:root{--bg-primary: #1e1e1e;--bg-secondary: #2a2a2a;--bg-card: #242424;--bg-hover: #303030;--border-color: #404040;--text-primary: #e0e0e0;--text-secondary: #b0b0b0;--text-muted: #808080;--accent-blue: #00b5d8;--accent-purple: #b794f6;--status-healthy: #48bb78;--status-progressing: #fbbf24;--status-degraded: #f56565;--status-unhealthy: #f56565;--status-unknown: #9f7aea;--status-synced: #48bb78;--status-outof-sync: #fbbf24;--spacing-page: 30px;--spacing-card: 20px;--spacing-gap: 20px;--font-size-h1: 28px;--font-size-h2: 20px;--font-size-body: 14px;--font-size-small: 12px;--grid-min-card: 320px;--grid-min-stat: 180px}@media(max-width:1024px){:root{--spacing-page: 20px;--spacing-gap: 16px;--grid-min-card: 280px;--grid-min-stat: 160px}}@media(max-width:768px){:root{--spacing-page: 16px;--spacing-card: 16px;--spacing-gap: 12px;--font-size-h1: 22px;--font-size-h2: 18px;--grid-min-card: 100%;--grid-min-stat: 100%}}@media(max-width:480px){:root{--spacing-page: 12px;--spacing-card: 12px;--spacing-gap: 10px;--font-size-h1: 20px;--font-size-h2: 16px;--font-size-body: 13px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-primary);color:var(--text-primary);min-height:100vh}code{font-family:Fira Code,Courier New,monospace}a{color:var(--accent-blue);text-decoration:none}a:hover{text-decoration:underline}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#505050}.app{display:flex;flex-direction:column;min-height:100vh}.top-nav{background:var(--bg-secondary);border-bottom:1px solid var(--border-color);padding:0 var(--spacing-page);height:60px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;gap:20px}.nav-brand{flex:0 0 auto}.nav-brand h2{font-size:var(--font-size-h2);font-weight:600;color:var(--accent-blue);margin:0}.nav-title{position:absolute;left:50%;transform:translate(-50%)}.nav-title h1{font-size:var(--font-size-h1);font-weight:700;color:var(--text-primary);margin:0;white-space:nowrap}.nav-links{display:flex;gap:8px;align-items:center;margin-left:auto}.nav-link{padding:8px 16px;color:var(--text-secondary);text-decoration:none;font-size:var(--font-size-body);font-weight:500;border-radius:6px;transition:all .2s ease}.nav-link:hover{color:var(--text-primary);background:var(--bg-hover);text-decoration:none}.nav-link.active{color:var(--accent-blue);background:#00b5d81a}.hamburger{display:none;flex-direction:column;justify-content:space-between;width:28px;height:20px;background:transparent;border:none;cursor:pointer;padding:0;z-index:110}.hamburger span{display:block;width:100%;height:2px;background:var(--text-primary);border-radius:2px;transition:all .3s ease;transform-origin:center}.hamburger.open span:nth-child(1){transform:translateY(9px) rotate(45deg)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}.nav-overlay{display:none}.main-content{flex:1;overflow-y:auto}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;color:var(--text-secondary)}.spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--accent-blue);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:15px}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1024px){.nav-title h1{font-size:20px}.nav-link{padding:8px 12px}}@media(max-width:768px){.top-nav{height:56px;padding:0 var(--spacing-page)}.nav-title{position:static;transform:none;flex:1;text-align:center;overflow:hidden}.nav-title h1{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hamburger{display:flex}.nav-links{position:fixed;top:56px;right:0;width:250px;height:calc(100vh - 56px);background:var(--bg-secondary);border-left:1px solid var(--border-color);flex-direction:column;align-items:stretch;gap:4px;padding:16px;margin-left:0;transform:translate(100%);transition:transform .3s ease;z-index:105;overflow-y:auto}.nav-links.open{transform:translate(0)}.nav-link{padding:14px 16px;font-size:16px;border-radius:8px}.nav-overlay{display:block;position:fixed;inset:56px 0 0;background:#00000080;z-index:104}}@media(max-width:480px){.top-nav{padding:0 var(--spacing-page)}.nav-brand h2{font-size:16px}.nav-title h1{font-size:14px}.nav-links{width:100%}}