@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg-dark:#0f172a;--bg-darker:#020617;--card-bg:#1e293bb3;--card-border:#ffffff0d;--text-primary:#f8fafc;--text-secondary:#94a3b8;--up-color:#10b981;--up-glow:#10b9814d;--down-color:#ef4444;--down-glow:#ef44444d;--degraded-color:#f59e0b;--degraded-glow:#f59e0b47;--checking-color:#3b82f6;--accent-color:#6366f1;--accent-glow:#6366f166}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-darker);color:var(--text-primary);background-image:radial-gradient(circle at 15%,#6366f114 0%,#0000 50%),radial-gradient(circle at 85% 30%,#10b9810d 0%,#0000 50%);background-attachment:fixed;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.dashboard-container{max-width:96%;margin:0 auto;padding:1rem 1.25rem 1.5rem}.dashboard-header{border-bottom:1px solid var(--card-border);justify-content:space-between;align-items:center;margin-bottom:1.2rem;padding-bottom:.9rem;display:flex}.header-title{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.header-title h1{letter-spacing:-.025em;background:linear-gradient(90deg,#fff,#94a3b8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.75rem;font-weight:700}.header-alert{background-color:#ef44441a;border:1px solid #ef444433;border-radius:.9rem;align-items:center;gap:.65rem;max-width:min(42rem,100%);padding:.45rem .85rem;animation:.3s ease-out forwards slide-down;display:inline-flex}.header-alert-prod{background-color:#a855f71f;border-color:#a855f74d}.header-alert-uat{background-color:#f59e0b1f;border-color:#f59e0b47}.header-alert-dev{background-color:#38bdf81f;border-color:#38bdf847}.header-alert-ok{background-color:#10b9811f;border-color:#10b98147}.header-controls{flex-wrap:wrap;align-items:center;gap:1.25rem;display:flex}.env-tabs{border:1px solid var(--card-border);background:#0f172a99;border-radius:.5rem;display:flex;overflow:hidden}.tab-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;padding:.5rem 1.25rem;font-size:.85rem;font-weight:600;transition:all .2s}.tab-btn:hover{color:var(--text-primary);background:#ffffff0d}.tab-btn.active{background:var(--accent-color);color:#fff}.interval-selector{color:var(--text-secondary);align-items:center;gap:.75rem;font-size:.875rem;display:flex}.interval-selector select{color:var(--text-primary);border:1px solid var(--card-border);cursor:pointer;background-color:#0f172acc;border-radius:.5rem;outline:none;padding:.5rem 1rem;font-family:inherit;font-size:.875rem;transition:all .2s}.interval-selector select:hover{border-color:#fff3}.interval-selector select:focus{border-color:var(--accent-color);box-shadow:0 0 0 2px var(--accent-glow)}.refresh-btn{background-color:var(--card-bg);color:var(--text-primary);border:1px solid var(--card-border);cursor:pointer;border-radius:.5rem;align-items:center;gap:.5rem;padding:.5rem 1rem;font-family:inherit;font-size:.875rem;font-weight:500;transition:all .2s;display:flex}.refresh-btn:hover:not(:disabled){background-color:#ffffff0d;border-color:#fff3}.refresh-btn svg{width:16px;height:16px;transition:transform .3s}.refresh-btn.refreshing svg{animation:1s linear infinite spin}.refresh-btn:disabled{opacity:.7;cursor:not-allowed}.alert-icon{color:var(--degraded-color);flex-shrink:0;justify-content:center;align-items:center;display:flex}.header-alert-ok .alert-icon,.header-alert-ok .alert-content strong{color:var(--up-color)}.alert-icon svg{width:20px;height:20px}.alert-content{color:#fca5a5;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.875rem;line-height:1.35;display:flex}.header-alert-prod .alert-content{color:#e9d5ff}.header-alert-uat .alert-content{color:#fde68a}.header-alert-dev .alert-content{color:#bae6fd}.header-alert-ok .alert-content{color:#bbf7d0}.alert-content strong{color:var(--degraded-color)}.alert-label{color:#fecaca}.header-alert-ok .alert-label,.header-alert-ok .alert-pill-count{color:#dcfce7}.header-alert-prod .alert-label,.header-alert-prod .alert-pill-count{color:#f3e8ff}.header-alert-uat .alert-label,.header-alert-uat .alert-pill-count{color:#fef3c7}.header-alert-dev .alert-label,.header-alert-dev .alert-pill-count{color:#e0f2fe}.alert-breakdown{flex-wrap:wrap;align-items:center;gap:.4rem;display:inline-flex}.alert-pill{color:#fee2e2;cursor:default;-webkit-user-select:text;user-select:text;background:0 0;border:none;border-radius:.35rem;align-items:center;gap:.4rem;padding:.18rem .15rem;font-size:.8rem;font-weight:500;display:inline-flex}.alert-pill-env{letter-spacing:.04em;color:#fca5a5}.header-alert-prod .alert-pill-env{color:#d8b4fe}.header-alert-uat .alert-pill-env{color:#fcd34d}.header-alert-dev .alert-pill-env{color:#7dd3fc}.header-alert-ok .alert-pill-env{color:#86efac}.alert-pill-count{color:#fee2e2}.environment-section{min-width:0}.env-title{color:var(--text-primary);z-index:2;background:linear-gradient(#020617f5,#020617d1,#0000);align-items:center;gap:.75rem;margin-bottom:.85rem;padding:.15rem 0 .55rem;font-size:1.05rem;font-weight:600;display:flex;position:sticky;top:0}.env-icon{border-radius:50%;width:8px;height:8px}.env-dev .env-icon{background-color:#38bdf8;box-shadow:0 0 8px #38bdf880}.env-uat .env-icon{background-color:#f59e0b;box-shadow:0 0 8px #f59e0b80}.env-prod .env-icon{background-color:#a855f7;box-shadow:0 0 8px #a855f780}.card-grid{grid-template-columns:1fr;gap:.7rem;display:grid}.dashboard-layout{gap:.65rem;display:grid}.dashboard-top-row{min-width:0}.environment-section-cloudfront .env-title{margin-bottom:.55rem;padding-bottom:.35rem}.dashboard-bottom-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:1rem;display:grid}.environment-section-frontend .card-grid,.environment-section-backend .card-grid,.environment-section-cloudfront .card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}.endpoint-card{background:var(--card-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--card-border);border-radius:.7rem;padding:.7rem .8rem;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}.environment-section-cloudfront .endpoint-card,.environment-section-frontend .endpoint-card,.environment-section-backend .endpoint-card{padding:.62rem .72rem}.endpoint-card:hover{transform:translateY(-2px);box-shadow:0 10px 20px #0003}.endpoint-card:before{content:"";background:0 0;height:2px;transition:background .3s;position:absolute;top:0;left:0;right:0}.endpoint-card.up:before{background:linear-gradient(to right, transparent, var(--up-color), transparent)}.endpoint-card.down:before{background:linear-gradient(to right, transparent, var(--down-color), transparent)}.endpoint-card.degraded:before{background:linear-gradient(to right, transparent, var(--degraded-color), transparent)}.endpoint-card.checking:before{background:linear-gradient(to right, transparent, var(--checking-color), transparent)}.card-header{justify-content:space-between;align-items:center;gap:.65rem;margin-bottom:.55rem;display:flex}.card-title{color:var(--text-primary);overflow-wrap:anywhere;font-size:.88rem;font-weight:600;line-height:1.25}.status-indicator-container{background:#0003;border:1px solid #ffffff0d;border-radius:2rem;flex-shrink:0;align-items:center;gap:.4rem;padding:.18rem .48rem;display:flex}.status-text{letter-spacing:.05em;font-size:.64rem;font-weight:600}.status-text.up{color:var(--up-color)}.status-text.down{color:var(--down-color)}.status-text.degraded{color:var(--degraded-color)}.status-text.checking{color:var(--checking-color)}.status-dot{border-radius:50%;width:8px;height:8px;position:relative}.status-dot.up{background-color:var(--up-color)}.status-dot.down{background-color:var(--down-color)}.status-dot.degraded{background-color:var(--degraded-color)}.pulse-ring{border:1px solid;border-radius:50%;position:absolute;inset:-4px}.pulse-ring.up{color:var(--up-color);animation:2s cubic-bezier(.215,.61,.355,1) infinite pulse-ring}.pulse-ring.down{color:var(--down-color);animation:1s cubic-bezier(.215,.61,.355,1) infinite pulse-ring}.pulse-ring.degraded{color:var(--degraded-color);animation:1.4s cubic-bezier(.215,.61,.355,1) infinite pulse-ring}.card-urls{flex-direction:column;gap:.35rem;max-height:132px;margin-bottom:.6rem;padding-right:.2rem;display:flex;overflow-y:auto}.environment-section-cloudfront .card-urls{max-height:112px}.environment-section-frontend .card-urls,.environment-section-backend .card-urls{max-height:116px}.card-urls::-webkit-scrollbar{width:4px}.card-urls::-webkit-scrollbar-track{background:#ffffff05}.card-urls::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}.url-row{background:#0000001f;border-radius:.45rem;align-items:flex-start;gap:.45rem;padding:.26rem .36rem;display:flex}.mini-dot{border-radius:50%;flex-shrink:0;width:6px;height:6px;margin-top:5px}.mini-dot.up{background-color:var(--up-color)}.mini-dot.down{background-color:var(--down-color)}.mini-dot.checking{background-color:var(--checking-color)}.url-info{flex-direction:column;gap:.2rem;min-width:0;display:flex}.url-link{color:#38bdf8;white-space:nowrap;text-overflow:ellipsis;font-size:.7rem;text-decoration:none;transition:color .2s;overflow:hidden}.url-link:hover{color:#7dd3fc;text-decoration:underline}.url-error{color:#fca5a5;font-size:.66rem;line-height:1.3}.card-footer{color:var(--text-secondary);border-top:1px solid #ffffff0d;padding-top:.45rem;font-size:.68rem}.card-footer .label{color:#64748b;margin-right:.25rem}.spinner{border:2px solid #3b82f64d;border-top-color:var(--checking-color);border-radius:50%;width:12px;height:12px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse-ring{0%{opacity:.5;transform:scale(.8)}80%,to{opacity:0;transform:scale(2)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (width<=768px){.dashboard-header{flex-direction:column;align-items:flex-start;gap:1rem}.header-alert{border-radius:.75rem}.header-controls{justify-content:space-between;width:100%}.dashboard-bottom-grid,.environment-section-frontend .card-grid,.environment-section-backend .card-grid,.environment-section-cloudfront .card-grid{grid-template-columns:1fr}.env-title{background:0 0;padding-bottom:.3rem;position:static}}
