:root{--bg-main: #070913;--bg-card: rgba(20, 26, 48, .45);--bg-card-hover: rgba(26, 34, 62, .6);--border-card: rgba(255, 255, 255, .05);--border-card-hover: rgba(255, 255, 255, .12);--text-primary: #f3f4f6;--text-secondary: #9ca3af;--color-up: #10b981;--color-up-glow: rgba(16, 185, 129, .15);--color-down: #ef4444;--color-down-glow: rgba(239, 68, 68, .15);--color-checking: #f59e0b;--color-checking-glow: rgba(245, 158, 11, .15);--accent-blue: #3b82f6;--font-outfit: "Outfit", sans-serif;--font-inter: "Inter", sans-serif;--radius-lg: 18px;--radius-md: 12px;--transition-smooth: all .3s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}html{background-color:var(--bg-main)}body{background-color:var(--bg-main);color:var(--text-primary);font-family:var(--font-inter);min-height:100vh;display:flex;justify-content:center;overflow-x:hidden;position:relative}#app{width:100%;display:flex;justify-content:center}.glass-bg{position:fixed;top:0;left:0;width:100vw;height:100vh;background:radial-gradient(circle at 50% 0%,#4facfe29,#07091300 75%);z-index:1;pointer-events:none}.app-container{width:100%;max-width:100%;padding:40px;z-index:2;display:flex;flex-direction:column;gap:32px}.app-header{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;border-bottom:1px solid var(--border-card);padding-bottom:24px}.logo-area{display:flex;align-items:center;gap:16px}.logo-icon{width:42px;height:42px}.logo-icon svg{width:100%;height:100%}.app-title{font-family:var(--font-outfit);font-size:1.8rem;font-weight:700;background:linear-gradient(90deg,#00f2fe,#4facfe);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.btn-check-now{background:linear-gradient(135deg,#00f2fe,#4facfe);border:none;color:#070913;padding:10px 24px;font-family:var(--font-outfit);font-weight:600;font-size:.95rem;border-radius:var(--radius-md);cursor:pointer;box-shadow:0 4px 15px #00f2fe40;transition:var(--transition-smooth);display:flex;align-items:center;justify-content:center;position:relative;outline:none}.btn-check-now:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00f2fe66}.btn-check-now:focus-visible{outline:none;box-shadow:0 0 0 3px #00f2fe80}.btn-check-now:active{transform:translateY(0)}.btn-check-now.loading{pointer-events:none}.btn-check-now.loading .btn-text{opacity:0}.btn-check-now.loading .btn-loader{display:block}.btn-loader{display:none;width:18px;height:18px;border:2px solid rgba(7,9,19,.3);border-top-color:#070913;border-radius:50%;animation:spinner .8s linear infinite;position:absolute}@keyframes spinner{to{transform:rotate(360deg)}}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.stat-card{background:var(--bg-card);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-card);border-radius:var(--radius-lg);padding:24px;display:flex;align-items:center;gap:20px;transition:var(--transition-smooth)}.stat-card:hover{border-color:var(--border-card-hover);transform:translateY(-2px)}.stat-card.alert-active{border-color:var(--color-down);box-shadow:0 0 15px #ef444440;animation:pulseRedBorder 2s infinite}@keyframes pulseRedBorder{0%{box-shadow:0 0 #ef444466}70%{box-shadow:0 0 0 8px #ef444400}to{box-shadow:0 0 #ef444400}}.stat-icon{width:48px;height:48px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center}.stat-icon svg{width:24px;height:24px}.icon-blue{background:#3b82f61a;color:var(--accent-blue)}.icon-green{background:#10b9811a;color:var(--color-up)}.icon-red{background:#ef44441a;color:var(--color-down)}.stat-info{display:flex;flex-direction:column;gap:4px}.stat-label{font-size:.85rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.stat-value{font-family:var(--font-outfit);font-size:1.8rem;font-weight:700}.services-section{display:flex;flex-direction:column;gap:16px;margin-top:24px}.section-title{font-family:var(--font-outfit);font-size:1.3rem;font-weight:600;color:var(--text-primary);margin-bottom:4px}.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}@media(max-width:1024px){.services-grid{grid-template-columns:1fr}}.service-card{background:var(--bg-card);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-card);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:16px;transition:var(--transition-smooth)}.service-card:hover{background:var(--bg-card-hover);border-color:var(--border-card-hover);box-shadow:0 8px 30px #00000040;transform:translateY(-3px)}.service-header{display:flex;justify-content:space-between;align-items:center}.service-name{font-family:var(--font-outfit);font-size:1.15rem;font-weight:600;color:var(--text-primary);text-decoration:none;transition:opacity .2s ease}.service-name:hover{opacity:.85;text-decoration:underline}.status-pill{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:4px 10px;border-radius:20px;display:flex;align-items:center;gap:6px}.status-indicator{width:8px;height:8px;border-radius:50%}.status-up{background:#10b9811a;color:var(--color-up);border:1px solid rgba(16,185,129,.25)}.status-up .status-indicator{background:var(--color-up);box-shadow:0 0 8px var(--color-up);animation:pulseGreen 2s infinite}.status-down{background:#ef44441a;color:var(--color-down);border:1px solid rgba(239,68,68,.25)}.status-down .status-indicator{background:var(--color-down);box-shadow:0 0 8px var(--color-down);animation:pulseRed 2s infinite}.status-checking{background:#f59e0b1a;color:var(--color-checking);border:1px solid rgba(245,158,11,.25)}.status-checking .status-indicator{background:var(--color-checking);box-shadow:0 0 8px var(--color-checking);animation:pulseOrange 2s infinite}@keyframes pulseGreen{0%{box-shadow:0 0 #10b981b3}70%{box-shadow:0 0 0 6px #10b98100}to{box-shadow:0 0 #10b98100}}@keyframes pulseRed{0%{box-shadow:0 0 #ef4444b3}70%{box-shadow:0 0 0 6px #ef444400}to{box-shadow:0 0 #ef444400}}@keyframes pulseOrange{0%{box-shadow:0 0 #f59e0bb3}70%{box-shadow:0 0 0 6px #f59e0b00}to{box-shadow:0 0 #f59e0b00}}.service-meta{display:flex;flex-direction:column;gap:8px;font-size:.85rem;color:var(--text-secondary)}.meta-item{display:flex;justify-content:space-between;align-items:center}.meta-value.success{color:var(--color-up);font-weight:500}.meta-value.error-msg{color:var(--color-down);font-weight:500;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.meta-value.down-time-msg{color:var(--color-down);font-weight:500}.timeline-area{display:flex;flex-direction:column;gap:6px;border-top:1px solid rgba(255,255,255,.03);padding-top:14px}.timeline-title{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-weight:600}.timeline-dots{display:flex;gap:4px;align-items:center}.timeline-dot{flex:1;height:18px;border-radius:4px;background:#ffffff0d;transition:var(--transition-smooth);position:relative;cursor:pointer}.timeline-dot.up{background:var(--color-up-glow);border:1px solid rgba(16,185,129,.3)}.timeline-dot.up:hover{background:var(--color-up)}.timeline-dot.down{background:var(--color-down-glow);border:1px solid rgba(239,68,68,.3)}.timeline-dot.down:hover{background:var(--color-down)}.timeline-dot:after{content:attr(data-tooltip);position:absolute;bottom:125%;left:50%;transform:translate(-50%) scale(.9);background:#0f172a;border:1px solid rgba(255,255,255,.1);color:#fff;padding:4px 8px;font-size:.75rem;border-radius:4px;white-space:nowrap;pointer-events:none;opacity:0;transition:var(--transition-smooth);z-index:10;box-shadow:0 4px 10px #0006}.timeline-dot:hover:after{opacity:1;transform:translate(-50%) scale(1)}.skeleton-loader{height:180px;background:linear-gradient(90deg,var(--bg-card) 25%,rgba(30,41,73,.4) 50%,var(--bg-card) 75%);background-size:200% 100%;animation:loading-pulse 1.5s infinite;border:1px solid var(--border-card);border-radius:var(--radius-lg)}@keyframes loading-pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.app-footer{border-top:1px solid var(--border-card);padding-top:20px;display:flex;justify-content:center;font-size:.85rem;color:var(--text-secondary)}.footer-info{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center}.separator{color:#ffffff26}.status-badge{background:#10b9811f;color:var(--color-up);border:1px solid rgba(16,185,129,.25);padding:2px 8px;border-radius:12px;font-size:.75rem;font-weight:600}.error-banner{background:#ef444426;border:1px solid rgba(239,68,68,.3);color:#f87171;padding:12px 20px;border-radius:var(--radius-md);margin-bottom:24px;font-size:.9rem;display:flex;align-items:center}.no-services{padding:40px;text-align:center;background:var(--bg-card);border:1px solid var(--border-card);border-radius:var(--radius-lg);color:var(--text-secondary)}@media(max-width:640px){.app-container{padding:20px 12px;gap:20px}.app-header{flex-direction:column;align-items:flex-start;gap:16px;padding-bottom:16px}.logo-area{gap:12px}.logo-icon{width:32px;height:32px}.app-title{font-size:1.4rem}.action-area{width:100%}.btn-check-now{width:100%;padding:12px 24px;font-size:.9rem}.stats-grid{grid-template-columns:repeat(3,1fr);gap:8px}.stat-card{padding:12px 6px;flex-direction:column;gap:6px;text-align:center;border-radius:var(--radius-md)}.stat-icon{width:32px;height:32px;border-radius:8px}.stat-icon svg{width:16px;height:16px}.stat-info{gap:2px}.stat-label{font-size:.6rem;letter-spacing:.01em}.stat-value{font-size:1.25rem}.services-grid{grid-template-columns:1fr;gap:12px}.service-card{padding:16px;gap:12px;border-radius:var(--radius-md)}.service-name{font-size:1.05rem}.status-pill{padding:3px 8px;font-size:.7rem}.service-meta{gap:6px;font-size:.8rem}.meta-value.error-msg{max-width:130px}.timeline-area{padding-top:10px;gap:4px}.timeline-title{font-size:.7rem}.timeline-dots{gap:2px}.timeline-dot{height:8px;border-radius:2px}.footer-info{flex-direction:column;gap:6px}.separator{display:none}}.service-card{position:relative;overflow:hidden;border:1px solid var(--border-card)}.service-card.scanning{border-color:#00f2fe59;box-shadow:0 0 15px #00f2fe1f;transform:translateY(-2px)}.service-card.scanning:after{content:"";position:absolute;top:0;left:-150%;width:150%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(0,242,254,.08) 50%,transparent 100%);animation:scan-sweep 1.5s ease-in-out infinite;pointer-events:none;z-index:2}@keyframes scan-sweep{0%{left:-150%}50%{left:100%}to{left:100%}}.card-progress-bar{position:absolute;bottom:0;left:0;height:3px;background:linear-gradient(90deg,#00f2fe,#4facfe);opacity:.35;transition:width .1s linear,background-color .3s ease;z-index:1}.service-card.scanning .card-progress-bar{background:linear-gradient(90deg,#f59e0b,#ef4444);opacity:.85}.progress-ring-container{display:flex;align-items:center;justify-content:center}.progress-ring{transform:rotate(-90deg);transform-origin:50% 50%}.progress-ring-circle{transition:stroke-dashoffset .1s linear,stroke .3s ease}