:root{--portal-primary:#3b82f6;--portal-primary-light:#60a5fa;--portal-primary-dark:#2563eb;--portal-primary-50:#eff6ff;--portal-primary-100:#dbeafe;--portal-primary-200:#bfdbfe;--portal-success:#10b981;--portal-success-light:#34d399;--portal-success-dark:#059669;--portal-accent:#f59e0b;--portal-accent-light:#fbbf24;--portal-accent-dark:#d97706;--portal-warning:#f59e0b;--portal-warning-light:#fcd34d;--portal-warning-dark:#b45309;--portal-error:#ef4444;--portal-error-light:#f87171;--portal-error-dark:#dc2626;--portal-bg:#f8fafc;--portal-bg-alt:#f1f5f9;--portal-card-bg:#ffffff;--portal-text:#1e293b;--portal-text-secondary:#475569;--portal-text-muted:#64748b;--portal-text-light:#94a3b8;--portal-border:#e2e8f0;--portal-border-light:#f1f5f9;--portal-border-focus:#3b82f6;--portal-shadow-sm:0 1px 2px 0 rgb(0 0 0/0.05);--portal-shadow:0 1px 3px 0 rgb(0 0 0/0.1),0 1px 2px -1px rgb(0 0 0/0.1);--portal-shadow-md:0 4px 6px -1px rgb(0 0 0/0.1),0 2px 4px -2px rgb(0 0 0/0.1);--portal-shadow-lg:0 10px 15px -3px rgb(0 0 0/0.1),0 4px 6px -4px rgb(0 0 0/0.1);--portal-radius-sm:0.375rem;--portal-radius:0.5rem;--portal-radius-lg:0.75rem;--portal-radius-xl:1rem;--portal-radius-2xl:1.5rem;--portal-spacing-xs:0.25rem;--portal-spacing-sm:0.5rem;--portal-spacing-md:1rem;--portal-spacing-lg:1.5rem;--portal-spacing-xl:2rem;--portal-spacing-2xl:3rem;--portal-transition-fast:150ms ease;--portal-transition:200ms ease;--portal-transition-slow:300ms ease}.dark{--portal-bg:#0f172a;--portal-bg-alt:#1e293b;--portal-card-bg:#1e293b;--portal-text:#f1f5f9;--portal-text-secondary:#cbd5e1;--portal-text-muted:#94a3b8;--portal-text-light:#64748b;--portal-border:#334155;--portal-border-light:#1e293b;--portal-shadow-sm:0 1px 2px 0 rgb(0 0 0/0.3);--portal-shadow:0 1px 3px 0 rgb(0 0 0/0.4),0 1px 2px -1px rgb(0 0 0/0.3);--portal-shadow-md:0 4px 6px -1px rgb(0 0 0/0.4),0 2px 4px -2px rgb(0 0 0/0.3);--portal-shadow-lg:0 10px 15px -3px rgb(0 0 0/0.4),0 4px 6px -4px rgb(0 0 0/0.3)}.portal-layout{background-color:var(--portal-bg);min-height:100vh}.portal-card{background-color:var(--portal-card-bg);border-radius:var(--portal-radius-lg);box-shadow:var(--portal-shadow);border:1px solid var(--portal-border-light);transition:box-shadow var(--portal-transition),transform var(--portal-transition)}.portal-card:hover{box-shadow:var(--portal-shadow-md)}.portal-card-clickable:hover{transform:translateY(-2px);box-shadow:var(--portal-shadow-lg)}.portal-button-primary{background:linear-gradient(135deg,var(--portal-primary),var(--portal-primary-dark));color:white;font-weight:500;padding:.75rem 1.5rem;border-radius:var(--portal-radius);transition:all var(--portal-transition);box-shadow:var(--portal-shadow)}.portal-button-primary:hover{background:linear-gradient(135deg,var(--portal-primary-dark),var(--portal-primary));box-shadow:var(--portal-shadow-md);transform:translateY(-1px)}.portal-button-secondary{background-color:var(--portal-card-bg);color:var(--portal-text);font-weight:500;padding:.75rem 1.5rem;border-radius:var(--portal-radius);border:1px solid var(--portal-border);transition:all var(--portal-transition)}.portal-button-secondary:hover{background-color:var(--portal-bg-alt);border-color:var(--portal-primary);color:var(--portal-primary)}.portal-input{background-color:var(--portal-card-bg);border:1px solid var(--portal-border);border-radius:var(--portal-radius);padding:.75rem 1rem;color:var(--portal-text);transition:all var(--portal-transition)}.portal-input:focus{outline:none;border-color:var(--portal-border-focus);box-shadow:0 0 0 3px var(--portal-primary-100)}.portal-badge{display:inline-flex;align-items:center;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500}.portal-badge-success{background-color:#dcfce7;color:#166534}.portal-badge-warning{background-color:#fef9c3;color:#854d0e}.portal-badge-error{background-color:#fee2e2;color:#991b1b}.portal-badge-info{background-color:#dbeafe;color:#1e40af}.dark .portal-badge-success{background-color:#166534;color:#dcfce7}.dark .portal-badge-warning{background-color:#854d0e;color:#fef9c3}.dark .portal-badge-error{background-color:#991b1b;color:#fee2e2}.dark .portal-badge-info{background-color:#1e40af;color:#dbeafe}@keyframes portal-fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes portal-slide-in{0%{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.portal-animate-fade-in{animation:portal-fade-in .3s ease-out}.portal-animate-slide-in{animation:portal-slide-in .3s ease-out}.portal-status-dot{width:.5rem;height:.5rem;border-radius:9999px}.portal-status-operational{background-color:var(--portal-success)}.portal-status-degraded{background-color:var(--portal-warning)}.portal-status-down{background-color:var(--portal-error)}.portal-quick-action{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;background-color:var(--portal-card-bg);border-radius:var(--portal-radius-lg);border:2px solid var(--portal-border-light);transition:all var(--portal-transition);cursor:pointer}.portal-quick-action:hover{border-color:var(--portal-primary);box-shadow:var(--portal-shadow-md);transform:translateY(-2px)}.portal-quick-action-icon{width:3rem;height:3rem;display:flex;align-items:center;justify-content:center;border-radius:var(--portal-radius-lg);margin-bottom:.75rem}