.notification-container{position:relative;display:inline-flex;align-items:center}.notification-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--border-color, #e2e8f0);border-radius:9999px;width:40px;height:40px;color:var(--text-color, #1e293b);cursor:pointer;transition:all .2s ease}.notification-trigger:hover,.notification-trigger:focus-visible{background:var(--bg-hover, rgba(0, 0, 0, .05));border-color:var(--brand-primary, #6366f1);outline:none}.notification-badge{position:absolute;top:-2px;right:-2px;background:#ef4444;color:#fff;font-size:.6875rem;font-weight:700;line-height:1;min-width:18px;height:18px;padding:0 4px;border-radius:9999px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px var(--bg-surface, #ffffff);pointer-events:none}.notification-popover{position:absolute;top:calc(100% + 8px);right:0;width:360px;max-width:90vw;max-height:480px;background:var(--bg-surface, #ffffff);border:1px solid var(--border-color, #e2e8f0);border-radius:12px;box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000001a;display:flex;flex-direction:column;z-index:1000;overflow:hidden;animation:fadeInDown .15s ease-out}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.notification-header{display:flex;align-items:center;justify-content:space-between;padding:.875rem 1rem;border-bottom:1px solid var(--border-color, #e2e8f0);background:var(--bg-surface-header, #f8fafc)}.notification-header h3{margin:0;font-size:.9375rem;font-weight:600;color:var(--text-heading, #0f172a)}.notification-mark-all-btn{background:none;border:none;color:var(--brand-primary, #6366f1);font-size:.75rem;font-weight:600;cursor:pointer;padding:.25rem .5rem;border-radius:4px;transition:background .15s ease}.notification-mark-all-btn:hover{background:#6366f11a}.notification-mark-all-btn:disabled{opacity:.5;cursor:not-allowed}.notification-list{overflow-y:auto;flex:1;max-height:380px;list-style:none;margin:0;padding:0}.notification-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;border-bottom:1px solid var(--border-color-light, #f1f5f9);cursor:pointer;transition:background .15s ease;text-align:left;width:100%;background:transparent;border-left:3px solid transparent}.notification-item:hover,.notification-item:focus-visible{background:var(--bg-hover, #f8fafc);outline:none}.notification-item.unread{background:#6366f10a;border-left-color:var(--brand-primary, #6366f1)}.notification-item.unread:hover{background:#6366f114}.notification-avatar-wrap{position:relative;flex-shrink:0}.notification-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;background:#e2e8f0;display:flex;align-items:center;justify-content:center}.notification-type-badge{position:absolute;bottom:-2px;right:-2px;width:16px;height:16px;border-radius:50%;background:var(--brand-primary, #6366f1);color:#fff;display:flex;align-items:center;justify-content:center;border:1px solid #ffffff}.notification-content{flex:1;min-width:0}.notification-text{font-size:.8125rem;line-height:1.35;color:var(--text-color, #1e293b);margin-bottom:.25rem;word-break:break-word}.notification-meta{font-size:.6875rem;color:var(--text-muted, #64748b);display:flex;align-items:center;gap:.5rem}.notification-unread-dot{width:6px;height:6px;border-radius:50%;background:var(--brand-primary, #6366f1);margin-top:.5rem;flex-shrink:0}.notification-empty{padding:2.5rem 1rem;text-align:center;color:var(--text-muted, #64748b)}.notification-empty p{margin:.5rem 0 0;font-size:.875rem}.notification-loading{padding:2rem 1rem;display:flex;align-items:center;justify-content:center}:root{--font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;--bg-primary: #f6f7fb;--bg-secondary: #ffffff;--bg-tertiary: #eef0f6;--bg-card: #ffffff;--bg-card-hover: #fbfbfe;--bg-surface: #ffffff;--bg-surface-raised: #f1f3f8;--text-primary: #171923;--text-secondary: #5f6475;--text-muted: #8b91a2;--text-tertiary: #7a8090;--accent-primary: #7c3aed;--accent-primary-hover: #6d28d9;--accent-secondary: #2563eb;--accent-success: #059669;--accent-warning: #d97706;--accent-danger: #dc2626;--accent-info: #0891b2;--border-subtle: #e6e8ef;--border-color: #e1e4ec;--border-medium: #cfd4df;--border-strong: #aeb5c4;--shadow-sm: 0 1px 2px rgb(16 24 40 / .04);--shadow-md: 0 8px 22px rgb(16 24 40 / .08);--shadow-lg: 0 18px 50px rgb(16 24 40 / .14);--radius-sm: .5rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-xl: 1.25rem;--radius-full: 9999px;--header-bg: rgb(255 255 255 / .9)}[data-theme=dark]{--bg-primary: #0b0d14;--bg-secondary: #121520;--bg-tertiary: #1a1e2e;--bg-card: #121520;--bg-card-hover: #171b2a;--bg-surface: #121520;--bg-surface-raised: #181d2e;--text-primary: #f8fafc;--text-secondary: #94a3b8;--text-muted: #64748b;--text-tertiary: #64748b;--accent-primary: #8b5cf6;--accent-primary-hover: #7c3aed;--accent-secondary: #3b82f6;--accent-success: #10b981;--accent-warning: #f59e0b;--accent-danger: #ef4444;--accent-info: #06b6d4;--border-subtle: #1e2436;--border-color: #272f45;--border-medium: #36415e;--border-strong: #4b587d;--shadow-sm: 0 1px 2px rgb(0 0 0 / .3);--shadow-md: 0 8px 22px rgb(0 0 0 / .45);--shadow-lg: 0 18px 50px rgb(0 0 0 / .6);--header-bg: rgb(18 21 32 / .88)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100%;background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-sans);line-height:1.5;-webkit-font-smoothing:antialiased}body{min-width:320px}#root{min-height:100vh;display:flex;flex-direction:column}a{color:var(--accent-primary);text-decoration:none;transition:color .15s ease}a:hover{color:var(--accent-primary-hover)}button,input,select,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid rgb(124 58 237 / .35);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-to-content{position:absolute;top:-100px;left:1rem;z-index:1000;padding:.75rem 1.1rem;border-radius:var(--radius-md);color:#fff;background:var(--accent-primary);font-weight:700}.skip-to-content:focus{top:1rem}.container{width:100%;max-width:1240px;margin:0 auto;padding-inline:1.25rem}.site-header{position:sticky;top:0;z-index:50;border-bottom:1px solid var(--border-subtle);background:var(--header-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.header-inner{display:flex;align-items:center;justify-content:space-between;min-height:4.5rem;gap:1rem}.brand-logo{display:inline-flex;align-items:center;gap:.7rem;border:0;color:var(--text-primary);background:transparent;cursor:pointer;font-size:1.05rem;font-weight:800;letter-spacing:-.02em}.brand-mark{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:.7rem;color:#fff;background:var(--accent-primary);box-shadow:0 5px 14px #7c3aed40}.brand-badge,.desktop-nav{display:none}.nav-links{display:flex;align-items:center;gap:.2rem;list-style:none}.nav-btn,.mobile-nav-btn{display:inline-flex;align-items:center;gap:.45rem;border:0;border-radius:var(--radius-md);color:var(--text-secondary);background:transparent;cursor:pointer;font-size:.86rem;font-weight:650;transition:color .15s ease,background .15s ease}.nav-btn{padding:.55rem .7rem}.nav-btn:hover,.mobile-nav-btn:hover{color:var(--text-primary);background:var(--bg-tertiary)}.nav-btn.active,.mobile-nav-btn.active{color:var(--accent-primary);background:#7c3aed1f}.mobile-menu-btn{display:inline-flex;align-items:center;justify-content:center;padding:.55rem;border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-primary);background:var(--bg-surface);cursor:pointer}.mobile-nav-drawer{border-top:1px solid var(--border-subtle);padding:.75rem 0 1rem;background:var(--bg-surface)}.mobile-nav-list{display:grid;gap:.3rem;list-style:none}.mobile-nav-btn{width:100%;justify-content:flex-start;padding:.8rem 1rem}.theme-toggle-btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--bg-surface);color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.theme-toggle-btn:hover{color:var(--accent-primary);border-color:var(--accent-primary);background:var(--bg-tertiary);transform:translateY(-1px)}.theme-toggle-icon{transition:transform .2s ease}.theme-toggle-btn:hover .theme-toggle-icon{transform:rotate(15deg)}.card{padding:1.35rem;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);background:var(--bg-card);box-shadow:var(--shadow-sm)}.card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.9rem}.card-title{color:var(--text-primary);font-size:1.05rem;font-weight:750;letter-spacing:-.015em}.card-description{margin-top:.25rem;color:var(--text-secondary);font-size:.88rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:2.5rem;border:1px solid transparent;border-radius:var(--radius-md);padding:.6rem 1rem;cursor:pointer;font-weight:700;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled{cursor:not-allowed;opacity:.55}.btn-primary{color:#fff;background:var(--accent-primary);box-shadow:0 5px 12px #7c3aed2e}.btn-primary:hover:not(:disabled){color:#fff;background:var(--accent-primary-hover)}.btn-secondary{border-color:var(--border-subtle);color:var(--text-primary);background:#fff}.btn-secondary:hover:not(:disabled),.btn-outline:hover:not(:disabled){border-color:var(--border-medium);background:var(--bg-tertiary)}.btn-outline{border-color:var(--border-medium);color:var(--text-primary);background:transparent}.btn-danger{color:#fff;background:var(--accent-danger)}.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .6rem;border-radius:var(--radius-full);font-size:.72rem;font-weight:750;line-height:1}.badge-success{color:#047857;border:1px solid #a7f3d0;background:#ecfdf5}.badge-warning{color:#92400e;border:1px solid #fed7aa;background:#fff7ed}.badge-info{color:#1d4ed8;border:1px solid #bfdbfe;background:#eff6ff}.badge-muted{color:var(--text-secondary);border:1px solid var(--border-subtle);background:var(--bg-tertiary)}.grid-2,.grid-3,.grid-4{display:grid;gap:1.25rem;grid-template-columns:1fr}.status-indicator{display:inline-block;width:.6rem;height:.6rem;border-radius:50%}.status-indicator.online{background:var(--accent-success)}.status-indicator.warning{background:var(--accent-warning)}.status-indicator.offline{background:var(--accent-danger)}.phase-step{display:flex;gap:1rem;padding:1rem;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#fff}.phase-step.active{border-color:#c4b5fd;background:#faf5ff}.phase-step.completed{border-color:#a7f3d0;background:#ecfdf5}@media(min-width:640px){.container{padding-inline:1.75rem}.grid-2{grid-template-columns:repeat(2,1fr)}}@media(min-width:768px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.desktop-nav{display:flex}.mobile-menu-btn{display:none}.grid-4{grid-template-columns:repeat(4,1fr)}.container{padding-inline:2rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}