html{--lumo-primary-color: #0d47a1;--lumo-primary-color-50pct: rgba(13,71,161,0.5);--lumo-primary-color-10pct: rgba(13,71,161,0.1);--lumo-primary-text-color: #0d47a1;--lumo-base-color: #ffffff;--lumo-body-text-color: #1f2937;--lumo-secondary-text-color: #6b7280;--lumo-contrast-10pct: rgba(0,0,0,0.06);--lumo-contrast-20pct: rgba(0,0,0,0.1);--lumo-header-text-color: #1f2937;--app-bg: #f8f9fa;--app-surface: #ffffff;--app-border: #e5e7eb;--app-sidebar-bg: #ffffff;--app-sidebar-width: 260px;--app-navbar-height: 56px;--app-accent: #0d47a1;--app-accent-light: #d9e8f7;--app-accent-dark: #093170;--app-text-primary: #1f2937;--app-text-secondary: #6b7280;--app-text-muted: #9ca3af;--app-menu-text: #2e4a6b;--app-menu-text-muted: #7b90a8;--app-card-shadow: 0 1px 3px rgba(0,0,0,0.08),0 1px 2px rgba(0,0,0,0.06);--app-card-shadow-hover: 0 4px 16px rgba(0,0,0,0.12);--app-btn-shadow: 0 1px 3px rgba(0,0,0,0.1),0 1px 2px rgba(0,0,0,0.06);--app-btn-shadow-hover: 0 4px 12px rgba(0,0,0,0.15);--app-btn-shadow-active: 0 1px 2px rgba(0,0,0,0.1);--app-grid-shadow: 0 2px 8px rgba(0,0,0,0.06),0 1px 3px rgba(0,0,0,0.04);--app-grid-shadow-hover: 0 6px 20px rgba(0,0,0,0.1);--app-radius: 12px;--app-radius-sm: 8px;--lumo-size-xl: 3rem;--lumo-size-l: 2.5rem;--lumo-size-m: 2.25rem;--lumo-size-s: 1.875rem;--lumo-size-xs: 1.5rem;--lumo-space-xl: 1.75rem;--lumo-space-l: 1.25rem;--lumo-space-m: 0.75rem;--lumo-space-s: 0.5rem;--lumo-space-xs: 0.25rem;--lumo-font-family: 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--lumo-font-size: 0.9375rem;--lumo-font-size-xxxl: 1.75rem;--lumo-font-size-xxl: 1.375rem;--lumo-font-size-xl: 1.125rem;--lumo-font-size-l: 1rem;--lumo-font-size-m: 0.875rem;--lumo-font-size-s: 0.8125rem;--lumo-font-size-xs: 0.75rem;--lumo-font-size-xxs: 0.6875rem;--lumo-line-height-m: 1.5;--lumo-line-height-s: 1.3;--lumo-line-height-xs: 1.2;--lumo-border-radius-s: 6px;--lumo-border-radius-m: 8px;--lumo-border-radius-l: 12px}body{background-color: var(--app-bg);font-family: var(--lumo-font-family);-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale}vaadin-app-layout{--vaadin-app-layout-drawer-overlay: false}vaadin-app-layout::part(navbar){background: linear-gradient( to right,#dbe7f3 0%,#cddded 18%,#dae2ec 40%,#e4e6e9 65%,#e8e9eb 100% );border-bottom: none;border-radius: 8px;box-shadow: 0 2px 12px rgba(0,0,0,0.06),0 1px 4px rgba(0,0,0,0.04);height: var(--app-navbar-height);min-height: var(--app-navbar-height);margin: 0.75rem 1rem 0 1.25rem}vaadin-app-layout::part(drawer){border-right: none;border-radius: 8px 12px 12px 8px;box-shadow: 4px 0 20px rgba(0,0,0,0.10),8px 0 40px rgba(0,0,0,0.06),1px 0 6px rgba(0,0,0,0.04);width: var(--app-sidebar-width);overflow: hidden;margin: 0.75rem 0.75rem 0.75rem 0.75rem;background: linear-gradient( 175deg,#dbe7f3 0%,#cddded 18%,#dae2ec 40%,#e4e6e9 65%,#e8e9eb 100% )}vaadin-app-layout::part(content){background: var(--app-bg)}vaadin-app-layout>:not([slot]){padding-left: 1.25rem;padding-top: calc(0.75rem + var(--lumo-space-s));box-sizing: border-box}vaadin-side-nav-item::part(link),vaadin-side-nav-item::part(content){white-space: normal !important;overflow: visible !important;text-overflow: clip !important;height: auto !important;line-height: 1.3;align-items: center !important;mask-image: none !important;-webkit-mask-image: none !important}vaadin-grid{background: var(--app-surface);border-radius: var(--app-radius);border: 1px solid var(--app-border);box-shadow: var(--app-grid-shadow);transition: box-shadow 0.2s ease;overflow: hidden}vaadin-grid:hover{box-shadow: var(--app-grid-shadow-hover)}.app-card{background: var(--app-surface);border: 1px solid var(--app-border);border-radius: var(--app-radius);padding: var(--lumo-space-l);box-shadow: var(--app-card-shadow);transition: box-shadow 0.2s ease}.app-card:hover{box-shadow: var(--app-card-shadow-hover)}.kpi-card{background: var(--app-surface);border: 1px solid var(--app-border);border-radius: var(--app-radius);padding: 1.25rem 1.5rem;min-width: 180px;flex: 1;box-shadow: var(--app-card-shadow);transition: box-shadow 0.2s ease,transform 0.15s ease}.kpi-card:hover{box-shadow: var(--app-card-shadow-hover);transform: translateY(-2px)}.kpi-card .kpi-label{font-size: var(--lumo-font-size-xs);font-weight: 600;color: var(--app-text-secondary);text-transform: uppercase;letter-spacing: 0.05em;margin: 0 0 0.5rem 0}.kpi-card .kpi-value{font-size: 1.75rem;font-weight: 700;color: var(--app-text-primary);margin: 0;line-height: 1.2}.kpi-card .kpi-badge{font-size: var(--lumo-font-size-xxs);font-weight: 500;padding: 2px 8px;border-radius: 4px;display: inline-block;margin-left: 0.5rem}.kpi-badge-positive{background: var(--app-accent-light);color: var(--app-accent)}.kpi-badge-warning{background: #fef3c7;color: #92400e}.kpi-badge-critical{background: #fee2e2;color: #991b1b}.kpi-badge-neutral{background: #f3f4f6;color: #4b5563}.spotlight-card{background: linear-gradient(135deg,var(--app-accent-dark) 0%,#0d47a1 25%,#3a6ca8 45%,#6b8fae 60%,#7f8b96 75%,#8f959c 88%,#9ca3af 100%);color: #ffffff;border-radius: var(--app-radius);padding: 1.5rem;box-shadow: 0 4px 14px rgba(0,0,0,0.15),0 2px 6px rgba(0,0,0,0.10);box-sizing: border-box;max-width: 100%}.spotlight-card .spotlight-label{font-size: var(--lumo-font-size-xxs);font-weight: 600;text-transform: uppercase;letter-spacing: 0.08em;color: rgba(255,255,255,0.7);margin: 0 0 0.75rem 0}.spotlight-card .spotlight-title{font-size: var(--lumo-font-size-xl);font-weight: 700;margin: 0 0 0.25rem 0}.spotlight-card .spotlight-subtitle{font-size: var(--lumo-font-size-s);color: rgba(255,255,255,0.8);margin: 0 0 1rem 0}.timeline-card{background: var(--app-surface);border: 1px solid var(--app-border);border-radius: var(--app-radius);padding: 1.25rem 1.5rem;box-shadow: var(--app-card-shadow)}.timeline-card .timeline-title{font-size: var(--lumo-font-size-m);font-weight: 600;color: var(--app-text-primary);margin: 0 0 1rem 0}.timeline-item{display: flex;align-items: flex-start;gap: 0.75rem;padding: 0.5rem 0}.timeline-item .timeline-dot{width: 8px;height: 8px;border-radius: 50%;background: var(--app-accent);margin-top: 6px;flex-shrink: 0}.timeline-item .timeline-dot.secondary{background: var(--app-text-muted)}.timeline-item .timeline-text{font-size: var(--lumo-font-size-s);font-weight: 500;color: var(--app-text-primary);margin: 0}.timeline-item .timeline-meta{font-size: var(--lumo-font-size-xxs);color: var(--app-text-muted);margin: 2px 0 0 0}.page-header{margin-bottom: 0}.page-header .page-subtitle{font-size: var(--lumo-font-size-xs);font-weight: 600;text-transform: uppercase;letter-spacing: 0.08em;color: var(--app-text-secondary);margin: 0 0 0.25rem 0}.page-header .page-title{font-size: var(--lumo-font-size-xxxl);font-weight: 700;color: var(--app-text-primary);margin: 0}.sidebar-org-name{font-size: var(--lumo-font-size-l);font-weight: 700;color: var(--app-text-primary);margin: 0}.sidebar-org-role{font-size: var(--lumo-font-size-xs);color: var(--app-text-secondary);margin: 0}.navbar-tabs{gap: 0}.navbar-tabs vaadin-tab{font-size: var(--lumo-font-size-m);font-weight: 500;color: var(--app-text-secondary);padding: 0 1rem}.navbar-tabs vaadin-tab[selected]{color: var(--app-text-primary);font-weight: 600}.navbar-actions{gap: 0.5rem;align-items: center}.navbar-action-btn{color: var(--app-text-secondary);cursor: pointer;width: 36px;height: 36px;display: flex;align-items: center;justify-content: center;border-radius: 50%;transition: background 0.15s ease}.navbar-action-btn:hover{background: var(--lumo-contrast-10pct)}vaadin-button{box-shadow: var(--app-btn-shadow);transition: box-shadow 0.2s ease,transform 0.1s ease}vaadin-button:hover{box-shadow: var(--app-btn-shadow-hover);transform: translateY(-1px)}vaadin-button:active{box-shadow: var(--app-btn-shadow-active);transform: translateY(0)}vaadin-button[theme~="primary"]{box-shadow: 0 2px 6px rgba(0,0,0,0.18),0 1px 3px rgba(0,0,0,0.10)}vaadin-button[theme~="primary"]:hover{box-shadow: 0 4px 14px rgba(0,0,0,0.20),0 2px 6px rgba(0,0,0,0.12)}vaadin-button[theme~="primary"]:active{box-shadow: 0 1px 3px rgba(0,0,0,0.15)}vaadin-button[theme~="tertiary"],vaadin-button[theme~="tertiary-inline"]{box-shadow: none}vaadin-button[theme~="tertiary"]:hover,vaadin-button[theme~="tertiary-inline"]:hover{box-shadow: none;transform: none}.btn-primary{background: var(--app-accent) !important;color: white !important;border-radius: var(--app-radius-sm) !important;font-weight: 600 !important;padding: 0.75rem 1.5rem !important;box-shadow: 0 2px 6px rgba(0,0,0,0.18),0 1px 3px rgba(0,0,0,0.10) !important}.btn-primary:hover{box-shadow: 0 4px 14px rgba(0,0,0,0.20),0 2px 6px rgba(0,0,0,0.12) !important;transform: translateY(-1px)}.btn-outline{background: transparent !important;border: 1px solid var(--app-border) !important;border-radius: var(--app-radius-sm) !important;color: var(--app-text-primary) !important;font-weight: 500 !important;box-shadow: var(--app-btn-shadow) !important}.btn-outline:hover{box-shadow: var(--app-btn-shadow-hover) !important;transform: translateY(-1px)}.v-status-message{display: none}.v-loading-indicator{position: fixed;top: 0;left: 0;right: 0;bottom: 0;pointer-events: auto;z-index: 2147483647;animation: fadein 0.3s ease-out 0.2s normal 1 both}.v-loading-indicator:before{width: 48px;height: 48px;position: absolute;top: 50%;left: 50%;margin: -24px 0 0 -24px;border: 3px solid var(--app-accent-light);border-top-color: var(--app-accent);border-radius: 50%;animation: spinner 0.8s linear infinite;content: ""}.v-loading-indicator.first:before,.v-loading-indicator.second:before,.v-loading-indicator.third:before{border-top-color: var(--app-accent)}@keyframes spinner{to{transform: rotate(360deg)}}@keyframes fadein{0%{background: rgba(0,0,0,0)}100%{background: rgba(0,0,0,0.3)}}.login-view{width: 100%;min-height: 100vh;padding: 1.5rem;box-sizing: border-box;display: flex;align-items: center;justify-content: center}.login-card{width: min(420px,100%);margin: auto;background: rgba(255,255,255,0.96);backdrop-filter: blur(12px);-webkit-backdrop-filter: blur(12px);border-radius: 10px;padding: 1.25rem 1.75rem 1.25rem;overflow: visible;box-shadow: 0 24px 60px rgba(0,0,0,0.30),0 10px 28px rgba(0,0,0,0.18),0 2px 6px rgba(0,0,0,0.10),0 0 0 1px rgba(255,255,255,0.5) inset;display: flex;flex-direction: column;align-items: stretch;gap: 0.25rem;animation: login-card-in 0.4s ease-out;text-align: center}.login-card>.login-logo,.login-card>.login-welcome,.login-card>.login-version{align-self: center}.login-card vaadin-login-form,.login-card vaadin-login-form-wrapper{background: transparent !important;box-shadow: none !important;padding: 0 !important;border-radius: 0 !important;border: none !important;width: 100% !important;max-width: none !important;min-width: 0 !important;align-self: stretch !important;margin: 0 !important;box-sizing: border-box !important}.login-card vaadin-login-form-wrapper::part(form){background: transparent !important;box-shadow: none !important;padding: 0 !important;border-radius: 0 !important}.login-card vaadin-login-form-wrapper::part(vaadin-login-native-form-wrapper),.login-card vaadin-login-form-wrapper::part(native-form){background: transparent !important;box-shadow: none !important;padding: 0 !important;border-radius: 0 !important}@keyframes login-card-in{from{opacity: 0;transform: translateY(12px)}to{opacity: 1;transform: translateY(0)}}.login-logo{margin: 0 !important}.login-welcome{margin: 0.25rem 0 0.5rem 0;font-size: 1rem;font-weight: 600;color: var(--app-text-primary);letter-spacing: 0.02em;text-transform: uppercase}.login-card vaadin-login-form{width: 100%}.login-card vaadin-login-form-wrapper{background: transparent;box-shadow: none;padding: 0}.login-version{font-size: 0.75rem;color: var(--app-text-muted);margin-top: 0.75rem}@media (max-width: 480px){.login-card{padding: 2rem 1.25rem 1rem;border-radius: 8px}}.instancia-card{background: var(--app-surface);border: 1px solid var(--app-border);border-radius: var(--app-radius);box-shadow: 0 4px 14px rgba(0,0,0,0.08),0 2px 6px rgba(0,0,0,0.05),0 1px 2px rgba(0,0,0,0.04);transition: box-shadow 0.2s ease,transform 0.2s ease}.instancia-card:hover{box-shadow: 0 10px 28px rgba(0,0,0,0.12),0 4px 12px rgba(0,0,0,0.08),0 2px 4px rgba(0,0,0,0.05);transform: translateY(-2px)}