@keyframes ping { 70% { box-shadow:0 0 0 10px var(--color-danger-subtle) }
 }
@keyframes wobble { 10% { transform:rotate(14deg) }
20% { transform:rotate(-8deg) }
30% { transform:rotate(14deg) }
40% { transform:rotate(-4deg) }
60% { transform:rotate(0deg) }
 }
@keyframes pulse-vercel { 0%,to { opacity:var(--opacity-100) }
50% { opacity:var(--opacity-50) }
 }
@keyframes shimmer-linear { 0% { left:-100% }
to { left:200% }
 }
@keyframes metric-card-shimmer { 0% { transform:translateX(-100%) }
to { transform:translateX(100%) }
 }
@keyframes metric-card-skeleton { 0%,to { opacity:60% }
50% { opacity:100% }
 }
@keyframes badge-shimmer { 0% { left:-100% }
to { left:200% }
 }
@keyframes badge-pulse { 0%,to { opacity:var(--opacity-100);transform:scale(1) }
50% { opacity:var(--opacity-70);transform:scale(1.05) }
 }
@keyframes badge-fade-in { 0% { opacity:0;transform:translateY(4px) }
to { opacity:var(--opacity-100);transform:translateY(0) }
 }
@keyframes topic-suggestion-shimmer { 0% { left:-100% }
to { left:200% }
 }
@keyframes topic-suggestion-confirm-enter { 0% { opacity:0;transform:scale(.95) }
to { opacity:100%;transform:scale(1) }
 }
@keyframes feedback-status-pulse { 0% { opacity:0;transform:scale(.8) }
50% { transform:scale(1.05) }
to { opacity:100%;transform:scale(1) }
 }
@keyframes error-shake { 0%,to { transform:translateX(0) }
20%,60% { transform:translateX(calc(var(--spacing-1)*-1)) }
40%,80% { transform:translateX(var(--spacing-1)) }
 }
@keyframes button-spinner { to { transform:rotate(1turn) }
 }
@keyframes shimmer-cat { to { transform:translateX(100%) }
 }
@keyframes pulse-cat { 0%,to { opacity:60% }
50% { opacity:100% }
 }
@keyframes stripeMetricEnter { 0% { opacity:0;transform:translateY(var(--animation-metric-enter-distance)) scale(var(--animation-metric-enter-scale-initial)) }
60% { transform:translateY(var(--animation-metric-enter-overshoot)) scale(var(--animation-metric-enter-scale-overshoot)) }
to { opacity:100%;transform:translateY(0) scale(var(--animation-metric-enter-scale-final)) }
 }
@keyframes valueUpdate { 0%,to { transform:scale(1) }
50% { transform:scale(1.05) }
 }
@keyframes errorPulse { 0%,to { opacity:100%;transform:scale(1) }
50% { opacity:70%;transform:scale(1.05) }
 }
@keyframes tooltip-in { 0% { opacity:0;transform:translateX(calc(var(--radius-full)*-1)) translateY(-10px) }
to { opacity:100%;transform:translateX(calc(var(--radius-full)*-1)) translateY(-5px) }
 }
@keyframes pulse-polling { 0%,to { opacity:100% }
50% { opacity:70% }
 }
@keyframes skeleton-pulse { 0%,to { opacity:100% }
50% { opacity:50% }
 }
@keyframes skeleton-card-fade-in { 0% { opacity:0;transform:translateY(var(--spacing-2)) }
to { opacity:1;transform:translateY(0) }
 }
@keyframes spinner-rotate { to { transform:rotate(1turn) }
 }
@keyframes dots-pulse { 0%,80%,to { opacity:50%;transform:scale(0) }
40% { opacity:100%;transform:scale(1) }
 }
@keyframes pulse-spin { 0% { opacity:100%;transform:scale(0) }
to { opacity:0;transform:scale(1) }
 }
@keyframes ring-rotate { 0% { transform:rotate(0deg) }
to { transform:rotate(1turn) }
 }
@keyframes bars-wave { 0%,40%,to { transform:scaleY(.4) }
20% { transform:scaleY(1) }
 }
@keyframes shimmer-text { 0% { background-position:200% 0 }
to { background-position:-200% 0 }
 }
@keyframes float-icon { 0%,to { transform:translateY(0) }
50% { transform:translateY(calc(var(--spacing-2-5)*-1)) }
 }
@keyframes rotate { 0% { transform:rotate(0deg) }
to { transform:rotate(1turn) }
 }
@keyframes progress-fill { 0% { width:0 }
to { width:70% }
 }
@keyframes toast-slide-in { 0% { opacity:0;transform:translateX(100%) }
to { opacity:100%;transform:translateX(0) }
 }
@keyframes toast-slide-in-left { 0% { opacity:0;transform:translateX(-100%) }
to { opacity:100%;transform:translateX(0) }
 }
@keyframes toast-slide-up { 0% { opacity:0;transform:translateY(100%) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes toast-slide-out { 0% { opacity:100%;transform:translateX(0) }
to { opacity:0;transform:translateX(100%) }
 }
@keyframes toast-slide-out-left { 0% { opacity:100%;transform:translateX(0) }
to { opacity:0;transform:translateX(-100%) }
 }
@keyframes toast-progress { 0% { width:100% }
to { width:0 }
 }
@keyframes skeleton-wave { 0% { transform:translateX(-100%) }
to { transform:translateX(100%) }
 }
@keyframes metric-pulse { 0% { transform:scale(1) }
50% { transform:scale(1.05) }
to { transform:scale(1) }
 }
@keyframes metric-value-increase { 0% { opacity:70%;transform:translateY(20px) }
50% { opacity:100%;transform:translateY(-4px) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes loading-shimmer { 0% { background-position:-200% 0 }
to { background-position:200% 0 }
 }
@keyframes spring-up { 0% { opacity:0;transform:translateY(20px) scale(.95) }
60% { transform:translateY(-4px) scale(1.02) }
to { opacity:100%;transform:translateY(0) scale(1) }
 }
@keyframes float { 0%,to { transform:translateY(0) }
50% { transform:translateY(-4px) }
 }
@keyframes progress-shine { 0% { left:-100% }
to { left:100% }
 }
@keyframes shimmer-slide { 0% { transform:translateX(-100%) }
to { transform:translateX(100%) }
 }
@keyframes pulse-success { 0% { opacity:100% }
50% { opacity:50% }
to { opacity:100% }
 }
@keyframes scroll-sentinel-fade-in { 0% { opacity:0;transform:translateY(var(--spacing-2)) }
to { opacity:1;transform:translateY(0) }
 }
@keyframes statCardEnter { 0% { opacity:0;transform:translateY(20px) scale(.95) }
60% { transform:translateY(-3px) scale(1.01) }
to { opacity:1;transform:translateY(0) scale(1) }
 }
@keyframes communicationCardEnter { 0% { opacity:0;transform:translateY(12px) scale(.98) }
60% { transform:translateY(-2px) scale(1.01) }
to { opacity:1;transform:translateY(0) scale(1) }
 }
@keyframes badgePulse { 0%,to { transform:scale(1) }
50% { transform:scale(1.1) }
 }
@keyframes modalEnter { 0% { opacity:0;transform:translateY(-20px) scale(.95) }
60% { transform:translateY(2px) scale(1.01) }
to { opacity:1;transform:translateY(0) scale(1) }
 }
@keyframes progressStripes { 0% { background-position:0 0 }
to { background-position:var(--spacing-10) 0 }
 }
@keyframes skeleton-loading { 0% { background-position:200% 0 }
to { background-position:-200% 0 }
 }
@keyframes indeterminate { 0% { transform:translateX(-100%) }
to { transform:translateX(400%) }
 }
@keyframes glow { 0%,to { opacity:0;transform:translate(-9999px,-9999px) scale(.8) }
50% { opacity:100%;transform:translate(-9999px,-9999px) scale(1.2) }
 }
@keyframes metricPulse { 0% { transform:scale(1) }
50% { transform:scale(1.02) }
to { transform:scale(1) }
 }
@keyframes monitoringShimmer { 0% { background-position:-200% 0 }
to { background-position:200% 0 }
 }
@keyframes enrichmentCardEnter { 0% { opacity:0;transform:translateY(16px) scale(.97) }
60% { transform:translateY(-3px) scale(1.01) }
to { opacity:1;transform:translateY(0) scale(1) }
 }
@keyframes statusPulse { 0%,to { box-shadow:inset 0 0 var(--spacing-4) var(--color-success-very-subtle) }
50% { box-shadow:inset 0 0 var(--spacing-6) rgba(34,197,94,.15) }
 }
@keyframes webhookCardEnter { 0% { opacity:0;transform:translateY(var(--spacing-4)) scale(.97) }
60% { transform:translateY(calc(var(--spacing-0-75)*-1)) scale(1.01) }
to { opacity:100%;transform:translateY(0) scale(1) }
 }
@keyframes webhookStatusPulse { 0%,to { box-shadow:inset 0 0 var(--spacing-4) var(--color-success-very-subtle) }
50% { box-shadow:inset 0 0 var(--spacing-6) color-mix(in srgb,var(--color-success) 15%,transparent) }
 }
@keyframes sg-mobile-nav-slide-in { to { opacity:100%;transform:translateX(0) }
 }
@keyframes learningSectionEnter { 0% { opacity:0;transform:translateY(var(--spacing-6)) scale(.97) }
60% { transform:translateY(calc(var(--spacing-1)*-1)) scale(1.01) }
to { opacity:100%;transform:translateY(0) scale(1) }
 }
@keyframes abIndicatorPulse { 0%,to { box-shadow:0 0 0 0 var(--color-info);opacity:100% }
50% { box-shadow:0 0 var(--spacing-2) var(--color-info);opacity:70% }
 }
@keyframes fa-spin { 0% { transform:rotate(0deg) }
to { transform:rotate(1turn) }
 }
@keyframes sg-pulse { 0%,to { opacity:100% }
50% { opacity:50% }
 }
@keyframes sg-slide-in { 0% { opacity:0;transform:translateX(100%) }
to { opacity:100%;transform:translateX(0) }
 }
@keyframes sg-slide-out { 0% { opacity:100%;transform:translateX(0) }
to { opacity:0;transform:translateX(100%) }
 }
@keyframes sg-spin { to { transform:rotate(1turn) }
 }
@keyframes slide-in-down { 0% { opacity:0;transform:translateY(calc(var(--spacing-2-5)*-1)) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes confidence-pulse { 0%,to { opacity:100% }
50% { opacity:70% }
 }
@keyframes confidence-highlight { 0%,to { transform:scale(1) }
25% { transform:scale(1.05) }
75% { transform:scale(1.02) }
 }
@keyframes confidence-loading { 0% { background-position:200% 0 }
to { background-position:-200% 0 }
 }
@keyframes suggestion-badge-spin { to { transform:rotate(1turn) }
 }
@keyframes suggestion-badge-confirm-enter { 0% { opacity:0;transform:scale(.95) }
to { opacity:100%;transform:scale(1) }
 }
@keyframes skeleton { 0% { background-position:200% 0 }
to { background-position:-200% 0 }
 }
@keyframes notification-slide-in { 0% { opacity:0;transform:translateY(-.5rem) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes notification-slide-out { 0% { opacity:100%;transform:translateY(0) }
to { opacity:0;transform:translateY(-.5rem) }
 }
@keyframes fade-out { 0% { opacity:100%;transform:scale(1) }
to { opacity:0;transform:scale(.95) }
 }
@keyframes quick-edit-spin { 0% { transform:rotate(0deg) }
to { transform:rotate(1turn) }
 }
@keyframes modal-fade-in { 0% { opacity:0 }
to { opacity:100% }
 }
@keyframes modal-spring-in { 0% { opacity:0;transform:translateY(30px) scale(.9) }
50% { opacity:100%;transform:translateY(-8px) scale(1.02) }
75% { transform:translateY(3px) scale(.99) }
to { opacity:100%;transform:translateY(0) scale(1) }
 }
@keyframes backdropFadeOut { 0% { opacity:100% }
to { opacity:0 }
 }
@keyframes modalSpringIn { 0% { opacity:0;transform:scale(.95) translateY(20px) }
60% { opacity:100%;transform:scale(1.02) translateY(-8px) }
to { opacity:100%;transform:scale(1) translateY(0) }
 }
@keyframes modalSpringOut { 0% { opacity:100%;transform:scale(1) translateY(0) }
to { opacity:0;transform:scale(.95) translateY(20px) }
 }
@keyframes fieldSlideIn { 0% { opacity:0;transform:translateY(12px) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes errorSlideIn { 0% { opacity:0;transform:translateY(-4px) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes pulse-danger { 0%,to { opacity:100% }
50% { opacity:50% }
 }
@keyframes backdropFadeIn { 0% { opacity:0 }
to { opacity:1 }
 }
@keyframes refreshSpin { 0% { transform:rotate(0deg) }
to { transform:rotate(1turn) }
 }
@keyframes expandContent { 0% { opacity:0;max-height:0 }
to { opacity:1;max-height:var(--inspector-max-height) }
 }
@keyframes progressShrink { 0% { transform:scaleX(1) }
to { transform:scaleX(0) }
 }
@keyframes fadeIn { to { opacity:1 }
 }
@keyframes conflictPulse { 0%,to { transform:scale(1);opacity:1 }
50% { transform:scale(1.1);opacity:.8 }
 }
@keyframes alternativeSlideIn { 0% { opacity:0;transform:translateX(-10px) }
to { opacity:1;transform:translateX(0) }
 }
@keyframes modal-slide-in { 0% { opacity:0;transform:translateY(calc(var(--spacing-5)*-1)) scale(.95) }
to { opacity:100%;transform:translateY(0) scale(1) }
 }
@keyframes item-fade-in { 0% { opacity:0 }
to { opacity:100% }
 }
@keyframes fadeInUp { 0% { opacity:0;transform:translateY(var(--spacing-2)) }
to { opacity:1;transform:translateY(0) }
 }
@keyframes progressFillIn { 0% { width:0 }
to { width:calc(var(--width, 0)*1%) }
 }
@keyframes keyboardFocusPulse { 0% { box-shadow:0 0 0 0 var(--color-brand-primary) }
50% { box-shadow:0 0 0 8px var(--color-brand-primary-subtle) }
to { box-shadow:0 0 0 0 transparent }
 }
@keyframes draftCardEnterSpring { 0% { opacity:0;transform:translateY(20px) scale(.96) }
60% { transform:translateY(-3px) scale(1.01) }
to { opacity:1;transform:translateY(0) scale(1) }
 }
@keyframes stat-pulse { 0% { color:var(--color-text-primary);transform:scale(1) }
50% { color:var(--accent);transform:scale(1.1) }
to { color:var(--color-text-primary);transform:scale(1) }
 }
@keyframes stat-pulse-spring { 0%,to { transform:scale(1) }
25% { transform:scale(1.08) }
50% { transform:scale(.98) }
75% { transform:scale(1.02) }
 }
@keyframes statEnterSpring { 0% { opacity:0;transform:translateY(24px) scale(.95) }
60% { transform:translateY(-4px) scale(1.02) }
to { opacity:1;transform:translateY(0) scale(1) }
 }
@keyframes insight-shimmer { 0% { background-position:-100% 0 }
to { background-position:200% 0 }
 }
@keyframes emailCardEnter { 0% { opacity:0;transform:translateX(-10px) }
60% { transform:translateX(2px) }
to { opacity:1;transform:translateX(0) }
 }
@keyframes undo-timer-pulse { 0%,to { opacity:100% }
50% { opacity:60% }
 }
@keyframes undo-button-spin { 0% { transform:rotate(0deg) }
to { transform:rotate(1turn) }
 }
@keyframes undo-loading-dots { 0%,20% { content:"" }
40% { content:"." }
60% { content:".." }
80%,to { content:"..." }
 }
@keyframes undo-notification-slide-in { 0% { opacity:0;transform:translateY(calc(var(--spacing-2)*-1)) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes undo-button-fade-out { 0% { opacity:100%;transform:scale(1) }
to { opacity:0;transform:scale(.95) }
 }
@keyframes classification-spin { to { transform:rotate(1turn) }
 }
@keyframes classification-flash-detail { 0% { background-color:var(--color-success-subtle) }
to { background-color:var(--color-surface) }
 }
@keyframes classification-pulse { 0%,to { opacity:100% }
50% { opacity:60% }
 }
@keyframes classification-shake { 0%,to { transform:translateX(0) }
10%,30%,50%,70%,90% { transform:translateX(-4px) }
20%,40%,60%,80% { transform:translateX(4px) }
 }
@media (prefers-color-scheme:dark) { @keyframes classification-flash-dark { 0% { background-color:var(--color-success-subtle) }
to { background-color:transparent }
 }
 }
@keyframes classification-skeleton { 0% { background-position:200% 0 }
to { background-position:-200% 0 }
 }
@keyframes neon-pulse { 0%,to { box-shadow:0 0 var(--spacing-2) var(--theme-accent-primary),0 0 var(--spacing-5) var(--theme-accent-primary),0 0 var(--spacing-10) var(--theme-accent-primary);opacity:100% }
50% { box-shadow:0 0 var(--spacing-1) var(--theme-accent-primary),0 0 var(--spacing-3) var(--theme-accent-primary),0 0 var(--spacing-6) var(--theme-accent-primary);opacity:80% }
 }
@keyframes table-loading { 0% { transform:translateX(-100%) }
to { transform:translateX(100%) }
 }
@keyframes slide-in { 0% { opacity:0;transform:translateX(100%) }
to { opacity:100%;transform:translateX(0) }
 }
@keyframes slide-out { 0% { opacity:100%;transform:translateX(0) }
to { opacity:0;transform:translateX(100%) }
 }
@keyframes export-modal-overlay-enter { 0% { opacity:0 }
to { opacity:100% }
 }
@keyframes export-modal-enter { 0% { opacity:0;transform:scale(.9) translateY(calc(var(--spacing-5)*-1)) }
to { opacity:100%;transform:scale(1) translateY(0) }
 }
@keyframes theme-toggle-dropdown-enter { 0% { opacity:0;transform:translateY(calc(var(--spacing-1)*-1)) scale(.95) }
to { opacity:100%;transform:translateY(0) scale(1) }
 }
@keyframes progress-shimmer { to { transform:translateX(100%) }
 }
@keyframes classification-flash { 0% { background-color:var(--color-success-subtle) }
to { background-color:transparent }
 }
@keyframes metricCardEnter { 0% { opacity:0;transform:translateY(12px) scale(.95) }
to { opacity:1;transform:translateY(0) scale(1) }
 }
@keyframes loading { 0% { background-position:200% 0 }
to { background-position:-200% 0 }
 }
@keyframes metricsShimmer { 0% { background-position:-200% 0 }
to { background-position:200% 0 }
 }
@keyframes slide-in-right { 0% { opacity:0;transform:translateX(100%) }
to { opacity:100%;transform:translateX(0) }
 }
@keyframes accordionOpen { 0% { opacity:var(--opacity-0);transform:var(--transform-dropdown-enter) }
to { opacity:var(--opacity-100);transform:translateY(0) }
 }
@keyframes templates-modal-shake { 0%,to { transform:translateX(0) }
25% { transform:translateX(calc(var(--spacing-1)*-1)) }
75% { transform:translateX(var(--spacing-1)) }
 }
@keyframes templates-modal-spin { to { transform:rotate(1turn) }
 }
@keyframes shake { 0%,to { transform:translateX(0) }
10%,30%,50%,70%,90% { transform:translateX(calc(var(--space-shake)*-1)) }
20%,40%,60%,80% { transform:translateX(var(--space-shake)) }
 }
@keyframes highlight-success { 0% { box-shadow:0 0 0 0 var(--color-success-15) }
50% { box-shadow:0 0 0 var(--spacing-2) var(--color-success-15),var(--shadow-badge-glow-success) }
to { box-shadow:0 0 0 0 var(--color-success-15) }
 }
@keyframes checkbox-bounce { 0% { transform:scale(1) }
50% { transform:scale(1.2) }
75% { transform:scale(.9) }
to { transform:scale(1) }
 }
@keyframes file-bounce { 0%,to { transform:scale(1) }
50% { transform:scale(1.1) }
 }
@keyframes slide-down { 0% { opacity:0;transform:translateY(-10px) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes slideInUp { 0% { opacity:0;transform:var(--transform-slide-in) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes resultSlideIn { 0% { opacity:0;transform:translateY(8px) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes modalSlideIn { 0% { opacity:0;transform:scale(.95) var(--transform-slide-in) }
to { opacity:100%;transform:scale(1) translateY(0) }
 }
@keyframes pulse-glow { 0%,to { box-shadow:0 0 var(--spacing-2) currentcolor;opacity:100% }
50% { box-shadow:0 0 var(--spacing-4) currentcolor;opacity:70% }
 }
@keyframes skeleton-shimmer { 0% { background-position:200% 0 }
to { background-position:-200% 0 }
 }
@keyframes alertPulse { 0%,to { box-shadow:0 0 0 0 var(--color-danger-subtle) }
50% { box-shadow:0 0 var(--spacing-4) var(--spacing-1) var(--color-danger-subtle) }
 }
@keyframes slideDown { 0% { opacity:0;transform:translateY(calc(var(--spacing-2)*-1)) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes bannerSlideIn { 0% { opacity:0;transform:translateY(calc(var(--spacing-3)*-1)) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes livePulse { 0%,to { opacity:100%;transform:scale(1) }
50% { opacity:50%;transform:scale(.85) }
 }
@keyframes activitySlideIn { 0% { opacity:0;transform:translateY(-8px) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes filterSlideDown { 0% { opacity:0;transform:translateY(-8px) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes timelineSlideIn { 0% { opacity:0;transform:translateX(-8px) }
to { opacity:100%;transform:translateX(0) }
 }
@keyframes auditTrailShimmer { 0% { background-position:-200% 0 }
to { background-position:200% 0 }
 }
@keyframes drift-pulse-success { 0%,to { opacity:100%;transform:scale(1) }
50% { opacity:70%;transform:scale(1.1) }
 }
@keyframes drift-pulse-warning { 0%,to { opacity:100%;transform:scale(1) }
50% { opacity:80%;transform:scale(1.15) }
 }
@keyframes drift-pulse-moderate { 0%,to { opacity:100%;transform:scale(1) }
50% { opacity:70%;transform:scale(1.2) }
 }
@keyframes drift-pulse-severe { 0%,to { box-shadow:0 0 var(--spacing-3) var(--color-danger);opacity:100%;transform:scale(1) }
50% { box-shadow:0 0 var(--spacing-4) var(--color-danger);opacity:90%;transform:scale(1.3) }
 }
@keyframes drift-shimmer { 0%,to { opacity:50% }
50% { opacity:100% }
 }
@keyframes glow-animation { 0% { background-position:0 var(--radius-full) }
50% { background-position:100% var(--radius-full) }
to { background-position:0 var(--radius-full) }
 }
@keyframes check-bounce { 0% { transform:scale(1) }
33% { transform:scale(1.25) }
to { transform:scale(1) }
 }
@keyframes dot-pulse { 0%,80%,to { opacity:50%;transform:scale(0) }
40% { opacity:100%;transform:scale(1) }
 }
@keyframes success-check { to { transform:rotate(45deg) scale(1) }
 }
@keyframes error-line1 { to { transform:rotate(45deg) scale(1) }
 }
@keyframes error-line2 { to { transform:rotate(-45deg) scale(1) }
 }
@keyframes focus-pulse { 0% { box-shadow:0 0 0 var(--spacing-0-75) var(--color-info-subtle) }
50% { box-shadow:0 0 0 var(--spacing-1-5) var(--color-info-subtle) }
to { box-shadow:0 0 0 var(--spacing-0-75) var(--color-info-subtle) }
 }
@keyframes gradient-shift { 0% { background-position:0 var(--radius-full) }
50% { background-position:100% var(--radius-full) }
to { background-position:0 var(--radius-full) }
 }
@keyframes loading-sweep { 0% { transform:translateX(-100%) }
to { transform:translateX(100%) }
 }
@keyframes flash-update { 0%,to { background-color:transparent }
50% { background-color:var(--color-brand-primary-subtle) }
 }
@keyframes highlight-fade { 0% { background-color:var(--color-brand-primary-light) }
to { background-color:var(--color-brand-primary-subtle) }
 }
@keyframes fade-in { 0% { opacity:0;transform:translateY(var(--spacing-2-5)) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes slide-in-left { 0% { opacity:0;transform:translateX(calc(var(--spacing-5)*-1)) }
to { opacity:100%;transform:translateX(0) }
 }
@keyframes slide-up { 0% { opacity:0;transform:translateY(100%) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes spin { 0% { transform:rotate(0deg) }
to { transform:rotate(1turn) }
 }
@keyframes pulse { 0%,to { opacity:100%;transform:scale(1) }
50% { opacity:50%;transform:scale(.8) }
 }
@keyframes shimmer { to { transform:translateX(100%) }
 }
@keyframes tooltip-fade-in { 0% { opacity:0;transform:translateY(var(--spacing-1)) }
to { opacity:100%;transform:translateY(0) }
 }
@keyframes tooltip-pulse { 0% { box-shadow:0 var(--spacing-1) var(--spacing-3) var(--alpha-black-15) 0 0 0 var(--spacing-px) var(--alpha-white-10) }
50% { box-shadow:0 var(--spacing-1) var(--spacing-1-5) var(--color-primary-500-30),0 0 0 var(--spacing-px) var(--color-primary-500-30) }
to { box-shadow:0 var(--spacing-1) var(--spacing-3) var(--alpha-black-15),0 0 0 var(--spacing-px) var(--alpha-white-10) }
 }
*,:after,:before { box-sizing:border-box }
* { margin:var(--spacing-0) }
body,html { height:100% }
body { min-height:100vh;color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);background-color:var(--color-surface-base);text-rendering:optimizespeed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale }
canvas,img,picture,svg,video { display:block;max-width:100% }
button,input,select,textarea { font:inherit }
h1,h2,h3,h4,h5,h6,p { overflow-wrap:anywhere }
.c-next,.c-root { isolation:isolate }
ol[role=list],ul[role=list] { padding:var(--spacing-0);list-style:none }
a:not([class]) { text-decoration-skip-ink:auto }
@media (prefers-reduced-motion:reduce) { html:focus-within { scroll-behavior:auto }
*,:after,:before { transition-duration:.01ms;animation-duration:.01ms;animation-iteration-count:1;scroll-behavior:auto }
 }
:root { --color-white:#fff;--color-black:#222;--color-gray-50:#f7f7f7;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-500:#6b7280;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-800:#1f2937;--color-gray-900:#111827;--color-brand-primary:var(--color-primary);--color-brand-primary-dark:var(--color-primary-dark);--color-brand-primary-light:#1fb8cd;--color-brand-primary-subtle:rgba(32,128,141,.1);--color-brand-primary-05:rgb(32 128 141/5%);--color-brand-primary-10:rgba(32,128,141,.1);--color-brand-primary-15:rgba(32,128,141,.15);--color-brand-primary-20:rgba(32,128,141,.2);--color-brand-primary-30:rgba(32,128,141,.3);--color-brand-primary-40:rgba(32,128,141,.4);--color-brand-primary-light-05:rgb(31 184 205/5%);--color-brand-primary-light-08:rgb(31 184 205/8%);--color-brand-primary-light-10:rgba(31,184,205,.1);--color-brand-primary-light-12:rgba(31,184,205,.12);--color-channel-access-premium:#20808d;--color-channel-access-premium-coop:#1a6b7a;--color-channel-direct-mobile:#7cbec7;--color-channel-direct-web:#4a90a4;--color-channel-course-website:#333;--color-channel-coop-site:#666;--color-chart-tooltip-bg:rgba(30,30,30,.95);--color-chart-tooltip-title:var(--color-white);--color-chart-tooltip-body:var(--color-text-secondary);--color-chart-tooltip-border:var(--alpha-white-10);--color-chart-axis-label:var(--color-text-muted);--color-chart-axis-title:var(--color-text-muted);--color-chart-grid:var(--alpha-white-5);--color-chart-legend:var(--color-text-tertiary);--color-chart-success:var(--color-success-light);--color-chart-success-bg:rgba(34,197,94,.1);--color-chart-primary-bg:rgba(32,128,141,.1);--color-chart-point-border:var(--color-white);--color-accent-primary:var(--color-brand-primary);--color-accent-hover:var(--color-brand-primary-light);--color-accent-secondary:var(--color-brand-primary-light);--color-accent-tertiary:#14b8a6;--color-focus:var(--color-brand-primary);--color-neutral-0:var(--color-white);--color-neutral-50:var(--color-gray-50);--color-neutral-100:var(--color-gray-100);--color-neutral-200:var(--color-gray-200);--color-neutral-300:var(--color-gray-300);--color-neutral-400:var(--color-gray-400);--color-neutral-500:var(--color-gray-500);--color-neutral-600:var(--color-gray-600);--color-neutral-700:var(--color-gray-700);--color-neutral-800:var(--color-gray-800);--color-neutral-900:var(--color-gray-900);--color-neutral-950:#030712;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-weight-black:900;--color-success:var(--color-success-light);--color-success-dark:var(--color-success);--color-success-light:#34d399;--color-success-high-contrast:#6ee7b7;--color-success-subtle:rgba(16,185,129,.1);--color-warning:var(--color-warning-light);--color-warning-dark:var(--color-warning);--color-warning-light:#fbbf24;--color-warning-high-contrast:#fcd34d;--color-warning-subtle:rgba(245,158,11,.1);--color-danger:var(--color-error-light);--color-danger-dark:var(--color-error);--color-danger-light:#f87171;--color-danger-subtle:rgba(239,68,68,.1);--color-info:var(--color-info-light);--color-info-dark:var(--color-info);--color-info-light:#60a5fa;--color-info-high-contrast:#93c5fd;--color-info-subtle:rgba(59,130,246,.1);--color-cyan:#22d3ee;--color-cyan-subtle:rgba(6,182,212,.1);--color-cyan-border:rgba(6,182,212,.3);--color-indigo:#6366f1;--color-indigo-subtle:rgba(79,70,229,.1);--color-indigo-hover:rgba(99,102,241,.25);--color-indigo-border:rgba(79,70,229,.3);--color-purple-100:#f3e8ff;--color-purple-200:#e9d5ff;--color-purple-700:#7c3aed;--color-pink-100:#fce7f3;--color-pink-200:#fbcfe8;--color-pink-700:#be185d;--color-primary-border:rgba(32,128,141,.3);--color-brand-primary-hover:rgba(32,128,141,.25);--color-warning-hover:rgba(251,146,60,.25);--color-success-hover:rgba(34,197,94,.25);--color-info-hover:rgba(59,130,246,.25);--color-success-bg:#d1fae5;--color-success-text:#065f46;--color-success-15:rgba(16,185,129,.15);--color-success-foreground:#2e7d32;--color-warning-bg:#fed7aa;--color-warning-text:#92400e;--color-warning-foreground:#f57c00;--color-danger-bg:#fee2e2;--color-danger-text:#991b1b;--color-danger-foreground:#d32f2f;--color-danger-surface:#fee2e2;--color-danger-high-contrast:#dc2626;--color-error-15:rgba(239,68,68,.15);--color-info-bg:#dbeafe;--color-info-text:#1e40af;--color-info-500:var(--color-info-light);--color-info-50:var(--color-info-bg);--color-warning-moderate:#fb923c;--color-warning-moderate-subtle:rgba(251,146,60,.1);--color-warning-moderate-border:rgba(251,146,60,.3);--color-warning-moderate-glow:rgba(251,146,60,.5);--color-warning-moderate-text:#9a3412;--color-surface-base:#0a0a0a;--color-surface-primary:#1a1a1a;--color-surface-primary-translucent:rgba(26,26,26,.95);--color-surface-elevated:#1e1e1e;--color-surface-elevated-translucent:rgba(30,30,30,.98);--color-surface-overlay:#2a2a2a;--color-surface-overlay-strong:rgba(42,42,42,.95);--color-surface-hover:#333;--color-surface-alt:hsla(0,0%,100%,.05);--surface-1:var(--color-gray-100);--color-card-background:var(--color-surface-elevated);--color-card-background-hover:var(--color-surface-hover);--color-card-background-selected:rgb(32 128 141/6%);--color-card-background-selected-hover:rgba(32,128,141,.1);--color-card-border:hsla(0,0%,100%,.08);--color-card-border-hover:hsla(0,0%,100%,.16);--color-card-divider:rgba(148,163,184,.2);--color-text-primary:var(--color-white);--color-text-secondary:#cbd5e1;--color-text-tertiary:#94a3b8;--color-text-muted:#64748b;--color-text-neutral:var(--color-white);--color-text-inverse:var(--color-black);--color-text-brand:var(--color-brand-primary-light);--color-status-muted:#6c757d;--color-text-on-light:var(--color-gray-900);--color-text-on-light-secondary:var(--color-gray-600);--color-text-on-light-muted:var(--color-gray-500);--color-text-on-dark:var(--color-white);--color-text-on-dark-secondary:var(--color-gray-300);--color-text-on-dark-muted:var(--color-gray-400);--color-surface-card:var(--color-neutral-0);--color-surface-card-hover:var(--color-surface-hover);--color-text-card:var(--color-text-on-light);--color-text-card-secondary:var(--color-text-on-light-secondary);--color-text-card-hover:var(--color-text-on-dark);--color-text-card-hover-secondary:var(--color-text-on-dark-secondary);--color-border-subtle:hsla(0,0%,100%,.05);--color-border-default:hsla(0,0%,100%,.08);--color-border-strong:hsla(0,0%,100%,.15);--color-border-brand:var(--color-brand-primary);--color-border-weak:#e0e0e0;--color-border-muted:#e0e0e0;--color-border-status:#e0e0e0;--color-success-border:rgba(34,197,94,.3);--color-info-border:rgba(59,130,246,.3);--color-warning-border:rgba(251,146,60,.3);--color-danger-border:rgba(239,68,68,.3);--color-warning-border-fair:rgba(245,158,11,.3);--color-danger-border-poor:rgba(239,68,68,.3);--divider-info:rgba(59,130,246,.2);--spacing-0:0;--spacing-px:1px;--spacing-0-5:0.125rem;--spacing-0-75:0.1875rem;--spacing-1:0.25rem;--spacing-1-5:0.375rem;--spacing-2:0.5rem;--spacing-2-5:0.625rem;--spacing-3:0.75rem;--spacing-3-5:0.875rem;--spacing-4:1rem;--spacing-5:1.25rem;--spacing-6:1.5rem;--spacing-7:1.75rem;--spacing-8:2rem;--spacing-9:2.25rem;--spacing-10:2.5rem;--spacing-11:2.75rem;--spacing-12:3rem;--spacing-14:3.5rem;--spacing-16:4rem;--spacing-20:5rem;--spacing-24:6rem;--spacing-28:7rem;--spacing-32:8rem;--border-width-0:0;--border-width-1:1px;--border-width-2:2px;--border-width-3:3px;--border-width-4:4px;--border-width-8:8px;--focus-ring-width:3px;--focus-ring-offset:2px;--shadow-focus:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle);--font-sans:-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,sans-serif;--font-mono:ui-monospace,sfmono-regular,"SF Mono",consolas,"Liberation Mono",menlo,monospace;--text-xs:0.75rem;--text-sm:0.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3rem;--text-6xl:3.75rem;--font-thin:100;--font-light:300;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--font-extrabold:800;--font-black:900;--leading-none:1;--leading-tight:1.25;--leading-snug:1.375;--leading-normal:1.5;--leading-relaxed:1.625;--leading-loose:2;--tracking-tighter:-0.05em;--tracking-tight:-0.025em;--tracking-normal:0;--tracking-wide:0.025em;--tracking-wider:0.05em;--tracking-widest:0.1em;--radius-none:0;--radius-sm:0.125rem;--radius-base:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-full:9999px;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1280px;--container-2xl:1400px;--container-3xl:1600px;--container-4xl:1700px;--container-5xl:1800px;--modal-width-context-inspector:900px;--modal-max-height:90vh;--size-touch-min:44px;--size-touch-comfortable:48px;--nav-height:60px;--nav-height-enhanced:64px;--modal-header-height:60px;--modal-footer-height:60px;--row-height-default:40px;--card-min-width-sm:20rem;--card-min-width-md:23.75rem;--card-min-width-lg:26.25rem;--card-min-height-draft:11.25rem;--card-min-height-category-empty:12.5rem;--section-min-height-email-list:25rem;--list-max-height-scrollable:25rem;--grid-min-column:15.625rem;--size-icon-xs:0.3125rem;--size-icon-sm:1.125rem;--size-icon-md:3rem;--size-icon-lg:3.5rem;--size-icon-inline:1.2em;--size-icon-checkmark-height:0.625rem;--size-spinner-lg:3.125rem;--size-sparkline:1.875rem;--size-chart-sm:15.625rem;--size-chart-mini:9.375rem;--size-icon-badge:1.75rem;--modal-max-width-sm:31.25rem;--modal-max-width-md:37.5rem;--dropdown-min-width:15rem;--bulk-approval-list-max-height:37.5rem;--template-body-max-height:25rem;--inspector-max-height:62.5rem;--drawer-width-md:32.5rem;--sidebar-width:16rem;--sidebar-width-collapsed:4rem;--master-width-min:350px;--master-width-preferred:35%;--master-width-large:30%;--master-width-ultrawide:25%;--detail-width-min:600px;--form-control-min-width:3.125rem;--text-badge:0.6875rem;--skeleton-header-height:2rem;--skeleton-badge-width:12.5rem;--skeleton-badge-height:3.75rem;--skeleton-section-height:5rem;--size-shimmer-small:5rem;--size-shimmer-medium:7.5rem;--size-shimmer-large:10rem;--col-width-date:6.25rem;--col-width-narrow:9.375rem;--col-width-medium:12.5rem;--col-width-wide:15.625rem;--col-width-extra-wide:18.75rem;--breakpoint-sm:640px;--breakpoint-md:768px;--breakpoint-lg:1024px;--breakpoint-xl:1280px;--breakpoint-2xl:1400px;--breakpoint-3xl:1920px;--max-width-full:1800px;--shadow-xs:0 1px 2px 0 rgb(0 0 0/5%);--shadow-sm:0 1px 3px rgba(0,0,0,.1);--shadow-base:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgb(0 0 0/6%);--shadow-md:0 4px 8px rgba(0,0,0,.1);--shadow-lg:0 8px 16px rgba(0,0,0,.1);--shadow-xl:0 12px 24px rgba(0,0,0,.15);--shadow-2xl:0 35px 60px -15px rgba(0,0,0,.3);--shadow-elevated:0 20px 25px -5px rgba(0,0,0,.1);--shadow-inner:inset 0 2px 4px 0 rgb(0 0 0/6%);--shadow-none:none;--shadow-inspector-modal:0 25px 50px -12px rgba(0,0,0,.5),0 0 0 1px hsla(0,0%,100%,.05);--shadow-inspector-badge:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgb(0 0 0/6%);--shadow-inspector-badge-glow:0 0 20px rgba(0,0,0,.2);--shadow-inspector-source-hover:0 4px 6px -1px rgba(0,0,0,.1);--shadow-card-lift-sm:0 2px 8px rgba(0,0,0,.1);--shadow-card-lift-md:0 4px 12px rgba(0,0,0,.1);--shadow-card-lift-lg:0 6px 16px rgba(0,0,0,.1);--sidebar-shadow:4px 0 24px -2px rgba(0,0,0,.15),2px 0 8px -2px rgb(0 0 0/8%);--overlay-light:hsla(0,0%,100%,.1);--overlay-light-20:hsla(0,0%,100%,.2);--overlay-light-30:hsla(0,0%,100%,.3);--overlay-medium:hsla(0,0%,100%,.5);--overlay-bg:rgba(0,0,0,.5);--overlay-dark:rgba(0,0,0,.8);--overlay-darker:rgba(0,0,0,.75);--overlay-scrim-80:rgba(0,0,0,.8);--alpha-black-70:rgba(0,0,0,.7);--alpha-black-5:rgb(0 0 0/5%);--alpha-black-10:rgba(0,0,0,.1);--alpha-black-15:rgba(0,0,0,.15);--alpha-black-20:rgba(0,0,0,.2);--alpha-black-30:rgba(0,0,0,.3);--alpha-black-40:rgba(0,0,0,.4);--alpha-black-50:rgba(0,0,0,.5);--alpha-black-60:rgba(0,0,0,.6);--alpha-black-80:rgba(0,0,0,.8);--alpha-white-5:hsla(0,0%,100%,.05);--alpha-white-10:hsla(0,0%,100%,.1);--alpha-white-20:hsla(0,0%,100%,.2);--alpha-white-30:hsla(0,0%,100%,.3);--alpha-white-80:hsla(0,0%,100%,.8);--opacity-0:0;--opacity-03:0.03;--opacity-05:0.05;--opacity-10:0.1;--opacity-20:0.2;--opacity-30:0.3;--opacity-40:0.4;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--backdrop-blur-light:blur(4px);--backdrop-blur-medium:blur(8px);--backdrop-blur-heavy:blur(12px);--backdrop-blur-extra-heavy:blur(16px);--touch-target-min:44px;--touch-target-comfortable:48px;--motion-raise-sm:-1px;--space-neg-1:-0.25rem;--space-shake:5px;--color-warning-aaa:#ff0;--color-neutral-950-aaa:var(--color-black);--focus-aaa-outline:var(--color-warning-aaa);--focus-aaa-shadow:var(--color-neutral-950-aaa);--bg-aaa-neutral-0:var(--color-neutral-0);--bg-aaa-primary:var(--color-neutral-0);--size-status-dot:8px;--size-scrollbar:0.5rem;--hover-bg:hsla(0,0%,100%,.1);--size-dropdown-recent:20rem;--size-dropdown-export:17.5rem;--size-dropdown-list-max:18.75rem;--size-filters-max:31.25rem;--size-grid-column-min:12.5rem;--size-results-min:25rem;--size-badge:20px;--size-button-pagination:40px;--size-label-min:4rem;--width-description-max:400px;--size-notification-min-width:20rem;--size-notification-max-width:25rem;--size-kill-switch-select-min:9.375rem;--size-kill-switch-button-height:2.625rem;--size-kill-switch-reason-max:12.5rem;--size-kill-switch-reason-max-sm:7.5rem;--gradient-success:linear-gradient(135deg,var(--color-surface-primary) 0%,var(--color-success-subtle) 100%);--gradient-warning:linear-gradient(135deg,var(--color-surface-primary) 0%,var(--color-warning-subtle) 100%);--gradient-error:linear-gradient(135deg,var(--color-surface-primary) 0%,var(--color-danger-subtle) 100%);--gradient-danger-badge:linear-gradient(135deg,#ef4444,#dc2626);--gradient-info:linear-gradient(135deg,var(--color-surface-primary) 0%,var(--color-info-subtle) 100%);--shadow-1:0 2px 8px rgba(0,0,0,.1);--shadow-light:0 2px 4px var(--alpha-black-5);--shadow-strong:0 4px 12px var(--alpha-black-15);--shadow-stronger:0 8px 32px var(--alpha-black-15);--shadow-colored-purple:0 4px 12px rgba(32,128,141,.3);--shadow-colored-blue:0 0 10px var(--color-brand-primary-subtle);--shadow-elevation-1:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgb(0 0 0/6%);--shadow-elevation-2:0 8px 16px rgba(0,0,0,.1);--shadow-brand-elevation-1:0 4px 8px var(--color-brand-primary-subtle);--shadow-brand-elevation-2:0 8px 16px var(--color-brand-primary-subtle);--shadow-drawer:-8px 0 24px rgba(0,0,0,.4);--shadow-purple-25:0 0 8px rgba(32,128,141,.25);--shadow-purple-35:0 0 8px rgba(32,128,141,.35);--shadow-purple-60:0 0 16px rgba(32,128,141,.6);--shadow-topic-badge-hover-booking:0 4px 12px rgba(6,182,212,.3);--shadow-topic-badge-hover-player:0 4px 12px rgba(20,184,166,.3);--shadow-topic-badge-hover-feature:0 4px 12px rgba(99,102,241,.3);--z-0:0;--z-10:10;--z-20:20;--z-30:30;--z-40:40;--z-50:50;--z-fixed:1030;--z-modal-backdrop:1040;--duration-instant:100ms;--duration-fast:200ms;--duration-base:200ms;--duration-medium:300ms;--duration-moderate:300ms;--duration-slow:500ms;--duration-slower:700ms;--duration-slowest:1000ms;--duration-shimmer:1500ms;--duration-pulse:2s;--delay-stagger-1:0ms;--delay-stagger-2:100ms;--delay-stagger-3:200ms;--delay-stagger-4:300ms;--delay-stagger-fine-1:0ms;--delay-stagger-fine-2:50ms;--delay-stagger-fine-3:100ms;--delay-stagger-fine-4:150ms;--delay-stagger-fine-5:200ms;--delay-stagger-fine-6:250ms;--delay-stagger-fine-7:300ms;--delay-stagger-fine-8:350ms;--animation-metric-enter-distance:24px;--animation-metric-enter-overshoot:-4px;--animation-metric-hover-lift:-4px;--animation-metric-enter-scale-initial:0.92;--animation-metric-enter-scale-overshoot:1.02;--animation-metric-enter-scale-final:1;--ease-linear:linear;--ease-ease:ease;--ease-in:cubic-bezier(0.4,0,1,1);--ease-out:cubic-bezier(0,0,0.2,1);--ease-in-out:cubic-bezier(0.4,0,0.2,1);--ease-bounce:cubic-bezier(0.68,-0.55,0.265,1.55);--z-index-base:1;--z-index-dropdown:10;--z-index-sticky:100;--z-index-overlay:1000;--z-index-modal:10000;--z-index-popover:10001;--z-index-tooltip:10100;--z-index-notification:10200;--z-index-critical:99999;--z-modal:var(--z-index-modal);--z-sticky:var(--z-index-sticky);--z-popover:var(--z-index-popover);--z-notification:var(--z-index-notification);--z-toast:var(--z-index-notification);--z-dropdown:var(--z-index-dropdown);--z-tooltip:var(--z-index-tooltip);--draft-card-bg:var(--color-card-background);--draft-card-bg-hover:var(--color-card-background-hover);--draft-card-border:var(--color-card-border);--draft-card-border-hover:var(--color-card-border-hover);--draft-card-padding:var(--spacing-6);--draft-card-radius:var(--radius-xl);--draft-card-shadow:var(--shadow-sm);--draft-card-shadow-hover:var(--shadow-md);--draft-card-shadow-selected-hover:0 4px 12px rgba(0,0,0,.15);--badge-ai-bg:rgba(6,182,212,.15);--badge-ai-color:#22d3ee;--badge-ai-border:rgba(6,182,212,.3);--badge-inbound-bg:rgba(168,85,247,.15);--badge-inbound-color:#c084fc;--badge-inbound-border:rgba(168,85,247,.3);--badge-draft-type-bg:rgba(100,116,139,.15);--badge-draft-type-color:#94a3b8;--badge-draft-type-border:rgba(100,116,139,.3);--button-padding-x:var(--spacing-5);--button-padding-y:var(--spacing-3);--button-radius:var(--radius-lg);--button-font-size:var(--text-sm);--button-font-weight:var(--font-semibold);--button-gradient-send:linear-gradient(135deg,#a855f7,#9333ea);--button-gradient-send-hover:linear-gradient(135deg,#9333ea,#7e22ce);--button-shadow-send:0 2px 8px rgba(168,85,247,.25);--button-shadow-send-hover:0 4px 12px rgba(168,85,247,.35);--button-bg-mark-sent:#14b8a6;--button-bg-mark-sent-hover:#0d9488;--button-shadow-mark-sent:0 2px 8px rgba(20,184,166,.25);--button-shadow-mark-sent-hover:0 4px 12px rgba(20,184,166,.35);--button-bg-edit:rgba(100,116,139,.2);--button-bg-edit-hover:rgba(100,116,139,.3);--button-border-edit:rgba(148,163,184,.3);--button-border-edit-hover:rgba(148,163,184,.4);--button-text-edit:#cbd5e1;--button-bg-delete:transparent;--button-bg-delete-hover:hsla(0,91%,71%,.1);--button-border-delete:hsla(0,91%,71%,.2);--button-border-delete-hover:hsla(0,91%,71%,.4);--button-text-delete:hsla(0,91%,71%,.7);--button-text-delete-hover:#f87171;--button-ring-delete:0 0 0 3px hsla(0,91%,71%,.1);--color-confidence-high:#10b981;--color-confidence-high-dark:#059669;--color-confidence-high-bg:rgba(16,185,129,.15);--color-confidence-high-border:rgba(16,185,129,.3);--color-confidence-medium:#f59e0b;--color-confidence-medium-dark:#d97706;--color-confidence-medium-bg:rgba(245,158,11,.15);--color-confidence-medium-border:rgba(245,158,11,.3);--color-confidence-low:#ef4444;--color-confidence-low-dark:#dc2626;--color-confidence-low-bg:rgba(239,68,68,.15);--color-confidence-low-border:rgba(239,68,68,.3);--confidence-badge-gradient-angle:135deg;--confidence-badge-high-gradient:linear-gradient(var(--confidence-badge-gradient-angle),var(--color-confidence-high) 0%,var(--color-confidence-high-dark) 100%);--confidence-badge-medium-gradient:linear-gradient(var(--confidence-badge-gradient-angle),var(--color-confidence-medium) 0%,var(--color-confidence-medium-dark) 100%);--confidence-badge-low-gradient:linear-gradient(var(--confidence-badge-gradient-angle),var(--color-confidence-low) 0%,var(--color-confidence-low-dark) 100%);--confidence-progress-track-bg:rgba(148,163,184,.2);--confidence-progress-bar-height:var(--spacing-2);--confidence-progress-bar-radius:var(--radius-base);--confidence-progress-transition:width var(--duration-slow) var(--ease-out);--confidence-progress-max-width:200px;--confidence-indicator-bar-width:3.75rem;--confidence-badge-font-size:11px;--confidence-badge-font-weight:var(--font-weight-bold);--confidence-badge-letter-spacing:0.05em;--confidence-badge-padding:var(--spacing-1-5) var(--spacing-3);--confidence-badge-shadow-high:0 2px 4px rgba(16,185,129,.2);--confidence-badge-shadow-medium:0 2px 4px rgba(245,158,11,.2);--confidence-badge-shadow-low:0 2px 4px rgba(239,68,68,.2);--confidence-badge-shadow-high-hover:0 4px 8px rgba(16,185,129,.3);--confidence-badge-shadow-medium-hover:0 4px 8px rgba(245,158,11,.3);--confidence-badge-shadow-low-hover:0 4px 8px rgba(239,68,68,.3);--input-bg:var(--color-surface-elevated);--input-border:var(--color-border-default);--input-border-focus:var(--color-brand-primary);--input-padding-x:var(--spacing-3);--input-padding-y:var(--spacing-2);--input-radius:var(--radius-md);--search-max-width:400px;--color-success-subtle-alpha:rgba(16,185,129,.1);--color-primary-500:#20808d;--color-success-500:var(--color-success-light);--color-danger-500:var(--color-error-light);--z-index-dialog:var(--z-index-modal);--metric-card-bg:var(--color-surface-primary);--metric-card-bg-gradient:linear-gradient(135deg,#1a1a1a,rgba(26,26,26,.95));--metric-card-bg-primary:linear-gradient(180deg,#1fb8cd,#0f434a);--metric-card-bg-success:linear-gradient(135deg,rgba(34,197,94,.25),rgba(16,185,129,.15));--metric-card-bg-info:linear-gradient(135deg,rgba(59,130,246,.25),rgba(37,99,235,.15));--metric-card-bg-warning:linear-gradient(135deg,rgba(251,146,60,.25),rgba(245,158,11,.15));--metric-card-bg-accent:linear-gradient(89.85deg,#121212,#014c52);--metric-card-border:var(--color-border-default);--metric-card-border-primary:rgba(32,128,141,.3);--metric-card-border-hover:var(--color-brand-primary);--metric-card-padding:2.5rem;--metric-card-radius:var(--radius-2xl);--metric-card-min-height:200px;--metric-card-gap:var(--spacing-6);--metric-card-shadow:0 10px 30px -5px var(--alpha-black-30),0 4px 6px -1px var(--alpha-black-20);--metric-card-shadow-hover:0 20px 40px -8px var(--color-brand-primary-subtle),0 10px 20px -5px var(--alpha-black-30);--metric-card-backdrop-blur:blur(10px);--gradient-brand-icon:linear-gradient(135deg,var(--color-brand-primary-10) 0%,var(--color-brand-primary-light-08) 100%);--gradient-brand-icon-hover:linear-gradient(135deg,var(--color-brand-primary-20) 0%,var(--color-brand-primary-light-12) 100%);--gradient-primary-enhanced:linear-gradient(180deg,#1fb8cd,#0f434a);--gradient-success-enhanced:linear-gradient(135deg,var(--color-success) 0%,var(--color-success-dark) 100%);--gradient-warning-enhanced:linear-gradient(135deg,var(--color-warning) 0%,var(--color-warning-dark) 100%);--gradient-danger-enhanced:linear-gradient(135deg,#ef4444,#dc2626);--gradient-info-enhanced:linear-gradient(135deg,var(--color-info) 0%,#0891b2 100%);--text-gradient-primary:linear-gradient(135deg,#121212,#1fb8cd);--text-gradient-brand:linear-gradient(90deg,#1fb8cd,#0f434a);--metric-icon-size:var(--spacing-12);--metric-icon-radius:var(--radius-lg);--metric-icon-shadow-primary:0 4px 12px rgba(32,128,141,.3);--metric-icon-shadow-success:0 4px 12px rgba(34,197,94,.3);--metric-icon-shadow-warning:0 4px 12px rgba(245,158,11,.3);--metric-icon-shadow-danger:0 4px 12px rgba(239,68,68,.3);--metric-icon-shadow-info:0 4px 12px rgba(6,182,212,.3);--shadow-icon-primary:var(--metric-icon-shadow-primary);--shadow-icon-success:var(--metric-icon-shadow-success);--shadow-icon-warning:var(--metric-icon-shadow-warning);--shadow-icon-danger:var(--metric-icon-shadow-danger);--shadow-badge-glow-success:0 0 20px rgba(34,197,94,.3);--shadow-badge-glow-danger:0 0 20px rgba(239,68,68,.3);--transform-hover-lift:translateY(-2px);--transform-hover-lift-micro:translateY(-1px);--transform-icon-rotate:scale(1.05) rotate(-3deg);--transform-dropdown-enter:translateY(-8px);--transform-slide-in:translateY(20px);--transform-pulse-scale:scale(1.05);--metric-label-font-size:var(--text-base);--metric-label-font-weight:var(--font-semibold);--metric-label-color:hsla(0,0%,63%,.9);--metric-label-letter-spacing:var(--tracking-wide);--metric-label-line-height:var(--leading-snug);--metric-label-transform:uppercase;--metric-value-font-size:3.5rem;--metric-value-font-weight:var(--font-light);--metric-value-color:var(--color-text-primary);--metric-value-line-height:var(--leading-none);--metric-value-letter-spacing:var(--tracking-tight);--metric-value-gradient:linear-gradient(135deg,var(--color-text-primary) 0%,hsla(0,0%,100%,.8) 100%);--metric-description-font-size:0.95625rem;--metric-description-color:#a0a0a0;--metric-description-line-height:var(--leading-snug);--metric-description-font-weight:var(--font-medium);--metric-transition-smooth:all var(--duration-medium) var(--ease-in-out);--metric-hover-transform:translateY(-4px) scale(1.02);--metric-icon-hover-transform:scale(1.1) rotate(5deg);--metric-tooltip-bg:rgba(42,42,42,.95);--metric-tooltip-border:rgba(32,128,141,.3);--metric-tooltip-shadow:0 4px 16px var(--alpha-black-30);--metric-tooltip-backdrop-blur:blur(10px);--metric-tooltip-padding:var(--spacing-3) var(--spacing-4);--metric-tooltip-radius:var(--radius-lg);--metric-tooltip-font-size:var(--text-sm);--metric-tooltip-font-weight:var(--font-medium);--metric-tooltip-offset:-50px;--chart-color-primary:#20808d;--chart-color-success:#22c55e;--chart-color-info:#3b82f6;--chart-color-purple:#014c52;--chart-color-orange:#fb923c;--chart-color-danger:#ef4444;--chart-color-primary-bg:rgba(32,128,141,.1);--chart-color-success-bg:rgba(34,197,94,.1);--chart-color-info-bg:rgba(59,130,246,.1);--chart-color-purple-bg:rgba(1,76,82,.1);--chart-color-orange-bg:rgba(251,146,60,.1);--chart-color-danger-bg:rgba(239,68,68,.1);--chart-color-primary-fill:rgba(32,128,141,.8);--chart-color-success-fill:rgba(34,197,94,.8);--chart-color-info-fill:rgba(59,130,246,.8);--chart-color-purple-fill:rgba(1,76,82,.8);--chart-color-orange-fill:rgba(251,146,60,.8);--chart-color-danger-fill:rgba(239,68,68,.8);--color-topic-booking:#22d3ee;--color-topic-booking-bg:rgba(6,182,212,.15);--color-topic-booking-border:rgba(6,182,212,.3);--color-topic-booking-hover:rgba(6,182,212,.25);--color-topic-booking-priority-bg:rgba(6,182,212,.25);--color-topic-booking-priority-border:rgba(6,182,212,.4);--color-topic-booking-priority-text:#67e8f9;--color-topic-player:#2dd4bf;--color-topic-player-bg:rgba(20,184,166,.15);--color-topic-player-border:rgba(20,184,166,.3);--color-topic-player-hover:rgba(20,184,166,.25);--color-topic-player-priority-bg:rgba(20,184,166,.25);--color-topic-player-priority-border:rgba(20,184,166,.4);--color-topic-player-priority-text:#5eead4;--color-topic-feature:#818cf8;--color-topic-feature-bg:rgba(99,102,241,.15);--color-topic-feature-border:rgba(99,102,241,.3);--color-topic-feature-hover:rgba(99,102,241,.25);--color-topic-feature-priority-bg:rgba(99,102,241,.25);--color-topic-feature-priority-border:rgba(99,102,241,.4);--color-topic-feature-priority-text:#a5b4fc;--color-topic-access-priority-bg:rgba(16,185,129,.25);--color-topic-access-priority-border:rgba(16,185,129,.4);--color-topic-payment-priority-bg:rgba(239,68,68,.25);--color-topic-payment-priority-border:rgba(239,68,68,.4);--color-topic-payment-priority-text:#fca5a5;--color-topic-reporting-priority-bg:rgba(245,158,11,.25);--color-topic-reporting-priority-border:rgba(245,158,11,.4);--color-topic-integration-priority-bg:rgba(32,128,141,.25);--color-topic-integration-priority-border:rgba(32,128,141,.4);--color-topic-integration-priority-text:#1fb8cd;--color-topic-other-bg:rgba(100,116,139,.15);--color-topic-other-border:rgba(100,116,139,.3);--color-topic-other-priority-bg:rgba(100,116,139,.25);--color-topic-other-priority-border:rgba(100,116,139,.4);--gradient-priority-p2:linear-gradient(135deg,#f59e0b,#d97706);--gradient-priority-p3:linear-gradient(135deg,#3b82f6,#2563eb);--gradient-priority-p4:linear-gradient(135deg,#6b7280,#4b5563);--color-priority-p1-border:rgba(239,68,68,.5);--color-priority-p2-border:rgba(245,158,11,.5);--color-priority-p3-border:rgba(59,130,246,.5);--color-priority-p4-border:hsla(220,9%,46%,.5);--skeleton-value-width:60%;--skeleton-label-width:40%;--skeleton-trend-width:30%;--glass-bg-light:hsla(0,0%,100%,.08);--glass-bg-medium:hsla(0,0%,100%,.12);--glass-bg-dark:rgba(30,30,30,.85);--glass-bg-darker:hsla(0,0%,8%,.9);--glass-border:hsla(0,0%,100%,.15);--glass-border-subtle:hsla(0,0%,100%,.08);--stripe-card-bg:hsla(0,0%,100%,.02);--stripe-card-bg-hover:hsla(0,0%,100%,.04);--stripe-card-bg-selected:rgb(32 128 141/8%);--stripe-card-border:hsla(0,0%,100%,.08);--stripe-card-border-hover:hsla(0,0%,100%,.15);--stripe-card-border-selected:var(--color-brand-primary);--stripe-card-shadow:0 1px 3px rgba(0,0,0,.12);--stripe-card-shadow-hover:0 2px 8px rgba(0,0,0,.16);--stripe-confidence-excellent:var(--color-success);--stripe-confidence-good:var(--color-info);--stripe-confidence-fair:var(--color-warning);--stripe-confidence-low:var(--color-danger);--color-success-very-subtle:rgb(34 197 94/5%);--color-info-very-subtle:rgb(59 130 246/5%);--color-warning-very-subtle:rgb(245 158 11/5%);--color-danger-very-subtle:rgb(239 68 68/5%);--color-hot-subtle:rgb(239 68 68/8%);--color-warm-subtle:rgb(245 158 11/8%);--color-new-subtle:rgb(59 130 246/8%);--color-cold-subtle:rgb(100 116 139/8%);--gradient-classification-hot:linear-gradient(135deg,transparent 0%,var(--color-hot-subtle) 100%);--gradient-classification-warm:linear-gradient(135deg,transparent 0%,var(--color-warm-subtle) 100%);--gradient-classification-new:linear-gradient(135deg,transparent 0%,var(--color-new-subtle) 100%);--gradient-classification-cold:linear-gradient(135deg,transparent 0%,var(--color-cold-subtle) 100%);--shadow-glow-brand:0 8px 32px var(--color-brand-primary-30);--shadow-glow-success:0 8px 32px rgba(34,197,94,.25);--shadow-glow-warning:0 8px 32px rgba(245,158,11,.25);--shadow-glow-danger:0 8px 32px rgba(239,68,68,.25);--shadow-glow-info:0 8px 32px rgba(59,130,246,.25);--shadow-glow-sm-brand:0 4px 16px var(--color-brand-primary-20);--shadow-glow-sm-success:0 4px 16px rgba(34,197,94,.2);--shadow-glow-sm-warning:0 4px 16px rgba(245,158,11,.2);--shadow-glow-sm-danger:0 4px 16px rgba(239,68,68,.2);--shadow-glow-teal:0 0 16px rgba(20,184,166,.3);--shadow-modal:0 25px 50px -12px var(--alpha-black-25),0 12px 24px -8px var(--alpha-black-15),0 0 0 1px var(--glass-border),0 0 60px -15px var(--color-brand-primary-30);--skeleton-base:var(--color-surface-hover);--skeleton-highlight:var(--color-surface-elevated);--skeleton-brand-hint:var(--color-brand-primary-05);--skeleton-gradient:linear-gradient(90deg,var(--skeleton-base) 0%,var(--skeleton-highlight) 50%,var(--skeleton-base) 100%) }
:root { --color-primary:#20808d;--color-primary-dark:#0f434a;--color-primary-light:#1fb8cd;--color-primary-50:#e6f5f7;--color-success:var(--color-success-light);--color-success-dark:var(--color-success);--color-success-light:#34d399;--color-success-bg:#d1fae5;--color-warning:var(--color-warning-light);--color-warning-dark:var(--color-warning);--color-warning-light:#fbbf24;--color-warning-bg:#fef3c7;--color-danger:var(--color-error-light);--color-danger-dark:var(--color-error);--color-danger-light:#f87171;--color-danger-bg:#fee2e2;--color-info:var(--color-info-light);--color-info-dark:var(--color-info);--color-info-light:#60a5fa;--color-info-bg:#dbeafe;--color-neutral-50:var(--color-gray-50);--color-neutral-100:var(--color-gray-100);--color-neutral-200:var(--color-gray-200);--color-neutral-300:var(--color-gray-300);--color-neutral-400:var(--color-gray-400);--color-neutral-500:var(--color-gray-500);--color-neutral-600:var(--color-gray-600);--color-neutral-700:var(--color-gray-700);--color-neutral-800:var(--color-gray-800);--color-neutral-900:var(--color-gray-900);--color-neutral-950:#030712;--color-bg-primary:#0a0a0a;--color-bg-secondary:#0f0f0f;--color-bg-tertiary:#111;--color-text-primary:var(--color-white);--color-text-secondary:var(--color-gray-200);--color-text-tertiary:var(--color-gray-400);--color-text-inverse:var(--color-neutral-900);--space-0:0;--space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--font-sans:-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,sans-serif;--font-mono:"SF Mono",monaco,"Cascadia Code","Roboto Mono",consolas,monospace;--text-xs:0.75rem;--text-sm:0.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3rem;--text-6xl:3.75rem;--font-thin:100;--font-light:300;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--font-extrabold:800;--font-black:900;--leading-none:1;--leading-tight:1.25;--leading-snug:1.375;--leading-normal:1.5;--leading-relaxed:1.625;--leading-loose:2;--tracking-tighter:-0.05em;--tracking-tight:-0.025em;--tracking-normal:0;--tracking-wide:0.025em;--tracking-wider:0.05em;--tracking-widest:0.1em;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-3xl:48rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--container-7xl:80rem;--container-full:100%;--shadow-xs:0 1px 2px 0 rgb(0 0 0/5%);--shadow-sm:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--shadow-2xl:0 25px 50px -12px rgba(0,0,0,.25);--shadow-inner:inset 0 2px 4px 0 rgb(0 0 0/5%);--shadow-none:0 0 transparent;--radius-none:0;--radius-sm:0.125rem;--radius-base:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-full:9999px;--border-width-0:0;--border-width-1:1px;--border-width-2:2px;--border-width-4:4px;--border-width-8:8px;--duration-75:75ms;--duration-100:100ms;--duration-150:150ms;--duration-200:200ms;--duration-300:300ms;--duration-500:500ms;--duration-700:700ms;--duration-1000:1000ms;--ease-linear:linear;--ease-in:cubic-bezier(0.4,0,1,1);--ease-out:cubic-bezier(0,0,0.2,1);--ease-in-out:cubic-bezier(0.4,0,0.2,1);--ease-bounce:cubic-bezier(0.68,-0.55,0.265,1.55);--z-0:0;--z-10:10;--z-20:20;--z-30:30;--z-40:40;--z-50:50;--z-modal:1000;--z-tooltip:1100;--z-notification:1200;--z-dropdown:1300 }
[data-theme=dark] { --color-neutral-50:#030712;--color-neutral-100:var(--color-gray-900);--color-neutral-200:var(--color-gray-800);--color-neutral-300:var(--color-gray-700);--color-neutral-400:var(--color-gray-600);--color-neutral-500:var(--color-gray-500);--color-neutral-600:var(--color-gray-400);--color-neutral-700:var(--color-gray-300);--color-neutral-800:var(--color-gray-200);--color-neutral-900:var(--color-gray-100);--color-neutral-950:var(--color-gray-50);--color-bg-primary:var(--color-gray-900);--color-bg-secondary:var(--color-gray-800);--color-bg-tertiary:var(--color-gray-700);--color-text-primary:var(--color-gray-50);--color-text-secondary:var(--color-gray-200);--color-text-tertiary:var(--color-gray-400);--color-text-inverse:var(--color-gray-900);--color-success-bg:#064e3b;--color-warning-bg:#78350f;--color-danger-bg:#7f1d1d;--color-info-bg:#1e3a8a;--shadow-sm:0 1px 3px 0 rgba(0,0,0,.3),0 1px 2px -1px rgba(0,0,0,.3);--shadow-md:0 4px 6px -1px rgba(0,0,0,.3),0 2px 4px -2px rgba(0,0,0,.3);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.3),0 4px 6px -4px rgba(0,0,0,.3) }
:root { --white:#fff;--black:#000;--gray-50:#f8fafc;--gray-100:#f1f5f9;--gray-200:#e2e8f0;--gray-300:#cbd5e1;--gray-400:#94a3b8;--gray-500:#64748b;--gray-600:#475569;--gray-700:#334155;--gray-800:#1e293b;--gray-900:#0f172a;--purple-600:var(--color-primary-dark);--purple-400:var(--color-primary-light);--green-500:var(--color-success);--amber-500:var(--color-warning);--red-500:var(--color-error);--blue-500:var(--color-info);--alpha-white-10:hsla(0,0%,100%,.1);--alpha-white-15:hsla(0,0%,100%,.15);--alpha-white-20:hsla(0,0%,100%,.2);--alpha-white-24:hsla(0,0%,100%,.24);--alpha-white-30:hsla(0,0%,100%,.3);--alpha-black-5:rgba(0,0,0,.05);--alpha-black-10:rgba(0,0,0,.1);--alpha-black-20:rgba(0,0,0,.2) }
.u-animate-spin { animation:spin 1s linear infinite }
.u-animate-pulse { animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite }
.u-animate-ping { animation:ping 1s cubic-bezier(0,0,.2,1) infinite }
.u-animate-fade-in { animation:fade-in .5s ease-out }
.u-animate-shake { animation:shake .82s cubic-bezier(.36,.07,.19,.97) both }
.u-animate-wobble { animation:wobble .82s ease-in-out }
html { -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility }
:focus-visible { border-radius:var(--radius-md);outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
,:after,:before { box-sizing:border-box }
{ margin:var(--spacing-0);padding:var(--spacing-0) }
html { font-size:var(--font-size-root,100%);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;scroll-behavior:smooth }
body { min-height:100vh;color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--font-normal);line-height:var(--leading-normal);background-color:var(--color-bg-secondary) }
h1,h2,h3,h4,h5,h6 { margin-bottom:var(--space-4);color:var(--color-text-primary);font-weight:var(--font-semibold);line-height:var(--leading-tight) }
h1 { font-size:var(--text-4xl);font-weight:var(--font-bold);letter-spacing:var(--tracking-tight) }
h2 { font-size:var(--text-3xl);font-weight:var(--font-bold) }
h3 { font-size:var(--text-2xl) }
h4 { font-size:var(--text-xl) }
h5 { font-size:var(--text-lg) }
h6 { font-size:var(--text-base);letter-spacing:var(--tracking-wide);text-transform:uppercase }
p { margin-bottom:var(--space-4);line-height:var(--leading-relaxed) }
p:last-child { margin-bottom:var(--spacing-0) }
a { color:var(--color-primary);text-decoration:none;transition:color var(--duration-200) var(--ease-in-out) }
a:hover { color:var(--color-primary-dark);text-decoration:underline }
a:focus { border-radius:var(--radius-sm);outline:2px solid var(--color-primary);outline-offset:2px }
ol,ul { margin-bottom:var(--space-4);padding-left:var(--space-6) }
li { margin-bottom:var(--space-2);line-height:var(--leading-relaxed) }
ol ol,ol ul,ul ol,ul ul { margin-top:var(--space-2);margin-bottom:var(--space-2) }
code { padding:var(--space-1) var(--space-2);color:var(--color-text-primary);font-family:var(--font-mono);font-size:var(--text-sm);background-color:var(--color-neutral-100);border-radius:var(--radius-md) }
pre { overflow-x:auto;margin-bottom:var(--space-4);padding:var(--space-4);color:var(--color-neutral-100);font-family:var(--font-mono);font-size:var(--text-sm);line-height:var(--leading-relaxed);background-color:var(--color-neutral-900);border-radius:var(--radius-lg) }
pre code { padding:var(--spacing-0);color:inherit;background-color:transparent }
blockquote { margin-bottom:var(--space-4);padding-left:var(--space-4);color:var(--color-text-secondary);font-style:italic;border-left:var(--spacing-1) solid var(--color-primary) }
hr { margin:var(--space-8) 0;border:none;border-top:1px solid var(--color-neutral-200) }
label { display:block;margin-bottom:var(--space-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium) }
input[type=date],input[type=datetime-local],input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],select,textarea { display:block;width:100%;padding:var(--space-2) var(--space-3);color:var(--color-text-primary);font-family:inherit;font-size:var(--text-base);line-height:var(--leading-normal);background-color:var(--color-bg-primary);border:var(--border-width-1) solid var(--color-neutral-300);border-radius:var(--radius-lg);transition:all var(--duration-200) var(--ease-in-out) }
textarea { min-height:var(--spacing-30);resize:vertical }
select { padding-right:var(--space-10);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 9 1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-3) center;cursor:pointer;appearance:none }
input:focus,select:focus,textarea:focus { border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px var(--color-brand-primary-subtle) }
input::placeholder,textarea::placeholder { color:var(--color-text-tertiary) }
input:disabled,select:disabled,textarea:disabled { background-color:var(--color-neutral-100);opacity:60%;cursor:not-allowed }
input[type=checkbox],input[type=radio] { display:inline-block;width:var(--space-4);height:var(--space-4);margin-right:var(--space-2);vertical-align:middle;cursor:pointer }
button,input[type=button],input[type=reset],input[type=submit] { display:inline-flex;justify-content:center;align-items:center;padding:var(--space-2) var(--space-4);color:var(--color-text-inverse);font-family:inherit;font-size:var(--text-sm);font-weight:var(--font-medium);line-height:var(--leading-normal);white-space:nowrap;background-color:var(--color-primary);border:none;border-radius:var(--radius-md);transition:all var(--duration-200) var(--ease-in-out);cursor:pointer }
button:hover,input[type=button]:hover,input[type=reset]:hover,input[type=submit]:hover { background-color:var(--color-primary-dark);box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-1px)*-1)) }
button:focus,input[type=button]:focus,input[type=reset]:focus,input[type=submit]:focus { outline:none;box-shadow:0 0 0 3px var(--metric-card-border-primary) }
button:active,input[type=button]:active,input[type=reset]:active,input[type=submit]:active { transform:translateY(0) }
button:disabled,input[type=button]:disabled,input[type=reset]:disabled,input[type=submit]:disabled { opacity:50%;transform:none;cursor:not-allowed }
table { overflow:hidden;width:100%;margin-bottom:var(--space-4);background-color:var(--color-bg-primary);border-radius:var(--radius-lg);border-collapse:collapse }
td,th { padding:var(--space-3) var(--space-4);text-align:left }
th { color:var(--color-text-primary);font-weight:var(--font-semibold);background-color:var(--color-neutral-50);border-bottom:var(--border-width-2) solid var(--color-neutral-200) }
td { border-bottom:var(--border-width-1) solid var(--color-neutral-100) }
tr:last-child td { border-bottom:none }
canvas,img,picture,svg,video { display:block;max-width:100%;height:auto }
.c-sr-only { position:absolute;overflow:hidden;clip-path:inset(0);width:1px;height:1px;margin:calc(var(--spacing-1px)*-1);padding:var(--spacing-0);white-space:nowrap;border-width:0 }
.c-focus__visible:focus { outline:2px solid var(--color-primary);outline-offset:2px }
::selection { color:var(--color-text-inverse);background-color:var(--color-primary) }
::-webkit-scrollbar { width:var(--spacing-3);height:var(--spacing-3) }
::-webkit-scrollbar-track { background:var(--color-neutral-100) }
::-webkit-scrollbar-thumb { background:var(--color-neutral-400);border:3px solid var(--color-neutral-100);border-radius:var(--radius-full) }
::-webkit-scrollbar-thumb:hover { background:var(--color-neutral-500) }
{ box-sizing:border-box;margin:var(--spacing-0);padding:var(--spacing-0) }
:root { --primary:var(--color-brand-primary);--primary-dark:var(--color-brand-primary-dark);--bg-dark:var(--color-surface-dark);--bg-card:var(--color-surface-dark-secondary);--text-primary:var(--white);--text-secondary:var(--gray-400);--border:var(--gray-700);--success:var(--green-500);--warning:var(--amber-500);--error:var(--red-500) }
body { font-family:-apple-system,blinkmacsystemfont,Segoe UI,Roboto,sans-serif;line-height:1.6;background:var(--bg-dark) }
.c-main-nav,nav { position:sticky;top:var(--spacing-0);z-index:var(--z-index-sticky);padding:var(--spacing-4) 0;background:var(--bg-card);border-bottom:1px solid var(--border) }
.c-nav-container { display:flex;justify-content:space-between;align-items:center;max-width:var(--container-2xl);margin:var(--spacing-0) auto;padding:var(--spacing-0) var(--spacing-8) }
.c-nav-brand { color:var(--primary);font-size:var(--spacing-6);font-weight:700 }
.c-nav-links { display:flex;align-items:center;gap:var(--spacing-8) }
.c-nav-link,nav a { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);text-decoration:none;border-radius:var(--spacing-2);transition:color .2s }
.c-insight-action a { color:var(--primary);font-weight:500;text-decoration:none }
.c-nav-link:hover,nav a:hover { color:var(--color-text-primary);background:var(--color-primary-subtle) }
.c-insight-action a:hover { text-decoration:underline }
.c-nav__link.active { color:var(--primary) }
.c-main-content,main { max-width:var(--container-2xl);margin:var(--spacing-0) auto;padding:var(--spacing-8) }
.c-card,.c-metric-card,.c-stats-card { margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--spacing-3) }
h1,h2,h3 { margin-bottom:var(--spacing-4);color:var(--color-text-primary) }
h1 { font-size:var(--spacing-10) }
h2 { font-size:var(--spacing-8) }
h3 { font-size:var(--spacing-6) }
.c-metrics-grid,.c-stats-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-wide),1fr));margin-bottom:var(--spacing-8) }
.c-metric-value,.c-stat-value { margin-bottom:var(--spacing-2);color:var(--primary);font-size:var(--spacing-10);font-weight:700 }
.c-metric-label,.c-stat-label { color:var(--color-text-secondary);font-size:var(--text-sm);letter-spacing:.05em;text-transform:uppercase }
.c-btn,button { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-6);color:var(--white);font-size:var(--spacing-4);background:var(--primary);border:none;border-radius:var(--spacing-2);transition:all .2s;cursor:pointer }
.c-c__btn:hover,button:hover { background:var(--primary-dark);transform:translateY(-1px) }
.c-loading { display:flex;justify-content:center;align-items:center;padding:var(--spacing-12);color:var(--color-text-secondary) }
.c-spinner { width:var(--spacing-8);height:var(--spacing-8);border:3px solid var(--border);border-top-color:var(--primary);border-radius:var(--radius-full);animation:spin 1s linear infinite }
table { width:100%;border-collapse:collapse }
td,th { padding:var(--spacing-4);text-align:left;border-bottom:1px solid var(--border) }
th { color:var(--primary);font-weight:600;background:var(--color-primary-subtle) }
.c-empty-state { padding:var(--spacing-16) var(--spacing-8);color:var(--color-text-secondary);text-align:center }
.c-empty-state-icon { margin-bottom:var(--spacing-4);font-size:4rem;opacity:50% }
.c-alert { display:flex;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-4);padding:var(--spacing-4) var(--spacing-6);border-radius:var(--spacing-2) }
.c-alert-error { color:var(--error);background:var(--color-danger-subtle);border:1px solid var(--color-danger-border) }
.c-alert-success { color:var(--success);background:var(--color-success-subtle);border:1px solid var(--color-success-border) }
.c-learning-insights { padding:var(--spacing-4) }
.c-insight-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-narrow),1fr));margin-bottom:var(--spacing-4) }
.c-insight-item { padding:var(--spacing-4);text-align:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--spacing-2) }
.c-insight-value { margin-bottom:var(--spacing-1);color:var(--primary);font-size:var(--spacing-8);font-weight:700 }
.c-insight-label { color:var(--color-text-secondary);font-size:var(--text-sm) }
.c-insight-action,.c-insight-info { margin-top:var(--spacing-4);color:var(--color-text-secondary);text-align:center }
.c-insight-info { font-style:italic }
.c-stats-grid { grid-template-columns:1fr }
,:after,:before { box-sizing:border-box }
{ margin:0 }
body { line-height:var(--line-height-base);background:var(--color-surface-base);-webkit-font-smoothing:antialiased }
canvas,img,picture,svg,video { display:block;max-width:100% }
button,input,select,textarea { font:inherit }
h1,h2,h3,h4,h5,h6,p { overflow-wrap:anywhere }
body { padding-top:var(--nav-offset,var(--spacing-20));color:var(--color-text-primary);font-family:var(--font-family);background:var(--bg-primary) }
html { color:var(--color-text-primary);font-family:var(--font-family-base);font-size:var(--text-base);line-height:var(--line-height-base) }
body { font-weight:var(--font-weight-normal) }
h1,h2,h3,h4,h5,h6 { margin-top:var(--spacing-0);margin-bottom:var(--spacing-3);font-family:var(--font-family-heading);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight) }
h1 { font-size:var(--text-3xl) }
h2 { font-size:var(--text-2xl) }
h3 { font-size:var(--text-xl) }
h4 { font-size:var(--text-lg) }
h5 { font-size:var(--text-base) }
h6 { font-size:var(--text-sm) }
p { margin-top:var(--spacing-0);margin-bottom:var(--spacing-4) }
a { color:var(--color-brand-primary);text-decoration:none;transition:color var(--transition-fast) }
a:hover { color:var(--color-brand-primary-dark) }
b,strong { font-weight:var(--font-weight-semibold) }
code { padding:var(--spacing-0) var(--spacing-1);font-family:var(--font-family-mono);font-size:.875em;background:var(--color-surface-elevated);border-radius:var(--radius-base) }
input,select,textarea { font-family:inherit;font-size:inherit;line-height:inherit }
input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],textarea { min-height:var(--col-width-date);resize:vertical }
input[type=email]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,select:focus,textarea:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 3px var(--color-brand-primary-alpha) }
label { display:block;margin-bottom:var(--spacing-1);color:var(--color-text-secondary);font-weight:var(--font-weight-medium) }
.o-container { --container-max-width:var(--container-xl);--container-padding:var(--spacing-6);width:100%;max-width:var(--container-max-width);margin-inline:auto;padding-inline:var(--container-padding) }
.o-container--sm { --container-max-width:var(--container-sm) }
.o-container--md { --container-max-width:var(--container-md) }
.o-container--lg { --container-max-width:var(--container-lg) }
.o-container--xl { --container-max-width:var(--container-xl) }
.o-container--2xl,.o-container--full { --container-max-width:100% }
.o-container--fluid { --container-max-width:100%;--container-padding:var(--spacing-0) }
@media (min-width:640px) { .o-container { --container-padding:var(--spacing-8) }
 }
@media (min-width:1024px) { .o-container { --container-padding:var(--spacing-10) }
 }
.o-section { padding-block:var(--spacing-16) }
.o-section--sm { padding-block:var(--spacing-8) }
.o-section--lg { padding-block:var(--spacing-24) }
.o-section--xl { padding-block:var(--spacing-32) }
.o-content { --content-max-width:65ch;max-width:var(--content-max-width);margin-inline:auto }
.o-content--narrow { --content-max-width:45ch }
.o-content--wide { --content-max-width:85ch }
.o-grid { --grid-gap:var(--spacing-6);--grid-columns:12;grid-gap:var(--grid-gap);gap:var(--grid-gap);grid-template-columns:repeat(var(--grid-columns),1fr) }
.o-grid--auto { --grid-min-width:var(--col-width-wide);grid-template-columns:repeat(auto-fit,minmax(var(--grid-min-width),1fr)) }
.o-grid--auto-sm { --grid-min-width:var(--col-width-medium) }
.o-grid--auto-md { --grid-min-width:var(--col-width-extra-wide) }
.o-grid--auto-lg { --grid-min-width:var(--card-min-width-lg) }
.o-grid--2 { --grid-columns:2 }
.o-grid--3 { --grid-columns:3 }
.o-grid--4 { --grid-columns:4 }
.o-grid--5 { --grid-columns:5 }
.o-grid--6 { --grid-columns:6 }
.o-grid--gap-none { --grid-gap:var(--spacing-0) }
.o-grid--gap-sm { --grid-gap:var(--spacing-2) }
.o-grid--gap-md { --grid-gap:var(--spacing-4) }
.o-grid--gap-lg { --grid-gap:var(--spacing-8) }
.o-grid--gap-xl { --grid-gap:var(--spacing-12) }
.o-grid__item { min-width:0 }
.o-grid__item--span-2 { grid-column:span 2 }
.o-grid__item--span-3 { grid-column:span 3 }
.o-grid__item--span-4 { grid-column:span 4 }
.o-grid__item--span-5 { grid-column:span 5 }
.o-grid__item--span-6 { grid-column:span 6 }
.o-grid__item--span-7 { grid-column:span 7 }
.o-grid__item--span-8 { grid-column:span 8 }
.o-grid__item--span-9 { grid-column:span 9 }
.o-grid__item--span-10 { grid-column:span 10 }
.o-grid__item--span-11 { grid-column:span 11 }
.o-grid__item--span-12,.o-grid__item--span-full { grid-column:1/-1 }
.o-grid--align-start { align-items:start }
.o-grid--align-center { align-items:center }
.o-grid--align-end { align-items:end }
.o-grid--align-stretch { align-items:stretch }
.o-grid--justify-start { justify-items:start }
.o-grid--justify-center { justify-items:center }
.o-grid--justify-end { justify-items:end }
.o-grid--justify-stretch { justify-items:stretch }
@media (max-width:768px) { .o-grid--responsive { --grid-columns:1 }
.o-grid--responsive .o-grid__item[class*=span] { grid-column:1/-1 }
 }
@media (min-width:769px) and (max-width:1024px) { .o-grid--responsive { --grid-columns:6 }
 }
.o-grid--masonry { grid-auto-flow:dense }
.o-grid--sidebar-left { grid-template-columns:var(--col-width-extra-wide) 1fr }
.o-grid--sidebar-right { grid-template-columns:1fr var(--col-width-extra-wide) }
.o-grid--sidebar-both { grid-template-columns:var(--col-width-wide) 1fr var(--col-width-wide) }
@media (max-width:1024px) { .o-grid--sidebar-both,.o-grid--sidebar-left,.o-grid--sidebar-right { grid-template-columns:1fr }
 }
.o-stack { --stack-gap:var(--spacing-6);display:flex;flex-direction:column;gap:var(--stack-gap) }
.o-stack--horizontal { flex-direction:row;align-items:center }
.o-stack--wrap { flex-wrap:wrap }
.o-stack--gap-none { --stack-gap:var(--spacing-0) }
.o-stack--gap-xs { --stack-gap:var(--spacing-1) }
.o-stack--gap-sm { --stack-gap:var(--spacing-2) }
.o-stack--gap-md { --stack-gap:var(--spacing-4) }
.o-stack--gap-lg { --stack-gap:var(--spacing-8) }
.o-stack--gap-xl { --stack-gap:var(--spacing-12) }
.o-stack--gap-2xl { --stack-gap:var(--spacing-16) }
.o-stack--align-start { align-items:flex-start }
.o-stack--align-center { align-items:center }
.o-stack--align-end { align-items:flex-end }
.o-stack--align-stretch { align-items:stretch }
.o-stack--justify-start { justify-content:flex-start }
.o-stack--justify-center { justify-content:center }
.o-stack--justify-end { justify-content:flex-end }
.o-stack--justify-between { justify-content:space-between }
.o-stack--justify-around { justify-content:space-around }
.o-stack--justify-evenly { justify-content:space-evenly }
.o-stack--recursive>* { margin-block:var(--spacing-0) }
.o-stack--recursive>*+* { margin-block-start:var(--stack-gap) }
.o-stack--split>:nth-child(2) { margin-inline-start:auto }
.o-stack__exception { --stack-gap:var(--spacing-0) }
.o-stack--divided>*+* { padding-block-start:var(--stack-gap);border-block-start:var(--spacing-px) solid var(--color-border-default) }
.o-layout { display:flex;gap:var(--spacing-6) }
.o-layout--column { flex-direction:column }
.o-layout--wrap { flex-wrap:wrap }
.o-layout--nowrap { flex-wrap:nowrap }
.o-layout--reverse { flex-direction:row-reverse }
.o-layout--column-reverse { flex-direction:column-reverse }
.o-center { display:grid;place-items:center;min-height:100vh }
.o-center--inline { min-height:auto }
.o-cluster { --cluster-gap:var(--spacing-4);display:flex;flex-wrap:wrap;align-items:center;gap:var(--cluster-gap) }
.o-cluster--start { align-items:flex-start }
.o-cluster--end { align-items:flex-end }
.o-cluster--stretch { align-items:stretch }
.o-sidebar { display:flex;gap:var(--spacing-8) }
.o-sidebar__side { flex-grow:1;flex-basis:20rem }
.o-sidebar__main { flex-grow:999;flex-basis:0;min-width:var(--radius-full) }
.o-sidebar--reverse { flex-direction:row-reverse }
@media (max-width:768px) { .o-sidebar { flex-direction:column }
.o-sidebar__side { flex-basis:auto }
 }
.o-switcher { --switcher-threshold:30rem;--switcher-gap:var(--spacing-6);display:flex;flex-wrap:wrap;gap:var(--switcher-gap) }
.o-switcher>* { flex-grow:1;flex-basis:calc((var(--switcher-threshold) - 100%)*999) }
.o-cover { display:flex;flex-direction:column;min-height:100vh }
.o-cover__footer,.o-cover__header { flex-shrink:0 }
.o-cover__main { display:flex;flex-grow:1;flex-direction:column;justify-content:center }
.o-frame { --frame-ratio:16/9;position:relative;aspect-ratio:var(--frame-ratio);overflow:hidden }
.o-frame--square { --frame-ratio:1/1 }
.o-frame--portrait { --frame-ratio:3/4 }
.o-frame--landscape { --frame-ratio:4/3 }
.o-frame--cinema { --frame-ratio:21/9 }
.o-frame>* { position:absolute;inset:var(--spacing-0);width:100%;height:100%;object-fit:cover }
.o-reel { --reel-gap:var(--spacing-6);--reel-item-width:auto;display:flex;overflow:auto hidden;gap:var(--reel-gap);scrollbar-width:thin }
.o-reel::-webkit-scrollbar { height:var(--spacing-2) }
.o-reel::-webkit-scrollbar-track { background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.o-reel::-webkit-scrollbar-thumb { background:var(--color-border-strong);border-radius:var(--radius-full) }
.o-reel>* { flex:0 0 var(--reel-item-width) }
.o-reel--auto>* { flex:0 0 auto }
.o-imposter { position:absolute;inset-block-start:var(--radius-full);inset-inline-start:var(--radius-full);transform:translate(-9999px,-9999px) }
.o-imposter--fixed { position:fixed }
.o-imposter--contain { max-width:calc(100% - var(--spacing-4)*2);max-height:calc(100% - var(--spacing-4)*2) }
.o-icon { display:inline-flex;align-items:center;gap:var(--spacing-2) }
.o-icon--vertical { flex-direction:column }
.o-icon__symbol { flex-shrink:0;width:1em;height:1em }
.o-box { --box-padding:var(--spacing-6);padding:var(--box-padding) }
.o-box--sm { --box-padding:var(--spacing-3) }
.o-box--lg { --box-padding:var(--spacing-8) }
.o-box--xl { --box-padding:var(--spacing-12) }
.o-box--inset { padding-inline:var(--box-padding) }
@media (max-width:768px) { .o-dashboard-sidebar-layout { grid-template-columns:1fr }
.o-dashboard-grid--three { grid-template-columns:1fr 1fr }
.o-dashboard-grid--three,.o-dashboard-grid,.o-summary-cards { grid-template-columns:1fr }
.o-benchmarks-grid { grid-template-columns:1fr 1fr }
.o-dashboard-content { padding:var(--spacing-4) }
 }
@media (max-width:200px) { .o-benchmarks-grid { grid-template-columns:1fr }
 }
.o-unified-dashboard { display:flex;flex-direction:column;min-height:100vh;padding:0;background:var(--color-surface-base) }
.o-dashboard-content { flex:1;width:100%;max-width:var(--spacing-400);margin:0 auto;padding:var(--spacing-6) }
.o-dashboard-section { margin-bottom:var(--spacing-8) }
.o-section-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-3);border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.o-section-header h2 { display:flex;align-items:center;gap:var(--spacing-2);margin:0;color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.o-section-header h2 i { color:var(--color-brand-primary);opacity:70% }
.o-summary-cards { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-70),1fr));margin-bottom:var(--spacing-8) }
.o-dashboard-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:1fr 1fr;margin-bottom:var(--spacing-8) }
.o-dashboard-grid--three { grid-template-columns:repeat(3,1fr) }
.o-dashboard-grid--full { grid-template-columns:1fr }
.o-dashboard-sidebar-layout { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:1fr var(--card-min-width-md);margin-bottom:var(--spacing-8) }
.o-chart-section { margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl) }
.o-chart-container { position:relative;display:flex;justify-content:center;align-items:center;min-height:var(--col-width-extra-wide) }
.o-insights-section { margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl) }
.o-benchmarks-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-medium),1fr)) }
.o-benchmark-item { padding:var(--spacing-4);text-align:center;background:var(--color-surface-elevated);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.o-benchmark-item:hover { background:var(--color-surface-hover);box-shadow:var(--shadow-sm);transform:translateY(calc(var(--spacing-2px)*-1)) }
.o-dashboard-section--loading { opacity:60%;pointer-events:none }
.o-dashboard-section--empty { display:flex;justify-content:center;align-items:center;min-height:var(--col-width-medium) }
@media (min-width:1025px) { .o-sidebar-layout { display:grid;grid-template-columns:var(--sidebar-width) 1fr;min-height:100vh }
.o-sidebar-layout__sidebar { position:fixed;top:0;left:0;overflow:hidden auto;grid-row:1;grid-column:1;width:var(--sidebar-width);height:100vh }
.o-sidebar-layout__main { grid-row:1;grid-column:2;min-height:100vh }
 }
@media (max-width:1024px) { .o-sidebar-layout { display:block;min-height:100vh }
.o-sidebar-layout__sidebar { position:fixed;top:0;left:0;z-index:var(--z-index-sticky);height:100vh }
.o-sidebar-layout__main { width:100%;min-height:100vh }
 }
@media (prefers-reduced-motion:reduce) { .o-sidebar-layout__main,.o-sidebar-layout__sidebar { transition:none }
 }
@media print { .o-sidebar-layout { display:block }
.o-sidebar-layout__sidebar { display:none }
.o-sidebar-layout__main { width:100%;margin:0 }
 }
.o-sidebar-layout { margin:0;padding:0 }
.o-master-detail { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:1fr;width:100% }
.o-master-detail__sidebar { width:100%;min-height:300px }
.o-master-detail__content { width:100%;min-height:400px }
@media (min-width:1024px) { .o-master-detail { gap:var(--spacing-8);grid-template-columns:minmax(350px,35%) 1fr }
.o-master-detail__sidebar { position:sticky;top:var(--spacing-6);overflow-y:auto;max-height:calc(100vh - var(--spacing-12)) }
.o-master-detail__content { min-height:600px }
 }
@media (min-width:1400px) { .o-master-detail { grid-template-columns:minmax(380px,30%) 1fr }
 }
@media (min-width:1920px) { .o-master-detail { gap:var(--spacing-10);grid-template-columns:minmax(400px,25%) 1fr }
.o-master-detail__sidebar { max-height:calc(100vh - var(--spacing-16)) }
 }
@media (min-width:1024px) { .o-master-detail--reversed { grid-template-columns:1fr minmax(350px,35%) }
 }
@media (min-width:1400px) { .o-master-detail--reversed { grid-template-columns:1fr minmax(380px,30%) }
 }
@media (min-width:1920px) { .o-master-detail--reversed { grid-template-columns:1fr minmax(400px,25%) }
 }
@media (min-width:1024px) { .o-master-detail--equal { grid-template-columns:1fr 1fr }
.o-master-detail--wide-sidebar { grid-template-columns:minmax(500px,60%) 1fr }
 }
@media (min-width:1400px) { .o-master-detail--wide-sidebar { grid-template-columns:minmax(600px,55%) 1fr }
 }
@media (min-width:1920px) { .o-master-detail--wide-sidebar { grid-template-columns:minmax(700px,50%) 1fr }
 }
.o-base,.o-base *,.o-base :after,.o-base :before { box-sizing:border-box;margin:var(--spacing-0);padding:var(--spacing-0) }
.o-dashboard-body { overflow-x:hidden;color:var(--color-text-primary);font-family:var(--font-sans);line-height:var(--leading-relaxed);background-color:var(--color-surface-base) }
.o-heading { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-weight:var(--font-semibold);line-height:var(--leading-tight) }
.o-heading--1 { font-size:var(--text-2xl) }
.o-heading--2 { font-size:var(--text-xl) }
.o-heading--3 { font-size:var(--text-lg) }
.o-heading--4 { font-size:var(--text-base) }
.o-heading--5 { font-size:var(--text-sm) }
.o-heading--6 { font-size:var(--text-xs) }
.o-paragraph { margin-bottom:var(--spacing-4);color:var(--color-text-secondary) }
.o-container { max-width:var(--container-xl);margin:var(--spacing-0) auto;padding:var(--spacing-0) var(--spacing-4) }
.o-section { margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:var(--color-neutral-0);border-radius:var(--radius-lg);box-shadow:0 var(--spacing-px) var(--spacing-0-75) var(--alpha-var(--color-neutral-900)-10),0 var(--spacing-px) var(--spacing-0-5) rgba(0,0,0,.06) }
.o-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4) }
.o-grid--cols-1 { grid-template-columns:repeat(1,minmax(0,1fr)) }
.o-grid--cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)) }
.o-grid--cols-3 { grid-template-columns:repeat(3,minmax(0,1fr)) }
.o-grid--cols-4 { grid-template-columns:repeat(4,minmax(0,1fr)) }
@media (max-width:768px) { .o-grid--cols-2,.o-grid--cols-3,.o-grid--cols-4 { grid-template-columns:1fr }
 }
.o-btn { display:inline-flex;justify-content:center;align-items:center;gap:var(--spacing-2);padding:var(--button-padding-y) var(--button-padding-x);font-size:var(--button-font-size);font-weight:var(--button-font-weight);line-height:var(--leading-none);text-decoration:none;border:var(--spacing-px) solid transparent;border-radius:var(--button-radius);transition:var(--metric-transition-smooth);cursor:pointer }
.o-btn:hover { transform:translateY(-1px) }
.o-btn:focus { outline:var(--spacing-0-5) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.o-btn--primary { color:var(--color-text-inverse);background-color:var(--color-brand-primary) }
.o-btn--primary:hover { background-color:var(--color-brand-primary-dark) }
.o-btn--secondary { color:var(--color-text-inverse);background-color:var(--color-neutral-500) }
.o-btn--secondary:hover { background-color:var(--color-neutral-600) }
.o-btn--success { color:var(--color-text-inverse);background-color:var(--color-success) }
.o-btn--success:hover { background-color:var(--color-success-dark) }
.o-btn--warning { color:var(--color-text-inverse);background-color:var(--color-warning) }
.o-btn--warning:hover { background-color:var(--color-warning-dark) }
.o-btn--danger { color:var(--color-text-inverse);background-color:var(--color-danger) }
.o-btn--danger:hover { background-color:var(--color-danger-dark) }
.o-btn--outline { color:var(--color-text-primary);background-color:transparent;border-color:var(--color-border-default) }
.o-btn--outline:hover { background-color:var(--color-surface-hover) }
.o-btn--sm { padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-xs) }
.o-btn--lg { padding:var(--spacing-4) var(--spacing-6);font-size:var(--text-base) }
.o-card { padding:var(--spacing-6);background:var(--color-surface-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:var(--metric-transition-smooth) }
.o-card:hover { box-shadow:var(--shadow-md);transform:translateY(-2px) }
.o-card__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-3);border-bottom:var(--spacing-px) solid var(--color-border-default) }
.o-card__title { color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.o-card__content { color:var(--color-text-secondary) }
.o-metric-card { padding:var(--metric-card-padding);text-align:center;background:var(--metric-card-bg);border-radius:var(--metric-card-radius);box-shadow:var(--metric-card-shadow);transition:var(--metric-transition-smooth) }
.o-metric-card:hover { box-shadow:var(--metric-card-shadow-hover);transform:var(--metric-hover-transform) }
.o-metric-card__value { margin-bottom:var(--spacing-2);color:var(--color-brand-primary);font-size:var(--metric-value-font-size);font-weight:var(--metric-value-font-weight);line-height:var(--metric-value-line-height) }
.o-metric-card__label { color:var(--metric-label-color);font-size:var(--metric-label-font-size);font-weight:var(--metric-label-font-weight);letter-spacing:var(--metric-label-letter-spacing);text-transform:var(--metric-label-transform) }
.o-metric-card__trend { display:flex;justify-content:center;align-items:center;gap:var(--spacing-1);margin-top:var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-medium) }
.o-trend--up { color:var(--color-success) }
.o-trend--down { color:var(--color-danger) }
.o-trend--neutral { color:var(--color-text-muted) }
.o-form-group { margin-bottom:var(--spacing-4) }
.o-form-group__label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.o-form-input,.o-form-select,.o-form-textarea { display:block;width:100%;padding:var(--input-padding-y) var(--input-padding-x);font-size:var(--text-sm);background-color:var(--input-bg);border:var(--spacing-px) solid var(--input-border);border-radius:var(--input-radius);transition:var(--duration-fast) ease-in-out }
.o-form-textarea { min-height:var(--spacing-32);resize:vertical }
.o-form-input:focus,.o-form-select:focus,.o-form-textarea:focus { border-color:var(--input-border-focus);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-alpha-20) }
.o-status { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase;border-radius:var(--radius-full) }
.o-status--success { color:var(--color-success-text);background-color:var(--color-success-bg) }
.o-status--warning { color:var(--color-warning-text);background-color:var(--color-warning-bg) }
.o-status--error { color:var(--color-danger-text);background-color:var(--color-danger-bg) }
.o-status--info { color:var(--color-info-text);background-color:var(--color-info-bg) }
.o-status__dot { width:var(--spacing-2);height:var(--spacing-2);border-radius:var(--radius-full) }
.o-status__dot--connected { background-color:var(--color-success) }
.o-status__dot--disconnected { background-color:var(--color-danger) }
.o-status__dot--pending { background-color:var(--color-warning) }
.o-loading { display:flex;justify-content:center;align-items:center;padding:var(--spacing-8);color:var(--color-text-muted) }
.o-loading__spinner { width:var(--spacing-8);height:var(--spacing-8);margin-right:var(--spacing-3);border:var(--spacing-0-5) solid var(--color-border-default);border-top:var(--spacing-0-5) solid var(--color-brand-primary);border-radius:var(--radius-full);animation:spin var(--duration-slowest) linear infinite }
.o-loading-overlay { position:fixed;inset:var(--spacing-0);z-index:var(--z-index-overlay);display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:var(--overlay-bg) }
.o-loading-overlay--hidden { display:none }
@media (max-width:640px) { .o-container { padding:var(--spacing-0) var(--spacing-3) }
.o-section { margin-bottom:var(--spacing-4);padding:var(--spacing-4) }
.o-metric-card { padding:var(--spacing-6) var(--spacing-4) }
.o-metric-card__value { font-size:var(--text-4xl) }
.o-heading--1 { font-size:var(--text-3xl) }
.o-heading--2 { font-size:var(--text-lg) }
.o-heading--3 { font-size:var(--text-base) }
 }
@media (max-width:200px) { .o-btn { padding:var(--spacing-2-5) var(--spacing-3-5);font-size:var(--text-sm) }
.o-metric-card__value { font-size:var(--text-2xl) }
.o-card { padding:var(--spacing-4) }
 }
@media (prefers-color-scheme:dark) { .o-dashboard-body { color:var(--color-text-primary);background-color:var(--color-surface-base) }
.o-card,.o-section { color:var(--color-text-primary);background-color:var(--color-surface-elevated) }
.o-form-input,.o-form-select,.o-form-textarea { color:var(--color-text-primary);background-color:var(--input-bg);border-color:var(--input-border) }
 }
.o-fade-in { animation:fade-in var(--duration-medium) var(--ease-in) }
.o-slide-up { animation:slide-up var(--duration-medium) var(--ease-out) }
.o-sr-only { position:absolute;overflow:hidden;clip-path:inset(0);width:var(--spacing-px);height:var(--spacing-px);margin:calc(var(--spacing-px)*-1);padding:var(--spacing-0);white-space:nowrap;border:0 }
@media (prefers-contrast:more) { .o-btn { border:var(--spacing-0-5) solid }
.o-card { border:var(--spacing-px) solid var(--color-border-strong) }
 }
@media (prefers-reduced-motion:reduce) { .o-dashboard *,.o-dashboard :after,.o-dashboard :before { transition-duration:.01ms;animation-duration:.01ms;animation-iteration-count:1 }
 }
@media (min-width:768px) { .o-stats-grid { gap:var(--spacing-10);grid-template-columns:repeat(4,1fr);max-width:none }
.o-stat-card { min-height:var(--metric-card-min-height);padding:var(--spacing-12) }
.o-stat-value { margin-bottom:var(--spacing-4);font-size:var(--text-5xl) }
.o-stat-label { margin-bottom:var(--spacing-8);font-size:var(--text-lg) }
.o-chart-card__body { height:var(--chart-height-desktop);padding:var(--spacing-10) }
 }
@media (min-width:1600px) { .o-container { max-width:var(--max-width-full);margin:var(--spacing-0) auto }
.o-stats-grid { gap:var(--spacing-12) }
.o-stat-card { min-height:calc(var(--metric-card-min-height) + var(--spacing-5));padding:var(--spacing-14) }
.o-stat-value { font-size:var(--metric-value-font-size) }
.o-stat-label { font-size:var(--text-xl) }
 }
@media (min-width:768px) { .o-performance-badge { padding:var(--spacing-2) var(--spacing-4);font-size:var(--text-sm) }
.o-stat-icon { width:var(--metric-icon-size);height:var(--metric-icon-size);font-size:var(--spacing-6) }
.o-threshold-indicator { height:var(--spacing-1-5);margin:var(--spacing-4) 0 }
.o-stat-card--desktop-tooltip:before { max-width:var(--col-width-extra-wide);padding:var(--spacing-4) var(--spacing-6);font-size:var(--text-sm);line-height:1.5 }
.o-charts-grid { gap:var(--spacing-12) }
.o-chart-card { min-height:calc(var(--chart-height-desktop) + var(--spacing-12)) }
.o-chart-card__header { padding:var(--spacing-8) var(--spacing-10) var(--spacing-6) }
.o-chart-card__header h2 { font-size:var(--text-xl) }
.o-chart-control-btn { padding:var(--spacing-2) var(--spacing-5);font-size:var(--text-sm) }
.o-loading-skeleton { height:var(--spacing-6);border-radius:var(--radius-lg) }
.o-refresh-indicator { top:var(--spacing-8);right:var(--spacing-8);padding:var(--spacing-4) var(--spacing-6);font-size:var(--text-sm) }
.o-connection-status { bottom:var(--spacing-8);left:var(--spacing-8);padding:var(--spacing-3) var(--spacing-5);font-size:var(--text-sm) }
.o-expanded-details { margin-top:var(--spacing-6);padding:var(--spacing-8) }
.o-detail-item { padding:var(--spacing-4) 0 }
.o-detail-label,.o-detail-value { font-size:var(--text-sm) }
.o-goal-section { margin-top:var(--spacing-6);padding:var(--spacing-6) }
.o-goal-title { margin-bottom:var(--spacing-4);font-size:var(--text-sm) }
.o-goal-bar { height:var(--spacing-2-5) }
 }
@media (min-width:768px) { .o-stat-card:focus-within { outline:var(--spacing-0-75) solid var(--accent,var(--color-brand-primary));outline-offset:var(--spacing-0-75) }
.o-expand-toggle { width:var(--spacing-8);height:var(--spacing-8);font-size:var(--text-sm) }
.o-expand-toggle:hover { transform:scale(1.1) }
.o-page-header h1 { font-size:var(--spacing-10) }
.o-page-header p { font-size:var(--text-lg) }
.o-stat-description { font-size:var(--text-sm);line-height:1.5 }
.o-stat-card:hover { box-shadow:var(--metric-card-shadow-hover);transform:translateY(calc(var(--spacing-1-5)*-1)) scale(1.03) }
.o-stat-card--primary:hover { box-shadow:var(--metric-card-shadow-hover) }
.o-notifications-container { top:var(--spacing-8);right:var(--spacing-8) }
.o-notification { max-width:calc(var(--col-width-extra-wide) + var(--spacing-32));padding:var(--spacing-4) var(--spacing-6);font-size:var(--text-sm) }
.o-error-message { margin-top:var(--spacing-4);font-size:var(--text-sm) }
.o-retry-button { margin-top:var(--spacing-4);padding:var(--spacing-3) var(--spacing-6);font-size:var(--text-sm) }
.o-refresh-button { top:var(--spacing-6);right:var(--spacing-6);width:var(--spacing-12);height:var(--spacing-12);font-size:var(--text-lg) }
.o-refresh-button:hover { transform:scale(1.1) }
 }
@media (min-width:1024px) { .o-ai-recommendations-alt,.o-ai-recommendations-section,.o-ai-recommendations,.o-recommendations-container,.o-recommendations__container { padding:var(--space-8,var(--spacing-8)) var(--space-6,var(--spacing-6)) }
 }
@media (min-width:1680px) { .o-ai-recommendations-alt,.o-ai-recommendations-section,.o-ai-recommendations,.o-recommendations-container,.o-recommendations__container { max-width:min(var(--max-width-full),90vw);margin:var(--spacing-0) auto;padding:var(--space-8,var(--spacing-8)) var(--space-8,var(--spacing-8)) }
 }
@media (min-width:1920px) { .o-learning-dashboard .o-sg-container,.o-learning-page .o-main-content,.o-learning-page .o-sg-container { max-width:min(var(--max-width-full),90vw) }
 }
@media (min-width:768px) { .o-stats-grid { gap:var(--space-5);grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1024px) { .o-stats-grid { gap:var(--space-6);grid-template-columns:repeat(4,1fr) }
 }
.o-ai-recommendations-alt,.o-ai-recommendations-section,.o-ai-recommendations,.o-recommendations-container,.o-recommendations__container { width:100%;max-width:100%;padding:var(--space-6,var(--spacing-6)) var(--space-4,var(--spacing-4)) }
.o-learning-dashboard .o-sg-container,.o-learning-page .o-main-content,.o-learning-page .o-sg-container { max-width:min(var(--max-width-full),95vw) }
.o-stats-grid { display:grid;grid-gap:var(--space-4);gap:var(--space-4);width:100%;margin-bottom:var(--space-8) }
.o-recommendations-list,.o-recommendations__list { width:100% }
.o-page-header { width:100%;margin-bottom:var(--space-8) }
.o-page-header h1 { margin-bottom:var(--space-2);font-size:var(--text-3xl,2.25rem) }
.o-gradient-text { background:linear-gradient(135deg,var(--color-accent-primary) 0,var(--color-accent-hover) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.draft-card { margin-bottom:var(--spacing-5);padding:var(--draft-card-padding);background:var(--draft-card-bg);border:var(--spacing-px) solid var(--draft-card-border);border-radius:var(--draft-card-radius);box-shadow:var(--draft-card-shadow);transition:all var(--duration-base) var(--ease-out);container-type:inline-size;container-name:draft-card }
.draft-card:hover,.draft-card[data-state=hover] { background:var(--draft-card-bg-hover);border-color:var(--color-brand-primary-subtle);box-shadow:var(--draft-card-shadow-hover);transform:translateY(-2px) }
.draft-card[data-priority=high] { --draft-card-border:var(--color-danger-subtle) }
.draft-card[data-priority=medium] { --draft-card-border:var(--color-warning-subtle) }
.draft-card[data-status=sent] { --draft-card-bg:var(--color-success-subtle);opacity:80% }
.draft-card__header { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-4);border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.draft-card__title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold);line-height:var(--leading-tight) }
.club-name-indicator { display:inline-flex;align-items:center;margin-left:var(--spacing-2);font-size:var(--text-sm);opacity:60%;transition:opacity var(--duration-base) var(--ease-out) }
.club-name-indicator--uncertain { color:var(--color-warning) }
.club-name-indicator:hover { opacity:100% }
.draft-card__subtitle { margin-top:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-base) }
.draft-card__email { margin-top:var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-sm) }
.draft-card__body { margin-bottom:var(--spacing-4) }
.draft-card__preview { margin:var(--spacing-4) 0;padding:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);background:var(--color-surface-overlay);border-left:var(--spacing-1) solid var(--color-brand-primary-subtle);border-radius:0 var(--radius-md) var(--radius-md) 0 }
.draft-card__footer { display:flex;flex-wrap:wrap;gap:var(--spacing-3);padding-top:var(--spacing-4);border-top:var(--spacing-px) solid var(--color-border-subtle) }
.draft-card__actions { display:flex;flex:1;gap:var(--spacing-3) }
.draft-card__badge { position:absolute;top:var(--spacing-4);right:var(--spacing-4);padding:var(--spacing-1) var(--spacing-3);color:var(--color-brand-primary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;background:var(--color-brand-primary-subtle);border-radius:var(--radius-full) }
.draft-card__badge[data-confidence=high] { color:var(--color-success);background:var(--color-success-subtle) }
.draft-card__badge[data-confidence=medium] { color:var(--color-warning);background:var(--color-warning-subtle) }
.draft-card__badge[data-confidence=low] { color:var(--color-danger);background:var(--color-danger-subtle) }
@container draft-card (max-width: var(--card-min-width-lg)) { .draft-card__header { flex-direction:column }
.draft-card__actions { flex-direction:column;width:100% }
.draft-card__badge { position:static;align-self:flex-start;margin-bottom:var(--spacing-2) }
 }
.draft-card__follow-up,.draft-card__trigger,.draft-preview,.draft-trigger-reason { display:block;overflow:hidden;margin:var(--spacing-5) var(--spacing-6) var(--spacing-5) var(--spacing-6);padding:var(--spacing-4) var(--spacing-5);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);background:var(--color-brand-primary-subtle);border-left:var(--spacing-1) solid var(--color-brand-primary-light);border-radius:0 var(--radius-md) var(--radius-md) 0 }
.draft-card__follow-up:first-line,.draft-card__trigger:first-line,.draft-preview:first-line,.draft-trigger-reason:first-line { color:var(--color-brand-primary-light);font-weight:var(--font-semibold) }
.draft-card__follow-up-label,.draft-trigger-followup { margin-bottom:var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.draft-card__header,.draft-header { margin:var(--spacing-0);padding:var(--spacing-6);border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.draft-card__info,.draft-info { padding:var(--spacing-6) }
.draft-card__info h3,.draft-info .card-title,.draft-info h3 { margin:var(--spacing-0) var(--spacing-0) var(--spacing-3) var(--spacing-0) }
.draft-actions,.draft-card__actions { margin:var(--spacing-0);padding:var(--spacing-5) var(--spacing-6);background:var(--color-surface-overlay) }
.draft-card__feedback,var(--color-danger-subtle)dback-group { margin:var(--spacing-0);padding:var(--spacing-4) var(--spacing-6);background:var(--color-surface-overlay-strong) }
.draft-card__contact,.draft-gm-name { position:relative;margin-bottom:var(--spacing-2);padding-left:var(--spacing-0);color:var(--color-text-secondary);font-size:var(--text-base) }
.draft-card__contact:before,.draft-gm-name:before { content:none;display:none }
.draft-card__feedback input[type=checkbox],.feedback-checkbox { display:inline-block }
.draft-card__checkbox--hidden,.draft-card__checkbox,.draft-select-checkbox { display:none }
.draft-age,.draft-card__age { display:inline-block;margin:var(--spacing-0) var(--spacing-0) var(--spacing-4) var(--spacing-0) }
@supports (selector(:has(.draft-select-checkbox))) { .draft-card:has(.draft-select-checkbox) .draft-card__info,.draft-card:has(.draft-select-checkbox) .draft-info { padding-left:var(--spacing-0) }
 }
.draft-card--has-checkbox .draft-card__info,.draft-card--has-checkbox .draft-info { padding-left:var(--spacing-0) }
@media (prefers-color-scheme:light) { .draft-card { --draft-card-bg:var(--color-neutral-50);--draft-card-border:var(--color-neutral-200);--color-text-primary:var(--color-neutral-900);--color-text-secondary:var(--color-neutral-600);--color-surface-overlay:var(--color-neutral-100) }
.draft-card__follow-up,.draft-card__trigger,.draft-preview,.draft-trigger-reason { background:var(--color-brand-primary-subtle);border-left-color:var(--color-brand-primary) }
 }
.dashboard-card { margin-bottom:var(--spacing-4);padding:var(--spacing-4);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-neutral-200);border-radius:var(--radius-lg);box-shadow:0 1px 2px var(--alpha-black-5),0 4px 8px var(--alpha-black-10),0 8px 16px var(--alpha-black-5);transition:transform var(--duration-fast) var(--ease-bounce),box-shadow var(--duration-medium) var(--ease-out),background var(--duration-medium) var(--ease-out) }
.dashboard-card:hover { box-shadow:0 2px 4px var(--alpha-black-10),0 8px 16px var(--alpha-black-15),0 16px 32px var(--alpha-black-10);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.dashboard-card__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3);padding-bottom:var(--spacing-3);border-bottom:var(--spacing-px) solid var(--color-neutral-100) }
.dashboard-card__title { margin:0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.dashboard-card__subtitle { margin-top:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
.dashboard-card__body { color:var(--color-text-primary) }
.dashboard-card__footer { display:flex;justify-content:space-between;align-items:center;margin-top:var(--spacing-4);padding-top:var(--spacing-3);border-top:var(--spacing-px) solid var(--color-neutral-100) }
.dashboard-card--elevated { background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border:var(--spacing-px) solid var(--glass-border);box-shadow:0 2px 4px var(--alpha-black-10),0 8px 16px var(--alpha-black-15),0 16px 32px var(--alpha-black-10) }
.dashboard-card--elevated:hover { box-shadow:0 4px 8px var(--alpha-black-15),0 12px 24px var(--alpha-black-20),0 24px 48px var(--alpha-black-15);border-color:var(--glass-border) }
.dashboard-card--elevated .dashboard-card__body,.dashboard-card--elevated .dashboard-card__title { color:var(--color-text-on-dark) }
.dashboard-card--elevated .dashboard-card__metric-label,.dashboard-card--elevated .dashboard-card__subtitle { color:var(--color-text-on-dark-secondary) }
.dashboard-card--compact { padding:var(--spacing-3) }
.dashboard-card--highlighted { border-width:var(--spacing-0-5);border-color:var(--color-primary) }
.dashboard-card--success { position:relative;overflow:hidden;border-left:var(--border-width-3) solid transparent;background:linear-gradient(var(--color-surface-primary),var(--color-surface-primary)) padding-box,linear-gradient(135deg,var(--color-success-light),var(--color-success-dark)) border-box }
.dashboard-card--success:hover { box-shadow:0 2px 4px var(--alpha-black-10),0 8px 16px var(--alpha-black-15),0 16px 32px var(--alpha-black-10),0 0 24px var(--color-success-15) }
.dashboard-card--warning { position:relative;overflow:hidden;border-left:var(--border-width-3) solid transparent;background:linear-gradient(var(--color-surface-primary),var(--color-surface-primary)) padding-box,linear-gradient(135deg,var(--color-warning-light),var(--color-warning-dark)) border-box }
.dashboard-card--warning:hover { box-shadow:0 2px 4px var(--alpha-black-10),0 8px 16px var(--alpha-black-15),0 16px 32px var(--alpha-black-10),0 0 24px var(--color-warning-subtle) }
.dashboard-card--error { position:relative;overflow:hidden;border-left:var(--border-width-3) solid transparent;background:linear-gradient(var(--color-surface-primary),var(--color-surface-primary)) padding-box,linear-gradient(135deg,var(--color-danger-light),var(--color-danger-dark)) border-box }
.dashboard-card--error:hover { box-shadow:0 2px 4px var(--alpha-black-10),0 8px 16px var(--alpha-black-15),0 16px 32px var(--alpha-black-10),0 0 24px var(--color-error-15) }
.dashboard-card--info { position:relative;overflow:hidden;border-left:var(--border-width-3) solid transparent;background:linear-gradient(var(--color-surface-primary),var(--color-surface-primary)) padding-box,linear-gradient(135deg,var(--color-info-light),var(--color-info-dark)) border-box }
.dashboard-card--info:hover { box-shadow:0 2px 4px var(--alpha-black-10),0 8px 16px var(--alpha-black-15),0 16px 32px var(--alpha-black-10),0 0 24px var(--color-info-subtle) }
.dashboard-card--metric { position:relative;overflow:hidden;text-align:center;background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);box-shadow:0 2px 4px var(--alpha-black-10),0 8px 16px var(--alpha-black-15) }
.dashboard-card--metric:hover { border-color:var(--color-border-strong);box-shadow:0 4px 8px var(--alpha-black-15),0 12px 24px var(--alpha-black-20),0 0 32px var(--color-brand-primary-20) }
.dashboard-card__metric-value { margin:var(--spacing-2) 0;color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold);line-height:var(--leading-tight);transition:color var(--duration-medium) var(--ease-out),transform var(--duration-fast) var(--ease-bounce) }
.dashboard-card--metric:hover .dashboard-card__metric-value { transform:scale(1.05) }
.dashboard-card__metric-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold);letter-spacing:.05em;text-transform:uppercase }
.dashboard-card__metric-change { display:inline-flex;align-items:center;gap:var(--spacing-1);margin-top:var(--spacing-2);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-sm);font-weight:var(--font-medium);border-radius:var(--radius-base);transition:all var(--duration-fast) var(--ease-out) }
.dashboard-card__metric-change--positive { color:var(--color-success-high-contrast);background:var(--color-success-15) }
.dashboard-card__metric-change--positive:hover { background:var(--color-success-subtle) }
.dashboard-card__metric-change--negative { color:var(--color-danger-light);background:var(--color-error-15) }
.dashboard-card__metric-change--negative:hover { background:var(--color-danger-subtle) }
.dashboard-card--loading { position:relative;opacity:70%;pointer-events:none }
.dashboard-card--loading:after { content:"";position:absolute;inset:0;background:var(--skeleton-gradient);background-size:200% 100%;animation:shimmer var(--duration-shimmer) ease-in-out infinite;border-radius:inherit }
.dashboard-card--clickable { cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform var(--duration-fast) var(--ease-bounce),box-shadow var(--duration-medium) var(--ease-out),background var(--duration-fast) var(--ease-out) }
.dashboard-card--clickable:active { transform:translateY(var(--spacing-0-5)) scale(.98);box-shadow:0 1px 2px var(--alpha-black-5),0 2px 4px var(--alpha-black-10) }
.dashboard-card--clickable:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.dashboard-cards-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fill,minmax(300px,1fr)) }
@media (max-width:768px) { .dashboard-card { margin-bottom:var(--spacing-3);padding:var(--spacing-3) }
.dashboard-cards-grid { gap:var(--spacing-3);grid-template-columns:1fr }
.dashboard-card__metric-value { font-size:var(--text-2xl) }
 }
@media (prefers-color-scheme:dark) { .dashboard-card { background:var(--color-surface-elevated);border-color:var(--color-neutral-700) }
.dashboard-card__footer,.dashboard-card__header { border-color:var(--color-neutral-700) }
 }
@media (prefers-reduced-motion:reduce) { .dashboard-card--clickable,.dashboard-card--elevated,.dashboard-card--metric,.dashboard-card,.dashboard-card__metric-change,.dashboard-card__metric-value { animation:none;transition-duration:.01ms }
.dashboard-card--loading:after { animation:none }
.dashboard-card--clickable:active,.dashboard-card:hover { transform:none }
 }
.confidence-badge { position:relative;display:inline-flex;overflow:hidden;align-items:center;width:80px;min-width:80px;height:var(--spacing-6);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-full);transition:all var(--duration-base) var(--ease-out);cursor:help }
.confidence-badge__track { position:absolute;top:var(--spacing-0);left:var(--spacing-0);overflow:hidden;width:100%;height:100%;background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.confidence-badge__fill { position:relative;width:calc(var(--confidence-value, 0)*1%);height:100%;background:linear-gradient(90deg,var(--color-neutral-400),var(--color-neutral-300));border-radius:var(--radius-full);transition:width var(--duration-moderate) var(--ease-out) }
.confidence-badge__text { position:absolute;top:var(--radius-full);left:var(--radius-full);z-index:var(--z-10);color:var(--color-text-primary);font-size:var(--text-xs);font-weight:var(--font-semibold);line-height:1;text-align:center;text-shadow:var(--text-shadow-sm);transform:translate(-9999px,-9999px);pointer-events:none }
.confidence-badge[data-confidence-level=excellent],.confidence-badge[data-confidence-level=high] { border-color:var(--color-success-subtle) }
.confidence-badge[data-confidence-level=excellent] .confidence-badge__fill,.confidence-badge[data-confidence-level=high] .confidence-badge__fill { background:linear-gradient(90deg,var(--color-success),var(--color-success-light)) }
.confidence-badge[data-confidence-level=excellent]:hover,.confidence-badge[data-confidence-level=high]:hover { border-color:var(--color-success);box-shadow:0 0 0 var(--spacing-0-5) var(--color-success-subtle) }
.confidence-badge[data-confidence-level=good] { border-color:var(--color-info-subtle) }
.confidence-badge[data-confidence-level=good] .confidence-badge__fill { background:linear-gradient(90deg,var(--color-info),var(--color-info-light)) }
.confidence-badge[data-confidence-level=good]:hover { border-color:var(--color-info);box-shadow:0 0 0 var(--spacing-0-5) var(--color-info-subtle) }
.confidence-badge[data-confidence-level=medium] { border-color:var(--color-warning-subtle) }
.confidence-badge[data-confidence-level=medium] .confidence-badge__fill { background:linear-gradient(90deg,var(--color-warning),var(--color-warning-light)) }
.confidence-badge[data-confidence-level=medium]:hover { border-color:var(--color-warning);box-shadow:0 0 0 var(--spacing-0-5) var(--color-warning-subtle) }
.confidence-badge[data-confidence-level=low] { border-color:var(--color-danger-subtle) }
.confidence-badge[data-confidence-level=low] .confidence-badge__fill { background:linear-gradient(90deg,var(--color-danger),var(--color-danger-light)) }
.confidence-badge[data-confidence-level=low]:hover { border-color:var(--color-danger);box-shadow:0 0 0 var(--spacing-0-5) var(--color-danger-subtle) }
.confidence-badge__fill--updating { animation:confidence-pulse 1s ease-in-out }
.confidence-badge--significant-change { animation:confidence-highlight 2s ease-in-out }
.confidence-badge--small { width:var(--nav-height);min-width:var(--nav-height);height:var(--spacing-4-5) }
.confidence-badge--small .confidence-badge__text { font-size:calc(var(--text-xs)*.9) }
.confidence-badge--large { width:var(--col-width-date);min-width:var(--col-width-date);height:var(--spacing-7) }
.confidence-badge--large .confidence-badge__text { font-size:var(--text-sm) }
@media (prefers-reduced-motion:reduce) { .confidence-badge,.confidence-badge__fill { transition:none }
.confidence-badge--significant-change,.confidence-badge--updating .confidence-badge__fill { animation:none }
 }
@media (prefers-contrast:more) { .confidence-badge { border-width:var(--spacing-0-5) }
.confidence-badge__text { font-weight:var(--font-bold);text-shadow:none }
 }
@media (prefers-color-scheme:light) { .confidence-badge__text { color:var(--color-neutral-900);text-shadow:var(--text-shadow-light) }
 }
.confidence-badge:focus-visible { outline:var(--spacing-0-5) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.confidence-badge__fill--loading { background:linear-gradient(90deg,var(--color-neutral-300),var(--color-neutral-400),var(--color-neutral-300));background-size:200% 100%;animation:confidence-loading 1.5s ease-in-out infinite }
.confidence-badge--loading .confidence-badge__text { opacity:70% }
.confidence-badge--error { background:var(--color-danger-subtle);border-color:var(--color-danger) }
.confidence-badge__fill--error { background:var(--color-danger-subtle) }
.confidence-badge--error .confidence-badge__text { color:var(--color-danger-dark) }
.c-draft-card__confidence { flex-direction:column;gap:var(--spacing-2) }
.c-draft-card__confidence-badge { gap:var(--spacing-1-5);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);letter-spacing:.5px;transition:none;cursor:default;pointer-events:none }
.c-draft-card__confidence-badge--medium { color:var(--color-neutral-900) }
.c-draft-card__confidence-label { font-weight:var(--font-weight-semibold) }
.c-draft-card__confidence-value { font-weight:var(--font-weight-medium);opacity:90% }
.c-draft-card__confidence-progress-container { overflow:hidden;width:100%;max-width:200px;height:var(--spacing-2);margin-top:var(--spacing-2);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.c-draft-card__confidence-progress { width:calc(var(--confidence, 0)*1%);height:100%;border-radius:var(--radius-full);transition:width var(--duration-slow) }
.c-draft-card__confidence-progress--high { background:var(--confidence-badge-high-gradient) }
.c-draft-card__confidence-progress--medium { background:var(--confidence-badge-medium-gradient) }
.c-draft-card__confidence-progress--low { background:var(--confidence-badge-low-gradient) }
@media (max-width:320px) { .c-draft-card__confidence-badge { justify-content:center;min-width:100% }
 }
@media (prefers-reduced-motion:reduce) { .c-draft-card__confidence-badge,.c-draft-card__confidence-progress { transition:none }
 }
@media (prefers-contrast:more) { .c-draft-card__confidence-badge { border-width:var(--spacing-0-5) }
.c-draft-card__confidence-label,.c-draft-card__confidence-value { font-weight:var(--font-weight-bold) }
 }
.confidence-badge--inline { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-weight-medium);border-radius:var(--radius-md) }
.confidence-badge--inline.confidence-badge--high { color:var(--color-text-on-dark);background:var(--confidence-badge-high-gradient) }
.confidence-badge--inline.confidence-badge--medium { color:var(--color-neutral-900);background:var(--confidence-badge-medium-gradient) }
.confidence-badge--inline.confidence-badge--low { color:var(--color-text-on-dark);background:var(--confidence-badge-low-gradient) }
.suggestion-badge { display:flex;flex-direction:column;gap:var(--spacing-3);min-width:var(--size-dropdown-export);max-width:var(--card-min-width-sm);padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-base) var(--ease-out) }
.suggestion-badge:hover { box-shadow:var(--shadow-md);transform:var(--transform-hover-lift-micro) }
.suggestion-badge--loading { position:relative;opacity:60%;pointer-events:none }
.suggestion-badge--loading:after { content:"";position:absolute;top:50%;left:50%;width:var(--spacing-6);height:var(--spacing-6);margin:calc(var(--spacing-6)/-2) 0 0 calc(var(--spacing-6)/-2);border:var(--border-width-2) solid var(--color-border-default);border-top-color:var(--color-primary);border-radius:50%;animation:suggestion-badge-spin var(--duration-slow) linear infinite }
.suggestion-badge--high { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-success-subtle) 100%);border-color:var(--color-success-border) }
.suggestion-badge--high:hover { border-color:var(--color-success);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-success-subtle) }
.suggestion-badge--moderate { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-warning-subtle) 100%);border-color:var(--color-warning-border) }
.suggestion-badge--moderate:hover { border-color:var(--color-warning);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-warning-subtle) }
.suggestion-badge__header { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.suggestion-badge__icon { font-size:var(--text-lg);line-height:1;transition:transform var(--duration-base) var(--ease-out) }
.suggestion-badge:hover .suggestion-badge__icon { transform:scale(1.1) }
.suggestion-badge__text { flex:1;color:var(--color-text-secondary);font-weight:var(--font-medium) }
.suggestion-badge__confidence-text { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-bold);letter-spacing:var(--tracking-tight);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.suggestion-badge--high .suggestion-badge__confidence-text { color:var(--color-success-light) }
.suggestion-badge--moderate .suggestion-badge__confidence-text { color:var(--color-warning-light) }
.suggestion-badge__confidence-wrapper { position:relative;display:flex;align-items:center;gap:var(--spacing-1) }
.suggestion-badge__info-icon { display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;width:var(--spacing-5);height:var(--spacing-5);font-size:var(--text-sm);border-radius:50%;opacity:70%;transition:opacity var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out);cursor:pointer;all:unset }
.suggestion-badge__info-icon:focus-visible,.suggestion-badge__info-icon:hover { background:var(--color-surface-hover);outline:var(--border-width-2) solid var(--color-primary);outline-offset:var(--spacing-0-5);opacity:100% }
.suggestion-badge__tooltip { position:absolute;bottom:calc(100% + var(--spacing-2));left:50%;z-index:var(--z-index-tooltip);visibility:hidden;width:max-content;min-width:var(--size-grid-column-min);max-width:var(--size-dropdown-export);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);opacity:0;transform:translateX(-50%) translateY(var(--spacing-1));transition:opacity var(--duration-base) var(--ease-out),visibility var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out);pointer-events:none }
.suggestion-badge__info-icon:focus+.suggestion-badge__tooltip,.suggestion-badge__info-icon:hover+.suggestion-badge__tooltip,.suggestion-badge__tooltip:hover { visibility:visible;opacity:100%;transform:translateX(-50%) translateY(0);pointer-events:auto }
.suggestion-badge__tooltip-content { padding:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.suggestion-badge__tooltip-title { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.suggestion-badge__tooltip-text { margin:0;color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-normal);line-height:var(--leading-relaxed) }
.suggestion-badge__tooltip-arrow { position:absolute;bottom:calc(var(--spacing-2)*-1);left:50%;width:0;height:0;border-top:var(--spacing-2) solid var(--color-surface-elevated);border-right:var(--spacing-2) solid transparent;border-left:var(--spacing-2) solid transparent;filter:drop-shadow(0 1px 1px var(--alpha-black-10));transform:translateX(-50%) }
.confidence-indicator { position:relative;overflow:hidden;width:100%;height:var(--spacing-2);background:var(--color-surface-primary);border-radius:var(--radius-base);box-shadow:inset 0 var(--border-width-1) var(--spacing-1) var(--alpha-black-10) }
.confidence-indicator__fill { height:100%;border-radius:var(--radius-base);transition:width var(--duration-slow) var(--ease-out) }
.confidence-indicator--high .confidence-indicator__fill { background:linear-gradient(90deg,var(--color-success) 0,var(--color-success-light) 100%);box-shadow:0 0 var(--spacing-2) var(--color-success-subtle) }
.confidence-indicator--moderate .confidence-indicator__fill { background:linear-gradient(90deg,var(--color-warning) 0,var(--color-warning-light) 100%);box-shadow:0 0 var(--spacing-2) var(--color-warning-subtle) }
.suggestion-badge__actions { display:flex;align-items:stretch;gap:var(--spacing-2) }
.suggestion-badge__actions .btn { display:flex;flex:1;justify-content:center;align-items:center;gap:var(--spacing-1);min-height:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-semibold);border:var(--border-width-1) solid transparent;border-radius:var(--radius-md);transition:all var(--duration-base) var(--ease-out);cursor:pointer }
.suggestion-badge__actions .btn--success { color:var(--color-text-on-dark);background:var(--color-success);border-color:var(--color-success) }
.suggestion-badge__actions .btn--success:hover { background:var(--color-success-dark);border-color:var(--color-success-dark);box-shadow:var(--shadow-sm),0 0 0 var(--spacing-0-5) var(--color-success-subtle);transform:var(--transform-hover-lift-micro) }
.suggestion-badge__actions .btn--success:active { transform:scale(.98) }
.suggestion-badge__actions .btn--secondary { color:var(--color-text-secondary);background:var(--color-surface-primary);border-color:var(--color-border-default) }
.suggestion-badge__actions .btn--secondary:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:var(--transform-hover-lift-micro) }
.suggestion-badge__actions .btn--secondary:active { transform:scale(.98) }
.suggestion-badge__actions .btn:focus-visible { z-index:var(--z-10);outline:var(--spacing-0-5) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
@media (max-width:640px) { .suggestion-badge { min-width:100%;max-width:100% }
.suggestion-badge__actions { flex-direction:column }
.suggestion-badge__actions .btn { width:100% }
.suggestion-badge__tooltip { right:var(--spacing-2);left:var(--spacing-2);max-width:calc(100vw - var(--spacing-4));transform:translateX(0) }
.suggestion-badge__tooltip-arrow { left:50% }
 }
@media (prefers-reduced-motion:reduce) { .confidence-indicator__fill,.suggestion-badge,.suggestion-badge__actions .btn,.suggestion-badge__icon,.suggestion-badge__info-icon,.suggestion-badge__tooltip { transition:none;animation:none }
.suggestion-badge--loading:after { animation:none }
.suggestion-badge__info-icon:focus-visible { outline:var(--border-width-2) solid var(--color-primary);outline-offset:var(--spacing-0-5) }
 }
@media (prefers-contrast:more) { .suggestion-badge { border-width:var(--border-width-2) }
.suggestion-badge__confidence-text { font-weight:var(--font-extrabold) }
.suggestion-badge__actions .btn { border-width:var(--border-width-2) }
 }
.suggestion-badge--confirmed { min-width:auto;max-width:var(--card-min-width-sm);padding:var(--spacing-3);animation:suggestion-badge-confirm-enter var(--duration-base) var(--ease-out);backdrop-filter:blur(8px) }
.suggestion-badge--accepted { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-success-subtle) 100%);border-color:var(--color-success-border) }
.suggestion-badge--accepted:hover { border-color:var(--color-success);box-shadow:var(--shadow-sm),0 0 0 var(--spacing-0-5) var(--color-success-subtle) }
.suggestion-badge--rejected { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-warning-subtle) 100%);border-color:var(--color-warning-border) }
.suggestion-badge--rejected:hover { border-color:var(--color-warning);box-shadow:var(--shadow-sm),0 0 0 var(--spacing-0-5) var(--color-warning-subtle) }
.suggestion-badge__confirmation { display:flex;align-items:center;gap:var(--spacing-3);font-size:var(--text-sm) }
.suggestion-badge__status-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);font-size:var(--text-lg);border-radius:50%;transition:transform var(--duration-fast) var(--ease-out) }
.suggestion-badge__status-icon [class*=fa-],.suggestion-badge__status-icon i { display:flex;align-items:center;justify-content:center;margin:0;width:100%;height:100% }
.suggestion-badge__status-icon [class*=fa-]:before { margin-right:0 }
.suggestion-badge--confirmed:hover .suggestion-badge__status-icon { transform:scale(1.1) }
.suggestion-badge--accepted .suggestion-badge__status-icon { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-dark) 100%);box-shadow:0 var(--spacing-1) var(--spacing-2) var(--color-success-subtle) }
.suggestion-badge--rejected .suggestion-badge__status-icon { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-warning) 0,var(--color-warning-dark) 100%);box-shadow:0 var(--spacing-1) var(--spacing-2) var(--color-warning-subtle) }
.suggestion-badge__status-content { display:flex;flex:1;flex-direction:column;gap:var(--spacing-0-5);min-width:0 }
.suggestion-badge__status-text { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);line-height:var(--leading-tight) }
.suggestion-badge--accepted .suggestion-badge__status-text { color:var(--color-success-dark) }
.suggestion-badge--rejected .suggestion-badge__status-text { color:var(--color-warning-dark) }
.suggestion-badge__status-description { color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-normal);line-height:var(--leading-normal) }
.suggestion-badge__timestamp { flex-shrink:0;margin-left:auto;padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-medium);background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-subtle);border-radius:var(--radius-base);transition:all var(--duration-fast) var(--ease-out);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.suggestion-badge--confirmed:hover .suggestion-badge__timestamp { background:var(--color-surface-hover);border-color:var(--color-border-default) }
@media (max-width:640px) { .suggestion-badge--confirmed { min-width:100%;padding:var(--spacing-3) }
.suggestion-badge__confirmation { flex-wrap:wrap;gap:var(--spacing-2) }
.suggestion-badge__timestamp { width:100%;margin-left:0;text-align:center }
 }
.suggestion-badge--inline { flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--spacing-2);min-width:auto;max-width:none;flex:1;padding:var(--spacing-2) var(--spacing-3);background:var(--color-surface-elevated);border-style:solid }
.suggestion-badge--inline .suggestion-badge__header { flex:1;min-width:0;flex-direction:row;gap:var(--spacing-2) }
.suggestion-badge--inline .suggestion-badge__icon { font-size:var(--text-sm) }
.suggestion-badge--inline .suggestion-badge__title { font-size:var(--text-xs) }
.suggestion-badge--inline .suggestion-badge__confidence { flex-shrink:0;margin:0 }
.suggestion-badge--inline .suggestion-badge__confidence-bar { width:var(--spacing-10);height:var(--spacing-1) }
.suggestion-badge--inline .suggestion-badge__actions { flex-direction:row;flex-shrink:0;gap:var(--spacing-1) }
.suggestion-badge--inline .suggestion-badge__actions .btn { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs) }
@media (max-width:480px) { .suggestion-badge--inline { flex-direction:column;align-items:stretch }
.suggestion-badge--inline .suggestion-badge__actions { width:100%;justify-content:stretch }
.suggestion-badge--inline .suggestion-badge__actions .btn { flex:1 }
 }
@media (prefers-reduced-motion:reduce) { .suggestion-badge--confirmed { animation:none }
.suggestion-badge__status-icon,.suggestion-badge__timestamp { transition:none }
 }
@media (prefers-contrast:more) { .suggestion-badge--confirmed { border-width:var(--border-width-2) }
.suggestion-badge--accepted { border-color:var(--color-success-dark) }
.suggestion-badge--rejected { border-color:var(--color-warning-dark) }
.suggestion-badge__status-icon { border:var(--border-width-2) solid }
.suggestion-badge__timestamp { border-width:var(--border-width-2) }
 }
.c-performance-dashboard { width:100%;min-height:100vh }
.c-loading-screen { position:fixed;inset:var(--spacing-0);z-index:var(--z-modal,9999);display:flex;flex-direction:column;justify-content:center;align-items:center;background:var(--color-surface-primary);transition:opacity var(--transition-medium,.3s ease) }
.c-loading-screen--hidden { opacity:0;pointer-events:none }
.c-loading-spinner { width:var(--nav-height);height:var(--nav-height);border:var(--spacing-1) solid var(--color-success-alpha-20);border-top-color:var(--color-success);border-radius:var(--radius-full,var(--radius-full));animation:spin var(--duration-slow,1s) linear infinite }
.c-loading-text { margin-top:var(--spacing-lg,var(--spacing-5));color:var(--color-text-primary);font-size:var(--font-size-lg,var(--spacing-4-5)) }
.c-nav-container { padding:var(--spacing-sm,var(--spacing-2-5)) var(--spacing-lg,var(--spacing-5));background:var(--color-surface-overlay);border-bottom:var(--spacing-px) solid var(--color-border-default) }
.c-nav-container a { margin-right:var(--spacing-lg,var(--spacing-5));padding:var(--spacing-xs,var(--spacing-2)) var(--spacing-sm,var(--spacing-3));color:var(--color-text-primary);text-decoration:none;border-radius:var(--radius-md,var(--spacing-1-5));transition:background var(--transition-fast,.2s) }
.c-nav-container a:hover { background:var(--hover-bg,var(--color-neutral-0-alpha-10)) }
.c-nav-container__link--active { color:var(--text-on-accent,var(--color-neutral-0));background:var(--color-success) }
.c-alert { position:relative;margin-bottom:var(--spacing-sm,var(--spacing-2-5));padding:var(--spacing-md,var(--spacing-1-25));border-radius:var(--radius-md,var(--spacing-1-5));animation:slide-in var(--transition-medium,.3s) ease }
.c-alert-info { color:var(--color-info);background:var(--color-info-bg,var(--color-info-alpha-10));border:var(--spacing-px) solid var(--color-info) }
.c-alert-warning { color:var(--color-warning);background:var(--color-warning-bg,var(--color-warning-alpha-10));border:var(--spacing-px) solid var(--color-warning) }
.c-alert-error { color:var(--color-danger);background:var(--color-error-bg,var(--color-danger-alpha-10));border:var(--spacing-px) solid var(--color-danger) }
.c-alert-critical { color:var(--color-danger-dark);background:var(--color-critical-bg,var(--color-danger-alpha-10));border:var(--spacing-px) solid var(--color-danger-dark) }
.c-alert-success { color:var(--color-success);background:var(--color-success-bg,var(--color-success-alpha-10));border:var(--spacing-px) solid var(--color-success) }
.c-alert-time { margin-bottom:var(--spacing-xs,var(--spacing-1-25));font-size:var(--font-size-sm,var(--spacing-3));opacity:70% }
.c-alert-message { font-size:var(--font-size-base,var(--spacing-3-5)) }
.c-alert-dismiss { position:absolute;top:var(--spacing-xs,var(--spacing-1-25));right:var(--spacing-xs,var(--spacing-1-25));padding:var(--spacing-xs,var(--spacing-1-25));color:inherit;font-size:var(--font-size-xl,var(--spacing-5));line-height:1;background:none;border:none;opacity:60%;transition:opacity var(--transition-fast,.2s);cursor:pointer }
.c-alert-dismiss:hover { opacity:100% }
.c-connection-status { display:flex;align-items:center;gap:var(--spacing-xs,var(--spacing-2)) }
.c-status-indicator { width:var(--spacing-2-5);height:var(--spacing-2-5);border-radius:var(--radius-full,var(--radius-full));transition:background-color var(--transition-fast,.2s) }
.c-status-indicator--connected { background-color:var(--color-success);box-shadow:0 0 var(--spacing-1-25) var(--color-success) }
.c-status-indicator--disconnected { background-color:var(--color-danger);box-shadow:0 0 var(--spacing-1-25) var(--color-danger) }
.c-status-indicator--reconnecting { background-color:var(--color-warning);animation:pulse var(--duration-slow,1s) infinite }
.c-status-text { color:var(--color-text-secondary);font-size:var(--font-size-sm,var(--spacing-3)) }
.c-kpi-card { padding:var(--spacing-md,var(--spacing-1-25));background:var(--color-neutral-0);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md,var(--spacing-2));transition:transform var(--transition-fast,.2s) }
.c-kpi-card:hover { box-shadow:var(--shadow-md,var(--shadow-sm));transform:translateY(-2px) }
.c-kpi-value { color:var(--color-neutral-700);font-size:var(--font-size-2xl,var(--spacing-6));font-weight:var(--font-weight-bold,600) }
.c-kpi-trend { margin-top:var(--spacing-xs,var(--spacing-1-25));font-size:var(--font-size-sm,var(--spacing-3)) }
.c-trend-up { color:var(--color-success) }
.c-trend-down { color:var(--color-danger) }
.c-trend-stable { color:var(--color-text-secondary) }
@media (prefers-reduced-motion:reduce) { .c-alert,.c-loading-spinner,.c-status-indicator--reconnecting { animation:none }
.c-alert-dismiss,.c-kpi-card,.c-nav-container a,.c-status-indicator { transition:none }
 }
.sg-connection-status { position:fixed;right:var(--spacing-lg,var(--spacing-6));bottom:var(--spacing-lg,var(--spacing-6));z-index:var(--z-index-overlay);display:flex;align-items:center;gap:var(--spacing-xs,var(--spacing-2));padding:var(--spacing-sm,var(--spacing-3)) var(--spacing-md,var(--spacing-1-5));font-size:var(--font-size-sm,var(--spacing-3-5));font-weight:var(--font-weight-medium,500);background:var(--color-neutral-0);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md,var(--spacing-2));box-shadow:var(--shadow-lg);opacity:0;transform:translateY(20px);transition:all .3s ease;pointer-events:none }
.sg-connection-status[data-visible=true] { opacity:100%;transform:translateY(0);pointer-events:auto }
.sg-connection-status[data-status=connected] { color:var(--color-success);background:var(--color-success-subtle);border-color:var(--color-success-light) }
.sg-connection-status[data-status=disconnected] { color:var(--color-danger);background:var(--color-danger-subtle);border-color:var(--color-danger-light) }
.sg-connection-status[data-status=reconnecting] { color:var(--color-warning);background:var(--color-warning-subtle);border-color:var(--color-warning-light) }
.sg-connection-status[data-status=error],.sg-connection-status[data-status=failed] { color:var(--color-danger);background:var(--color-danger-subtle);border-color:var(--color-danger-light) }
.sg-connection-status[data-status=unknown] { color:var(--color-neutral-500);background:var(--color-neutral-50);border-color:var(--color-neutral-300) }
.sg-connection-status i { flex-shrink:0;font-size:var(--font-size-base,var(--spacing-1-5)) }
.sg-connection-status__text { font-weight:var(--font-weight-medium,500);white-space:nowrap }
.sg-connection-status .fa-spin { animation:fa-spin 2s linear infinite }
@media (max-width:768px) { .sg-connection-status { right:var(--spacing-md,var(--spacing-1-5));bottom:var(--spacing-md,var(--spacing-1-5));padding:var(--spacing-xs,var(--spacing-2)) var(--spacing-sm,var(--spacing-3));font-size:var(--font-size-xs,var(--spacing-3)) }
 }
@media (prefers-contrast:more) { .sg-connection-status { font-weight:var(--font-weight-semibold,600);border-width:var(--spacing-0-5) }
 }
@media (prefers-reduced-motion:reduce) { .sg-connection-status { transition:opacity .2s ease }
.sg-connection-status .fa-spin { animation:none }
 }
.sg-connection-status:focus-within { outline:var(--spacing-0-5) solid var(--color-info);outline-offset:var(--spacing-0-5) }
.connection-status { padding:var(--spacing-1) var(--spacing-3);font-weight:var(--font-medium);border-radius:var(--radius-full);transition:all .3s ease }
.connection-status:before { content:"";width:var(--spacing-2);height:var(--spacing-2);border-radius:50%;animation:pulse 2s ease-in-out infinite }
.connection-status.connected { color:var(--color-success-dark);background:var(--color-success-subtle) }
.connection-status.connected:before { background:var(--color-success) }
.connection-status.disconnected { color:var(--color-danger-dark);background:var(--color-danger-subtle) }
.connection-status.disconnected:before { background:var(--color-danger);animation:none }
.connection-status.failed { color:var(--color-neutral-600);background:var(--color-neutral-100) }
.connection-status.failed:before { background:var(--color-neutral-400);animation:none }
.connection-status.reconnecting { color:var(--color-warning-dark);background:var(--color-warning-subtle) }
.connection-status.reconnecting:before { background:var(--color-warning);animation:spin 1s linear infinite }
.alert-banner { position:fixed;top:var(--spacing-0);left:50%;z-index:var(--z-index-notification);width:calc(100% - var(--spacing-8));max-width:var(--spacing-160);padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-elevated);border-radius:0 0 var(--radius-lg) var(--radius-lg);box-shadow:var(--shadow-lg);transform:translateX(-50%);animation:slide-down .3s ease }
.alert-banner.success { border-bottom:var(--spacing-0-5) solid var(--color-success) }
.alert-banner.error { border-bottom:var(--spacing-0-5) solid var(--color-danger) }
.alert-banner.warning { border-bottom:var(--spacing-0-5) solid var(--color-warning) }
.alert-banner.info { border-bottom:var(--spacing-0-5) solid var(--color-info) }
.alert-banner .alert-message { display:flex;align-items:center;gap:var(--spacing-3) }
.alert-banner .alert-icon { flex-shrink:0;width:var(--spacing-5);height:var(--spacing-5) }
.alert-banner .alert-text { flex:1;font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.alert-banner .alert-dismiss { flex-shrink:0;padding:var(--spacing-1);background:transparent;border:none;opacity:70%;transition:opacity .2s ease;cursor:pointer }
.alert-banner .alert-dismiss:hover { opacity:100% }
.updating { position:relative }
.updating:after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--alpha-primary-10),transparent);animation:shimmer 1.5s ease-in-out infinite;pointer-events:none }
@media (max-width:768px) { .connection-status { padding:var(--spacing-0-5) var(--spacing-2);font-size:var(--text-xs) }
.alert-banner { width:100%;max-width:none;border-radius:0 }
 }
.api-loading { position:relative;min-height:var(--spacing-20) }
.api-loading:after { content:"";position:absolute;top:50%;left:50%;width:var(--spacing-8);height:var(--spacing-8);margin:calc(var(--spacing-4)*-1) 0 0 calc(var(--spacing-4)*-1);border:var(--spacing-0-5) solid var(--color-neutral-200);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite }
.api-status { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-medium);border-radius:var(--radius-full) }
.api-status:before { width:var(--spacing-2);height:var(--spacing-2);background:currentcolor;border-radius:50%;content:"" }
.api-status--pending { color:var(--color-neutral-600);background:var(--color-neutral-100) }
.api-status--loading { color:var(--color-info-dark);background:var(--color-info-subtle) }
.api-status--loading:before { animation:pulse 2s ease-in-out infinite }
.api-status--success { color:var(--color-success-dark);background:var(--color-success-subtle) }
.api-status--error { color:var(--color-danger-dark);background:var(--color-danger-subtle) }
.api-status--warning { color:var(--color-warning-dark);background:var(--color-warning-subtle) }
.api-progress { overflow:hidden;width:100%;height:var(--spacing-1);background:var(--color-neutral-200);border-radius:var(--radius-full) }
.api-progress__bar { position:relative;overflow:hidden;width:var(--progress,0);height:100%;background:var(--color-primary);transition:width .3s ease }
.api-progress__bar:after { position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--alpha-white-30),transparent);transform:translateX(-100%);animation:shimmer 2s infinite;content:"" }
.api-error { margin:var(--spacing-3) 0;padding:var(--spacing-3) var(--spacing-4);color:var(--color-danger-dark);background:var(--color-danger-subtle);border:var(--spacing-px) solid var(--color-danger);border-radius:var(--radius-base) }
.api-error__title { margin-bottom:var(--spacing-1);font-weight:var(--font-semibold) }
.api-error__message { font-size:var(--text-sm) }
.api-error__retry { margin-top:var(--spacing-2) }
.api-queue { padding:var(--spacing-3);font-size:var(--text-sm);background:var(--color-surface-secondary);border-radius:var(--radius-base) }
.api-queue__item { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) 0;border-bottom:var(--spacing-px) solid var(--color-neutral-200) }
.api-queue__item:last-child { border-bottom:none }
.api-queue__label { color:var(--color-text-secondary) }
.api-queue__status { display:flex;align-items:center;gap:var(--spacing-1) }
.api-skeleton { background:linear-gradient(90deg,var(--color-neutral-100) 25%,var(--color-neutral-200) 50%,var(--color-neutral-100) 75%);background-size:200% 100%;border-radius:var(--radius-base);animation:skeleton 1.5s ease-in-out infinite }
.api-skeleton--text { height:var(--spacing-4);margin:var(--spacing-2) 0 }
.api-skeleton--title { width:60%;height:var(--spacing-6);margin:var(--spacing-3) 0 }
.api-skeleton--card { height:var(--spacing-32);margin:var(--spacing-4) 0 }
@media (max-width:768px) { .api-status { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs) }
.api-error { padding:var(--spacing-2) var(--spacing-3) }
 }
.notification-toast { position:fixed;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-index-notification);max-width:var(--spacing-96);padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-elevated);border-radius:var(--radius-base);box-shadow:var(--shadow-xl);animation:slide-in .3s ease }
.notifications-container { z-index:var(--z-index-notification);width:calc(100vw - var(--spacing-8));max-width:var(--spacing-96);pointer-events:none }
.notifications-container>* { pointer-events:auto }
.notification { display:flex;overflow:hidden;align-items:flex-start;gap:var(--spacing-3);margin-bottom:var(--spacing-2);background:var(--color-surface-elevated);animation:slideIn .3s ease-out }
.notification:before { position:absolute;top:0;bottom:0;left:0;width:var(--spacing-1);background:currentcolor;content:"" }
.notification--success { color:var(--color-success) }
.notification--warning { color:var(--color-warning) }
.notification--error { color:var(--color-danger) }
.notification--info { color:var(--color-info) }
.notification__icon { display:grid;flex-shrink:0;width:var(--spacing-5);height:var(--spacing-5);color:inherit;place-items:center }
.notification__content { flex:1;min-width:0 }
.notification__title { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-weight:var(--font-semibold) }
.notification__message { color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.notification__actions { margin-top:var(--spacing-2) }
.notification__dismiss { display:grid;flex-shrink:0;width:var(--spacing-6);height:var(--spacing-6);background:transparent;border:none;border-radius:var(--radius-base);opacity:50%;transition:opacity .2s ease,background-color .2s ease;cursor:pointer;place-items:center }
.notification__dismiss:hover { background:var(--alpha-black-5);opacity:100% }
.notification__dismiss:active { background:var(--alpha-black-10) }
.notification__progress { position:absolute;right:0;bottom:0;left:0;overflow:hidden;height:var(--spacing-0-5);background:var(--alpha-black-10) }
.notification__progress-bar { width:var(--progress,100%);height:100%;background:currentcolor;opacity:60%;transition:width linear }
.system-notification { position:fixed;right:var(--spacing-4);bottom:var(--spacing-4);left:var(--spacing-4);z-index:var(--z-index-notification);padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-neutral-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);animation:slideUp .3s ease-out }
.system-notification--critical { color:var(--color-danger-dark);background:var(--color-danger-subtle);border-color:var(--color-danger) }
.system-notification--warning { color:var(--color-warning-dark);background:var(--color-warning-subtle);border-color:var(--color-warning) }
.inline-notification { margin:var(--spacing-3) 0;padding:var(--spacing-3) var(--spacing-4);border:var(--spacing-px) solid;border-radius:var(--radius-base) }
.inline-notification--success { color:var(--color-success-dark);background:var(--color-success-subtle);border-color:var(--color-success) }
.inline-notification--warning { color:var(--color-warning-dark);background:var(--color-warning-subtle);border-color:var(--color-warning) }
.inline-notification--error { color:var(--color-danger-dark);background:var(--color-danger-subtle);border-color:var(--color-danger) }
.inline-notification--info { color:var(--color-info-dark);background:var(--color-info-subtle);border-color:var(--color-info) }
.notification--floating { position:fixed;top:var(--spacing-5);right:var(--spacing-5);z-index:var(--z-index-notification);animation:notification-slide-in .3s ease }
.notification--hide { animation:notification-slide-out .3s ease forwards }
@media (max-width:768px) { .notifications-container { top:var(--spacing-2);right:var(--spacing-2);width:calc(100vw - var(--spacing-4));max-width:none }
.notification-toast { top:var(--spacing-2);right:var(--spacing-2);max-width:none }
.notification { padding:var(--spacing-2) var(--spacing-3) }
.system-notification { right:var(--spacing-2);bottom:var(--spacing-2);left:var(--spacing-2) }
 }
@media (prefers-color-scheme:dark) { .notification { background:var(--color-surface-secondary);box-shadow:var(--shadow-dark) }
.notification-toast { background:var(--color-surface-secondary) }
.system-notification { background:var(--color-surface-secondary);border-color:var(--color-neutral-700) }
 }
@media (max-width:640px) { .toast-container { top:var(--spacing-3);right:var(--spacing-3);left:var(--spacing-3);max-width:none }
.toast { padding:var(--spacing-3);border-radius:var(--radius-md) }
.toast__message { max-width:none;font-size:var(--text-xs) }
.toast__icon { font-size:var(--text-base) }
 }
@media (prefers-contrast:high) { .toast { border-width:2px }
.toast--error,.toast--info,.toast--success,.toast--warning { border-left-width:6px }
 }
@media (prefers-reduced-motion:reduce) { .toast { transform:none;transition:opacity var(--duration-fast) var(--ease-linear) }
.toast:hover,.toast[data-state=hidden],.toast[data-state=visible] { transform:none }
.toast--timed:after { animation:none }
 }
.toast-container { z-index:var(--z-tooltip);gap:var(--spacing-2);width:100%;max-width:420px }
.toast { min-height:56px;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);box-shadow:var(--shadow-lg);opacity:0;transform:translateX(100%);transition:all var(--duration-moderate) var(--ease-out);pointer-events:auto }
.toast[data-state=visible] { opacity:100%;transform:translateX(0) }
.toast[data-state=hidden] { opacity:0;transform:translateX(100%) }
.toast--error,.toast--info,.toast--success,.toast--warning { background:var(--color-surface-elevated) }
.toast__content { display:flex;align-items:flex-start;gap:var(--spacing-3);width:100%;min-height:24px }
.toast__icon { margin-top:var(--spacing-0-5);font-size:var(--text-lg);line-height:1 }
.toast__message { flex:1;max-width:300px;color:var(--color-text-primary);font-weight:var(--font-medium);line-height:var(--leading-normal);overflow-wrap:anywhere }
.toast__close { margin:-2px -2px 0 0;padding:var(--spacing-1);font-size:var(--text-sm);line-height:1;background:none;border-radius:var(--radius-base);transition:color var(--duration-fast) var(--ease-out) }
.toast__close:focus { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.toast:hover { box-shadow:var(--shadow-xl);transform:translateX(-2px) }
.toast[data-state=visible]:hover { transform:translateX(-2px) }
.toast--timed:after { content:"";position:absolute;bottom:var(--spacing-0);left:var(--spacing-0);height:2px;background:currentcolor;opacity:30%;animation:toast-progress var(--toast-duration,3s) linear forwards }
[data-theme=dark] .toast { background:var(--color-surface-elevated);border-color:var(--color-border-strong);box-shadow:var(--shadow-lg) }
[data-theme=dark] .toast__close:hover { background:var(--color-surface-hover) }
.toast-container .toast:not(:last-child) { margin-bottom:var(--spacing-2) }
.toast-container .toast:nth-child(2) { transform:translateX(100%) scale(.95) }
.toast-container .toast:nth-child(2)[data-state=visible] { transform:translateX(0) scale(.95) }
.toast-container .toast:nth-child(3) { transform:translateX(100%) scale(.9) }
.toast-container .toast:nth-child(3)[data-state=visible] { transform:translateX(0) scale(.9) }
.toast-container .toast:nth-child(n+4) { display:none }
@media (max-width:768px) { .rules-card__header { flex-direction:column;align-items:flex-start;gap:var(--spacing-3) }
.rules-card__actions { justify-content:flex-start;width:100% }
.condition-builder__row { gap:var(--spacing-1);grid-template-columns:1fr }
.rule-pattern { max-width:var(--col-width-medium) }
.suggestion-header { flex-direction:column;align-items:flex-start }
.suggestion-actions { justify-content:flex-start }
.suggestions-list { max-height:var(--col-width-extra-wide) }
.detail-item { flex-direction:column;align-items:flex-start }
.detail-item strong { min-width:auto;margin-bottom:var(--spacing-1) }
.rule-details-content { max-height:var(--col-width-extra-wide) }
 }
.rules-management-section { margin-top:var(--spacing-6) }
.rules-card { overflow:hidden;background:var(--bg-elevated);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm) }
.rules-card__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4);background:var(--bg-primary);border-bottom:var(--spacing-px) solid var(--border-color) }
.rules-card__title { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.rules-card__actions { display:flex;gap:var(--spacing-2) }
.rules-table { width:100%;border-collapse:separate;border-spacing:0 }
.rules-table__row { border-bottom:var(--spacing-px) solid var(--border-subtle);transition:background-color var(--transition-fast) }
.rules-table__row:hover { background-color:var(--bg-hover) }
.rules-table__row--selected { background-color:var(--accent-muted) }
.rules-table__row--pending { border-left:var(--spacing-1) solid var(--warning) }
.rules-table__row--active { border-left:var(--spacing-1) solid var(--success) }
.rules-table__row--disabled { border-left:var(--spacing-1) solid var(--neutral);opacity:60% }
.rule-pattern { display:inline-block;overflow:hidden;max-width:var(--col-width-extra-wide);padding:var(--spacing-1) var(--spacing-2);font-family:var(--font-mono);font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap;background:var(--bg-code);border-radius:var(--radius-sm) }
.rule-pattern--domain { color:var(--info);background:var(--info-muted) }
.rule-pattern--email { color:var(--success);background:var(--success-muted) }
.rule-pattern--composite { color:var(--warning);background:var(--warning-muted) }
.rule-success-rate { display:inline-flex;align-items:center;gap:var(--spacing-2);min-width:var(--spacing-30) }
.rule-success-rate__bar { position:relative;overflow:hidden;flex:1;height:var(--spacing-1-5);background:var(--bg-secondary);border-radius:var(--radius-full) }
.rule-success-rate__fill { position:absolute;top:var(--spacing-0);left:var(--spacing-0);height:100%;background:linear-gradient(90deg,var(--success),var(--success-dark));transition:width var(--transition-slow) }
.rule-success-rate__fill--low { background:linear-gradient(90deg,var(--danger),var(--danger-dark)) }
.rule-success-rate__fill--medium { background:linear-gradient(90deg,var(--warning),var(--warning-dark)) }
.rule-success-rate__text { min-width:var(--spacing-10);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);text-align:right }
.rule-status { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase;border-radius:var(--radius-full) }
.rule-status--active { color:var(--success);background:var(--success-muted) }
.rule-status--pending { color:var(--warning);background:var(--warning-muted) }
.rule-status--disabled { color:var(--neutral);background:var(--neutral-muted) }
.rule-status--rejected { color:var(--danger);background:var(--danger-muted) }
.rule-priority { display:inline-flex;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);font-size:var(--text-sm);font-weight:var(--font-bold);border-radius:var(--radius-sm) }
.rule-priority--high { color:var(--danger);background:var(--danger-muted) }
.rule-priority--medium { color:var(--warning);background:var(--warning-muted) }
.rule-priority--low { color:var(--info);background:var(--info-muted) }
.rule-checkbox { width:var(--spacing-5);height:var(--spacing-5);cursor:pointer;accent-color:var(--accent) }
.rule-checkbox:indeterminate { opacity:60% }
.condition-builder { padding:var(--spacing-3);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--radius-md) }
.condition-builder__group { margin-bottom:var(--spacing-3);padding-left:var(--spacing-4);border-left:var(--spacing-0-5) solid var(--border-color) }
.condition-builder__operator { display:inline-block;margin:var(--spacing-2) 0;padding:var(--spacing-1) var(--spacing-2);color:var(--accent);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--accent-muted);border-radius:var(--radius-sm) }
.condition-builder__row { display:grid;align-items:center;grid-gap:var(--spacing-2);gap:var(--spacing-2);grid-template-columns:var(--col-width-narrow) var(--spacing-30) 1fr auto;margin-bottom:var(--spacing-2) }
.test-results { overflow-y:auto;max-height:var(--card-min-width-lg);margin-top:var(--spacing-3);padding:var(--spacing-3);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--radius-md) }
.test-result { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2);padding:var(--spacing-2);border-radius:var(--radius-sm) }
.test-result--match { background:var(--success-muted);border:var(--spacing-px) solid var(--success) }
.test-result--no-match { background:var(--bg-primary);border:var(--spacing-px) solid var(--border-color) }
.test-result__email { font-family:var(--font-mono);font-size:var(--text-sm) }
.test-result__badge { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-sm) }
.performance-metric { display:flex;flex-direction:column;align-items:center;padding:var(--spacing-3);text-align:center;background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--radius-md) }
.performance-metric__value { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:1 }
.performance-metric__label { color:var(--color-text-secondary);font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.performance-metric--success { background:var(--success-muted);border-color:var(--success) }
.performance-metric--warning { background:var(--warning-muted);border-color:var(--warning) }
.rules-loading { display:flex;justify-content:center;align-items:center;padding:var(--spacing-8);color:var(--color-text-secondary) }
.rules-loading__spinner { margin-right:var(--spacing-2);animation:spin 1s linear infinite }
.rules-empty { padding:var(--spacing-8);color:var(--color-text-secondary);text-align:center }
.rules-empty__icon { margin-bottom:var(--spacing-3);font-size:var(--text-4xl);opacity:50% }
.rules-empty__text { margin-bottom:var(--spacing-2);font-size:var(--text-lg) }
.rules-empty__subtext { color:var(--color-text-tertiary);font-size:var(--text-sm) }
.suggestions-loading { display:flex;justify-content:center;align-items:center;padding:var(--spacing-8);color:var(--color-text-secondary) }
.suggestions-empty { padding:var(--spacing-8);color:var(--color-text-secondary);text-align:center }
.suggestions-list { overflow-y:auto;max-height:var(--card-min-width-lg);padding:var(--spacing-2) }
.suggestion-item { margin-bottom:var(--spacing-3);padding:var(--spacing-3);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--radius-md);transition:all var(--transition-fast) }
.suggestion-item:hover { border-color:var(--accent);box-shadow:var(--shadow-sm) }
.suggestion-header { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:var(--spacing-2);margin-bottom:var(--spacing-2) }
.suggestion-title { flex:1;min-width:0;margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.suggestion-body { margin-bottom:var(--spacing-3) }
.suggestion-description { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);line-height:1.5 }
.suggestion-pattern { margin-bottom:var(--spacing-2);font-size:var(--text-sm) }
.suggestion-pattern code { padding:var(--spacing-1) var(--spacing-2);color:var(--accent);font-family:var(--font-mono);background:var(--bg-code);border-radius:var(--radius-sm) }
.suggestion-classification { margin-bottom:var(--spacing-2);font-size:var(--text-sm) }
.classification-tag { padding:var(--spacing-1) var(--spacing-2);color:var(--accent);font-size:var(--text-xs);font-weight:var(--font-medium);background:var(--accent-muted);border-radius:var(--radius-sm) }
.suggestion-actions { display:flex;flex-wrap:wrap;gap:var(--spacing-2) }
.suggestion-actions .btn { padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-sm) }
.field-error { display:block;margin-top:var(--spacing-1);color:var(--danger);font-size:var(--text-sm) }
.form-input.error,.form-select.error { border-color:var(--danger);box-shadow:0 0 0 var(--spacing-0-75) var(--color-danger-alpha-10) }
.rule-info-section { margin-bottom:var(--spacing-4);padding:var(--spacing-3);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--radius-md) }
.rule-summary { font-size:var(--text-sm);line-height:1.5 }
.rule-test-form { margin-bottom:var(--spacing-4) }
.rule-test-form h3 { margin-bottom:var(--spacing-2);color:var(--color-text-primary) }
.help-text { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm) }
.test-results h3 { margin-bottom:var(--spacing-3);color:var(--color-text-primary) }
.results-content { font-size:var(--text-sm) }
.test-result.success { padding:var(--spacing-3);background:var(--success-muted);border:var(--spacing-px) solid var(--success);border-radius:var(--radius-sm) }
.test-result.warning { padding:var(--spacing-3);background:var(--warning-muted);border:var(--spacing-px) solid var(--warning);border-radius:var(--radius-sm) }
.test-result h4 { margin-bottom:var(--spacing-2);color:var(--color-text-primary) }
.result-summary { margin-bottom:var(--spacing-2) }
.matched-conditions ul { margin:var(--spacing-2) 0;padding-left:var(--spacing-4) }
.matched-conditions li { margin-bottom:var(--spacing-1) }
.rule-details-content { overflow-y:auto;max-height:var(--card-min-width-lg) }
.rule-details-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:1fr }
.detail-section { padding:var(--spacing-3);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--radius-md) }
.detail-section h3 { margin-bottom:var(--spacing-3);padding-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold);border-bottom:var(--spacing-px) solid var(--border-color) }
.detail-item { margin-bottom:var(--spacing-2);font-size:var(--text-sm) }
.detail-item:last-child { margin-bottom:var(--spacing-0) }
.detail-item strong { min-width:var(--spacing-30);color:var(--color-text-primary);font-weight:var(--font-medium) }
.status-badge { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-medium);text-transform:uppercase;border-radius:var(--radius-sm) }
.status-badge.active { color:var(--success);background:var(--success-muted) }
.status-badge.inactive { color:var(--neutral);background:var(--neutral-muted) }
.pattern-code { padding:var(--spacing-1) var(--spacing-2);color:var(--accent);font-family:var(--font-mono);font-size:var(--text-sm);background:var(--bg-code);border-radius:var(--radius-sm) }
.classification-badge { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-medium);text-transform:capitalize;border-radius:var(--radius-sm) }
.classification-badge.business { color:var(--info);background:var(--info-muted) }
.classification-badge.personal { color:var(--success);background:var(--success-muted) }
.classification-badge.spam { color:var(--danger);background:var(--danger-muted) }
.classification-badge.newsletter { color:var(--accent);background:var(--accent-muted) }
.conditions-list { font-size:var(--text-sm) }
.condition-item { margin-bottom:var(--spacing-2);padding:var(--spacing-2);background:var(--bg-tertiary);border-left:var(--spacing-1) solid var(--accent);border-radius:var(--radius-sm) }
.condition-item:last-child { margin-bottom:var(--spacing-0) }
.condition-item code { padding:var(--spacing-half) var(--spacing-1);font-family:var(--font-mono);background:var(--bg-code);border-radius:var(--radius-xs) }
.metrics-list { font-size:var(--text-sm) }
.metric-item { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2);padding:var(--spacing-1) 0;border-bottom:var(--spacing-px) solid var(--border-subtle) }
.metric-item:last-child { margin-bottom:var(--spacing-0);border-bottom:none }
@media (max-width:768px) { .bulk-approval__stats { grid-template-columns:1fr }
.bulk-approval__filters { flex-direction:column }
.bulk-approval__filter { width:100% }
.category-table { font-size:var(--text-xs) }
.category-table__cell { padding:var(--spacing-2) var(--spacing-1) }
 }
.badge-priority { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-sm);font-weight:var(--font-weight-medium);line-height:1;white-space:nowrap;border-radius:var(--radius-sm) }
.badge-priority--p0 { color:var(--color-text-on-dark);background-color:var(--color-danger) }
.badge-priority--p1 { color:var(--color-text-primary);background-color:var(--color-warning) }
.badge-priority--p2 { color:var(--color-text-on-dark);background-color:var(--color-info) }
.badge-priority--p3 { color:var(--color-text-primary);background-color:var(--glass-bg-medium) }
.badge-priority--p4 { color:var(--color-text-secondary);background-color:var(--glass-bg-medium) }
.badge-category { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-xs);font-weight:var(--font-weight-medium);background-color:var(--glass-bg-medium);border:1px solid var(--glass-border);border-radius:var(--radius-sm) }
.confidence-indicator { display:inline-flex;align-items:center;gap:var(--spacing-1);font-size:var(--text-sm) }
.confidence-indicator__percent { color:var(--color-text-secondary);font-size:var(--text-xs) }
.confidence-indicator__bar { overflow:hidden;width:var(--confidence-indicator-bar-width);height:var(--confidence-progress-bar-height);background-color:var(--glass-bg-medium);border-radius:var(--radius-sm) }
.confidence-indicator__fill { height:100%;transition:width .3s ease }
.confidence-indicator__fill--high { background-color:var(--color-success) }
.confidence-indicator__fill--medium { background-color:var(--color-warning) }
.confidence-indicator__fill--low { background-color:var(--color-danger) }
.category-table { width:100%;border-collapse:collapse;margin-top:var(--spacing-4) }
.category-table__header { background-color:var(--glass-bg-medium);border-bottom:2px solid var(--glass-border) }
.category-table__header th { padding:var(--spacing-3) var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);text-align:left }
.category-table__row { background-color:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border-bottom:1px solid var(--glass-border);transition:background-color var(--duration-fast) var(--ease-out) }
.category-table__row:hover { background-color:var(--glass-bg-medium) }
.category-table__cell { padding:var(--spacing-3) var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm) }
.category-table__cell--text { color:var(--color-text-primary) }
.category-table__actions { display:flex;gap:var(--spacing-2) }
.category-table__code { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs);background-color:var(--glass-bg-medium);border-radius:var(--radius-sm) }
.category-form { margin-bottom:var(--spacing-4);padding:var(--spacing-4);background-color:var(--glass-bg-dark);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:var(--radius-md) }
.category-form h2 { color:var(--color-text-primary) }
.category-form__group { margin-bottom:var(--spacing-3) }
.category-form__label { display:block;margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-medium) }
.category-form__label small,.form-help { color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-weight-normal) }
.category-form__input,.category-form__select,.category-form__textarea { width:100%;padding:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);background-color:var(--color-surface-primary);border:1px solid var(--glass-border);border-radius:var(--radius-sm);transition:border-color .2s ease }
.category-form__input:-webkit-autofill:hover,.category-form__input:-webkit-autofill,.category-form__select:-webkit-autofill:hover,.category-form__select:-webkit-autofill,.category-form__textarea:-webkit-autofill:hover,.category-form__textarea:-webkit-autofill { -webkit-text-fill-color:var(--color-text-primary);box-shadow:0 0 0 1000px var(--color-surface-primary) inset;transition:background-color 5000s ease-in-out 0s }
.category-form__input:-webkit-autofill:focus,.category-form__select:-webkit-autofill:focus,.category-form__textarea:-webkit-autofill:focus { -webkit-text-fill-color:var(--color-text-primary);box-shadow:0 0 0 1000px var(--color-surface-primary) inset,0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle);transition:background-color 5000s ease-in-out 0s }
.category-form__input:focus,.category-form__select:focus,.category-form__textarea:focus { border-color:var(--color-primary-500);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
.category-form__textarea { min-height:var(--spacing-20);resize:vertical }
.category-form__actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-4) }
.bulk-approval { padding:var(--spacing-4);color:var(--color-text-primary);background-color:var(--glass-bg-dark);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:var(--radius-md) }
.bulk-approval__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4);color:var(--color-text-primary) }
.bulk-approval__stats { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:var(--spacing-4) }
.bulk-approval__stat { padding:var(--spacing-3);background-color:var(--glass-bg-medium);border:1px solid var(--glass-border);border-radius:var(--radius-sm) }
.bulk-approval__stat-label { margin-bottom:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-xs);letter-spacing:.05em;text-transform:uppercase }
.bulk-approval__stat-value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-bold) }
.bulk-approval__filters { display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin-bottom:var(--spacing-4) }
.bulk-approval__filter { padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);background-color:var(--color-surface-primary);border:1px solid var(--glass-border);border-radius:var(--radius-sm);transition:all .2s ease;cursor:pointer }
.bulk-approval__filter:hover { background-color:var(--glass-bg-medium) }
.bulk-approval__filter--active { color:var(--color-text-on-dark);background-color:var(--color-primary-500);border-color:var(--color-primary-500) }
.bulk-approval__list { overflow-y:auto;max-height:var(--bulk-approval-list-max-height);border:1px solid var(--glass-border);border-radius:var(--radius-sm) }
.bulk-approval__item { display:flex;align-items:flex-start;gap:var(--spacing-3);padding:var(--spacing-3);color:var(--color-text-primary);border-bottom:1px solid var(--glass-border);transition:background-color .2s ease }
.bulk-approval__item:last-child { border-bottom:none }
.bulk-approval__item:hover { background-color:var(--glass-bg-medium) }
.bulk-approval__item--selected { background-color:var(--color-primary-50) }
.bulk-approval__checkbox { margin-top:var(--spacing-1) }
.bulk-approval__content { flex:1;min-width:0 }
.bulk-approval__email-subject { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-weight:var(--font-weight-medium) }
.bulk-approval__email-from { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.bulk-approval__classification { display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin-bottom:var(--spacing-2) }
.bulk-approval__reasoning { padding:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);background-color:var(--glass-bg-medium);border-left:var(--border-width-3) solid var(--color-brand-primary);border-radius:var(--radius-sm) }
.bulk-approval__stat-value--success { color:var(--color-success) }
.bulk-approval__stat-value--warning { color:var(--color-warning) }
.bulk-approval__stat-value--danger { color:var(--color-danger) }
.bulk-approval__stat-note { color:var(--color-text-secondary);font-size:var(--text-xs) }
.bulk-approval__controls { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3);padding:var(--spacing-3);color:var(--color-text-primary);background-color:var(--glass-bg-medium);border-radius:var(--radius-sm) }
.bulk-approval__select-label { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-secondary);cursor:pointer }
.bulk-approval__loading { padding:var(--spacing-6);color:var(--color-text-secondary);text-align:center }
.bulk-approval__skeleton { height:var(--col-width-date);margin-bottom:var(--spacing-3) }
.category-table__actions-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3) }
.category-table__search { max-width:var(--col-width-extra-wide) }
.category-table__loading { padding:var(--spacing-4);color:var(--color-text-secondary);text-align:center }
.category-table__skeleton { height:var(--nav-height);margin-bottom:var(--spacing-2) }
.u-visually-hidden { position:absolute;overflow:hidden;clip:rect(0,0,0,0);width:var(--spacing-px);height:var(--spacing-px);margin:calc(var(--spacing-px)*-1);padding:0;white-space:nowrap;border:0 }
.empty-state { padding:var(--spacing-8);color:var(--color-text-secondary) }
.empty-state__icon { margin-bottom:var(--spacing-3);font-size:var(--text-4xl) }
.empty-state__title { font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.empty-state__message { max-width:var(--col-width-extra-wide);margin:0 auto;color:var(--color-text-secondary);font-size:var(--text-sm) }
.error-state { padding:var(--spacing-8);color:var(--color-text-secondary);text-align:center }
.error-state__icon { margin-bottom:var(--spacing-3);color:var(--color-danger);font-size:var(--text-4xl) }
.error-state__title { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.error-state__message { max-width:var(--col-width-extra-wide);margin:0 auto;margin-bottom:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm) }
.badge-success { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);color:var(--color-success-text);font-size:var(--text-xs);font-weight:var(--font-weight-medium);background-color:var(--color-success-bg);border-radius:var(--radius-sm) }
.badge-danger { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);color:var(--color-danger-text);font-size:var(--text-xs);font-weight:var(--font-weight-medium);background-color:var(--color-danger-bg);border-radius:var(--radius-sm) }
.email-classification-badges { display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin-top:var(--spacing-2) }
.category-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3) }
.category-header h2 { color:var(--color-text-primary) }
.category-search { max-width:var(--col-width-extra-wide) }
.skeleton--row { height:var(--row-height-default);margin-bottom:var(--spacing-2) }
.skeleton { background:linear-gradient(90deg,var(--glass-bg-medium) 25%,var(--glass-bg-dark) 50%,var(--glass-bg-medium) 75%);border-radius:var(--radius-sm) }
@media (prefers-reduced-motion:reduce) { .skeleton { animation:none;background:var(--glass-bg-medium) }
.bulk-approval__filter,.bulk-approval__item,.category-table__row,.confidence-indicator__fill { transition:none }
 }
.batch-panel { position:fixed;right:var(--spacing-0);bottom:var(--spacing-0);left:var(--spacing-0);z-index:var(--z-fixed);background:var(--color-surface-elevated);border-top:var(--spacing-0-5) solid var(--color-brand-primary);box-shadow:var(--shadow-xl);transform:translateY(100%);transition:transform var(--duration-medium) ease-out }
.batch-panel--visible { transform:translateY(0) }
.batch-panel__inner { display:flex;gap:var(--spacing-3);padding:var(--spacing-4) }
.bulk-approval__badge--editable { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-in-out),border-color var(--duration-fast) var(--ease-in-out),box-shadow var(--duration-fast) var(--ease-in-out);cursor:pointer }
.bulk-approval__badge--editable:hover { background:var(--color-surface-hover);border-color:var(--color-brand-primary);box-shadow:var(--shadow-sm) }
.bulk-approval__badge--editable:focus { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.bulk-approval__badge-icon { width:var(--spacing-3);height:var(--spacing-3);opacity:var(--opacity-70);transition:opacity var(--duration-fast) var(--ease-in-out) }
.bulk-approval__badge--editable:hover .bulk-approval__badge-icon { opacity:var(--opacity-100) }
.quick-edit-panel { position:absolute;top:calc(100% + var(--spacing-2));left:var(--spacing-0);z-index:var(--z-index-dropdown);visibility:visible;min-width:var(--col-width-wide);padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);opacity:var(--opacity-100);transition:opacity var(--duration-fast) var(--ease-in-out),visibility var(--duration-fast) var(--ease-in-out) }
.quick-edit-panel[hidden] { visibility:hidden;opacity:var(--opacity-0);pointer-events:none }
[data-theme=dark] .quick-edit-panel { background:var(--color-surface-overlay);border-color:var(--color-border-default);box-shadow:var(--shadow-stronger) }
.quick-edit__section { display:flex;flex-direction:column;gap:var(--spacing-2) }
.quick-edit__section:not(:last-child) { margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-4);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.quick-edit__label { margin-bottom:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.quick-edit__category-select { width:100%;padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--input-bg);border:var(--border-width-1) solid var(--input-border);border-radius:var(--input-radius);transition:border-color var(--duration-fast) var(--ease-in-out),box-shadow var(--duration-fast) var(--ease-in-out);cursor:pointer }
.quick-edit__category-select:hover { border-color:var(--color-border-strong) }
.quick-edit__category-select:focus { border-color:var(--input-border-focus);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
[data-theme=dark] .quick-edit__category-select { background:var(--color-surface-primary);border-color:var(--color-border-default) }
.quick-edit__reason-chips { display:flex;flex-wrap:wrap;gap:var(--spacing-2) }
.reason-chip { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-alt);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-full);transition:background var(--duration-fast) var(--ease-in-out),border-color var(--duration-fast) var(--ease-in-out),color var(--duration-fast) var(--ease-in-out);cursor:pointer;-webkit-user-select:none;user-select:none }
.reason-chip:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.reason-chip:focus { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.reason-chip--selected { color:var(--color-white);background:var(--color-brand-primary);border-color:var(--color-brand-primary);box-shadow:var(--shadow-colored-purple) }
.reason-chip--selected:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark) }
[data-theme=dark] .reason-chip { background:var(--color-surface-primary);border-color:var(--color-border-subtle) }
[data-theme=dark] .reason-chip:hover { background:var(--color-surface-elevated) }
.quick-edit__add-reason { display:flex;flex-direction:column;gap:var(--spacing-2) }
.quick-edit__add-reason-input { width:100%;padding:var(--input-padding-y) var(--input-padding-x);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--input-bg);border:var(--border-width-1) solid var(--input-border);border-radius:var(--input-radius);transition:border-color var(--duration-fast) var(--ease-in-out),box-shadow var(--duration-fast) var(--ease-in-out) }
.quick-edit__add-reason-input::placeholder { color:var(--color-text-muted);opacity:var(--opacity-70) }
.quick-edit__add-reason-input:hover { border-color:var(--color-border-strong) }
.quick-edit__add-reason-input:focus { border-color:var(--input-border-focus);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
[data-theme=dark] .quick-edit__add-reason-input { background:var(--color-surface-primary);border-color:var(--color-border-default) }
.quick-edit__note-textarea { width:100%;min-height:var(--spacing-20);padding:var(--input-padding-y) var(--input-padding-x);color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-sm);background:var(--input-bg);border:var(--border-width-1) solid var(--input-border);border-radius:var(--input-radius);transition:border-color var(--duration-fast) var(--ease-in-out),box-shadow var(--duration-fast) var(--ease-in-out);resize:vertical }
.quick-edit__note-textarea::placeholder { color:var(--color-text-muted);opacity:var(--opacity-70) }
.quick-edit__note-textarea:hover { border-color:var(--color-border-strong) }
.quick-edit__note-textarea:focus { border-color:var(--input-border-focus);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
[data-theme=dark] .quick-edit__note-textarea { background:var(--color-surface-primary);border-color:var(--color-border-default) }
.quick-edit__actions { display:flex;justify-content:flex-end;gap:var(--spacing-2);margin-top:var(--spacing-4);padding-top:var(--spacing-4);border-top:var(--border-width-1) solid var(--color-border-subtle) }
.quick-edit__btn { padding:var(--button-padding-y) var(--button-padding-x);font-size:var(--button-font-size);font-weight:var(--button-font-weight);border:var(--border-width-1) solid transparent;border-radius:var(--button-radius);transition:background var(--duration-fast) var(--ease-in-out),border-color var(--duration-fast) var(--ease-in-out),box-shadow var(--duration-fast) var(--ease-in-out),transform var(--duration-fast) var(--ease-in-out),opacity var(--duration-fast) var(--ease-in-out);cursor:pointer }
.quick-edit__btn:focus { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.quick-edit__btn--cancel { color:var(--color-text-secondary);background:transparent;border-color:var(--color-border-default) }
.quick-edit__btn--cancel:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.quick-edit__btn--save { color:var(--color-white);background:var(--color-brand-primary);border-color:var(--color-brand-primary);box-shadow:var(--shadow-sm) }
.quick-edit__btn--save:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark);box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.quick-edit__btn--save:disabled { color:var(--color-text-muted);background:var(--color-surface-alt);border-color:var(--color-border-subtle);box-shadow:none;opacity:var(--opacity-50);transform:none;cursor:not-allowed }
[data-theme=dark] .quick-edit__btn--cancel { border-color:var(--color-border-subtle) }
[data-theme=dark] .quick-edit__btn--cancel:hover { background:var(--color-surface-elevated) }
.quick-edit__loader { display:inline-block;width:var(--spacing-4);height:var(--spacing-4);border:var(--border-width-2) solid var(--color-border-subtle);border-top-color:var(--color-brand-primary);border-radius:var(--radius-full);animation:quick-edit-spin var(--duration-slow) var(--ease-linear) infinite }
.bulk-approval__edit-container { position:relative;display:inline-block }
.bulk-approval__item--removing { opacity:0;transition:opacity var(--duration-medium) var(--ease-out) }
.quick-edit__sr-only { position:absolute;overflow:hidden;clip:rect(0,0,0,0);width:var(--spacing-px);height:var(--spacing-px);margin:calc(var(--spacing-px)*-1);padding:var(--spacing-0);white-space:nowrap;border-width:var(--border-width-0) }
@media (max-width:var(--breakpoint-sm )) { .quick-edit-panel { position:fixed;top:50%;left:50%;width:calc(100vw - var(--spacing-8));min-width:auto;max-width:var(--modal-max-width-sm);transform:translate(-50%,-50%) }
.quick-edit-panel[hidden] { transform:translate(-50%,-50%) scale(.95) }
.quick-edit__reason-chips { flex-direction:column }
.reason-chip { justify-content:center;width:100% }
 }
@media (prefers-reduced-motion:reduce) { .bulk-approval__badge--editable,.quick-edit-panel,.quick-edit__add-reason-input,.quick-edit__btn,.quick-edit__category-select,.quick-edit__note-textarea,.reason-chip { transition:none }
.quick-edit__loader { animation:none }
.bulk-approval__badge-icon { transition:none }
 }
.modal-backdrop,.modal { position:fixed;inset:var(--spacing-0);z-index:var(--z-modal-backdrop);display:none;visibility:hidden;justify-content:center;align-items:center;padding:var(--spacing-4);background:var(--overlay-dark);opacity:0;transition:opacity var(--duration-base) var(--ease-out),visibility var(--duration-base) var(--ease-out);backdrop-filter:blur(var(--spacing-1)) }
.modal-backdrop.active,.modal-backdrop.show,.modal.active,.modal.modal--active,.modal.show { display:flex;visibility:visible;opacity:100% }
.modal__backdrop { position:absolute;inset:var(--spacing-0);z-index:-1;background:var(--overlay-dark);backdrop-filter:blur(var(--spacing-1)) }
.modal .modal,.modal__content,.modal__dialog { position:relative;z-index:var(--z-modal);display:flex;overflow:hidden;flex-direction:column;width:90%;max-width:800px;max-height:90vh;background:var(--glass-bg-dark);border:var(--spacing-px) solid var(--glass-border);border-radius:var(--radius-2xl);backdrop-filter:var(--backdrop-blur-medium);box-shadow:var(--shadow-modal);opacity:0;transform:translateY(20px) scale(.95);transition:transform var(--duration-medium) var(--ease-bounce),opacity var(--duration-medium) var(--ease-out),box-shadow var(--duration-medium) var(--ease-out) }
.modal-backdrop.active .modal,.modal-backdrop.show .modal,.modal.active .modal__content,.modal.active .modal__dialog,.modal.modal--active .modal__content,.modal.modal--active .modal__dialog,.modal.show .modal__content,.modal.show .modal__dialog { opacity:100%;transform:scale(1) }
.modal-header,.modal__header { display:flex;flex-shrink:0;justify-content:space-between;align-items:center;padding:var(--spacing-6);border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.modal-title,.modal__title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.modal-body,.modal__body { overflow-y:auto;flex:1 1 auto;padding:var(--spacing-6) }
.modal-footer,.modal__footer { display:flex;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--spacing-3);padding:var(--spacing-6);background:var(--color-surface-overlay);border-top:var(--spacing-px) solid var(--color-border-subtle) }
.modal-close,.modal__close { position:relative;z-index:var(--z-popover);padding:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-2xl);line-height:1;background:transparent;border:none;transition:color var(--duration-fast) var(--ease-out);cursor:pointer }
.modal-close:hover,.modal__close:hover { color:var(--color-text-primary) }
.modal .form-group,.modal__form-group { margin-bottom:var(--spacing-6) }
.modal .form-label,.modal__label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.modal .form-input,.modal .form-textarea,.modal__input,.modal__textarea { width:100%;padding:var(--spacing-3);color:var(--color-text-primary);font-family:inherit;font-size:var(--text-base);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out) }
.modal .form-input::placeholder,.modal .form-textarea::placeholder,.modal__input::placeholder,.modal__textarea::placeholder { color:var(--color-text-muted) }
.modal .form-textarea,.modal__textarea { min-height:var(--col-width-medium);line-height:var(--leading-relaxed);resize:vertical }
.modal .form-input:focus,.modal .form-textarea:focus,.modal__input:focus,.modal__textarea:focus { border-color:var(--input-border-focus);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.sg-modal[data-visible=false] { display:none }
.sg-modal[data-visible=true] { position:fixed;inset:var(--spacing-0);z-index:var(--z-modal-backdrop);display:flex;justify-content:center;align-items:center;padding:var(--spacing-4);animation:modal-fade-in var(--duration-base) var(--ease-out) }
.sg-modal__backdrop { position:absolute;inset:var(--spacing-0);z-index:-1;background:var(--overlay-bg);backdrop-filter:blur(var(--spacing-0-5)) }
.sg-modal__dialog { position:relative;display:flex;overflow:hidden;flex-direction:column;width:100%;max-width:600px;max-height:90vh;background:var(--glass-bg-dark);border:var(--spacing-px) solid var(--glass-border);border-radius:var(--radius-2xl);backdrop-filter:var(--backdrop-blur-medium);box-shadow:var(--shadow-modal);animation:modal-spring-in var(--duration-medium) var(--ease-bounce) }
@media (max-width:768px) { .modal .modal,.modal__content,.modal__dialog { width:95%;max-height:95vh;margin:var(--spacing-4) }
.modal-body,.modal-footer,.modal-header,.modal__body,.modal__footer,.modal__header { padding:var(--spacing-4) }
.sg-modal[data-visible=true] { padding:var(--spacing-0) }
.sg-modal__dialog { max-width:100%;height:100%;max-height:100%;border-radius:0 }
 }
.modal:focus-within .modal__content,.modal:focus-within .modal__dialog { box-shadow:var(--shadow-2xl),0 0 0 var(--spacing-0-5) var(--color-brand-primary) }
body.modal-open { overflow:hidden }
.modal--draft { position:fixed;inset:var(--spacing-0);z-index:var(--z-modal-backdrop) }
.modal--draft.active,.modal--draft.show { display:flex }
@media (prefers-reduced-motion:reduce) { .modal-backdrop,.modal { transition:none }
.modal .modal,.modal__content,.modal__dialog { transition:none;transform:none }
.sg-modal[data-visible=true],.sg-modal__dialog { animation:none }
.modal.active .modal__content,.modal.active .modal__dialog,.modal.modal--active .modal__content,.modal.show .modal__content,.modal.show .modal__dialog { transform:none }
 }
@media (max-width:48rem) { .sg-modal__container--lg,.sg-modal__container--xl { width:95vw;max-width:95vw }
.sg-modal__content { padding:var(--spacing-3) }
.sg-modal__content td,.sg-modal__content th { padding:var(--spacing-2);font-size:var(--text-xs) }
 }
.sg-modal__container--lg { width:90vw;max-width:90vw;max-height:85vh }
.sg-modal__container--xl { width:95vw;max-width:95vw;max-height:90vh }
.sg-modal__content { overflow:hidden auto;max-height:calc(85vh - var(--modal-header-height) - var(--modal-footer-height));padding:var(--spacing-5) }
.sg-modal__content table { width:100%;table-layout:fixed }
.sg-modal__content .sg-table { width:100%;border-collapse:separate;border-spacing:0 }
.sg-modal__content th { position:sticky;top:0;z-index:var(--z-index-base);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold);text-align:left;white-space:nowrap;background:var(--color-surface-elevated);border-bottom:2px solid var(--color-border-strong) }
.sg-modal__content td { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);vertical-align:middle;border-bottom:1px solid var(--color-border-subtle) }
.sg-modal__content [data-column=date] { width:var(--col-width-date) }
.sg-modal__content [data-column=club] { width:var(--col-width-wide);word-break:anywhere;overflow-wrap:anywhere }
.sg-modal__content [data-column=from] { width:var(--col-width-medium);word-break:anywhere;overflow-wrap:anywhere }
.sg-modal__content [data-column=subject] { min-width:var(--col-width-extra-wide);word-break:anywhere;overflow-wrap:anywhere }
.sg-modal__content [data-column=authority] { width:var(--col-width-narrow) }
.sg-modal__content td { overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
.sg-modal__content td:hover { position:relative;z-index:var(--z-index-base);overflow:visible;white-space:normal;overflow-wrap:anywhere;background:var(--color-surface-hover) }
.sg-modal__table-wrapper { overflow-x:auto;width:100%;margin:var(--spacing-3) 0 }
.sg-modal__content tr:hover td { background:var(--color-surface-hover) }
.sg-modal__backdrop { backdrop-filter:blur(4px) }
.sg-modal--visible .sg-modal__container { animation:modal-slide-in var(--duration-medium) var(--ease-out);will-change:transform,opacity }
.sg-modal--visible .sg-modal__container:not(:hover) { animation-fill-mode:both }
@media (max-width:768px) { .modal-vercel { padding:var(--spacing-4) }
.modal-vercel__dialog { max-width:100%;max-height:95vh }
.modal-vercel__body,.modal-vercel__footer,.modal-vercel__header { padding:var(--spacing-4) }
.modal-vercel__footer { flex-direction:column }
.modal-vercel__btn,.modal-vercel__footer button { width:100% }
 }
@media (max-width:640px) { .modal-vercel { padding:var(--spacing-0) }
.modal-vercel__dialog { height:100vh;max-height:100vh;border-radius:var(--radius-none) }
 }
@media (prefers-reduced-motion:reduce) { .modal-vercel,.modal-vercel__dialog { transition:none;animation:none }
.modal-vercel__status-badge:before { animation:none }
 }
@media (prefers-contrast:high) { .modal-vercel__dialog,.modal-vercel__status-badge { border-width:var(--border-width-2) }
 }
.modal-vercel { position:fixed;inset:var(--spacing-0);z-index:var(--z-index-modal);display:none;visibility:hidden;justify-content:center;align-items:center;padding:var(--spacing-6);background:var(--alpha-black-50);opacity:var(--opacity-0);transition:opacity var(--duration-fast) var(--ease-out),visibility var(--duration-fast) var(--ease-out) }
.modal-vercel.active,.modal-vercel.show { display:flex;visibility:visible;opacity:var(--opacity-100) }
.modal-vercel__dialog { position:relative;display:flex;overflow:hidden;flex-direction:column;width:100%;max-width:var(--container-md);max-height:85vh;background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl),0 0 0 var(--border-width-1) var(--alpha-white-5);opacity:var(--opacity-0);transform:scale(.96);transition:transform var(--duration-medium) var(--ease-out),opacity var(--duration-medium) var(--ease-out) }
.modal-vercel.active .modal-vercel__dialog,.modal-vercel.show .modal-vercel__dialog { opacity:var(--opacity-100);transform:scale(1) }
.modal-vercel__header { position:relative;display:flex;flex-shrink:0;justify-content:space-between;align-items:center;gap:var(--spacing-4);padding:var(--spacing-5) var(--spacing-6);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.modal-vercel__title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold);line-height:var(--leading-tight) }
.modal-vercel__status-badge { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1) var(--spacing-3);color:var(--color-success);font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;background:var(--color-success-subtle);border:var(--border-width-1) solid var(--color-success-border);border-radius:var(--radius-base) }
.modal-vercel__status-badge:before { width:var(--size-status-dot);height:var(--size-status-dot);content:"";background:var(--color-success);border-radius:var(--radius-full);animation:pulse-vercel 2s cubic-bezier(.4,0,.6,1) infinite }
.modal-vercel__close-btn { position:absolute;top:var(--spacing-5);right:var(--spacing-6);display:flex;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);padding:var(--spacing-0);color:var(--color-text-muted);font-size:var(--text-xl);line-height:1;background:transparent;border:none;border-radius:var(--radius-md);transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);cursor:pointer }
.modal-vercel__close-btn:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.modal-vercel__close-btn:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.modal-vercel__body { overflow-y:auto;flex:1 1 auto;padding:var(--spacing-8) var(--spacing-6);color:var(--color-text-secondary);font-size:var(--text-base);line-height:var(--leading-relaxed) }
.modal-vercel__body code,.modal-vercel__code { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-primary);font-family:var(--font-mono);font-size:var(--text-sm);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-base) }
.modal-vercel__body pre { overflow-x:auto;padding:var(--spacing-4);font-family:var(--font-mono);font-size:var(--text-sm);line-height:var(--leading-normal);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.modal-vercel__data-row { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3) var(--spacing-0);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.modal-vercel__data-row:last-child { border-bottom:none }
.modal-vercel__data-label { color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.modal-vercel__data-value { color:var(--color-text-primary);font-family:var(--font-mono);font-size:var(--text-sm);font-weight:var(--font-medium) }
.modal-vercel__footer { display:flex;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--spacing-3);padding:var(--spacing-5) var(--spacing-6);border-top:var(--border-width-1) solid var(--color-border-subtle) }
.modal-vercel__btn,.modal-vercel__footer button { padding:var(--spacing-2-5) var(--spacing-5);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:transparent;border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);cursor:pointer }
.modal-vercel__btn:hover,.modal-vercel__footer button:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.modal-vercel__btn--primary,.modal-vercel__footer button.primary { color:var(--color-neutral-0);background:var(--color-neutral-900);border-color:var(--color-neutral-900) }
.modal-vercel__btn--primary:hover,.modal-vercel__footer button.primary:hover { background:var(--color-neutral-900);border-color:var(--color-neutral-900) }
.modal-vercel__btn:focus-visible,.modal-vercel__footer button:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.modal-vercel--small .modal-vercel__dialog { max-width:var(--modal-max-width-sm) }
.modal-vercel--medium .modal-vercel__dialog { max-width:var(--modal-max-width-md) }
.modal-vercel--large .modal-vercel__dialog { max-width:var(--container-lg) }
.modal-vercel--fullscreen .modal-vercel__dialog { width:100%;max-width:100%;height:100vh;max-height:100vh;border-radius:var(--radius-none) }
.modal-vercel__form-group { margin-bottom:var(--spacing-6) }
.modal-vercel__label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.modal-vercel__input,.modal-vercel__textarea { width:100%;padding:var(--spacing-2-5) var(--spacing-3);color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-sm);background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out) }
.modal-vercel__input::placeholder,.modal-vercel__textarea::placeholder { color:var(--color-text-muted) }
.modal-vercel__input:focus,.modal-vercel__textarea:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.modal-vercel__textarea { min-height:var(--spacing-32);line-height:var(--leading-relaxed);resize:vertical }
.modal-vercel:focus-within .modal-vercel__dialog { box-shadow:var(--shadow-xl),0 0 0 var(--border-width-1) var(--alpha-white-5),0 0 0 var(--spacing-1) var(--color-brand-primary-subtle) }
.modal-vercel-open { overflow:hidden }
@media (max-width:768px) { .modal-linear { padding:var(--spacing-4) }
.modal-linear__dialog { max-width:100%;max-height:95vh }
.modal-linear__body,.modal-linear__footer,.modal-linear__header,.modal-linear__tabs { padding:var(--spacing-5) }
.modal-linear__data-grid { grid-template-columns:1fr }
.modal-linear__footer { flex-direction:column-reverse }
.modal-linear__btn,.modal-linear__footer button { width:100% }
 }
@media (max-width:640px) { .modal-linear { padding:var(--spacing-0) }
.modal-linear__dialog { height:100vh;max-height:100vh;border-radius:var(--radius-none) }
.modal-linear__tabs { overflow-x:auto }
 }
@media (prefers-reduced-motion:reduce) { .modal-linear,.modal-linear__close-btn,.modal-linear__dialog,.modal-linear__progress-fill,.modal-linear__tab { transition:none;animation:none }
.modal-linear__progress-fill:after { animation:none }
 }
@media (forced-colors:active),(prefers-contrast:more) { .modal-linear__data-item,.modal-linear__dialog,.modal-linear__section { border-width:var(--border-width-2) }
 }
.modal-linear { position:fixed;inset:var(--spacing-0);z-index:var(--z-index-modal);display:none;visibility:hidden;justify-content:center;align-items:center;padding:var(--spacing-8);background:var(--overlay-darker);opacity:var(--opacity-0);transition:opacity var(--duration-medium) var(--ease-out),visibility var(--duration-medium) var(--ease-out);backdrop-filter:var(--backdrop-blur-medium) }
.modal-linear.active,.modal-linear.show { display:flex;visibility:visible;opacity:var(--opacity-100) }
.modal-linear__dialog { position:relative;display:flex;overflow:hidden;flex-direction:column;width:100%;max-width:var(--container-md);max-height:85vh;background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%);border:var(--border-width-1) solid var(--color-border-strong);border-radius:var(--radius-2xl);box-shadow:var(--shadow-2xl),var(--shadow-purple-25);opacity:var(--opacity-0);transform:scale(.92) translateY(var(--spacing-6));transition:transform var(--duration-moderate) cubic-bezier(.34,1.56,.64,1),opacity var(--duration-moderate) var(--ease-out) }
.modal-linear.active .modal-linear__dialog,.modal-linear.show .modal-linear__dialog { opacity:var(--opacity-100);transform:scale(1) translateY(var(--spacing-0)) }
.modal-linear__header { position:relative;display:flex;flex-shrink:0;align-items:center;gap:var(--spacing-4);padding:var(--spacing-6) var(--spacing-8);background:linear-gradient(135deg,var(--color-brand-primary-subtle) 0,transparent 100%);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.modal-linear__icon-badge { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);font-size:var(--text-xl);background:var(--gradient-primary-enhanced);border-radius:var(--radius-lg);box-shadow:var(--shadow-purple-35) }
.modal-linear__title { flex:1;margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold);line-height:var(--leading-tight) }
.modal-linear__close-btn { position:absolute;top:var(--spacing-6);right:var(--spacing-8);display:flex;justify-content:center;align-items:center;width:var(--spacing-9);height:var(--spacing-9);padding:var(--spacing-0);color:var(--color-text-muted);font-size:var(--text-xl);line-height:1;background:var(--color-surface-overlay);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.modal-linear__close-btn:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:scale(1.05) }
.modal-linear__close-btn:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.modal-linear__tabs { display:flex;gap:var(--spacing-2);padding:var(--spacing-4) var(--spacing-8);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.modal-linear__tab { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-medium);background:transparent;border:none;border-radius:var(--radius-md);transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);cursor:pointer }
.modal-linear__tab:hover { color:var(--color-text-secondary);background:var(--color-surface-hover) }
.modal-linear__tab.active { color:var(--color-text-primary);background:var(--color-surface-elevated);box-shadow:var(--shadow-sm) }
.modal-linear__tab:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.modal-linear__body { overflow-y:auto;flex:1 1 auto;padding:var(--spacing-8);color:var(--color-text-secondary);font-size:var(--text-base);line-height:var(--leading-relaxed) }
.modal-linear__section { margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:linear-gradient(135deg,var(--alpha-white-5) 0,transparent 100%);border:var(--border-width-1) solid var(--color-border-subtle);border-radius:var(--radius-xl) }
.modal-linear__section:last-child { margin-bottom:var(--spacing-0) }
.modal-linear__section-title { margin-top:var(--spacing-0);margin-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.modal-linear__progress-container { margin-top:var(--spacing-4);margin-bottom:var(--spacing-4) }
.modal-linear__progress-label { display:flex;justify-content:space-between;margin-bottom:var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.modal-linear__progress-bar { position:relative;overflow:hidden;width:100%;height:var(--spacing-2);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.modal-linear__progress-fill { position:relative;height:100%;background:var(--gradient-primary-enhanced);border-radius:var(--radius-full);box-shadow:var(--shadow-purple-25);transition:width var(--duration-moderate) cubic-bezier(.34,1.56,.64,1) }
.modal-linear__progress-fill:after { position:absolute;top:0;left:-100%;width:100%;height:100%;content:"";background:linear-gradient(90deg,transparent,var(--alpha-white-30),transparent);animation:shimmer-linear 2s infinite }
.modal-linear__data-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-top:var(--spacing-4) }
.modal-linear__data-item { padding:var(--spacing-4);background:var(--color-surface-overlay);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);transition:border-color var(--duration-fast) var(--ease-out) }
.modal-linear__data-item:hover { border-color:var(--color-brand-primary) }
.modal-linear__data-label { display:block;margin-bottom:var(--spacing-1);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.modal-linear__data-value { display:block;color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.modal-linear__footer { display:flex;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--spacing-3);padding:var(--spacing-6) var(--spacing-8);background:var(--color-surface-elevated);border-top:var(--border-width-1) solid var(--color-border-subtle) }
.modal-linear__btn,.modal-linear__footer button { padding:var(--spacing-2-5) var(--spacing-6);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--color-surface-overlay);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);transition:color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.modal-linear__btn:hover,.modal-linear__footer button:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.modal-linear__btn--primary,.modal-linear__footer button.primary { color:var(--color-white);background:var(--gradient-primary-enhanced);border-color:transparent;box-shadow:var(--shadow-purple-35) }
.modal-linear__btn--primary:hover,.modal-linear__footer button.primary:hover { box-shadow:var(--shadow-purple-60) }
.modal-linear__btn:focus-visible,.modal-linear__footer button:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.modal-linear--priority-high .modal-linear__icon-badge { background:var(--gradient-danger-enhanced);box-shadow:var(--metric-icon-shadow-danger) }
.modal-linear--priority-high .modal-linear__header { background:linear-gradient(135deg,var(--color-danger-subtle) 0,transparent 100%) }
.modal-linear--priority-high .modal-linear__progress-fill { background:var(--gradient-danger-enhanced) }
.modal-linear--priority-medium .modal-linear__icon-badge { background:var(--gradient-warning-enhanced);box-shadow:var(--metric-icon-shadow-warning) }
.modal-linear--priority-medium .modal-linear__header { background:linear-gradient(135deg,var(--color-warning-subtle) 0,transparent 100%) }
.modal-linear--priority-medium .modal-linear__progress-fill { background:var(--gradient-warning-enhanced) }
.modal-linear--priority-low .modal-linear__icon-badge { background:var(--gradient-success-enhanced);box-shadow:var(--metric-icon-shadow-success) }
.modal-linear--priority-low .modal-linear__header { background:linear-gradient(135deg,var(--color-success-subtle) 0,transparent 100%) }
.modal-linear--priority-low .modal-linear__progress-fill { background:var(--gradient-success-enhanced) }
.modal-linear__form-group { margin-bottom:var(--spacing-6) }
.modal-linear__label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.modal-linear__input,.modal-linear__textarea { width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-base);background:var(--color-surface-overlay);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out) }
.modal-linear__input::placeholder,.modal-linear__textarea::placeholder { color:var(--color-text-muted) }
.modal-linear__input:hover,.modal-linear__textarea:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.modal-linear__input:focus,.modal-linear__textarea:focus { background:var(--color-surface-primary);border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.modal-linear__textarea { min-height:var(--spacing-32);line-height:var(--leading-relaxed);resize:vertical }
.modal-linear:focus-within .modal-linear__dialog { box-shadow:var(--shadow-2xl),var(--shadow-purple-25),0 0 0 var(--spacing-1) var(--color-brand-primary) }
.modal-linear-open { overflow:hidden }
@media (max-width:1024px) { .modal-stripe__dialog { max-width:90% }
 }
@media (max-width:768px) { .modal-stripe { padding:var(--spacing-4) }
.modal-stripe__dialog { max-width:100%;max-height:95vh }
.modal-stripe__body,.modal-stripe__footer,.modal-stripe__header { padding:var(--spacing-5) }
.modal-stripe__footer { flex-direction:column;align-items:flex-start }
.modal-stripe__footer-actions { flex-direction:column-reverse;width:100% }
.modal-stripe__btn,.modal-stripe__footer button { width:100% }
.modal-stripe__data-row { flex-direction:column;align-items:flex-start;gap:var(--spacing-1) }
.modal-stripe__data-value { text-align:left }
.modal-stripe__table { font-size:var(--text-xs) }
 }
@media (max-width:640px) { .modal-stripe { padding:var(--spacing-0) }
.modal-stripe__dialog { height:100vh;max-height:100vh;border-radius:var(--radius-none) }
.modal-stripe__table-wrapper { overflow-x:auto }
 }
@media (prefers-reduced-motion:reduce) { .modal-stripe,.modal-stripe__close-btn,.modal-stripe__data-row,.modal-stripe__dialog { transition:none }
 }
@media (prefers-contrast:high) { .modal-stripe__badge,.modal-stripe__dialog,.modal-stripe__status { border-width:var(--border-width-2) }
.modal-stripe__header { border-bottom-width:var(--border-width-3) }
 }
.modal-stripe { position:fixed;inset:var(--spacing-0);z-index:var(--z-index-modal);display:none;visibility:hidden;justify-content:center;align-items:center;padding:var(--spacing-8);background:var(--overlay-scrim-80);opacity:var(--opacity-0);transition:opacity var(--duration-medium) var(--ease-out),visibility var(--duration-medium) var(--ease-out) }
.modal-stripe.active,.modal-stripe.show { display:flex;visibility:visible;opacity:var(--opacity-100) }
.modal-stripe__dialog { position:relative;display:flex;overflow:hidden;flex-direction:column;width:100%;max-width:var(--container-lg);max-height:90vh;background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);opacity:var(--opacity-0);transform:scale(.98) translateY(calc(var(--spacing-4)*-1));transition:transform var(--duration-medium) cubic-bezier(.16,1,.3,1),opacity var(--duration-medium) var(--ease-out) }
.modal-stripe.active .modal-stripe__dialog,.modal-stripe.show .modal-stripe__dialog { opacity:var(--opacity-100);transform:scale(1) translateY(var(--spacing-0)) }
.modal-stripe__header { display:flex;flex-shrink:0;flex-direction:column;gap:var(--spacing-2);padding:var(--spacing-8);background:var(--color-surface-elevated);border-bottom:var(--border-width-2) solid var(--color-border-default) }
.modal-stripe__status { display:inline-flex;align-items:center;align-self:flex-start;gap:var(--spacing-2);padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-success);font-size:var(--text-xs);font-weight:var(--font-bold);letter-spacing:var(--tracking-wider);text-transform:uppercase;background:var(--color-success-subtle);border:var(--border-width-1) solid var(--color-success-border);border-radius:var(--radius-base) }
.modal-stripe__status:before { width:var(--size-status-dot);height:var(--size-status-dot);content:"";background:var(--color-success);border-radius:var(--radius-full) }
.modal-stripe__title { margin:var(--spacing-2) var(--spacing-0) var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-semibold);line-height:var(--leading-tight) }
.modal-stripe__subtitle { margin:var(--spacing-0);color:var(--color-text-tertiary);font-size:var(--text-base);line-height:var(--leading-normal) }
.modal-stripe__close-btn { position:absolute;top:var(--spacing-8);right:var(--spacing-8);display:flex;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);padding:var(--spacing-0);color:var(--color-text-muted);font-size:var(--text-2xl);line-height:1;background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);cursor:pointer }
.modal-stripe__close-btn:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.modal-stripe__close-btn:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.modal-stripe__body { overflow-y:auto;flex:1 1 auto;padding:var(--spacing-8);color:var(--color-text-secondary);font-size:var(--text-base);line-height:var(--leading-relaxed) }
.modal-stripe__section { padding:var(--spacing-6) var(--spacing-0);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.modal-stripe__section:last-child { border-bottom:none }
.modal-stripe__section-title { margin-top:var(--spacing-0);margin-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.modal-stripe__data-row { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4) var(--spacing-0);border-bottom:var(--border-width-1) solid var(--color-border-subtle);transition:background-color var(--duration-fast) var(--ease-out) }
.modal-stripe__data-row:last-child { border-bottom:none }
.modal-stripe__data-row:hover { background:var(--color-surface-hover) }
.modal-stripe__data-label { color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.modal-stripe__data-value { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);text-align:right }
.modal-stripe__data-value--mono { font-family:var(--font-mono);font-size:var(--text-xs) }
.modal-stripe__data-value--large { font-size:var(--text-xl) }
.modal-stripe__table { width:100%;border-collapse:collapse;font-size:var(--text-sm) }
.modal-stripe__table thead { background:var(--color-surface-elevated);border-bottom:var(--border-width-2) solid var(--color-border-default) }
.modal-stripe__table th { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-align:left;text-transform:uppercase }
.modal-stripe__table td { padding:var(--spacing-4);color:var(--color-text-primary);border-bottom:var(--border-width-1) solid var(--color-border-subtle);transition:background-color var(--duration-fast) var(--ease-out) }
.modal-stripe__table tbody tr:hover { background:var(--color-surface-hover) }
.modal-stripe__table tbody tr:last-child td { border-bottom:none }
.modal-stripe__footer { display:flex;flex-shrink:0;justify-content:space-between;align-items:center;gap:var(--spacing-4);padding:var(--spacing-6) var(--spacing-8);background:var(--color-surface-elevated);border-top:var(--border-width-1) solid var(--color-border-default) }
.modal-stripe__footer-meta { color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--font-medium) }
.modal-stripe__footer-actions { display:flex;gap:var(--spacing-3) }
.modal-stripe__btn,.modal-stripe__footer button { padding:var(--spacing-2-5) var(--spacing-5);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);cursor:pointer }
.modal-stripe__btn:hover,.modal-stripe__footer button:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:var(--shadow-sm) }
.modal-stripe__btn--primary,.modal-stripe__footer button.primary { color:var(--color-text-on-dark);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.modal-stripe__btn--primary:hover,.modal-stripe__footer button.primary:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark);box-shadow:var(--shadow-purple-35) }
.modal-stripe__btn--destructive,.modal-stripe__footer button.destructive { color:var(--color-danger);border-color:var(--color-danger-border) }
.modal-stripe__btn--destructive:hover,.modal-stripe__footer button.destructive:hover { color:var(--color-text-on-dark);background:var(--color-danger);border-color:var(--color-danger) }
.modal-stripe__btn:focus-visible,.modal-stripe__footer button:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.modal-stripe--success .modal-stripe__status { color:var(--color-success);background:var(--color-success-subtle);border-color:var(--color-success-border) }
.modal-stripe--success .modal-stripe__status:before { background:var(--color-success) }
.modal-stripe--success .modal-stripe__header { border-bottom-color:var(--color-success-border) }
.modal-stripe--warning .modal-stripe__status { color:var(--color-warning);background:var(--color-warning-subtle);border-color:var(--color-warning-border) }
.modal-stripe--warning .modal-stripe__status:before { background:var(--color-warning) }
.modal-stripe--warning .modal-stripe__header { border-bottom-color:var(--color-warning-border) }
.modal-stripe--error .modal-stripe__status { color:var(--color-danger);background:var(--color-danger-subtle);border-color:var(--color-danger-border) }
.modal-stripe--error .modal-stripe__status:before { background:var(--color-danger) }
.modal-stripe--error .modal-stripe__header { border-bottom-color:var(--color-danger-border) }
.modal-stripe__badge { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2-5);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-base) }
.modal-stripe__badge--success { color:var(--color-success);background:var(--color-success-subtle);border-color:var(--color-success-border) }
.modal-stripe__badge--warning { color:var(--color-warning);background:var(--color-warning-subtle);border-color:var(--color-warning-border) }
.modal-stripe__badge--error { color:var(--color-danger);background:var(--color-danger-subtle);border-color:var(--color-danger-border) }
.modal-stripe__form-group { margin-bottom:var(--spacing-6) }
.modal-stripe__label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.modal-stripe__input,.modal-stripe__select,.modal-stripe__textarea { width:100%;padding:var(--spacing-3);color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-base);background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out) }
.modal-stripe__input::placeholder,.modal-stripe__textarea::placeholder { color:var(--color-text-muted) }
.modal-stripe__input:focus,.modal-stripe__select:focus,.modal-stripe__textarea:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle),var(--shadow-sm) }
.modal-stripe__textarea { min-height:var(--spacing-32);line-height:var(--leading-relaxed);resize:vertical }
.modal-stripe:focus-within .modal-stripe__dialog { box-shadow:var(--shadow-2xl),0 0 0 var(--spacing-1) var(--color-brand-primary) }
.modal-stripe-open { overflow:hidden }
.sg-classification-modal-backdrop { position:fixed;inset:0;z-index:var(--z-modal-backdrop);display:flex;justify-content:center;align-items:center;padding:var(--spacing-4);background:var(--overlay-darker);opacity:0;animation:backdropFadeIn var(--duration-medium) var(--ease-out) forwards;backdrop-filter:var(--backdrop-blur-heavy) }
.sg-classification-modal-backdrop[data-visible=false] { animation:backdropFadeOut var(--duration-fast) var(--ease-in) forwards }
.sg-classification-modal { position:relative;overflow:hidden;width:100%;max-width:var(--container-sm);max-height:90vh;background:var(--color-surface-elevated);border:1px solid var(--alpha-white-20);border-radius:var(--radius-xl);box-shadow:0 0 0 1px var(--color-brand-primary-subtle),0 8px 16px -4px var(--alpha-black-40),0 20px 40px -8px var(--alpha-black-60),0 40px 80px -16px var(--alpha-black-80),var(--shadow-purple-60);opacity:0;transform:scale(.95) translateY(20px);animation:modalSpringIn var(--duration-slow) var(--ease-bounce) forwards;animation-delay:50ms }
.sg-classification-modal[data-closing=true] { animation:modalSpringOut var(--duration-fast) var(--ease-in) forwards }
.sg-classification-modal__header { position:relative;padding:var(--spacing-6);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-surface-primary) 100%);border-top:var(--border-width-2) solid transparent;border-bottom:1px solid var(--alpha-white-10);border-image:var(--gradient-primary-enhanced);border-image-slice:1 }
.sg-classification-modal__title { margin:0;color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-weight-semibold);background:var(--text-gradient-brand);background-clip:text;-webkit-text-fill-color:transparent }
.sg-classification-modal__close { position:absolute;top:var(--spacing-6);right:var(--spacing-6);display:flex;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);color:var(--color-text-primary);font-size:24px;font-weight:300;line-height:1;background:var(--alpha-white-5);border:1px solid var(--alpha-white-10);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-classification-modal__close:hover { color:var(--color-text-primary);background:var(--alpha-white-10);border-color:var(--alpha-white-20);box-shadow:var(--shadow-sm);transform:translateY(-2px) }
.sg-classification-modal__close:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.sg-classification-modal__body { overflow:hidden auto;max-height:calc(90vh - 200px);padding:var(--spacing-6);scrollbar-width:thin;scrollbar-color:var(--alpha-white-20) transparent }
.sg-classification-modal__body::-webkit-scrollbar { width:var(--size-status-dot) }
.sg-classification-modal__body::-webkit-scrollbar-track { background:transparent }
.sg-classification-modal__body::-webkit-scrollbar-thumb { background:var(--alpha-white-20);border-radius:var(--radius-full) }
.sg-classification-modal__body::-webkit-scrollbar-thumb:hover { background:var(--alpha-white-30) }
.sg-form-group { margin-bottom:var(--spacing-5);opacity:0;transform:translateY(12px);animation:fieldSlideIn var(--duration-medium) var(--ease-out) forwards }
.sg-form-group:first-child { animation-delay:.1s }
.sg-form-group:nth-child(2) { animation-delay:.15s }
.sg-form-group:nth-child(3) { animation-delay:.2s }
.sg-form-group:nth-child(4) { animation-delay:.25s }
.sg-form-group:nth-child(5) { animation-delay:.3s }
.sg-form-group:nth-child(6) { animation-delay:.35s }
.sg-form-group:nth-child(7) { animation-delay:.4s }
.sg-form-label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-medium);transition:color var(--duration-fast) var(--ease-out) }
.sg-form-label--required:after { content:" *";color:var(--color-danger) }
.sg-form-input,.sg-form-select,.sg-form-textarea { width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-base);line-height:var(--line-height-normal);background:var(--alpha-white-5);border:1px solid var(--alpha-white-10);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.sg-form-input:focus,.sg-form-select:focus,.sg-form-textarea:focus { background:var(--alpha-white-8);border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 3px var(--color-brand-primary-subtle),var(--shadow-sm) }
.sg-form-input:hover:not(:focus):not(:disabled),.sg-form-select:hover:not(:focus):not(:disabled),.sg-form-textarea:hover:not(:focus):not(:disabled) { background:var(--alpha-white-8);border-color:var(--alpha-white-20) }
.sg-form-input:disabled,.sg-form-select:disabled,.sg-form-textarea:disabled { opacity:50%;cursor:not-allowed }
.sg-form-input:read-only { color:var(--color-text-tertiary);background:var(--alpha-white-3);cursor:default }
.sg-form-textarea { min-height:var(--spacing-24);font-family:inherit;resize:vertical }
.sg-form-select { padding-right:var(--spacing-10);color:var(--color-text-secondary);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='currentColor' d='M6 9 1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacing-3) center;background-size:12px;cursor:pointer;appearance:none }
.sg-classification-modal__footer { display:flex;justify-content:flex-end;gap:var(--spacing-3);padding:var(--spacing-6);background:var(--color-surface-elevated);border-top:1px solid var(--alpha-white-10) }
.sg-button--ghost { padding:var(--spacing-3) var(--spacing-6);color:var(--color-text-secondary);font-size:var(--text-base);font-weight:var(--font-weight-medium);background:transparent;border:1px solid var(--alpha-white-20);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-button--ghost:hover { color:var(--color-text-primary);background:var(--alpha-white-5);border-color:var(--alpha-white-30) }
.sg-button--ghost:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.sg-button--primary-gradient { position:relative;overflow:hidden;padding:var(--spacing-3) var(--spacing-8);color:var(--color-white);font-size:var(--text-base);font-weight:var(--font-weight-semibold);background:var(--gradient-primary-enhanced);border:1px solid transparent;border-radius:var(--radius-lg);box-shadow:var(--shadow-icon-primary);transition:all var(--duration-medium) var(--ease-out);cursor:pointer }
.sg-button--primary-gradient:before { content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0,var(--alpha-white-20) 50%,transparent 100%);transform:translateX(-100%);transition:transform var(--duration-slow) var(--ease-out) }
.sg-button--primary-gradient:hover { box-shadow:var(--shadow-purple-60);filter:brightness(1.1);transform:translateY(-2px) }
.sg-button--primary-gradient:hover:before { transform:translateX(100%) }
.sg-button--primary-gradient:active { transform:translateY(0) scale(.98) }
.sg-button--primary-gradient:focus-visible { outline:2px solid var(--color-brand-primary-light);outline-offset:2px }
.sg-button--primary-gradient:disabled { opacity:50%;transform:none;cursor:not-allowed }
.sg-button--primary-gradient:disabled:hover { box-shadow:var(--shadow-icon-primary);transform:none }
.sg-classification-modal--loading .sg-form-group { opacity:100%;animation:none }
.sg-classification-modal__skeleton { background:linear-gradient(90deg,var(--alpha-white-5) 0,var(--alpha-white-10) 50%,var(--alpha-white-5) 100%);background-size:200% 100%;border-radius:var(--radius-md);animation:skeleton-shimmer var(--duration-shimmer) var(--ease-linear) infinite }
.sg-form-group--error .sg-form-input,.sg-form-group--error .sg-form-select,.sg-form-group--error .sg-form-textarea { border-color:var(--color-danger) }
.sg-form-group--error .sg-form-input:focus,.sg-form-group--error .sg-form-select:focus,.sg-form-group--error .sg-form-textarea:focus { box-shadow:0 0 0 3px var(--color-danger-subtle),var(--shadow-sm) }
.sg-form-error { display:flex;align-items:center;gap:var(--spacing-2);margin-top:var(--spacing-2);color:var(--color-danger);font-size:var(--text-sm);animation:errorSlideIn var(--duration-fast) var(--ease-out) }
@media (max-width:640px) { .sg-classification-modal-backdrop { padding:var(--spacing-2) }
.sg-classification-modal { max-width:100%;max-height:95vh }
.sg-classification-modal__body,.sg-classification-modal__footer,.sg-classification-modal__header { padding:var(--spacing-4) }
.sg-classification-modal__title { padding-right:var(--spacing-10);font-size:var(--text-lg) }
.sg-classification-modal__footer { flex-direction:column }
.sg-button--ghost,.sg-button--primary-gradient { justify-content:center;width:100% }
 }
@media (prefers-reduced-motion:reduce) { .sg-button--primary-gradient:before,.sg-classification-modal-backdrop,.sg-classification-modal,.sg-form-group { transition:none;animation:none }
.sg-classification-modal-backdrop { opacity:100% }
.sg-classification-modal,.sg-form-group { opacity:100%;transform:none }
.sg-button--primary-gradient:hover,.sg-classification-modal__close:hover { transform:none }
 }
.classification-analytics-section { margin-top:var(--spacing-8);padding:var(--spacing-6);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-lg) }
.classification-analytics-section .section-header { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-6) }
.classification-analytics-section .section-title { display:flex;align-items:center;gap:var(--spacing-3);margin:0;color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.classification-analytics-section .section-title i { color:var(--color-brand-primary) }
.classification-analytics-section .section-meta { display:flex;align-items:center;gap:var(--spacing-4) }
.mode-badge { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out) }
.mode-badge[data-mode=shadow] { color:var(--color-info);background:var(--color-info-subtle);border-color:var(--color-info-border) }
.mode-badge[data-mode=suggest] { color:var(--color-warning);background:var(--color-warning-subtle);border-color:var(--color-warning-border) }
.mode-badge[data-mode=auto] { color:var(--color-success);background:var(--color-success-subtle);border-color:var(--color-success-border) }
.health-indicator { display:inline-flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.health-dot { width:var(--spacing-2);height:var(--spacing-2);background:var(--color-text-tertiary);border-radius:var(--radius-full);transition:background var(--duration-fast) var(--ease-out) }
.health-dot--healthy { background:var(--color-success);box-shadow:0 0 var(--spacing-2) var(--color-success) }
.health-dot--degraded { background:var(--color-warning);box-shadow:0 0 var(--spacing-2) var(--color-warning) }
.health-dot--unhealthy { background:var(--color-danger);box-shadow:0 0 var(--spacing-2) var(--color-danger);animation:pulse-danger 1.5s var(--ease-in-out) infinite }
.metrics-grid--headline { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(4,1fr);margin-bottom:var(--spacing-6) }
@media (max-width:1200px) { .metrics-grid--headline { grid-template-columns:repeat(2,1fr) }
 }
@media (max-width:640px) { .metrics-grid--headline { grid-template-columns:1fr }
 }
.metric-card-v2--classification { display:flex;align-items:flex-start;gap:var(--spacing-4);padding:var(--spacing-5);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.metric-card-v2--classification:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px) }
.metric-card-v2__icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);font-size:var(--text-xl);border-radius:var(--radius-xl) }
.metric-card-v2__icon--success { color:var(--color-success);background:var(--color-success-subtle) }
.metric-card-v2__icon--info { color:var(--color-info);background:var(--color-info-subtle) }
.metric-card-v2__icon--primary { color:var(--color-brand-primary);background:var(--color-brand-primary-subtle) }
.metric-card-v2__icon--warning { color:var(--color-warning);background:var(--color-warning-subtle) }
.metric-card-v2__content { flex:1;min-width:0 }
.metric-card-v2__label { margin-bottom:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.metric-card-v2__value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:1.2 }
.metric-card-v2__trend { display:flex;align-items:center;gap:var(--spacing-1);margin-top:var(--spacing-1);color:var(--color-success);font-size:var(--text-xs) }
.metric-card-v2__trend--down { color:var(--color-danger) }
.metric-card-v2__subtitle { margin-top:var(--spacing-1);color:var(--color-text-tertiary);font-size:var(--text-xs) }
.metric-card-v2__progress { margin-top:var(--spacing-2) }
.metric-card-v2__progress-bar { overflow:hidden;height:var(--spacing-1);background:var(--color-surface-hover);border-radius:var(--radius-full) }
.metric-card-v2__progress-fill { width:var(--progress-width,0);height:100%;background:var(--color-brand-primary);border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.calibration-grid { margin-bottom:var(--spacing-6) }
.calibration-grid__title { display:flex;align-items:center;gap:var(--spacing-2);margin:0 0 var(--spacing-4) 0;color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.calibration-grid__title i { color:var(--color-text-secondary) }
.calibration-grid__cards { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(3,1fr) }
@media (max-width:900px) { .calibration-grid__cards { grid-template-columns:1fr }
 }
.calibration-card { padding:var(--spacing-5);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.calibration-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-sm) }
.calibration-card__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4) }
.calibration-card__level { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.calibration-card__threshold { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-medium);background:var(--color-surface-hover);border-radius:var(--radius-md) }
.calibration-card__body { text-align:center }
.calibration-card__rate { color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold);line-height:1.2 }
.calibration-card__label { margin-bottom:var(--spacing-3);color:var(--color-text-tertiary);font-size:var(--text-xs) }
.calibration-card__gauge { overflow:hidden;height:var(--spacing-2);margin-bottom:var(--spacing-3);background:var(--color-surface-hover);border-radius:var(--radius-full) }
.calibration-card__gauge-fill { width:var(--progress-width,0);height:100%;border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.calibration-card--high .calibration-card__gauge-fill { background:var(--color-success) }
.calibration-card--moderate .calibration-card__gauge-fill { background:var(--color-warning) }
.calibration-card--low .calibration-card__gauge-fill { background:var(--color-danger) }
.calibration-card__stats { display:flex;justify-content:space-between;color:var(--color-text-secondary);font-size:var(--text-xs) }
.classification-charts-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(2,1fr);margin-bottom:var(--spacing-6) }
@media (max-width:900px) { .classification-charts-grid { grid-template-columns:1fr }
 }
.chart-section--classification { padding:var(--spacing-5);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg) }
.chart-section--classification .chart-section__header { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4) }
.chart-section--classification .chart-section__title { display:flex;align-items:center;gap:var(--spacing-2);margin:0;color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.chart-section--classification .chart-section__title i { color:var(--color-text-secondary) }
.chart-section--classification .chart-section__legend { display:flex;gap:var(--spacing-4) }
.chart-section--classification .legend-item { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs) }
.chart-section--classification .legend-color { width:var(--spacing-3);height:var(--spacing-3);border-radius:var(--radius-sm) }
.chart-section--classification .legend-item--accepted .legend-color { background:var(--color-success) }
.chart-section--classification .legend-item--rejected .legend-color { background:var(--color-danger) }
.chart-section--classification .chart-section__body { position:relative;height:var(--size-chart-sm) }
.chart-section--classification .chart-section__body canvas { width:100%;height:100% }
.classification-rules-table-wrapper { overflow:hidden;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg) }
.classification-rules-table__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4) var(--spacing-5);border-bottom:1px solid var(--color-border-default) }
.classification-rules-table__title { display:flex;align-items:center;gap:var(--spacing-2);margin:0;color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.classification-rules-table__title i { color:var(--color-text-secondary) }
.classification-rules-table__meta { color:var(--color-text-tertiary);font-size:var(--text-xs) }
.classification-rules-table__body { overflow-x:auto }
.classification-rules-table { width:100%;border-collapse:collapse }
.classification-rules-table thead { background:var(--color-surface-hover) }
.classification-rules-table th { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:.05em;text-align:left;text-transform:uppercase;white-space:nowrap }
.classification-rules-table th.th--sortable { transition:background var(--duration-fast) var(--ease-out);cursor:pointer;-webkit-user-select:none;user-select:none }
.classification-rules-table th.th--sortable:hover { background:var(--color-surface-primary) }
.classification-rules-table th.th--sortable:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:-2px }
.classification-rules-table th.th--sortable i { margin-left:var(--spacing-1);opacity:50%;transition:opacity var(--duration-fast) var(--ease-out) }
.classification-rules-table th.th--sortable:hover i,.classification-rules-table th.th--sorted i { opacity:100% }
.classification-rules-table td { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);border-bottom:1px solid var(--color-border-default) }
.classification-rules-table tbody tr { transition:background var(--duration-fast) var(--ease-out) }
.classification-rules-table tbody tr:hover { background:var(--color-surface-hover) }
.classification-rules-table tbody tr:last-child td { border-bottom:none }
.classification-rules-table__skeleton-row td { padding:var(--spacing-4) }
.status-badge { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-full) }
.status-badge--excellent { color:var(--color-success);background:var(--color-success-subtle) }
.status-badge--good { color:var(--color-info);background:var(--color-info-subtle) }
.status-badge--fair { color:var(--color-warning);background:var(--color-warning-subtle) }
.status-badge--poor { color:var(--color-danger);background:var(--color-danger-subtle) }
.classification-empty-state { display:flex;flex-direction:column;justify-content:center;align-items:center;padding:var(--spacing-12) var(--spacing-6);text-align:center }
.classification-empty-state[hidden] { display:none }
.classification-empty-state__icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-16);height:var(--spacing-16);margin-bottom:var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-3xl);background:var(--color-surface-hover);border-radius:var(--radius-full) }
.classification-empty-state__title { margin:0 0 var(--spacing-2) 0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.classification-empty-state__description { max-width:var(--size-dropdown-recent);margin:0 0 var(--spacing-6) 0;color:var(--color-text-secondary);font-size:var(--text-sm) }
.classification-empty-state__cta { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-5);color:var(--color-text-on-primary);font-size:var(--text-sm);font-weight:var(--font-medium);text-decoration:none;background:var(--color-brand-primary);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.classification-empty-state__cta:hover { background:var(--color-brand-primary-hover);box-shadow:var(--shadow-md);transform:translateY(-1px) }
.classification-empty-state__cta:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.classification-analytics-section .skeleton { display:inline-block;height:var(--text-base);background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);background-size:200% 100%;border-radius:var(--radius-md);animation:skeleton-shimmer 1.5s var(--ease-in-out) infinite }
.classification-analytics-section .skeleton--w-xs { width:var(--spacing-12) }
.classification-analytics-section .skeleton--w-sm { width:calc(var(--spacing-12)*1.2) }
.classification-analytics-section .skeleton--w-md { width:calc(var(--spacing-12)*1.4) }
.classification-analytics-section .skeleton--w-lg { width:calc(var(--spacing-12)*1.5) }
.classification-analytics-section .skeleton--w-xl { width:var(--size-shimmer-small) }
.classification-analytics-section .skeleton--w-2xl { width:calc(var(--size-shimmer-small)*1.25) }
.classification-analytics-section .skeleton--w-3xl { width:var(--size-shimmer-medium) }
.classification-analytics-section .skeleton--w-4xl { width:calc(var(--size-shimmer-medium)*1.17) }
.classification-analytics-section .gauge-fill--initial,.classification-analytics-section .progress-fill--initial { width:0 }
@media (prefers-reduced-motion:reduce) { .calibration-card,.classification-analytics-section .skeleton,.classification-empty-state__cta,.health-dot--unhealthy,.metric-card-v2--classification { transition:none;animation:none }
.classification-empty-state__cta:hover,.metric-card-v2--classification:hover { transform:none }
 }
.classification-error-banner { margin-bottom:var(--spacing-4);padding:var(--spacing-4);background:var(--color-danger-subtle);border:1px solid var(--color-danger-border);border-radius:var(--radius-lg) }
.classification-error-banner[hidden] { display:none }
.classification-error-banner__content { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3) }
.classification-error-banner__icon { flex-shrink:0;color:var(--color-danger);font-size:var(--text-lg) }
.classification-error-banner__text { flex:1;min-width:0 }
.classification-error-banner__text strong { display:block;margin-bottom:var(--spacing-1);color:var(--color-danger);font-weight:var(--font-semibold) }
.classification-error-banner__text span { display:block;color:var(--color-text-secondary);font-size:var(--text-sm) }
.classification-error-banner__retry { display:inline-flex;flex-shrink:0;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.classification-error-banner__retry:hover { background:var(--color-surface-elevated);border-color:var(--color-border-strong) }
.classification-error-banner__retry:focus { outline:2px solid var(--color-focus);outline-offset:2px }
.classification__status-badge { display:flex;align-items:center;gap:var(--spacing-2) }
.classification__metrics-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(4,1fr);margin-bottom:var(--spacing-6) }
.classification__metric-item { padding:var(--spacing-3);text-align:center;background:var(--color-surface-secondary,hsla(0,0%,100%,.05));border-radius:var(--radius-md,8px) }
.classification__details { margin-bottom:var(--spacing-4);padding:var(--spacing-4);background:var(--color-surface-secondary,hsla(0,0%,100%,.05));border-radius:var(--radius-md,8px) }
.classification__detail-row { display:flex;justify-content:space-between;padding:var(--spacing-2) 0;border-bottom:1px solid var(--color-border,hsla(0,0%,100%,.1)) }
.classification__detail-row:last-child { border-bottom:none }
.classification__detail-label { color:var(--color-text-secondary,#888) }
.classification__detail-value { font-weight:600 }
@media (max-width:768px) { .classification__metrics-grid { grid-template-columns:repeat(2,1fr) }
 }
.context-enrichment-modal__overlay { position:fixed;inset:0;z-index:var(--z-modal);display:flex;justify-content:center;align-items:center;padding:var(--spacing-5);background-color:var(--alpha-black-60) }
.context-enrichment-modal { display:flex;flex-direction:column;width:100%;max-width:var(--modal-max-width-md);max-height:90vh;color:var(--color-text-primary);background:var(--color-surface-base);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl) }
.context-enrichment-modal__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-6) var(--spacing-7);border-bottom:var(--border-width-1) solid var(--color-border-default) }
.context-enrichment-modal__header h2 { margin:0;color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.context-enrichment-modal__close { display:flex;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);padding:0;color:var(--color-text-muted);font-size:var(--text-2xl);background:none;border:none;border-radius:var(--radius-md);transition:all var(--duration-fast);cursor:pointer }
.context-enrichment-modal__close:hover { color:var(--color-text-primary);background-color:var(--color-surface-hover) }
.context-enrichment-modal__body { overflow-y:auto;flex:1;padding:var(--spacing-6) var(--spacing-7) }
.context-enrichment-modal__quality-score-section { margin-bottom:var(--spacing-6);padding:var(--spacing-5);color:var(--color-text-on-dark);background:var(--gradient-primary-enhanced);border-radius:var(--radius-xl) }
.quality-score-section__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3) }
.quality-score-section__header strong { font-size:var(--text-2xl) }
.quality-score-section__needed { padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-medium);background:var(--overlay-light-20);border-radius:var(--radius-full) }
.quality-score-section__progress { overflow:hidden;height:var(--spacing-2-5);background:var(--overlay-light-20);border-radius:var(--radius-lg) }
.quality-score-section__bar { width:var(--progress-width,0);height:100%;background:var(--color-white);border-radius:var(--radius-lg);transition:width var(--duration-medium) ease }
.quality-score-section__potential { margin-top:var(--spacing-3);padding-top:var(--spacing-3);border-top:var(--border-width-1) solid var(--overlay-light-30) }
.quality-score-section__potential strong { color:var(--color-confidence-high);font-size:var(--text-xl) }
.context-enrichment-modal__email-preview-section { margin-bottom:var(--spacing-6) }
.context-enrichment-modal__email-preview-section h3 { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.email-preview-section__preview { padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg) }
.email-preview-section__row { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-normal) }
.email-preview-section__row:last-child { margin-bottom:0 }
.email-preview-section__row strong { display:inline-block;min-width:var(--spacing-16);margin-right:var(--spacing-2);color:var(--color-text-muted) }
.context-enrichment-modal__enrichment-section { margin-bottom:var(--spacing-7);padding-bottom:var(--spacing-7);border-bottom:var(--border-width-1) solid var(--color-border-default) }
.context-enrichment-modal__enrichment-section:last-of-type { border-bottom:none }
.context-enrichment-modal__enrichment-section h3 { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.enrichment-section__description { margin-bottom:var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-sm) }
.enrichment-section__category-options,.enrichment-section__classification-options { display:grid;grid-gap:var(--spacing-2-5);gap:var(--spacing-2-5) }
.enrichment-section__option { display:flex;align-items:center;padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-base);border:var(--border-width-2) solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast);cursor:pointer }
.enrichment-section__option:hover { background:var(--color-surface-elevated);border-color:var(--color-brand-primary) }
.enrichment-section__option input[type=radio] { margin-right:var(--spacing-3);cursor:pointer }
.enrichment-section__option input[type=radio]:checked+.enrichment-section__option-label { color:var(--color-brand-primary);font-weight:var(--font-semibold) }
.enrichment-section__option-label { flex:1;color:var(--color-text-secondary);font-size:var(--text-sm) }
.enrichment-section__option-points { padding:var(--spacing-0-5) var(--spacing-2);color:var(--color-confidence-high);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-success-bg);border-radius:var(--radius-xl) }
.enrichment-section__option:has(input:checked) { background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary) }
.enrichment-section__other-input { flex:1;margin-left:var(--spacing-3);padding:var(--spacing-1-5) var(--spacing-2-5);font-size:var(--text-sm);border:var(--border-width-1) solid var(--color-border-strong);border-radius:var(--radius-md) }
.enrichment-section__other-input:disabled { color:var(--color-text-muted);background:var(--color-surface-hover) }
.context-enrichment-modal__existing-classification { margin-top:var(--spacing-3);padding:var(--spacing-5);background:var(--color-success-bg);border:var(--border-width-2) solid var(--color-confidence-high);border-radius:var(--radius-xl) }
.context-enrichment-modal__classification-badge { display:inline-flex;align-items:center;gap:var(--spacing-1-5);margin-bottom:var(--spacing-3);padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-on-dark);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-confidence-high);border-radius:var(--radius-full) }
.context-enrichment-modal__classification-details { margin-bottom:var(--spacing-2);color:var(--color-success-text);font-size:var(--text-base) }
.context-enrichment-modal__classification-details strong { margin-right:var(--spacing-1-5);color:var(--color-confidence-high-dark) }
.context-enrichment-modal__classification-source { margin-left:var(--spacing-1-5);color:var(--color-confidence-high-dark);font-size:var(--text-xs);font-style:italic }
.context-enrichment-modal__classification-note { margin:var(--spacing-2) 0 0 0;color:var(--color-confidence-high-dark);font-size:var(--text-xs);font-style:italic }
.context-enrichment-modal__signature-suggestion { margin-bottom:var(--spacing-4);padding:var(--spacing-4);background:var(--color-warning-bg);border:var(--border-width-2) solid var(--color-confidence-medium);border-radius:var(--radius-xl) }
.context-enrichment-modal__suggestion-badge { display:inline-flex;align-items:center;gap:var(--spacing-1-5);margin-bottom:var(--spacing-3);padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-on-dark);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-confidence-medium);border-radius:var(--radius-full) }
.context-enrichment-modal__suggestion-details { margin-bottom:var(--spacing-3);color:var(--color-text-on-light);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.context-enrichment-modal__suggestion-details strong { color:var(--color-confidence-medium-dark) }
.context-enrichment-modal__suggestion-details small { color:var(--color-text-muted) }
.context-enrichment-modal__accept-suggestion { padding:var(--spacing-2) var(--spacing-3);color:var(--color-confidence-medium-dark);font-size:var(--text-xs);background:var(--color-surface-base);border:var(--border-width-1) solid var(--color-confidence-medium);transition:all var(--duration-fast) }
.context-enrichment-modal__accept-suggestion:hover { color:var(--color-text-on-dark);background:var(--color-confidence-medium) }
.enrichment-section__notes-textarea { width:100%;padding:var(--spacing-3);font-family:inherit;font-size:var(--text-sm);border:var(--border-width-2) solid var(--color-border-default);border-radius:var(--radius-lg);transition:border-color var(--duration-fast);resize:vertical }
.enrichment-section__notes-textarea:focus { border-color:var(--color-brand-primary);outline:none }
.enrichment-section__suggestions { margin-top:var(--spacing-2) }
.enrichment-section__suggestions small { color:var(--color-text-muted);font-size:var(--text-xs) }
.impact-summary { display:flex;align-items:center;gap:var(--spacing-4);margin-top:var(--spacing-5);padding:var(--spacing-4);background:var(--color-success-bg);border:var(--border-width-2) solid var(--color-confidence-high);border-radius:var(--radius-xl) }
.impact-summary__icon { font-size:var(--text-3xl) }
.impact-summary__text { flex:1;color:var(--color-success-text);font-size:var(--text-sm) }
.impact-summary__text strong { color:var(--color-confidence-high-dark) }
.impact-summary__status { display:inline-block;margin-left:var(--spacing-2);font-weight:var(--font-semibold) }
.impact-summary__status--success { color:var(--color-confidence-high) }
.impact-summary__status--warning { color:var(--color-confidence-medium) }
.context-enrichment-modal__footer { display:flex;justify-content:flex-end;gap:var(--spacing-3);padding:var(--spacing-5) var(--spacing-7);border-top:var(--border-width-1) solid var(--color-border-default) }
@media (max-width:var(--breakpoint-sm )) { .context-enrichment-modal__overlay { padding:var(--spacing-3) }
.context-enrichment-modal { max-height:95vh }
.context-enrichment-modal__body,.context-enrichment-modal__footer,.context-enrichment-modal__header { padding:var(--spacing-4) var(--spacing-5) }
.quality-score-section__header { flex-direction:column;align-items:flex-start;gap:var(--spacing-2) }
.enrichment-section__option { padding:var(--spacing-2-5) var(--spacing-3) }
 }
.context-inspector-backdrop { position:fixed;inset:0;z-index:var(--z-index-modal);background:var(--overlay-darker);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:var(--spacing-4);animation:backdropFadeIn .3s cubic-bezier(.68,-.55,.265,1.55);transition:opacity .2s ease-out }
.context-inspector { position:relative;display:flex;flex-direction:column;width:100%;max-width:var(--modal-width-context-inspector);max-height:90vh;background:var(--color-surface-elevated-translucent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-inspector-modal);animation:modalSlideIn .4s cubic-bezier(.68,-.55,.265,1.55);will-change:transform,opacity;transform:translateZ(0) }
.context-inspector__header { padding:var(--spacing-6);border-bottom:1px solid var(--color-border-subtle);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%) }
.context-inspector__header-top { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-4) }
.context-inspector__title { font-size:var(--text-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0;background:linear-gradient(135deg,var(--color-text-primary) 0,var(--color-brand-primary-light) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text }
.context-inspector__close { padding:var(--spacing-2);background:transparent;border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:var(--text-2xl);line-height:1;cursor:pointer;transition:all .2s ease-out }
.context-inspector__close:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong);color:var(--color-text-primary);transform:scale(1.1) }
.context-inspector__close:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.context-inspector__metadata { display:flex;flex-wrap:wrap;gap:var(--spacing-4);margin-bottom:var(--spacing-4);font-size:var(--text-sm);color:var(--color-text-tertiary) }
.context-inspector__metadata-item code { font-family:monospace;font-size:var(--text-xs);padding:var(--spacing-1) var(--spacing-2);background:var(--color-surface-overlay);border-radius:var(--radius-sm);color:var(--color-brand-primary-light) }
.context-inspector__confidence { display:flex;justify-content:center }
.context-confidence-badge { display:inline-flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-6);border-radius:var(--radius-full);border:1px solid transparent;box-shadow:var(--shadow-inspector-badge);transition:all .3s ease-out }
.context-confidence-badge__icon { width:var(--size-icon-badge);height:var(--size-icon-badge);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);font-size:var(--text-lg);font-weight:var(--font-weight-bold);box-shadow:var(--shadow-inspector-badge-glow) }
.context-confidence-badge__icon [class*=fa-],.context-confidence-badge__icon i { display:flex;align-items:center;justify-content:center;margin:0;width:100%;height:100% }
.context-confidence-badge__icon [class*=fa-]:before { margin-right:0 }
.context-confidence-badge__value { font-size:var(--text-3xl);font-weight:var(--font-weight-bold);line-height:1 }
.context-confidence-badge__label { font-size:var(--text-sm);font-weight:var(--font-weight-medium);text-transform:uppercase;letter-spacing:.05em }
.context-confidence-badge--excellent { background:linear-gradient(135deg,var(--color-success-15) 0,var(--color-success-very-subtle) 100%);border-color:var(--color-success-border) }
.context-confidence-badge--excellent .context-confidence-badge__icon { background:linear-gradient(135deg,var(--color-success-light) 0,var(--color-success) 100%);color:var(--color-text-on-dark) }
.context-confidence-badge--excellent .context-confidence-badge__value { background:linear-gradient(135deg,var(--color-success-high-contrast) 0,var(--color-success) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text }
.context-confidence-badge--good { background:linear-gradient(135deg,var(--color-info-subtle) 0,var(--color-info-very-subtle) 100%);border-color:var(--color-info-border) }
.context-confidence-badge--good .context-confidence-badge__icon { background:linear-gradient(135deg,var(--color-info-light) 0,var(--color-info) 100%);color:var(--color-text-on-dark) }
.context-confidence-badge--good .context-confidence-badge__value { background:linear-gradient(135deg,var(--color-info-high-contrast) 0,var(--color-info) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text }
.context-confidence-badge--fair { background:linear-gradient(135deg,var(--color-warning-subtle) 0,var(--color-warning-very-subtle) 100%);border-color:var(--color-warning-border-fair) }
.context-confidence-badge--fair .context-confidence-badge__icon { background:linear-gradient(135deg,var(--color-warning-light) 0,var(--color-warning) 100%);color:var(--color-text-primary) }
.context-confidence-badge--fair .context-confidence-badge__value { background:linear-gradient(135deg,var(--color-warning-high-contrast) 0,var(--color-warning) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text }
.context-confidence-badge--poor { background:linear-gradient(135deg,var(--color-error-15) 0,var(--color-danger-very-subtle) 100%);border-color:var(--color-danger-border-poor) }
.context-confidence-badge--poor .context-confidence-badge__icon { background:linear-gradient(135deg,var(--color-danger-light) 0,var(--color-danger) 100%);color:var(--color-text-on-dark) }
.context-confidence-badge--poor .context-confidence-badge__value { color:var(--color-white) }
.context-inspector__body { flex:1;overflow-y:auto;padding:var(--spacing-6);scrollbar-width:thin;scrollbar-color:var(--color-border-default) transparent }
.context-inspector__body::-webkit-scrollbar { width:var(--size-scrollbar) }
.context-inspector__body::-webkit-scrollbar-track { background:transparent }
.context-inspector__body::-webkit-scrollbar-thumb { background:var(--color-border-default);border-radius:var(--radius-full) }
.context-inspector__body::-webkit-scrollbar-thumb:hover { background:var(--color-border-strong) }
.context-warnings { margin-bottom:var(--spacing-6);background:var(--color-warning-subtle);border:1px solid var(--color-warning-subtle);border-radius:var(--radius-lg) }
.context-warnings__header { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-3) }
.context-warnings__title { font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 }
.context-warnings__toggle { padding:var(--spacing-1);background:transparent;border:none;color:var(--color-text-secondary);cursor:pointer;transition:transform .2s ease-out }
.context-warnings__toggle:hover { color:var(--color-text-primary);transform:scale(1.1) }
.context-warnings__content { display:flex;flex-direction:column;gap:var(--spacing-3) }
.context-warning { display:flex;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-elevated);border-left:var(--border-width-4) solid transparent;border-radius:var(--radius-md);animation:slideInUp .3s ease-out backwards }
.context-warning__icon { font-size:var(--text-xl);flex-shrink:0 }
.context-warning__content { flex:1 }
.context-warning__source { font-size:var(--text-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--spacing-1) }
.context-warning__message { font-size:var(--text-sm);color:var(--color-text-primary);margin-bottom:var(--spacing-2) }
.context-warning__suggestion { font-size:var(--text-sm);color:var(--color-text-secondary);font-style:italic }
.context-warning__dismiss { padding:var(--spacing-1);background:transparent;border:none;color:var(--color-text-tertiary);cursor:pointer;font-size:var(--text-lg);line-height:1;transition:all .2s ease-out }
.context-warning__dismiss:hover { color:var(--color-text-primary);transform:scale(1.2) }
.context-warning--critical { border-left-color:var(--color-danger);background:var(--color-danger-subtle) }
.context-warning--high { border-left-color:var(--color-danger-light);background:var(--color-danger-subtle) }
.context-warning--medium { border-left-color:var(--color-warning);background:var(--color-warning-subtle) }
.context-warning--low { border-left-color:var(--color-info);background:var(--color-info-subtle) }
.context-warning--info { border-left-color:var(--color-info-light);background:var(--color-info-subtle) }
.context-sources__title { font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-4) 0 }
.context-sources__list { display:flex;flex-direction:column;gap:var(--spacing-3) }
.context-source { background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);overflow:hidden;transition:all .2s ease-out;animation:slideInUp .3s ease-out backwards }
.context-source:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-inspector-source-hover);transform:translateY(-2px) }
.context-source__header-container { display:flex;align-items:center;gap:var(--spacing-2);width:100%;padding-right:var(--spacing-4) }
.context-source__header { flex:1;display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4);background:transparent;border:none;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background-color .2s ease-out }
.context-source__header:hover { background:var(--color-surface-hover) }
.context-source__header:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:-2px }
.context-source__header-left { display:flex;align-items:center;gap:var(--spacing-3) }
.context-source__icon { font-size:var(--text-xl);flex-shrink:0 }
.context-source__label { font-size:var(--text-base);font-weight:var(--font-weight-medium);color:var(--color-text-primary) }
.context-source__header-right { display:flex;align-items:center;gap:var(--spacing-3) }
.context-source__badge { padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);border-radius:var(--radius-full) }
.context-source__badge.badge--success { background:var(--color-success-subtle);color:var(--color-success-high-contrast);border:1px solid var(--color-success-border) }
.context-source__badge.badge--warning { background:var(--color-warning-subtle);color:var(--color-warning-high-contrast);border:1px solid var(--color-warning-border-fair) }
.context-source__badge.badge--error { background:var(--color-danger-subtle);color:var(--color-danger-light);border:1px solid var(--color-danger-border-poor) }
.context-source__timestamp { font-size:var(--text-xs);color:var(--color-text-tertiary) }
.context-source__refresh-button { display:inline-flex;align-items:center;justify-content:center;width:var(--spacing-8);height:var(--spacing-8);padding:0;background:transparent;border:1px solid var(--color-border-default);border-radius:var(--radius-md);color:var(--color-text-tertiary);cursor:pointer;flex-shrink:0;transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),transform var(--duration-fast) cubic-bezier(.68,-.55,.265,1.55);will-change:transform;transform:translateZ(0) }
.context-source__refresh-button:hover:not(:disabled) { background:var(--color-primary-subtle);border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-1px) }
.context-source__refresh-button:active:not(:disabled) { transform:translateY(0) }
.context-source__refresh-button:disabled { cursor:not-allowed;opacity:.5 }
.context-source__refresh-icon { font-size:var(--text-base);display:inline-block }
.context-source__refresh-button--loading .context-source__refresh-icon { animation:refreshSpin 1s linear infinite }
.context-source__refresh-button--success:hover:not(:disabled),.context-source__refresh-button--success { background:var(--color-success-subtle);border-color:var(--color-success);color:var(--color-success) }
.context-source__refresh-button--error { background:var(--color-danger-subtle);border-color:var(--color-danger);color:var(--color-danger) }
.context-source__refresh-button--error:hover:not(:disabled) { background:var(--color-danger-subtle);border-color:var(--color-danger-dark);color:var(--color-danger-dark) }
.context-source__toggle { font-size:var(--text-sm);color:var(--color-text-tertiary);transition:transform .2s ease-out }
.context-source__header:hover .context-source__toggle { color:var(--color-text-primary) }
.context-source__content { padding:var(--spacing-4);border-top:1px solid var(--color-border-subtle);background:var(--color-surface-base);animation:expandContent .3s ease-out }
.context-data-object { margin:0 }
.context-data-field { display:grid;grid-template-columns:minmax(120px,auto) 1fr;grid-gap:var(--spacing-3);gap:var(--spacing-3);padding:var(--spacing-2) 0;border-bottom:1px solid var(--color-border-subtle) }
.context-data-field:last-child { border-bottom:none }
.context-data-key { font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-brand-primary-light);margin:0 }
.context-data-value { font-size:var(--text-sm);color:var(--color-text-secondary);margin:0;word-break:break-word }
.context-data-array { list-style:disc;padding-left:var(--spacing-5);margin:var(--spacing-2) 0;color:var(--color-text-secondary) }
.context-data-array li { font-size:var(--text-sm);padding:var(--spacing-1) 0 }
.context-link { color:var(--color-link-primary);text-decoration:underline;text-decoration-color:var(--color-border-default);text-decoration-thickness:1px;text-underline-offset:2px;transition:all var(--transition-fast) ease;cursor:pointer }
.context-link:hover { color:var(--color-link-hover);text-decoration-color:var(--color-link-hover) }
.context-link:focus { outline:2px solid var(--color-focus);outline-offset:2px;border-radius:var(--radius-sm) }
.context-link--email { color:var(--color-success-primary) }
.context-link--email:before { content:"✉ ";opacity:.7;font-size:.9em }
.context-link--email:hover { color:var(--color-success-dark) }
.context-link--url { color:var(--color-brand-primary) }
.context-link--url:after { content:" ↗";opacity:.5;font-size:.85em;transition:opacity var(--transition-fast) ease }
.context-link--url:hover:after { opacity:.8 }
.context-link__domain { color:var(--color-text-tertiary);font-size:.85em;font-style:italic;margin-left:var(--spacing-1) }
.context-date { color:var(--color-text-secondary);font-style:italic;border-bottom:1px dotted var(--color-border-default);cursor:help;transition:border-color var(--transition-fast) ease }
.context-date:hover { border-bottom-color:var(--color-text-primary);color:var(--color-text-primary) }
.context-inspector-skeleton { display:flex;flex-direction:column;gap:var(--spacing-4);padding:var(--spacing-4) }
.skeleton--header { width:60%;height:var(--skeleton-header-height) }
.skeleton--badge { width:var(--skeleton-badge-width);height:var(--skeleton-badge-height);align-self:center;border-radius:var(--radius-full) }
.skeleton--section { width:100%;height:var(--skeleton-section-height) }
.context-inspector-error { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-4);padding:var(--spacing-8);text-align:center }
.context-inspector-error__icon { font-size:64px }
.context-inspector-error__title { font-size:var(--text-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 }
.context-inspector-error__message { font-size:var(--text-base);color:var(--color-text-secondary);margin:0 }
.context-inspector__footer { display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-6);border-top:1px solid var(--color-border-subtle);background:var(--color-surface-primary) }
.context-inspector__footer-actions { display:flex;gap:var(--spacing-3) }
.u-hidden { display:none }
.sr-only { margin:-1px }
@media (max-width:768px) { .context-inspector { max-width:100%;max-height:100vh;border-radius:0 }
.context-inspector__metadata { flex-direction:column;gap:var(--spacing-2) }
.context-data-field { grid-template-columns:1fr;gap:var(--spacing-1) }
.context-inspector__footer { flex-direction:column;gap:var(--spacing-3) }
.context-inspector__footer-actions { width:100%;flex-direction:column }
.context-inspector__footer .sg-btn { width:100% }
 }
.context-inspector__edit-btn { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-primary);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-base);cursor:pointer;transition:all .2s ease }
.context-inspector__edit-btn:hover { background:var(--color-primary-hover);border-color:var(--color-primary);color:var(--color-text-on-dark);transform:translateY(-1px) }
.context-inspector__edit-btn:active { transform:translateY(0) }
.context-inspector__unsaved-indicator { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-warning);background:var(--color-warning-subtle);border:1px solid var(--color-warning-border);border-radius:var(--radius-base) }
.context-data-field--editable { cursor:pointer;padding:var(--spacing-2);border-radius:var(--radius-sm);transition:background-color .2s ease;position:relative }
.context-data-field--editable:hover { background:var(--color-brand-primary-subtle) }
.context-data-field--editable:hover .context-data-tree__edit-icon { opacity:1 }
.context-data-tree__edit-icon { position:absolute;right:var(--spacing-2);top:50%;transform:translateY(-50%);opacity:0;transition:opacity .2s ease;color:var(--color-primary);font-size:var(--text-sm) }
.context-data-field--modified { background:var(--color-info-subtle);border-left:3px solid var(--color-primary);padding-left:var(--spacing-3) }
.context-data-tree__input { width:100%;padding:var(--spacing-2);font-size:var(--text-sm);font-family:var(--font-family-base);color:var(--color-text-primary);background:var(--color-surface-elevated);border:2px solid var(--color-primary);border-radius:var(--radius-sm);outline:none;transition:border-color .2s ease,box-shadow .2s ease }
.context-data-tree__input:focus { border-color:var(--color-primary);box-shadow:var(--shadow-purple-25) }
.context-data-tree__input[type=textarea] { min-height:var(--spacing-20);resize:vertical }
.context-data-tree__error { display:block;margin-top:var(--spacing-1);font-size:var(--text-xs);color:var(--color-error);font-weight:var(--font-weight-medium) }
.context-inspector__header-actions { display:flex;align-items:center;gap:var(--spacing-3) }
.context-inspector-confirm-overlay { position:fixed;inset:0;z-index:var(--z-index-modal);background:var(--overlay-scrim-80);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;animation:backdropFadeIn .2s ease-out }
.context-inspector-confirm-dialog { background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-inspector-modal);max-width:var(--size-96);width:90%;animation:modalSlideIn .3s cubic-bezier(.68,-.55,.265,1.55) }
.context-inspector-confirm-dialog__header { padding:var(--spacing-6) var(--spacing-6) var(--spacing-4);border-bottom:1px solid var(--color-border-subtle) }
.context-inspector-confirm-dialog__title { margin:0;font-size:var(--text-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary) }
.context-inspector-confirm-dialog__body { padding:var(--spacing-4) var(--spacing-6) }
.context-inspector-confirm-dialog__body p { margin:0;color:var(--color-text-secondary);font-size:var(--text-base);line-height:1.5 }
.context-inspector-confirm-dialog__footer { padding:var(--spacing-4) var(--spacing-6) var(--spacing-6);display:flex;gap:var(--spacing-3);justify-content:flex-end }
.toast-notification-container { position:fixed;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-index-notification);display:flex;flex-direction:column;gap:var(--spacing-3);max-width:var(--size-96);width:90% }
.toast-notification { display:flex;align-items:flex-start;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);opacity:0;transform:translateX(100%);transition:all .3s cubic-bezier(.68,-.55,.265,1.55);position:relative;overflow:hidden }
.toast-notification--visible { opacity:1;transform:translateX(0) }
.toast-notification--exiting { opacity:0;transform:translateX(100%) }
.toast-notification__icon { flex-shrink:0;width:var(--size-icon-sm);height:var(--size-icon-sm) }
.toast-notification--success { border-left:4px solid var(--color-success) }
.toast-notification--success .toast-notification__icon { color:var(--color-success) }
.toast-notification--error { border-left:4px solid var(--color-error) }
.toast-notification--error .toast-notification__icon { color:var(--color-error) }
.toast-notification--warning { border-left:4px solid var(--color-warning) }
.toast-notification--warning .toast-notification__icon { color:var(--color-warning) }
.toast-notification--info { border-left:4px solid var(--color-primary) }
.toast-notification--info .toast-notification__icon { color:var(--color-primary) }
.toast-notification__content { flex:1;min-width:0 }
.toast-notification__message { margin:0;font-size:var(--text-sm);color:var(--color-text-primary);word-wrap:break-word }
.toast-notification__close { flex-shrink:0;width:var(--spacing-6);height:var(--spacing-6);display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--color-text-secondary);cursor:pointer;font-size:var(--text-lg);line-height:1;transition:color .2s ease }
.toast-notification__close:hover { color:var(--color-text-primary) }
.toast-notification__progress { position:absolute;bottom:0;left:0;height:var(--spacing-1);width:100%;background:currentColor;opacity:.3;transform-origin:left }
.toast-notification__progress--active { animation:progressShrink linear }
.context-inspector__edit-history-section { margin-top:var(--spacing-4);border-top:1px solid var(--color-border-subtle);padding-top:var(--spacing-4) }
.context-inspector__edit-history-toggle { display:flex;align-items:center;gap:var(--spacing-2);width:100%;padding:var(--spacing-3);background:var(--color-surface-secondary);border:1px solid var(--color-border-subtle);border-radius:var(--radius-base);font-size:var(--text-base);font-weight:var(--font-weight-medium);color:var(--color-text-primary);cursor:pointer;transition:all .2s ease }
.context-inspector__edit-history-toggle:hover { background:var(--color-surface-elevated);border-color:var(--color-border-default) }
.context-inspector__edit-history-toggle .toggle-icon { font-size:var(--text-sm);transition:transform .2s ease }
.context-inspector__edit-history-toggle[aria-expanded=true] .toggle-icon { transform:rotate(90deg) }
.edit-history-count { margin-left:auto;font-size:var(--text-sm);color:var(--color-text-secondary) }
.context-inspector__edit-history-content { margin-top:var(--spacing-3) }
.context-inspector__edit-history-content[hidden] { display:none }
.context-inspector__edit-history-empty,.context-inspector__edit-history-loading { display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);padding:var(--spacing-6);color:var(--color-text-secondary);font-size:var(--text-sm) }
.context-inspector__edit-history-timeline { display:flex;flex-direction:column;gap:var(--spacing-4) }
.context-inspector__edit-history-item { padding:var(--spacing-4);background:var(--color-surface-secondary);border:1px solid var(--color-border-subtle);border-radius:var(--radius-base);transition:border-color .2s ease }
.context-inspector__edit-history-item:hover { border-color:var(--color-border-default) }
.edit-history-item__header { display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-3);margin-bottom:var(--spacing-3) }
.edit-history-item__field { display:flex;align-items:center;gap:var(--spacing-2);flex:1;min-width:0 }
.field-source { font-size:var(--text-xs);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em }
.field-separator { color:var(--color-text-tertiary) }
.field-path { font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary);word-wrap:break-word }
.edit-history-item__sync-status { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-weight-medium);padding:var(--spacing-1) var(--spacing-2);border-radius:var(--radius-sm);white-space:nowrap }
.edit-history-item__sync-status--synced { background:var(--color-success-subtle);color:var(--color-success) }
.edit-history-item__sync-status--failed { background:var(--color-danger-subtle);color:var(--color-error) }
.sync-status-icon { font-size:var(--text-sm) }
.context-inspector__edit-history-retry { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-weight-medium);color:var(--color-primary);background:var(--color-brand-primary-subtle);border:1px solid var(--color-brand-primary-20);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease }
.context-inspector__edit-history-retry:hover { background:var(--color-brand-primary-subtle);border-color:var(--color-primary) }
.edit-history-item__diff { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3);background:var(--color-surface-primary);border-radius:var(--radius-sm);margin-bottom:var(--spacing-2) }
.diff-new,.diff-old { flex:1;min-width:0 }
.diff-label { display:block;font-size:var(--text-xs);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);margin-bottom:var(--spacing-1) }
.diff-value { display:block;font-size:var(--text-sm);color:var(--color-text-primary);word-wrap:break-word }
.diff-value code { display:block;padding:var(--spacing-2);background:var(--color-surface-secondary);border-radius:var(--radius-sm);font-size:var(--text-xs);white-space:pre-wrap }
.diff-value em { color:var(--color-text-tertiary);font-style:italic }
.diff-arrow { color:var(--color-text-tertiary);font-size:var(--text-lg);flex-shrink:0 }
.edit-history-item__timestamp { font-size:var(--text-xs);color:var(--color-text-tertiary) }
.edit-history-item__timestamp time { cursor:help }
.context-inspector__meeting-patterns { margin-top:var(--spacing-6);background:var(--color-surface-primary);border-radius:var(--radius-lg);padding:var(--spacing-5);border:1px solid var(--color-border-subtle);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:slideInUp .4s cubic-bezier(.68,-.55,.265,1.55) }
.context-inspector__meeting-patterns-header { margin-bottom:var(--spacing-5);border-bottom:1px solid var(--color-border-subtle);padding-bottom:var(--spacing-3) }
.context-inspector__meeting-patterns-title { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);margin:0 }
.context-inspector__meeting-patterns-icon { font-size:var(--text-xl) }
.context-inspector__meeting-patterns-count { display:inline-flex;align-items:center;justify-content:center;min-width:var(--spacing-6);height:var(--spacing-6);padding:0 var(--spacing-2);background:var(--color-primary);color:var(--color-on-primary);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-bold) }
.meeting-pattern-group { margin-bottom:var(--spacing-4);background:var(--color-surface-secondary);border-radius:var(--radius-md);padding:var(--spacing-4);border-left:3px solid var(--color-primary);transition:transform .2s ease,box-shadow .2s ease }
.meeting-pattern-group:hover { transform:translateY(-2px);box-shadow:var(--shadow-card-lift-md) }
.meeting-pattern-group:last-child { margin-bottom:0 }
.meeting-pattern-group__header { margin-bottom:var(--spacing-3) }
.meeting-pattern-group__title { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text-primary);margin:0 }
.meeting-pattern-group__icon { font-size:var(--text-lg) }
.meeting-pattern-group__badge { display:inline-flex;align-items:center;justify-content:center;min-width:var(--spacing-5);height:var(--spacing-5);padding:0 var(--spacing-2);background:var(--color-primary-light);color:var(--color-primary-dark);border-radius:var(--radius-base);font-size:var(--text-xs);font-weight:var(--font-semibold) }
.meeting-pattern-group__list { display:flex;flex-direction:column;gap:var(--spacing-2) }
.meeting-pattern-item { display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-3);background:var(--color-surface-primary);border-radius:var(--radius-base);border:1px solid var(--color-border-subtle);gap:var(--spacing-3);animation:fadeIn .3s ease forwards;opacity:0 }
.meeting-pattern-item__text { flex:1;font-size:var(--text-sm);color:var(--color-text-secondary);line-height:1.5 }
.meeting-pattern-item__confidence { flex-shrink:0;padding:var(--spacing-1) var(--spacing-2);background:linear-gradient(135deg,var(--color-success),var(--color-success-dark));color:var(--color-on-primary);border-radius:var(--radius-base);font-size:var(--text-xs);font-weight:var(--font-bold) }
.meeting-pattern-group__more { margin-top:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);text-align:center;font-size:var(--text-sm);color:var(--color-text-tertiary);font-style:italic }
.context-inspector__meeting-patterns-empty { margin-top:var(--spacing-6);padding:var(--spacing-8) var(--spacing-6);text-align:center;background:var(--color-surface-secondary);border-radius:var(--radius-lg);border:2px dashed var(--color-border-subtle) }
.context-inspector__meeting-patterns-empty-icon { font-size:3rem;display:block;margin-bottom:var(--spacing-3) }
.context-inspector__meeting-patterns-empty-title { font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-2) }
.context-inspector__meeting-patterns-empty-text { font-size:var(--text-sm);color:var(--color-text-secondary);margin:0;line-height:1.6 }
.context-inspector__objection-library { margin-top:var(--spacing-6);background:var(--color-surface-primary);border-radius:var(--radius-lg);padding:var(--spacing-5);border:1px solid var(--color-border-subtle);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:slideInUp .4s cubic-bezier(.68,-.55,.265,1.55) }
.context-inspector__objection-library-header { margin-bottom:var(--spacing-5);border-bottom:1px solid var(--color-border-subtle);padding-bottom:var(--spacing-3) }
.context-inspector__objection-library-title { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);margin:0 }
.context-inspector__objection-library-icon { font-size:var(--text-xl) }
.context-inspector__objection-library-count { display:inline-flex;align-items:center;justify-content:center;min-width:var(--spacing-6);height:var(--spacing-6);padding:0 var(--spacing-2);background:var(--color-primary);color:var(--color-on-primary);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-bold) }
.objection-card { margin-bottom:var(--spacing-4);background:var(--color-surface-secondary);border-radius:var(--radius-md);padding:var(--spacing-4);border-left:3px solid var(--color-primary);box-shadow:var(--shadow-card-lift-sm);animation:slideInUp .3s ease forwards;opacity:0;transition:transform .2s ease,box-shadow .2s ease }
.objection-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-card-lift-lg) }
.objection-card:last-child { margin-bottom:0 }
.objection-card__header { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-3);gap:var(--spacing-3) }
.objection-card__theme { flex:1;font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text-primary);margin:0 }
.objection-card__success-rate { flex-shrink:0;display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-base);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.objection-card__success-rate--high { background:var(--color-success-light);color:var(--color-success-dark) }
.objection-card__success-rate--medium { background:var(--color-warning-light);color:var(--color-warning-dark) }
.objection-card__success-rate--low { background:var(--color-error-light);color:var(--color-error-dark) }
.objection-card__success-icon { font-size:var(--text-base) }
.objection-card__section { margin-bottom:var(--spacing-3) }
.objection-card__section:last-of-type { margin-bottom:0 }
.objection-card__section-title { font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-secondary);margin:0 0 var(--spacing-2) }
.objection-card__phrases { display:flex;flex-wrap:wrap;gap:var(--spacing-2) }
.objection-card__phrase { display:inline-block;padding:var(--spacing-1) var(--spacing-2);background:var(--color-primary-light);color:var(--color-primary-dark);border-radius:var(--radius-base);font-size:var(--text-xs);font-weight:var(--font-medium) }
.objection-card__responses { display:flex;flex-direction:column;gap:var(--spacing-2) }
.objection-card__response { display:flex;align-items:flex-start;gap:var(--spacing-2);padding:var(--spacing-2);background:var(--color-surface-primary);border-radius:var(--radius-base);border:1px solid var(--color-border-subtle) }
.objection-card__response-arrow { flex-shrink:0;color:var(--color-primary);font-weight:var(--font-bold);margin-top:var(--spacing-1) }
.objection-card__response-text { flex:1;font-size:var(--text-sm);color:var(--color-text-secondary);line-height:1.5 }
.objection-card__more-responses { margin-top:var(--spacing-1);font-size:var(--text-xs);color:var(--color-text-tertiary);font-style:italic;padding-left:var(--spacing-5) }
.objection-card__footer { margin-top:var(--spacing-3);padding-top:var(--spacing-3);border-top:1px solid var(--color-border-subtle);display:flex;align-items:center;justify-content:flex-end }
.objection-card__frequency { display:flex;align-items:center;gap:var(--spacing-1);font-size:var(--text-xs);color:var(--color-text-tertiary) }
.objection-card__frequency-icon { font-size:var(--text-sm) }
.context-inspector__objection-library-empty { margin-top:var(--spacing-6);padding:var(--spacing-8) var(--spacing-6);text-align:center;background:var(--color-surface-secondary);border-radius:var(--radius-lg);border:2px dashed var(--color-border-subtle) }
.context-inspector__objection-library-empty-icon { font-size:3rem;display:block;margin-bottom:var(--spacing-3) }
.context-inspector__objection-library-empty-title { font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-2) }
.context-inspector__objection-library-empty-text { font-size:var(--text-sm);color:var(--color-text-secondary);margin:0;line-height:1.6 }
.provenance-badge { display:inline-flex;position:relative;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);background:var(--color-danger-subtle);border:1px solid var(--color-danger);color:var(--color-danger);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-medium);line-height:1;transition:transform var(--duration-fast) cubic-bezier(.68,-.55,.265,1.55),box-shadow var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out);will-change:transform;transform:translateZ(0);cursor:help }
.provenance-badge:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--color-danger-subtle) 100%);border-radius:var(--radius-full);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;z-index:-1 }
.provenance-badge:hover { transform:translateY(-1px);box-shadow:0 4px 8px var(--color-danger-subtle);border-color:var(--color-danger-dark) }
.provenance-badge:hover:before { opacity:1 }
.provenance-badge--high { background:var(--color-success-subtle);border-color:var(--color-success);color:var(--color-success) }
.provenance-badge--high:before { background:linear-gradient(135deg,transparent 0,var(--color-success-subtle) 100%) }
.provenance-badge--high:hover { box-shadow:0 4px 8px var(--color-success-subtle);border-color:var(--color-success-dark) }
.provenance-badge--medium { background:var(--color-warning-subtle);border-color:var(--color-warning);color:var(--color-warning) }
.provenance-badge--medium:before { background:linear-gradient(135deg,transparent 0,var(--color-warning-subtle) 100%) }
.provenance-badge--medium:hover { box-shadow:0 4px 8px var(--color-warning-subtle);border-color:var(--color-warning-dark) }
.provenance-badge__icon { font-size:var(--text-sm);line-height:1;flex-shrink:0 }
.provenance-badge__source { white-space:nowrap;font-weight:var(--font-semibold) }
.provenance-badge__separator { opacity:.5;font-weight:var(--font-normal) }
.provenance-badge__confidence { font-weight:var(--font-bold);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.provenance-badge:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.conflict-warning { margin-top:var(--spacing-2) }
.conflict-warning__trigger { display:flex;align-items:center;gap:var(--spacing-2);width:100%;padding:var(--spacing-2) var(--spacing-3);background:var(--color-warning-subtle);border:1px solid var(--color-warning);color:var(--color-warning);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out) }
.conflict-warning__trigger:hover { background:var(--color-warning-hover);border-color:var(--color-warning-dark);transform:translateY(-1px) }
.conflict-warning__trigger:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.conflict-warning__icon { font-size:var(--text-base);flex-shrink:0;animation:conflictPulse 2s ease-in-out infinite }
.conflict-warning__text { flex:1;text-align:left }
.conflict-warning__toggle { font-size:var(--text-xs);transition:transform var(--duration-fast) var(--ease-out) }
.conflict-warning__trigger--expanded .conflict-warning__toggle { transform:rotate(180deg) }
.conflict-warning__content { margin-top:var(--spacing-2);overflow:hidden }
.conflict-warning__content[hidden] { display:none }
.conflict-warning__alternatives { display:flex;flex-direction:column;gap:var(--spacing-2) }
.conflict-warning__alternative { padding:var(--spacing-3);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-md);animation:alternativeSlideIn .3s ease-out backwards }
.conflict-warning__alternative:hover { border-color:var(--color-border-strong);background:var(--color-surface-hover) }
.conflict-warning__alternative-header { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-2) }
.conflict-warning__alternative-icon { font-size:var(--text-base);flex-shrink:0 }
.conflict-warning__alternative-source { flex:1;font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-primary) }
.conflict-warning__alternative-confidence { display:inline-flex;padding:var(--spacing-1) var(--spacing-2);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-bold);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.conflict-warning__alternative-confidence--high { background:var(--color-success-subtle);color:var(--color-success) }
.conflict-warning__alternative-confidence--medium { background:var(--color-warning-subtle);color:var(--color-warning) }
.conflict-warning__alternative-confidence--low { background:var(--color-danger-subtle);color:var(--color-danger) }
.conflict-warning__alternative-value { padding:var(--spacing-2);background:var(--color-surface-base);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);font-size:var(--text-sm);font-family:var(--font-mono,monospace);color:var(--color-text-secondary);word-break:break-word;white-space:pre-wrap }
@media (prefers-reduced-motion:reduce) { .conflict-warning__alternative,.conflict-warning__icon,.context-inspector-backdrop,.context-inspector,.context-source,.context-warning,.meeting-pattern-group,.meeting-pattern-item,.objection-card,.provenance-badge,.skeleton { animation:none;transition:none }
.conflict-warning__trigger:hover,.context-inspector__close:hover,.context-source:hover,.meeting-pattern-group:hover,.objection-card:hover,.provenance-badge:hover { transform:none }
.provenance-badge:hover:before,.provenance-badge:before { opacity:0 }
 }
.context-inspector__notion-section { display:flex;flex-direction:column;gap:var(--spacing-4);padding:var(--spacing-6) }
.context-inspector__notion-header { display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-3);margin-bottom:var(--spacing-2) }
.context-inspector__notion-title { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary) }
.context-inspector__notion-icon { font-size:var(--text-2xl);line-height:1 }
.context-inspector__notion-count { display:inline-flex;align-items:center;justify-content:center;min-width:var(--spacing-6);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out) }
.notion-meeting-card { position:relative;display:flex;flex-direction:column;gap:var(--spacing-4);padding:var(--spacing-5);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-medium) var(--ease-out);overflow:hidden;will-change:transform;transform:translateZ(0) }
.notion-meeting-card:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-subtle) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;z-index:0 }
.notion-meeting-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-lg);transform:translateY(-2px) }
.notion-meeting-card:hover:before { opacity:1 }
.notion-meeting-card>* { position:relative;z-index:1 }
.notion-meeting-card { animation:slideInUp .4s var(--ease-out) backwards }
.notion-meeting-card:first-child { animation-delay:0s }
.notion-meeting-card:nth-child(2) { animation-delay:50ms }
.notion-meeting-card:nth-child(3) { animation-delay:.1s }
.notion-meeting-card:nth-child(4) { animation-delay:.15s }
.notion-meeting-card:nth-child(5) { animation-delay:.2s }
.notion-meeting-card:nth-child(6) { animation-delay:.25s }
.notion-meeting-card:nth-child(7) { animation-delay:.3s }
.notion-meeting-card:nth-child(8) { animation-delay:.35s }
.notion-meeting-card:nth-child(9) { animation-delay:.4s }
.notion-meeting-card:nth-child(10) { animation-delay:.45s }
.notion-meeting-card__header { display:flex;align-items:flex-start;justify-content:space-between;gap:var(--spacing-3) }
.notion-meeting-card__title-group { flex:1;min-width:0 }
.notion-meeting-card__club-name { font-size:var(--text-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-1);line-height:1.4 }
.notion-meeting-card__date { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-sm);color:var(--color-text-tertiary) }
.notion-meeting-card__date-icon { font-size:var(--text-base);opacity:.7 }
.notion-meeting-card__sentiment { display:inline-flex;align-items:center;gap:var(--spacing-1-5);padding:var(--spacing-1-5) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-weight-medium);border-radius:var(--radius-full);white-space:nowrap;transition:all var(--duration-fast) var(--ease-out) }
.notion-meeting-card__sentiment--positive { color:var(--color-success-text);background:linear-gradient(135deg,var(--color-success-subtle),var(--color-success-15));border:1px solid var(--color-success-border) }
.notion-meeting-card__sentiment--positive:hover { background:linear-gradient(135deg,var(--color-success-15),var(--color-success-subtle));box-shadow:0 0 8px var(--color-success-subtle) }
.notion-meeting-card__sentiment--neutral { color:var(--color-text-secondary);background:linear-gradient(135deg,var(--color-surface-hover),var(--color-surface-elevated));border:1px solid var(--color-border-default) }
.notion-meeting-card__sentiment--neutral:hover { background:linear-gradient(135deg,var(--color-surface-elevated),var(--color-surface-hover));border-color:var(--color-border-strong) }
.notion-meeting-card__sentiment--negative { color:var(--color-danger-text);background:linear-gradient(135deg,var(--color-danger-subtle),var(--color-error-15));border:1px solid var(--color-border-default) }
.notion-meeting-card__sentiment--negative:hover { background:linear-gradient(135deg,var(--color-error-15),var(--color-danger-subtle));box-shadow:0 0 8px var(--color-danger-subtle) }
.notion-meeting-card__sentiment--mixed { color:var(--color-text-brand);background:linear-gradient(135deg,var(--color-brand-primary-subtle),var(--color-surface-elevated));border:1px solid var(--color-primary-border) }
.notion-meeting-card__sentiment--mixed:hover { background:linear-gradient(135deg,var(--color-surface-elevated),var(--color-brand-primary-subtle));box-shadow:0 0 8px var(--color-brand-primary-subtle) }
.notion-meeting-card__sentiment-icon { font-size:var(--text-sm);line-height:1 }
.notion-meeting-card__section { display:flex;flex-direction:column;gap:var(--spacing-2) }
.notion-meeting-card__section-title { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em }
.notion-meeting-card__section-icon { font-size:var(--text-base);opacity:.7 }
.notion-meeting-card__summary { font-size:var(--text-sm);color:var(--color-text-primary);line-height:1.6 }
.notion-meeting-card__objections { display:flex;flex-direction:column;gap:var(--spacing-2) }
.notion-meeting-card__objection { display:flex;align-items:flex-start;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);color:var(--color-text-secondary);background:var(--color-surface-hover);border-left:2px solid var(--color-warning);border-radius:var(--radius-base);transition:all var(--duration-fast) var(--ease-out) }
.notion-meeting-card__objection:hover { background:var(--color-surface-overlay);border-left-color:var(--color-warning-light);transform:translateX(2px) }
.notion-meeting-card__objection-icon { flex-shrink:0;margin-top:var(--spacing-0-5);font-size:var(--text-base);color:var(--color-warning) }
.notion-meeting-card__actions { display:flex;flex-direction:column;gap:var(--spacing-2) }
.notion-meeting-card__action { display:flex;align-items:flex-start;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);color:var(--color-text-secondary);background:var(--color-surface-hover);border-left:2px solid var(--color-info);border-radius:var(--radius-base);transition:all var(--duration-fast) var(--ease-out) }
.notion-meeting-card__action:hover { background:var(--color-surface-overlay);border-left-color:var(--color-info-light);transform:translateX(2px) }
.notion-meeting-card__action-icon { flex-shrink:0;margin-top:var(--spacing-0-5);font-size:var(--text-base);color:var(--color-info) }
.notion-meeting-card__footer { display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-3);padding-top:var(--spacing-3);border-top:1px solid var(--color-border-subtle) }
.notion-meeting-card__attendees { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-xs);color:var(--color-text-tertiary) }
.notion-meeting-card__attendees-icon { font-size:var(--text-sm);opacity:.7 }
.notion-meeting-card__source-badge { display:inline-flex;align-items:center;gap:var(--spacing-1-5);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-weight-medium);color:var(--color-text-brand);background:var(--color-brand-primary-subtle);border:1px solid var(--color-primary-border);border-radius:var(--radius-base);transition:all var(--duration-fast) var(--ease-out) }
.notion-meeting-card__source-badge:hover { background:var(--color-surface-elevated);border-color:var(--color-border-strong);box-shadow:0 0 8px var(--color-brand-primary-subtle) }
.notion-meeting-card__source-icon { font-size:var(--text-sm);line-height:1 }
.context-inspector__notion-empty { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-3);padding:var(--spacing-12) var(--spacing-6);text-align:center }
.context-inspector__notion-empty-icon { font-size:var(--text-4xl);opacity:.5 }
.context-inspector__notion-empty-title { font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary) }
.context-inspector__notion-empty-text { font-size:var(--text-sm);color:var(--color-text-tertiary);max-width:var(--max-width-prose) }
.notion-meeting-card--skeleton { pointer-events:none }
.notion-meeting-card--skeleton .skeleton { background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);background-size:200% 100%;border-radius:var(--radius-base);animation:skeleton-shimmer 1.5s ease-in-out infinite }
.notion-meeting-card--skeleton .skeleton--title { width:60%;height:var(--spacing-5);margin-bottom:var(--spacing-2) }
.notion-meeting-card--skeleton .skeleton--date { width:40%;height:var(--spacing-4);margin-bottom:var(--spacing-4) }
.notion-meeting-card--skeleton .skeleton--text { width:100%;height:var(--spacing-3-5);margin-bottom:var(--spacing-2) }
.notion-meeting-card--skeleton .skeleton--text:last-child { width:75% }
@media (max-width:768px) { .context-inspector__notion-section { padding:var(--spacing-4) }
.notion-meeting-card { padding:var(--spacing-4);gap:var(--spacing-3) }
.notion-meeting-card__header { flex-direction:column;align-items:flex-start }
.notion-meeting-card__sentiment { align-self:flex-start }
 }
@media (prefers-reduced-motion:reduce) { .notion-meeting-card,.notion-meeting-card:before,.notion-meeting-card__action,.notion-meeting-card__objection,.notion-meeting-card__sentiment,.notion-meeting-card__source-badge,.skeleton { animation:none;transition:none }
.notion-meeting-card:hover,.notion-meeting-card__action:hover,.notion-meeting-card__objection:hover { transform:none }
 }
.notion-meeting-card:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.notion-meeting-card__sentiment:focus-visible,.notion-meeting-card__source-badge:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.examples-page { min-height:100vh;padding:var(--spacing-8);color:var(--color-text-primary);background:var(--color-surface-primary) }
.examples-page__title { margin-bottom:var(--spacing-8);color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold);text-align:center }
.examples-page__subtitle { margin-bottom:var(--spacing-2);color:var(--color-text-secondary) }
.examples-page__description { margin-bottom:var(--spacing-4);color:var(--color-text-tertiary) }
.demo-section { margin-bottom:var(--spacing-12) }
.demo-section__title { margin-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.demo-section__description { margin-bottom:var(--spacing-6);color:var(--color-text-tertiary);line-height:var(--leading-relaxed) }
.demo-btn { padding:var(--spacing-3) var(--spacing-6);color:var(--color-neutral-0);font-weight:var(--font-medium);background:var(--color-brand-primary);border:none;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.demo-btn:hover { background:var(--color-brand-primary-dark);box-shadow:var(--shadow-md);transform:translateY(-1px) }
.demo-btn:active { box-shadow:var(--shadow-sm);transform:translateY(0) }
.info-box { margin-top:var(--spacing-6);padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md) }
.info-box--warning { background:var(--color-warning-bg);border-color:var(--color-warning-border) }
.info-box--info { background:var(--color-info-bg);border-color:var(--color-info-border) }
.info-box__title { color:var(--color-text-primary);font-weight:var(--font-semibold) }
.examples-page pre { overflow-x:auto;margin-bottom:var(--spacing-6);padding:var(--spacing-4);color:var(--color-text-primary);font-family:var(--font-mono);font-size:var(--text-sm);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md) }
.examples-page code { padding:var(--spacing-1) var(--spacing-2);color:var(--color-brand-primary);font-family:var(--font-mono);font-size:var(--text-sm);background:var(--color-surface-elevated);border-radius:var(--radius-sm) }
.demo-content-title { margin-bottom:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
@media (min-width:1536px) { .sg-container { max-width:calc(100vw - var(--spacing-12)) }
 }
@media (min-width:1920px) { .sg-container { max-width:var(--max-width-full) }
 }
@media (min-width:1536px) { .sg-category-grid { grid-template-columns:repeat(auto-fill,minmax(var(--card-min-width-md),1fr)) }
 }
@media (min-width:1920px) { .sg-category-grid { grid-template-columns:repeat(auto-fill,minmax(var(--card-min-width-lg),1fr)) }
 }
@media (min-width:1536px) { .sg-metric-grid { gap:var(--spacing-5) }
 }
.sg-container { max-width:calc(100vw - var(--spacing-8));margin:0 auto;padding-right:var(--spacing-4);padding-left:var(--spacing-4) }
.sg-container--fluid { width:100%;max-width:100%;padding-right:var(--spacing-4);padding-left:var(--spacing-4) }
.sg-main-content { width:100%;min-height:calc(100vh - var(--nav-height)) }
.o-sidebar-layout .sg-main-content,.o-sidebar-layout main { max-width:none;padding:var(--spacing-6) var(--spacing-8) }
.sg-category-grid { display:grid;grid-gap:var(--spacing-5);gap:var(--spacing-5);grid-template-columns:repeat(auto-fill,minmax(var(--card-min-width-sm),1fr));width:100% }
.sg-metric-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--grid-min-column),1fr));width:100% }
.sg-card,.tab-content,[data-tab-content] { width:100% }
.sg-search { max-width:var(--search-max-width) }
.sg-card__header .sg-search { max-width:100% }
.navigation { position:fixed;top:var(--spacing-0);left:var(--spacing-0);z-index:var(--z-fixed);width:280px;height:100vh;background:var(--color-surface-primary);border-right:var(--spacing-px) solid var(--color-border) }
.navigation__list { margin:var(--spacing-0);padding:var(--spacing-0);list-style:none }
.navigation__item { border-bottom:var(--spacing-px) solid var(--color-border) }
.navigation__link { display:block;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);text-decoration:none;transition:background var(--duration-fast) }
.navigation__link:hover { background:var(--color-surface-hover) }
.alert { position:relative;margin-bottom:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);border-radius:var(--radius-md) }
.alert--info { color:var(--color-info);background:var(--color-info-subtle);border-left:var(--spacing-1) solid var(--color-info) }
.alert--success { color:var(--color-success);background:var(--color-success-subtle);border-left:var(--spacing-1) solid var(--color-success) }
.alert--warning { color:var(--color-warning);background:var(--color-warning-subtle);border-left:var(--spacing-1) solid var(--color-warning) }
.alert--error { color:var(--color-danger);background:var(--color-danger-subtle);border-left:var(--spacing-1) solid var(--color-danger) }
.metric-card { padding:var(--spacing-4);color:var(--color-text-primary,#fff);background:var(--color-bg-secondary,var(--color-surface-primary));border:var(--spacing-px) solid var(--color-border-default,var(--color-border-primary));transition:transform var(--duration-fast,.15s ease),box-shadow var(--duration-fast,.15s ease) }
.metric-card:hover { box-shadow:var(--shadow-md) }
.metric-card__icon { margin-bottom:var(--spacing-2);color:var(--color-brand-primary,var(--color-accent-primary));font-size:var(--text-2xl) }
.metric-card__value { color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold) }
.metric-card__label { margin-top:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
@media (prefers-reduced-motion:reduce) { .metric-card-v2 { transition:none }
.metric-card-v2:hover { will-change:auto }
.metric-card-v2--loading .metric-card-v2__value,.metric-card-v2__progress-fill:after { animation:none;will-change:auto }
 }
.metric-card-v2 { position:relative;overflow:hidden;max-height:fit-content;padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-xl);transition:transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);contain:layout style }
.metric-card-v2:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-lg);transform:translateY(-2px);will-change:transform,box-shadow,border-color }
.metric-card-v2__header { position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-4) }
.metric-card-v2__title { display:flex;visibility:visible;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wider);text-transform:uppercase;opacity:100% }
.metric-card-v2__title i { color:var(--color-brand-primary);font-size:var(--text-base) }
.metric-card-v2__actions { display:flex;gap:var(--spacing-1) }
.metric-card-v2__action-btn { display:flex;justify-content:center;align-items:center;width:32px;height:32px;color:var(--color-text-tertiary);background:transparent;border:var(--border-width-1) solid transparent;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.metric-card-v2__action-btn:hover:not(:disabled) { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.metric-card-v2__action-btn:disabled { opacity:30%;cursor:not-allowed }
.metric-card-v2__body { display:flex;flex-direction:column;gap:var(--spacing-2) }
.metric-card-v2__value { margin-bottom:var(--spacing-2);font-size:var(--text-5xl);transition:color var(--duration-medium) var(--ease-out) }
.metric-card-v2__value--empty { color:var(--color-text-secondary);font-size:var(--text-6xl);opacity:80% }
.metric-card-v2__value--positive { background:linear-gradient(135deg,var(--color-brand-primary) 0,var(--color-brand-primary-light) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.metric-card-v2__value--negative { color:var(--color-danger) }
.metric-card-v2__value--neutral { color:var(--color-text-secondary) }
.metric-card-v2__comparison { margin-bottom:var(--spacing-3);color:var(--color-text-tertiary);font-size:var(--text-sm) }
.metric-card-v2__trend { display:inline-flex;align-items:center;align-self:flex-start;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-sm);background:var(--color-surface-elevated);border-radius:var(--radius-md) }
.metric-card-v2__trend--up { color:var(--color-success);background:var(--color-success-subtle) }
.metric-card-v2__trend--down { color:var(--color-danger);background:var(--color-danger-subtle) }
.metric-card-v2__trend--neutral { color:var(--color-text-tertiary);background:var(--color-surface-elevated) }
.metric-card-v2__benchmark { display:flex;align-items:center;gap:var(--spacing-2);margin-top:var(--spacing-2);padding-top:var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-sm);border-top:1px solid var(--color-border-subtle) }
.metric-card-v2__progress { margin-top:var(--spacing-4);transition:opacity var(--duration-medium) var(--ease-out) }
.metric-card-v2__progress-label { display:flex;visibility:visible;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-medium);opacity:100% }
.metric-card-v2__progress-label span { visibility:visible;opacity:100% }
.metric-card-v2__progress-bar { position:relative;overflow:hidden;height:var(--spacing-1-5);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.metric-card-v2__progress-fill { width:var(--progress,0);background:linear-gradient(90deg,var(--color-brand-primary) 0,var(--color-brand-primary-light) 100%);transition:width var(--duration-slow) var(--ease-out),background var(--duration-medium) var(--ease-out) }
.metric-card-v2__progress-fill.progress-success { background:linear-gradient(90deg,var(--color-success) 0,var(--color-success-light) 100%) }
.metric-card-v2__progress-fill.progress-warning { background:linear-gradient(90deg,var(--color-warning-dark) 0,var(--color-warning-light) 100%) }
.metric-card-v2__progress-fill.progress-danger { background:linear-gradient(90deg,var(--color-danger-dark) 0,var(--color-danger-light) 100%) }
.metric-card-v2__progress-fill:after { inset:0;background:linear-gradient(90deg,transparent,var(--alpha-white-20),transparent);transform:translateX(-100%);animation:metric-card-shimmer 2s infinite;will-change:transform }
.metric-card-v2__progress--hidden { display:none }
.metric-card-v2__empty-message { margin-top:var(--spacing-4);padding:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold);font-style:italic;background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-strong);border-radius:var(--radius-md);opacity:90% }
.metric-card-v2__pattern-list { margin-top:var(--spacing-3);padding-top:var(--spacing-3);border-top:1px solid var(--color-border-subtle) }
.metric-card-v2__pattern-item { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) 0;color:var(--color-text-secondary);font-size:var(--text-sm) }
.metric-card-v2__pattern-item i { color:var(--color-brand-primary);opacity:60% }
.metric-card-v2--loading .metric-card-v2__value { color:transparent;background:var(--color-surface-elevated);border-radius:var(--radius-md);animation:metric-card-skeleton 1.5s infinite;will-change:background-position }
@media (max-width:768px) { .sg-topic-badge__text { overflow:hidden;max-width:calc(var(--spacing-20)*6);text-overflow:ellipsis }
 }
@media (max-width:640px) { .sg-topic-badge__text { position:absolute;overflow:hidden;clip:rect(0,0,0,0);width:1px;height:1px;margin:-1px;padding:0;white-space:nowrap;border-width:0 }
.sg-topic-badge { padding:var(--spacing-2) }
.sg-topic-badge__icon { font-size:var(--text-lg) }
.sg-topic-badge__priority { margin-left:0 }
 }
@media (prefers-reduced-motion:reduce) { .sg-topic-badge,.sg-topic-badge__confidence-dot,.sg-topic-badge__icon,.sg-topic-badge__priority { transition:none;animation:none }
.sg-topic-badge--clickable:hover,.sg-topic-badge--clickable:hover .sg-topic-badge__icon,.sg-topic-badge:hover,.sg-topic-badge:hover .sg-topic-badge__icon { transform:none }
.sg-topic-badge--loading:before,.sg-topic-badge__confidence-dot--high { animation:none }
.sg-topic-badge--clickable:hover .sg-topic-badge__confidence-dot { transform:none }
 }
@media (prefers-contrast:more) { .sg-topic-badge { border-width:var(--border-width-2);backdrop-filter:none }
.sg-topic-badge--high-confidence,.sg-topic-badge--low-confidence,.sg-topic-badge--medium-confidence { border-style:solid;opacity:var(--opacity-100) }
.sg-topic-badge__priority { border-width:var(--border-width-2) }
 }
.sg-topic-badge { position:relative;display:inline-flex;align-items:center;gap:var(--spacing-1-5);padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-xs);font-weight:var(--font-medium);line-height:var(--leading-tight);letter-spacing:var(--tracking-wide);white-space:nowrap;background:var(--alpha-black-40);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:transform var(--duration-fast) cubic-bezier(.34,1.56,.64,1),box-shadow var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),opacity var(--duration-fast) var(--ease-out);will-change:transform;backdrop-filter:var(--backdrop-blur-heavy) }
.sg-topic-badge__icon { display:inline-flex;flex-shrink:0;justify-content:center;align-items:center;font-size:var(--text-base);line-height:var(--leading-none);transition:transform var(--duration-fast) cubic-bezier(.34,1.56,.64,1) }
.sg-topic-badge__text { display:inline-block;font-size:var(--text-xs);font-weight:var(--font-medium);line-height:var(--leading-tight);letter-spacing:var(--tracking-wide) }
.sg-topic-badge__priority { display:inline-flex;justify-content:center;align-items:center;margin-left:var(--spacing-1);padding:var(--spacing-0-5) var(--spacing-1-5);font-size:var(--text-badge);font-weight:var(--font-bold);letter-spacing:var(--tracking-wider);text-transform:uppercase;background:var(--alpha-white-10);border:var(--border-width-1) solid var(--alpha-white-20);border-radius:var(--radius-md);box-shadow:var(--shadow-xs) }
.sg-topic-badge--booking { color:var(--color-topic-booking);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-topic-booking-bg) 100%);border-color:var(--color-topic-booking-border) }
.sg-topic-badge--booking:hover { border-color:var(--color-topic-booking);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-topic-booking-bg) }
.sg-topic-badge--booking .sg-topic-badge__priority { color:var(--color-topic-booking-priority-text);background:var(--color-topic-booking-priority-bg);border-color:var(--color-topic-booking-priority-border) }
.sg-topic-badge--access { color:var(--color-success-light);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-success-15) 100%);border-color:var(--color-success-border) }
.sg-topic-badge--access:hover { border-color:var(--color-success);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-success-subtle) }
.sg-topic-badge--access .sg-topic-badge__priority { color:var(--color-success-high-contrast);background:var(--color-topic-access-priority-bg);border-color:var(--color-topic-access-priority-border) }
.sg-topic-badge--payment { color:var(--color-danger-light);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-error-15) 100%);border-color:var(--color-danger-border) }
.sg-topic-badge--payment:hover { border-color:var(--color-danger);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-error-15) }
.sg-topic-badge--payment .sg-topic-badge__priority { color:var(--color-topic-payment-priority-text);background:var(--color-topic-payment-priority-bg);border-color:var(--color-topic-payment-priority-border) }
.sg-topic-badge--reporting { color:var(--color-warning-light);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-warning-subtle) 100%);border-color:var(--color-warning-border) }
.sg-topic-badge--reporting:hover { border-color:var(--color-warning);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-warning-subtle) }
.sg-topic-badge--reporting .sg-topic-badge__priority { color:var(--color-warning-high-contrast);background:var(--color-topic-reporting-priority-bg);border-color:var(--color-topic-reporting-priority-border) }
.sg-topic-badge--integration { color:var(--color-brand-primary-light);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-brand-primary-subtle) 100%);border-color:color-mix(in srgb,var(--color-brand-primary) 30%,transparent) }
.sg-topic-badge--integration:hover { border-color:var(--color-brand-primary);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-brand-primary-subtle) }
.sg-topic-badge--integration .sg-topic-badge__priority { color:var(--color-topic-integration-priority-text);background:var(--color-topic-integration-priority-bg);border-color:var(--color-topic-integration-priority-border) }
.sg-topic-badge--player { color:var(--color-topic-player);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-topic-player-bg) 100%);border-color:var(--color-topic-player-border) }
.sg-topic-badge--player:hover { border-color:var(--color-topic-player);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-topic-player-bg) }
.sg-topic-badge--player .sg-topic-badge__priority { color:var(--color-topic-player-priority-text);background:var(--color-topic-player-priority-bg);border-color:var(--color-topic-player-priority-border) }
.sg-topic-badge--feature { color:var(--color-topic-feature);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-topic-feature-bg) 100%);border-color:var(--color-topic-feature-border) }
.sg-topic-badge--feature:hover { border-color:var(--color-topic-feature);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-topic-feature-bg) }
.sg-topic-badge--feature .sg-topic-badge__priority { color:var(--color-topic-feature-priority-text);background:var(--color-topic-feature-priority-bg);border-color:var(--color-topic-feature-priority-border) }
.sg-topic-badge--other { color:var(--color-text-tertiary);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-topic-other-bg) 100%);border-color:var(--color-topic-other-border) }
.sg-topic-badge--other:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-surface-hover) }
.sg-topic-badge--other .sg-topic-badge__priority { color:var(--color-text-secondary);background:var(--color-topic-other-priority-bg);border-color:var(--color-topic-other-priority-border) }
.sg-topic-badge--high-confidence { border-width:var(--border-width-2);border-style:solid;box-shadow:var(--shadow-sm);opacity:var(--opacity-100) }
.sg-topic-badge--high-confidence:hover { box-shadow:var(--shadow-lg) }
.sg-topic-badge--medium-confidence { border-width:var(--border-width-1);border-style:dashed;opacity:var(--opacity-85) }
.sg-topic-badge--medium-confidence:hover { border-style:solid;opacity:var(--opacity-100) }
.sg-topic-badge--low-confidence { border-width:var(--border-width-1);border-style:dotted;box-shadow:none;opacity:var(--opacity-60) }
.sg-topic-badge--low-confidence:hover { border-style:dashed;box-shadow:var(--shadow-sm);opacity:var(--opacity-85) }
.sg-topic-badge__priority--p1 { color:var(--color-neutral-0);background:var(--gradient-danger-badge);border-color:var(--color-priority-p1-border) }
.sg-topic-badge__priority--p2 { color:var(--color-neutral-0);background:var(--gradient-priority-p2);border-color:var(--color-priority-p2-border) }
.sg-topic-badge__priority--p3 { color:var(--color-neutral-0);background:var(--gradient-priority-p3);border-color:var(--color-priority-p3-border) }
.sg-topic-badge__priority--p4 { color:var(--color-neutral-0);background:var(--gradient-priority-p4);border-color:var(--color-priority-p4-border) }
.sg-topic-badge:hover { box-shadow:var(--shadow-md);transform:scale(1.02) }
.sg-topic-badge:hover .sg-topic-badge__icon { transform:scale(1.1) }
.sg-topic-badge:focus-visible,.sg-topic-badge:focus { outline:var(--border-width-3) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5);transform:scale(1.02) }
.sg-topic-badge:active { box-shadow:var(--shadow-sm);transform:scale(.98) }
.sg-topic-badge--disabled,.sg-topic-badge[disabled] { opacity:var(--opacity-40);cursor:not-allowed;pointer-events:none }
.sg-topic-badge--loading { position:relative;overflow:hidden;pointer-events:none }
.sg-topic-badge--loading:before { content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0,var(--alpha-white-20) 50%,transparent 100%);animation:badge-shimmer var(--duration-shimmer) infinite }
.sg-topic-badge--clickable { transition:transform var(--duration-fast) cubic-bezier(.34,1.56,.64,1),box-shadow var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);cursor:pointer;-webkit-user-select:none;user-select:none }
.sg-topic-badge--clickable:hover { z-index:var(--z-tooltip);box-shadow:var(--shadow-lg);transform:translateY(calc(var(--spacing-0-5)*-1)) scale(1.02) }
.sg-topic-badge--clickable:hover .sg-topic-badge__icon { transform:scale(1.15) }
.sg-topic-badge--clickable:focus-visible { z-index:var(--z-tooltip);outline:var(--border-width-3) solid var(--color-brand-primary);outline-offset:var(--spacing-1);box-shadow:var(--shadow-lg);transform:translateY(calc(var(--spacing-0-5)*-1)) scale(1.02) }
.sg-topic-badge--clickable:active { box-shadow:var(--shadow-sm);transform:translateY(0) scale(.98);transition-duration:calc(var(--duration-fast)/2) }
.sg-topic-badge__confidence-dot { position:absolute;top:calc(var(--spacing-1)*-1);right:calc(var(--spacing-1)*-1);z-index:calc(var(--z-tooltip) + 1);width:var(--spacing-2);height:var(--spacing-2);border:var(--border-width-2) solid var(--color-surface-primary);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transform:translateZ(0);transition:transform var(--duration-fast) cubic-bezier(.34,1.56,.64,1),box-shadow var(--duration-fast) var(--ease-out);will-change:transform }
.sg-topic-badge__confidence-dot--high { background:var(--color-success);animation:confidence-pulse var(--duration-pulse) cubic-bezier(.4,0,.6,1) infinite }
.sg-topic-badge__confidence-dot--medium { background:var(--color-warning) }
.sg-topic-badge__confidence-dot--low { background:var(--color-text-tertiary);opacity:var(--opacity-70) }
.sg-topic-badge--clickable:hover .sg-topic-badge__confidence-dot { box-shadow:var(--shadow-md);transform:translateZ(0) scale(1.2) }
.sg-topic-badge--auto-applied { position:relative;border-width:var(--border-width-2) }
.sg-topic-badge--auto-applied:after { position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--alpha-white-5) 100%);border-radius:inherit;pointer-events:none;content:"" }
.sg-topic-badge--manually-set { border-width:var(--border-width-3);border-style:double }
.sg-topic-badge__sr-only { position:absolute;overflow:hidden;clip:rect(0,0,0,0);width:1px;height:1px;margin:-1px;padding:0;white-space:nowrap;border-width:0 }
.sg-topic-badge--pulse { animation:badge-pulse var(--duration-pulse) cubic-bezier(.4,0,.6,1) infinite }
.sg-topic-badge--fade-in { animation:badge-fade-in var(--duration-fast) var(--ease-out) }
.sg-topic-badge-group { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-2) }
.sg-topic-badge-group--vertical { flex-direction:column;align-items:flex-start }
.sg-topic-badge--compact { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-badge);min-width:auto;background:var(--alpha-black-20);backdrop-filter:var(--backdrop-blur-light) }
.sg-topic-badge--compact .sg-topic-badge__icon { font-size:var(--text-sm) }
.sg-topic-badge--compact .sg-topic-badge__text { font-size:var(--text-badge);max-width:calc(var(--spacing-20)*5);overflow:hidden;text-overflow:ellipsis }
.sg-topic-badge--compact .sg-topic-badge__confidence-inline { display:inline-flex;align-items:center;margin-left:var(--spacing-1);font-size:var(--text-badge);opacity:var(--opacity-70) }
.sg-topic-badge--compact .sg-topic-badge__confidence-dot { position:static;display:inline-block;width:var(--spacing-1-5);height:var(--spacing-1-5);margin-left:var(--spacing-1);border:none }
.sg-topic-badge--compact .sg-topic-badge__priority { display:none }
.sg-topic-badge--compact:hover { transform:scale(1.01);box-shadow:var(--shadow-sm) }
@media (max-width:640px) { .sg-topic-suggestion { min-width:100%;max-width:100% }
.sg-topic-suggestion__actions { flex-direction:column }
.sg-topic-suggestion__actions .btn { width:100% }
.sg-topic-suggestion__tooltip { right:var(--spacing-2);left:var(--spacing-2);max-width:calc(100vw - var(--spacing-4));transform:translateX(0) }
.sg-topic-suggestion__tooltip-arrow { left:50% }
 }
@media (prefers-reduced-motion:reduce) { .sg-topic-suggestion,.sg-topic-suggestion__actions .btn,.sg-topic-suggestion__category-btn,.sg-topic-suggestion__confidence-fill,.sg-topic-suggestion__dropdown-chevron,.sg-topic-suggestion__dropdown,.sg-topic-suggestion__icon,.sg-topic-suggestion__info-btn,.sg-topic-suggestion__tooltip { transition:none;animation:none }
.sg-topic-suggestion--confirmed,.sg-topic-suggestion--loading:before { animation:none }
.sg-topic-suggestion__actions .btn:focus-visible,.sg-topic-suggestion__category-btn:focus-visible,.sg-topic-suggestion__info-btn:focus-visible { outline:var(--border-width-2) solid var(--color-focus);outline-offset:var(--spacing-0-5) }
 }
@media (prefers-contrast:more) { .sg-topic-suggestion { border-width:var(--border-width-2) }
.sg-topic-suggestion__confidence-text { font-weight:var(--font-extrabold) }
.sg-topic-suggestion--accepted,.sg-topic-suggestion--rejected,.sg-topic-suggestion__actions .btn { border-width:var(--border-width-2) }
.sg-topic-suggestion--high { border-color:var(--color-success-dark) }
.sg-topic-suggestion--moderate { border-color:var(--color-warning-dark) }
.sg-topic-suggestion--accepted { border-color:var(--color-success-dark) }
.sg-topic-suggestion--rejected { border-color:var(--color-warning-dark) }
 }
.sg-topic-suggestion { position:relative;display:flex;flex-direction:column;gap:var(--spacing-3);min-width:var(--size-dropdown-export);max-width:var(--card-min-width-sm);padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-base) cubic-bezier(.34,1.56,.64,1);backdrop-filter:var(--backdrop-blur-extra-heavy) }
.sg-topic-suggestion:hover { box-shadow:var(--shadow-md);transform:var(--transform-hover-lift-micro) }
.sg-topic-suggestion--high { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-success-subtle) 100%);border-color:var(--color-success-border) }
.sg-topic-suggestion--high:hover { border-color:var(--color-success);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-success-subtle) }
.sg-topic-suggestion--moderate { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-warning-subtle) 100%);border-color:var(--color-warning-border) }
.sg-topic-suggestion--moderate:hover { border-color:var(--color-warning);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-warning-subtle) }
.sg-topic-suggestion--low { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-surface-overlay) 100%);border-color:var(--color-border-strong) }
.sg-topic-suggestion--low:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-md),0 0 0 var(--spacing-0-5) var(--color-surface-hover) }
.sg-topic-suggestion__header { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.sg-topic-suggestion__icon { flex-shrink:0;font-size:var(--text-lg);line-height:1;transition:transform var(--duration-base) cubic-bezier(.34,1.56,.64,1) }
.sg-topic-suggestion:hover .sg-topic-suggestion__icon { transform:scale(1.1) rotate(-3deg) }
.sg-topic-suggestion__label,.sg-topic-suggestion__text { flex:1;color:var(--color-text-secondary);font-weight:var(--font-medium) }
.sg-topic-suggestion__confidence-wrapper { position:relative;display:flex;align-items:center;gap:var(--spacing-1) }
.sg-topic-suggestion__confidence-text { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-bold);letter-spacing:var(--tracking-tight);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.sg-topic-suggestion--high .sg-topic-suggestion__confidence-text { color:var(--color-success-light) }
.sg-topic-suggestion--moderate .sg-topic-suggestion__confidence-text { color:var(--color-warning-light) }
.sg-topic-suggestion--low .sg-topic-suggestion__confidence-text { color:var(--color-text-tertiary) }
.sg-topic-suggestion__info-btn { display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;width:var(--spacing-5);height:var(--spacing-5);font-size:var(--text-sm);border-radius:50%;opacity:70%;transition:opacity var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out);cursor:pointer;all:unset }
.sg-topic-suggestion__info-btn:focus-visible,.sg-topic-suggestion__info-btn:hover { background:var(--color-surface-hover);outline:var(--border-width-2) solid var(--color-focus);outline-offset:var(--spacing-0-5);opacity:100% }
.sg-topic-suggestion__tooltip { position:absolute;bottom:calc(100% + var(--spacing-2));left:50%;z-index:var(--z-index-tooltip);visibility:hidden;width:max-content;min-width:var(--size-grid-column-min);max-width:var(--size-dropdown-export);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);opacity:0;transform:translateX(-50%) translateY(var(--spacing-2));transition:opacity var(--duration-base) var(--ease-out),visibility var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out);pointer-events:none }
.sg-topic-suggestion__info-btn:focus+.sg-topic-suggestion__tooltip,.sg-topic-suggestion__info-btn:hover+.sg-topic-suggestion__tooltip,.sg-topic-suggestion__tooltip:hover { visibility:visible;opacity:100%;transform:translateX(-50%) translateY(0);pointer-events:auto }
.sg-topic-suggestion__tooltip-content { padding:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.sg-topic-suggestion__tooltip-title { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.sg-topic-suggestion__tooltip-text { margin:0;color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-normal);line-height:var(--leading-relaxed) }
.sg-topic-suggestion__tooltip-arrow { position:absolute;bottom:calc(var(--spacing-2)*-1);left:50%;width:0;height:0;border-top:var(--spacing-2) solid var(--color-surface-elevated);border-right:var(--spacing-2) solid transparent;border-left:var(--spacing-2) solid transparent;filter:drop-shadow(0 1px 1px var(--alpha-black-10));transform:translateX(-50%) }
.sg-topic-suggestion__category { position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3) }
.sg-topic-suggestion__category-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);white-space:nowrap }
.sg-topic-suggestion__category-btn { all:unset;display:inline-flex;align-items:center;gap:var(--spacing-2);box-sizing:border-box;padding:var(--spacing-2) var(--spacing-4);min-width:var(--spacing-24);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-surface-hover) 100%);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-fast) cubic-bezier(.34,1.56,.64,1);cursor:pointer }
.sg-topic-suggestion__category-btn:hover { background:linear-gradient(135deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 100%);border-color:var(--color-border-strong);box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-5)*-1)) scale(1.02) }
.sg-topic-suggestion__category-btn:focus-visible { outline:var(--border-width-2) solid var(--color-focus);outline-offset:var(--spacing-0-5) }
.sg-topic-suggestion__dropdown-chevron { font-size:var(--text-sm);line-height:1;transition:transform var(--duration-fast) var(--ease-out) }
.sg-topic-suggestion__category-btn[aria-expanded=true] .sg-topic-suggestion__dropdown-chevron { transform:rotate(180deg) }
.sg-topic-suggestion__dropdown { position:absolute;top:calc(100% + var(--spacing-1));right:0;left:0;z-index:var(--z-index-dropdown);visibility:hidden;background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);opacity:0;transform:var(--transform-dropdown-enter);transition:opacity var(--duration-fast) var(--ease-out),visibility var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);pointer-events:none }
.sg-topic-suggestion__dropdown[aria-hidden=false] { visibility:visible;opacity:100%;transform:translateY(0);pointer-events:auto }
.sg-topic-suggestion__confidence-bar { position:relative;overflow:hidden;width:100%;height:var(--spacing-2);background:var(--color-surface-primary);border-radius:var(--radius-base);box-shadow:inset 0 var(--border-width-1) var(--spacing-1) var(--alpha-black-10) }
.sg-topic-suggestion__confidence-fill { height:100%;border-radius:var(--radius-base);transition:width var(--duration-slow) var(--ease-out) }
.sg-topic-suggestion--high .sg-topic-suggestion__confidence-fill { background:linear-gradient(90deg,var(--color-success) 0,var(--color-success-light) 100%);box-shadow:0 0 var(--spacing-2) var(--color-success-subtle) }
.sg-topic-suggestion--moderate .sg-topic-suggestion__confidence-fill { background:linear-gradient(90deg,var(--color-warning) 0,var(--color-warning-light) 100%);box-shadow:0 0 var(--spacing-2) var(--color-warning-subtle) }
.sg-topic-suggestion--low .sg-topic-suggestion__confidence-fill { background:linear-gradient(90deg,var(--color-neutral-500) 0,var(--color-neutral-400) 100%);box-shadow:0 0 var(--spacing-2) var(--alpha-white-10) }
.sg-topic-suggestion__actions { display:flex;align-items:stretch;gap:var(--spacing-2) }
.sg-topic-suggestion__actions .btn { display:flex;flex:1;justify-content:center;align-items:center;gap:var(--spacing-1);min-height:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-semibold);border:var(--border-width-1) solid transparent;border-radius:var(--radius-md);transition:all var(--duration-base) var(--ease-out);cursor:pointer }
.sg-topic-suggestion__actions .btn--success { color:var(--color-white);background:var(--color-success);border-color:var(--color-success) }
.sg-topic-suggestion__actions .btn--success:hover { background:var(--color-success-dark);border-color:var(--color-success-dark);box-shadow:var(--shadow-sm),0 0 0 var(--spacing-0-5) var(--color-success-subtle);transform:var(--transform-hover-lift-micro) }
.sg-topic-suggestion__actions .btn--success:active { transform:scale(.98) }
.sg-topic-suggestion__actions .btn--secondary { color:var(--color-text-secondary);background:var(--color-surface-primary);border-color:var(--color-border-default) }
.sg-topic-suggestion__actions .btn--secondary:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:var(--transform-hover-lift-micro) }
.sg-topic-suggestion__actions .btn--secondary:active { transform:scale(.98) }
.sg-topic-suggestion__actions .btn:focus-visible { z-index:var(--z-10);outline:var(--spacing-0-5) solid var(--color-focus);outline-offset:var(--spacing-0-5) }
.sg-topic-suggestion--loading { position:relative;overflow:hidden;pointer-events:none }
.sg-topic-suggestion--loading:before { content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0,var(--alpha-white-20) 50%,transparent 100%);animation:topic-suggestion-shimmer var(--duration-shimmer) infinite }
.sg-topic-suggestion--confirmed { min-width:auto;padding:var(--spacing-3);animation:topic-suggestion-confirm-enter var(--duration-base) var(--ease-out);backdrop-filter:var(--backdrop-blur-medium) }
.sg-topic-suggestion--accepted { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-success-subtle) 100%);border-color:var(--color-success-border) }
.sg-topic-suggestion--accepted:hover { border-color:var(--color-success);box-shadow:var(--shadow-sm),0 0 0 var(--spacing-0-5) var(--color-success-subtle) }
.sg-topic-suggestion--rejected { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-warning-subtle) 100%);border-color:var(--color-warning-border) }
.sg-topic-suggestion--rejected:hover { border-color:var(--color-warning);box-shadow:var(--shadow-sm),0 0 0 var(--spacing-0-5) var(--color-warning-subtle) }
.sg-topic-suggestion--inline { flex-direction:column;align-items:stretch;gap:var(--spacing-3);min-width:auto;max-width:none;flex:1;padding:var(--spacing-4);background:var(--color-surface-elevated);border-style:solid }
.sg-topic-suggestion--inline .sg-topic-suggestion__header { display:flex;align-items:center;gap:var(--spacing-2);width:100% }
.sg-topic-suggestion--inline .sg-topic-suggestion__icon { font-size:var(--text-lg);flex-shrink:0 }
.sg-topic-suggestion--inline .sg-topic-suggestion__text { flex:1;font-size:var(--text-sm) }
.sg-topic-suggestion--inline .sg-topic-suggestion__confidence-wrapper { flex-shrink:0 }
.sg-topic-suggestion--inline .sg-topic-suggestion__category { width:100% }
.sg-topic-suggestion--inline .sg-topic-suggestion__category-btn { width:100%;justify-content:space-between;font-size:var(--text-sm);padding:var(--spacing-2) var(--spacing-3);min-width:auto }
.sg-topic-suggestion--inline .sg-topic-suggestion__confidence-bar { width:100%;height:var(--spacing-2) }
.sg-topic-suggestion--inline .sg-topic-suggestion__actions { display:flex;flex-direction:row;gap:var(--spacing-2);width:100% }
.sg-topic-suggestion--inline .sg-topic-suggestion__actions .btn { flex:1;padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm) }
@media (max-width:480px) { .sg-topic-suggestion--inline { padding:var(--spacing-3) }
.sg-topic-suggestion--inline .sg-topic-suggestion__actions .btn { flex:1 }
 }
.sg-topic-suggestion__feedback-status { display:inline-flex;align-items:center;gap:var(--spacing-1);margin-left:auto;padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-semibold);text-transform:uppercase;letter-spacing:var(--tracking-wide);border-radius:var(--radius-full);animation:feedback-status-pulse var(--duration-base) var(--ease-out) }
.sg-topic-suggestion--accepted .sg-topic-suggestion__feedback-status { color:var(--color-success-dark);background:var(--color-success-subtle) }
.sg-topic-suggestion--corrected .sg-topic-suggestion__feedback-status,.sg-topic-suggestion--rejected .sg-topic-suggestion__feedback-status { color:var(--color-warning-dark);background:var(--color-warning-subtle) }
.sg-topic-suggestion--corrected { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-info-subtle) 100%);border-color:var(--color-info-border) }
.sg-topic-suggestion--corrected:hover { border-color:var(--color-info);box-shadow:var(--shadow-sm),0 0 0 var(--spacing-0-5) var(--color-info-subtle) }
.sg-topic-suggestion__error { display:flex;align-items:center;gap:var(--spacing-2);margin-top:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);color:var(--color-danger);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-danger-subtle);border:var(--border-width-1) solid var(--color-danger-border);border-radius:var(--radius-md);animation:error-shake var(--duration-base) var(--ease-out) }
.sg-topic-suggestion__error:before { content:"⚠️";flex-shrink:0 }
.sg-topic-suggestion__actions .btn--loading { pointer-events:none;cursor:wait;opacity:70%;position:relative }
.sg-topic-suggestion__actions .btn--loading:after { content:"";position:absolute;top:50%;left:50%;width:var(--spacing-4);height:var(--spacing-4);margin:calc(var(--spacing-2)*-1) 0 0 calc(var(--spacing-2)*-1);border-top-color:transparent;border:var(--border-width-2) solid transparent;border-top:var(--border-width-2) solid;border-radius:var(--radius-full);animation:button-spinner var(--duration-slow) linear infinite }
.sg-topic-suggestion__actions .btn--loading>* { visibility:hidden }
@media (prefers-reduced-motion:reduce) { .sg-topic-suggestion__error,.sg-topic-suggestion__feedback-status { animation:none }
.sg-topic-suggestion__actions .btn--loading:after { animation:none;border-color:currentcolor;opacity:50% }
 }
.sg-topic-selector { position:fixed;inset:var(--spacing-0);z-index:var(--z-modal-backdrop);display:none;visibility:hidden;justify-content:center;align-items:center;padding:var(--spacing-4);opacity:0;transition:opacity var(--duration-base) var(--ease-out),visibility var(--duration-base) var(--ease-out) }
.sg-topic-selector.active,.sg-topic-selector.show,.sg-topic-selector[data-visible=true] { display:flex;visibility:visible;opacity:100% }
.sg-topic-selector--loading { cursor:wait }
.sg-topic-selector--loading .sg-topic-selector__dialog { opacity:var(--opacity-60);pointer-events:none }
.sg-topic-selector__overlay { position:absolute;inset:var(--spacing-0);z-index:-1;background:var(--overlay-bg);backdrop-filter:var(--backdrop-blur-medium) }
.sg-topic-selector__dialog { position:relative;z-index:var(--z-modal);display:flex;overflow:hidden;flex-direction:column;width:90%;max-width:600px;max-height:80vh;background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);opacity:0;transform:scale(.95);transition:transform var(--duration-base) var(--ease-out),opacity var(--duration-base) var(--ease-out);animation:modal-slide-in var(--duration-medium) var(--ease-out) }
.sg-topic-selector.active .sg-topic-selector__dialog,.sg-topic-selector.show .sg-topic-selector__dialog,.sg-topic-selector[data-visible=true] .sg-topic-selector__dialog { opacity:100%;transform:scale(1) }
.sg-topic-selector__header { display:flex;flex-shrink:0;justify-content:space-between;align-items:center;padding:var(--spacing-6);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.sg-topic-selector__title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.sg-topic-selector__close { position:relative;z-index:var(--z-popover);padding:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-2xl);line-height:1;background:transparent;border:none;transition:color var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-topic-selector__close:hover { color:var(--color-text-primary) }
.sg-topic-selector__close:focus { color:var(--color-text-primary);outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.sg-topic-selector__body { overflow-y:auto;flex:1 1 auto;padding:var(--spacing-6) }
.sg-topic-selector__search { position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;margin-bottom:var(--spacing-6);padding:var(--spacing-4) var(--spacing-0);background:var(--color-surface-primary) }
.sg-topic-selector__search-input { flex:1;padding:var(--spacing-3) var(--spacing-4);padding-left:var(--spacing-10);color:var(--color-text-primary);font-family:inherit;font-size:var(--text-base);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out) }
.sg-topic-selector__search-input::placeholder { color:var(--color-text-muted) }
.sg-topic-selector__search-input:focus { border-color:var(--input-border-focus);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.sg-topic-selector__search-icon { position:absolute;left:var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-lg);pointer-events:none }
.sg-topic-selector__groups { display:flex;flex-direction:column;gap:var(--spacing-4) }
.sg-topic-selector__group { border:var(--border-width-1) solid var(--color-border-subtle);border-radius:var(--radius-lg);transition:border-color var(--duration-fast) var(--ease-out) }
.sg-topic-selector__group:hover { border-color:var(--color-border-default) }
.sg-topic-selector__group--collapsed .sg-topic-selector__list { display:none }
.sg-topic-selector__group--collapsed .sg-topic-selector__group-header:after { transform:rotate(0deg) }
.sg-topic-selector__group-header { position:relative;display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4) var(--spacing-5);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold);background:var(--color-surface-elevated);border:none;border-radius:var(--radius-lg) var(--radius-lg) var(--spacing-0) var(--spacing-0);transition:background-color var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-topic-selector__group-header:hover { background:var(--color-surface-overlay) }
.sg-topic-selector__group-header:focus { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:calc(var(--focus-ring-offset)*-1) }
.sg-topic-selector__group-header:after { display:inline-block;width:var(--spacing-3);height:var(--spacing-3);margin-left:var(--spacing-2);border-width:0 var(--border-width-2) var(--border-width-2) 0;border-style:solid;border-color:var(--color-text-secondary);transform:rotate(45deg);transition:transform var(--duration-fast) var(--ease-out);content:"" }
.sg-topic-selector__list { display:flex;flex-direction:column;padding:var(--spacing-2) }
.sg-topic-selector__item { display:flex;align-items:flex-start;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);background:transparent;border:var(--border-width-1) solid transparent;border-radius:var(--radius-md);transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-topic-selector__item:hover { background:var(--color-surface-hover);border-color:var(--color-border-subtle);transform:translateX(var(--spacing-1)) }
.sg-topic-selector__item--focused,.sg-topic-selector__item:focus { background:var(--color-surface-hover);border-color:var(--color-brand-primary);outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.sg-topic-selector__item--selected { background:var(--color-card-background-selected);border-color:var(--color-brand-primary) }
.sg-topic-selector__item--selected:hover { background:var(--color-card-background-selected-hover) }
.sg-topic-selector__item--highlighted { background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary) }
.sg-topic-selector__item-icon { flex-shrink:0;width:var(--spacing-6);height:var(--spacing-6);font-size:var(--text-lg);line-height:var(--spacing-6);text-align:center }
.sg-topic-selector__item-name { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-medium) }
.sg-topic-selector__item-desc { margin:var(--spacing-1) var(--spacing-0) var(--spacing-0);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.sg-topic-selector__details { display:none;padding:var(--spacing-6);background:var(--color-surface-elevated);border-top:var(--border-width-1) solid var(--color-border-subtle) }
.sg-topic-selector--has-selection .sg-topic-selector__details { display:block }
.sg-topic-selector__priority { margin-bottom:var(--spacing-6) }
.sg-topic-selector__priority h4 { margin:var(--spacing-0) var(--spacing-0) var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.sg-topic-selector__priority-options { display:flex;gap:var(--spacing-2) }
.sg-topic-selector__priority-button { flex:1;padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-overlay);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-full);transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-topic-selector__priority-button:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:var(--transform-hover-lift-micro) }
.sg-topic-selector__priority-button:focus { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.sg-topic-selector__priority-button--p0 { color:var(--color-danger);border-color:var(--color-danger-border) }
.sg-topic-selector__priority-button--p0.active,.sg-topic-selector__priority-button--p0:hover { color:var(--color-text-on-dark);background:var(--gradient-danger-enhanced);border-color:var(--color-danger);box-shadow:var(--shadow-badge-glow-danger) }
.sg-topic-selector__priority-button--p1 { color:var(--color-danger-light);border-color:var(--color-danger-border-poor) }
.sg-topic-selector__priority-button--p1.active,.sg-topic-selector__priority-button--p1:hover { color:var(--color-text-on-dark);background:var(--gradient-danger-badge);border-color:var(--color-danger-light) }
.sg-topic-selector__priority-button--p2 { color:var(--color-warning);border-color:var(--color-warning-border) }
.sg-topic-selector__priority-button--p2.active,.sg-topic-selector__priority-button--p2:hover { color:var(--color-text-on-dark);background:var(--gradient-priority-p2);border-color:var(--color-warning) }
.sg-topic-selector__priority-button--p3 { color:var(--color-info);border-color:var(--color-info-border) }
.sg-topic-selector__priority-button--p3.active,.sg-topic-selector__priority-button--p3:hover { color:var(--color-text-on-dark);background:var(--gradient-priority-p3);border-color:var(--color-info) }
.sg-topic-selector__priority-button--p4 { color:var(--color-text-muted);border-color:var(--color-border-default) }
.sg-topic-selector__priority-button--p4.active,.sg-topic-selector__priority-button--p4:hover { color:var(--color-text-on-dark);background:var(--gradient-priority-p4);border-color:var(--color-neutral-500) }
.sg-topic-selector__products { margin-bottom:var(--spacing-0) }
.sg-topic-selector__products h4 { margin:var(--spacing-0) var(--spacing-0) var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.sg-topic-selector__products-grid { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:repeat(2,1fr) }
.sg-topic-selector__product-item { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3);background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-subtle);border-radius:var(--radius-md);transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-topic-selector__product-item:hover { background:var(--color-surface-hover);border-color:var(--color-border-default) }
.sg-topic-selector__product-item input[type=checkbox] { flex-shrink:0;width:var(--spacing-4);height:var(--spacing-4);cursor:pointer }
.sg-topic-selector__product-item label { flex:1;color:var(--color-text-primary);font-size:var(--text-sm);cursor:pointer }
.sg-topic-selector__footer { display:flex;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--spacing-3);padding:var(--spacing-6);background:var(--color-surface-overlay);border-top:var(--border-width-1) solid var(--color-border-subtle) }
.sg-topic-selector__apply,.sg-topic-selector__cancel { padding:var(--button-padding-y) var(--button-padding-x);font-size:var(--button-font-size);font-weight:var(--button-font-weight);border-radius:var(--button-radius);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-topic-selector__cancel { color:var(--color-text-primary);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default) }
.sg-topic-selector__cancel:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.sg-topic-selector__cancel:focus { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.sg-topic-selector__apply { color:var(--color-text-on-dark);background:var(--button-gradient-send);border:none;box-shadow:var(--button-shadow-send) }
.sg-topic-selector__apply:hover { background:var(--button-gradient-send-hover);box-shadow:var(--button-shadow-send-hover);transform:var(--transform-hover-lift-micro) }
.sg-topic-selector__apply:focus { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.sg-topic-selector__apply:disabled { opacity:var(--opacity-50);cursor:not-allowed;pointer-events:none }
.sg-topic-selector__item { animation:item-fade-in var(--duration-fast) var(--ease-out) }
@media (max-width:768px) { .sg-topic-selector__dialog { width:95%;max-height:95vh }
.sg-topic-selector__body,.sg-topic-selector__footer,.sg-topic-selector__header { padding:var(--spacing-4) }
.sg-topic-selector__products-grid { grid-template-columns:1fr }
.sg-topic-selector__priority-options { flex-wrap:wrap }
.sg-topic-selector__priority-button { flex-basis:calc(50% - var(--spacing-1)) }
 }
@media (max-width:480px) { .sg-topic-selector { padding:var(--spacing-0) }
.sg-topic-selector__dialog { width:100%;height:100%;max-height:100%;border-radius:0 }
 }
.sg-topic-selector.active,.sg-topic-selector.show,.sg-topic-selector[data-visible=true] { isolation:isolate }
@media (prefers-contrast:more) { .sg-topic-selector__item--selected,.sg-topic-selector__priority-button.active { border-width:var(--border-width-2) }
 }
@media (prefers-reduced-motion:reduce) { .sg-topic-selector,.sg-topic-selector__dialog,.sg-topic-selector__group-header:after,.sg-topic-selector__item { transition:none;animation:none }
.sg-topic-selector__item:hover { transform:none }
 }
body.sg-topic-selector-open { overflow:hidden }
.metric-card-v2__header { padding:0;background:transparent;border:none }
.metric-card-v2__title { margin:0;padding:0;background:transparent;border:none }
.metric-card-v2__title i { display:inline-block;width:auto;height:auto;margin-right:var(--spacing-2);padding:0;background:transparent }
.metric-card-v2__header:after,.metric-card-v2__header:before,.metric-card-v2__title:after,.metric-card-v2__title:before { display:none }
.metric-card-v2 i { flex-shrink:0;line-height:1 }
.metric-card-v2 .sg-card__header,.metric-card-v2 .sg-sg-sg-card { margin:0;padding:0;background:transparent;border:none }
.metric-card-cat { position:relative;overflow:hidden;padding:var(--spacing-6);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);transition:transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out) }
.metric-card-cat:before { position:absolute;top:0;bottom:0;left:0;width:var(--spacing-1);background:var(--color-border-default);transition:background var(--duration-fast) var(--ease-out);content:"" }
.metric-card-cat:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-lg);transform:translateY(-2px) }
.metric-card-cat:hover:before { background:var(--color-brand-primary) }
.metric-card-cat__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3) }
.metric-card-cat__icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);font-size:var(--text-xl);background:var(--color-surface-elevated);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.metric-card-cat:hover .metric-card-cat__icon { transform:scale(1.1) }
.metric-card-cat__value { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-5xl);font-weight:var(--font-bold);line-height:var(--leading-tight);transition:color var(--duration-medium) var(--ease-out) }
.metric-card-cat__label { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);letter-spacing:var(--tracking-wider);text-transform:uppercase }
.metric-card-cat__status { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-surface-elevated);border-radius:var(--radius-md) }
.metric-card-cat__trend { position:absolute;top:var(--spacing-4);right:var(--spacing-4);display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-sm);font-weight:var(--font-semibold);border-radius:var(--radius-full) }
.metric-card-cat__trend-icon { display:flex;justify-content:center;align-items:center }
.metric-card-cat__trend--up { color:var(--color-success-text);background:var(--color-success-subtle) }
.metric-card-cat__trend--down { color:var(--color-danger-text);background:var(--color-danger-subtle) }
.metric-card-cat__trend--neutral { color:var(--color-text-tertiary);background:var(--color-surface-elevated) }
.metric-card-cat--categories:before { background:var(--color-info) }
.metric-card-cat--categories .metric-card-cat__icon,.metric-card-cat--categories .metric-card-cat__status { color:var(--color-info-text);background:var(--color-info-subtle) }
.metric-card-cat--rules:before { background:var(--color-warning) }
.metric-card-cat--rules .metric-card-cat__icon,.metric-card-cat--rules .metric-card-cat__status { color:var(--color-warning-text);background:var(--color-warning-subtle) }
.metric-card-cat--tagged:before { background:var(--color-success) }
.metric-card-cat--tagged .metric-card-cat__icon { color:var(--color-success-text);background:var(--color-success-subtle) }
.metric-card-cat--tagged .metric-card-cat__value { background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-light) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.metric-card-cat--accuracy:before { background:var(--color-brand-primary) }
.metric-card-cat--accuracy .metric-card-cat__icon { color:var(--color-brand-primary);background:var(--color-brand-primary-subtle) }
.metric-card-cat--accuracy .metric-card-cat__value { background:linear-gradient(135deg,var(--color-brand-primary) 0,var(--color-brand-primary-light) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.metric-card-cat__progress { position:relative;overflow:hidden;height:var(--spacing-1-5);margin-top:var(--spacing-3);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.metric-card-cat__progress-fill { position:relative;height:100%;background:linear-gradient(90deg,var(--color-brand-primary) 0,var(--color-brand-primary-light) 100%);border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.metric-card-cat__progress-fill:after { position:absolute;inset:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--color-neutral-0) 30%,transparent),transparent);transform:translateX(-100%);animation:shimmer-cat 2s infinite;content:"" }
.metric-card-cat--loading .metric-card-cat__value { color:transparent;background:var(--color-surface-elevated);border-radius:var(--radius-md);animation:pulse-cat 1.5s infinite }
.metric-card-cat__sparkline { height:var(--size-sparkline);margin-top:var(--spacing-3);opacity:60%;transition:opacity var(--duration-fast) var(--ease-out) }
.metric-card-cat:hover .metric-card-cat__sparkline { opacity:100% }
@media (max-width:768px) { .sg-metric-card { padding:var(--spacing-4) }
.sg-metric-card__value { font-size:var(--text-3xl) }
.sg-metric-card__icon { width:40px;height:40px;font-size:var(--text-xl) }
 }
@media (prefers-reduced-motion:reduce) { .sg-metric-card,.sg-metric-card__icon,.sg-metric-card__retry-btn,.sg-metric-card__trend--down,.sg-metric-card__trend--neutral,.sg-metric-card__trend--up,.sg-metric-card__value { transition:none;animation:none }
.sg-metric-card:hover,.sg-metric-card:hover .sg-metric-card__icon { transform:none }
.sg-metric-card__skeleton { animation:none }
 }
@media (prefers-contrast:high) { .sg-metric-card,.sg-metric-card__trend--down,.sg-metric-card__trend--neutral,.sg-metric-card__trend--up { border-width:2px }
 }
.sg-metric-card { position:relative;display:flex;overflow:hidden;flex-direction:column;gap:var(--spacing-4);padding:var(--spacing-6);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-2xl);box-shadow:var(--shadow-sm);transition:transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);will-change:transform }
.sg-metric-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-lg);transform:translateY(-2px) }
.sg-metric-card__header { display:flex;justify-content:space-between;align-items:flex-start }
.sg-metric-card__icon { display:flex;justify-content:center;align-items:center;width:48px;height:48px;color:var(--color-brand-primary);font-size:var(--text-2xl);background:var(--gradient-brand-icon);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.sg-metric-card:hover .sg-metric-card__icon { background:var(--gradient-brand-icon-hover);transform:scale(1.05) }
.sg-metric-card__body { display:flex;flex:1;flex-direction:column;gap:var(--spacing-2) }
.sg-metric-card__value { color:var(--color-text-primary);font-size:var(--text-4xl);font-weight:var(--font-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);transition:color var(--duration-medium) var(--ease-out) }
.sg-metric-card__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.sg-metric-card__trend--down,.sg-metric-card__trend--neutral,.sg-metric-card__trend--up { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out) }
.sg-metric-card__trend--up { color:var(--color-success-text);background:var(--color-success-bg);border:1px solid var(--color-success-border) }
.sg-metric-card__trend--down { color:var(--color-danger-text);background:var(--color-danger-bg);border:1px solid var(--color-danger-border) }
.sg-metric-card__trend--neutral { color:var(--color-text-tertiary);background:var(--color-surface-hover);border:1px solid var(--color-border-subtle) }
.sg-metric-card__loading { display:flex;flex-direction:column;gap:var(--spacing-3) }
.sg-metric-card__skeleton { height:56px;background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);background-size:200% 100%;border-radius:var(--radius-md);animation:skeleton-loading 1.5s ease-in-out infinite }
.sg-metric-card__error { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);text-align:center }
.sg-metric-card__error-icon { color:var(--color-danger);font-size:var(--text-3xl) }
.sg-metric-card__error-message { color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-metric-card__retry-btn { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-hover);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-metric-card__retry-btn:hover { background:var(--color-surface-overlay);border-color:var(--color-border-strong);box-shadow:var(--shadow-sm);transform:translateY(-1px) }
.sg-metric-card__retry-btn:active { box-shadow:none;transform:translateY(0) }
.sg-metric-card--success .sg-metric-card__value { background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-high-contrast) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.sg-metric-card--warning .sg-metric-card__value { background:linear-gradient(135deg,var(--color-warning) 0,var(--color-warning-high-contrast) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.sg-metric-card--danger .sg-metric-card__value { background:linear-gradient(135deg,var(--color-danger) 0,var(--color-danger-high-contrast) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.sg-metric-card--info .sg-metric-card__value { background:linear-gradient(135deg,var(--color-info) 0,var(--color-info-high-contrast) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.sg-metric-card:focus-within { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.sg-metric-card__retry-btn:focus { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.visually-hidden { position:absolute;overflow:hidden;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;padding:0;white-space:nowrap;border:0 }
@media (max-width:var(--breakpoint-md )) { .sg-metric--linear,.sg-metric--stripe,.sg-metric--vercel { padding:var(--spacing-5) }
.sg-metric--linear .sg-metric__value,.sg-metric--stripe .sg-metric__value,.sg-metric--vercel .sg-metric__value { font-size:var(--text-3xl) }
 }
@media (prefers-reduced-motion:reduce) { .sg-metric--linear,.sg-metric--stripe,.sg-metric--vercel,.sg-metric,.sg-metric__progress-fill,.sg-metric__retry-btn,.sg-metric__sparkline-bar { transition:none;animation:none }
.sg-metric--linear:hover,.sg-metric--vercel:hover { transform:none }
.sg-metric__skeleton { animation:none }
 }
@media (prefers-contrast:high) { .sg-metric--linear,.sg-metric--stripe,.sg-metric--vercel { border-width:2px }
 }
.sg-metric { position:relative;transition:all var(--duration-medium) cubic-bezier(.4,0,.2,1) }
.sg-metric--vercel { padding:var(--spacing-7);background:var(--glass-bg-dark);border:1px solid var(--glass-border);border-radius:var(--radius-2xl);box-shadow:0 4px 12px var(--alpha-black-15),0 1px 3px var(--alpha-black-10);backdrop-filter:var(--backdrop-blur-medium) }
.sg-metric--vercel:hover { box-shadow:0 12px 32px var(--alpha-black-20),0 2px 8px var(--alpha-black-15);transform:translateY(-4px) }
.sg-metric--vercel .sg-metric__icon-container { display:flex;justify-content:center;align-items:center;width:40px;height:40px;margin-bottom:var(--spacing-4);background:linear-gradient(135deg,var(--color-primary-dark) 0,var(--color-primary) 100%);border-radius:var(--radius-lg) }
.sg-metric--vercel .sg-metric__icon-container i { color:var(--color-text-on-dark);font-size:var(--text-xl) }
.sg-metric--vercel .sg-metric__value { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-4xl);font-weight:var(--font-bold);line-height:var(--leading-none) }
.sg-metric--vercel .sg-metric__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.sg-metric--vercel .sg-metric__trend { display:inline-flex;align-items:center;gap:var(--spacing-1);margin-top:var(--spacing-3);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-md) }
.sg-metric--vercel .sg-metric__trend--up { color:var(--color-success-foreground);background:var(--color-success-bg) }
.sg-metric--vercel .sg-metric__trend--down { color:var(--color-danger-high-contrast);background:var(--color-danger-bg) }
.sg-metric--linear { position:relative;overflow:hidden;padding:var(--spacing-7);background:var(--alpha-white-98,hsla(0,0%,100%,.98));border:1px solid var(--overlay-medium);border-radius:var(--radius-2xl);box-shadow:0 4px 16px var(--alpha-black-15),0 1px 4px var(--alpha-black-10);backdrop-filter:blur(10px) }
.sg-metric--linear:before { position:absolute;top:0;right:0;left:0;height:3px;background:linear-gradient(90deg,var(--color-primary-dark) 0,var(--color-primary) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);content:"" }
.sg-metric--linear:hover:before { opacity:100% }
.sg-metric--linear:hover { border-color:var(--color-brand-primary-40);box-shadow:0 16px 40px var(--color-brand-primary-30),0 4px 16px var(--alpha-black-15);transform:translateY(-4px) }
.sg-metric--linear .sg-metric__header { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-5) }
.sg-metric--linear .sg-metric__icon-badge { display:flex;justify-content:center;align-items:center;width:44px;height:44px;background:linear-gradient(135deg,var(--color-primary-dark) 0,var(--color-primary) 100%);border-radius:var(--radius-xl);box-shadow:0 4px 12px var(--color-brand-primary-30) }
.sg-metric--linear .sg-metric__icon-badge i { color:var(--color-text-on-dark);font-size:var(--text-xl) }
.sg-metric--linear .sg-metric__value { margin-bottom:var(--spacing-2);font-size:42px;font-weight:var(--font-semibold);line-height:var(--leading-none);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-primary-dark) 100%);background-clip:text;-webkit-text-fill-color:transparent }
.sg-metric--linear .sg-metric__label { margin-bottom:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-base);font-weight:var(--font-medium) }
.sg-metric--linear .sg-metric__progress { overflow:hidden;height:4px;background:var(--glass-bg-medium);border-radius:var(--radius-sm) }
.sg-metric--linear .sg-metric__progress-fill { height:100%;background:linear-gradient(90deg,var(--color-primary-dark) 0,var(--color-primary) 100%);border-radius:var(--radius-sm);transition:width 1s cubic-bezier(.4,0,.2,1) }
.sg-metric--linear .sg-metric__sparkline { display:flex;align-items:flex-end;gap:3px;height:40px;margin-top:var(--spacing-4) }
.sg-metric--linear .sg-metric__sparkline-bar { flex:1;background:linear-gradient(180deg,var(--color-primary-dark) 0,var(--color-primary) 100%);border-radius:var(--radius-sm);opacity:60%;transition:all var(--duration-medium) var(--ease-out) }
.sg-metric--linear .sg-metric__sparkline-bar:hover { opacity:100%;transform:scaleY(1.05) }
.sg-metric--stripe { padding:var(--spacing-7);background:var(--glass-bg-dark);border:1px solid var(--glass-border);border-radius:var(--radius-2xl);box-shadow:0 4px 12px var(--alpha-black-15),0 1px 3px var(--alpha-black-10);backdrop-filter:var(--backdrop-blur-medium) }
.sg-metric--stripe:hover { border-color:var(--color-brand-primary);box-shadow:0 8px 24px var(--alpha-black-15),0 2px 8px var(--alpha-black-10);transform:translateY(-2px) }
.sg-metric--stripe .sg-metric__top { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-6) }
.sg-metric--stripe .sg-metric__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);letter-spacing:.5px;text-transform:uppercase }
.sg-metric--stripe .sg-metric__badge { padding:var(--spacing-1) var(--spacing-2);color:var(--color-brand-primary);font-size:11px;font-weight:var(--font-semibold);letter-spacing:.5px;text-transform:uppercase;background:var(--color-brand-primary-subtle);border-radius:var(--radius-xl) }
.sg-metric--stripe .sg-metric__badge--success { color:var(--color-success-foreground);background:var(--color-success-bg) }
.sg-metric--stripe .sg-metric__badge--warning { color:var(--color-warning-foreground);background:var(--color-warning-bg) }
.sg-metric--stripe .sg-metric__badge--danger { color:var(--color-danger-high-contrast);background:var(--color-danger-bg) }
.sg-metric--stripe .sg-metric__value { margin-bottom:var(--spacing-3);color:var(--color-text-primary);font-size:40px;font-weight:var(--font-semibold);line-height:var(--leading-none);background:none;-webkit-text-fill-color:var(--color-text-primary) }
.sg-metric--stripe .sg-metric__subtitle { margin-bottom:var(--spacing-5);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-metric--stripe .sg-metric__stat-row { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3) 0;border-top:1px solid var(--glass-border) }
.sg-metric--stripe .sg-metric__stat-row:first-of-type { border-top:1px solid var(--glass-border) }
.sg-metric--stripe .sg-metric__stat-label { color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-normal) }
.sg-metric--stripe .sg-metric__stat-value { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.sg-metric__loading { display:flex;flex-direction:column;gap:var(--spacing-3) }
.sg-metric__skeleton { height:56px;background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);background-size:200% 100%;border-radius:var(--radius-md);animation:skeleton-shimmer 1.5s ease-in-out infinite }
.sg-metric__error { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);text-align:center }
.sg-metric__error-icon { color:var(--color-danger);font-size:var(--text-3xl) }
.sg-metric__error-message { color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-metric__retry-btn { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-hover);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-metric__retry-btn:hover { background:var(--color-surface-overlay);border-color:var(--color-border-strong);box-shadow:var(--shadow-sm);transform:translateY(-1px) }
.sg-metric:focus-within { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:2px }
.sg-metric__retry-btn:focus { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:2px }
.sg-metric .visually-hidden { position:absolute;overflow:hidden;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;padding:0;white-space:nowrap;border:0 }
.metrics-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(320px,1fr));margin-bottom:var(--spacing-8) }
@media (max-width:768px) { .metrics-grid { gap:var(--spacing-4);grid-template-columns:1fr }
 }
@media (min-width:1400px) { .metrics-grid { grid-template-columns:repeat(4,1fr) }
 }
@media (max-width:768px) { .sg-stripe-metric { gap:var(--spacing-4);padding:var(--spacing-5) }
.sg-stripe-metric__icon { width:var(--size-icon-md);height:var(--size-icon-md);font-size:var(--text-xl) }
.sg-stripe-metric__value { font-size:var(--text-3xl) }
 }
@media (prefers-reduced-motion:reduce) { .sg-stripe-metric,.sg-stripe-metric:before,.sg-stripe-metric__icon,.sg-stripe-metric__trend,.sg-stripe-metric__value { transition:none;animation:none }
.sg-stripe-metric:hover,.sg-stripe-metric:hover .sg-stripe-metric__icon { transform:none }
.sg-stripe-metric__skeleton { animation:none }
 }
@media (prefers-contrast:high) { .sg-stripe-metric,.sg-stripe-metric__trend { border-width:var(--border-width-2) }
 }
.sg-stripe-metric { position:relative;display:flex;overflow:hidden;flex-direction:column;gap:var(--spacing-5);padding:var(--spacing-7);background:var(--alpha-white-10);border:1px solid var(--alpha-white-20);border-radius:var(--radius-2xl);box-shadow:var(--metric-card-shadow);transition:transform var(--duration-medium) var(--ease-out),box-shadow var(--duration-medium) var(--ease-out),border-color var(--duration-medium) var(--ease-out);animation:stripeMetricEnter var(--duration-slow) var(--ease-bounce);will-change:transform;backdrop-filter:var(--backdrop-blur-extra-heavy) }
.sg-stripe-metric:first-child { animation-delay:var(--delay-stagger-1) }
.sg-stripe-metric:nth-child(2) { animation-delay:var(--delay-stagger-2) }
.sg-stripe-metric:nth-child(3) { animation-delay:var(--delay-stagger-3) }
.sg-stripe-metric:nth-child(4) { animation-delay:var(--delay-stagger-4) }
.sg-stripe-metric:hover { border-color:var(--color-border-strong);box-shadow:var(--metric-card-shadow-hover);transform:translateY(var(--animation-metric-hover-lift)) }
.sg-stripe-metric:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--alpha-white-5) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none }
.sg-stripe-metric:hover:before { opacity:100% }
.sg-stripe-metric__header { display:flex;justify-content:space-between;align-items:flex-start }
.sg-stripe-metric__icon { display:flex;justify-content:center;align-items:center;width:var(--size-icon-lg);height:var(--size-icon-lg);font-size:var(--text-2xl);border-radius:var(--radius-xl);box-shadow:0 4px 12px var(--alpha-black-15),0 1px 3px var(--alpha-black-10);transition:transform var(--duration-medium) var(--ease-out) }
.sg-stripe-metric:hover .sg-stripe-metric__icon { transform:scale(1.1) }
.sg-stripe-metric--primary .sg-stripe-metric__icon { color:var(--color-text-on-dark);background:var(--gradient-primary-enhanced) }
.sg-stripe-metric--success .sg-stripe-metric__icon { color:var(--color-text-on-dark);background:var(--gradient-success-enhanced) }
.sg-stripe-metric--info .sg-stripe-metric__icon { color:var(--color-text-on-dark);background:var(--gradient-info-enhanced) }
.sg-stripe-metric--warning .sg-stripe-metric__icon { color:var(--color-text-on-dark);background:var(--gradient-warning-enhanced) }
.sg-stripe-metric__trend { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out) }
.sg-stripe-metric__trend--up { color:var(--color-success);background:var(--color-success-bg);border:1px solid var(--color-success-border) }
.sg-stripe-metric__trend--down { color:var(--color-danger);background:var(--color-danger-bg);border:1px solid var(--color-danger-border) }
.sg-stripe-metric__trend--neutral { color:var(--color-text-tertiary);background:var(--color-surface-hover);border:1px solid var(--color-border-subtle) }
.sg-stripe-metric__body { display:flex;flex-direction:column;gap:var(--spacing-2) }
.sg-stripe-metric__value { color:var(--color-text-primary);font-size:var(--text-4xl);font-weight:var(--font-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);transition:color var(--duration-medium) var(--ease-out) }
.sg-stripe-metric__value--updating { animation:valueUpdate var(--duration-medium) var(--ease-out) }
.sg-stripe-metric--primary .sg-stripe-metric__value { background:linear-gradient(135deg,var(--color-brand-primary) 0,var(--color-brand-primary-light) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.sg-stripe-metric--success .sg-stripe-metric__value { background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-high-contrast) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.sg-stripe-metric--info .sg-stripe-metric__value { background:linear-gradient(135deg,var(--color-info) 0,var(--color-info-high-contrast) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.sg-stripe-metric--warning .sg-stripe-metric__value { background:linear-gradient(135deg,var(--color-warning) 0,var(--color-warning-high-contrast) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.sg-stripe-metric__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.sg-stripe-metric--loading { pointer-events:none }
.sg-stripe-metric__skeleton { height:var(--spacing-20);background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);background-size:200% 100%;border-radius:var(--radius-lg);animation:shimmer var(--duration-shimmer) var(--ease-in-out) infinite }
.sg-stripe-metric--error { border-color:var(--color-danger-border) }
.sg-stripe-metric__error { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-3);text-align:center }
.sg-stripe-metric__error-icon { color:var(--color-danger);font-size:var(--text-3xl) }
.sg-stripe-metric__error-message { color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-stripe-metric:focus-within { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
@media (max-width:1024px) { .sg-metrics-grid { gap:var(--spacing-5);grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr)) }
 }
@media (max-width:768px) { .sg-metrics-grid { gap:var(--spacing-4);grid-template-columns:1fr }
 }
@media (prefers-reduced-motion:reduce) { .sg-error-state__icon,.sg-stripe-metric,.skeleton { transition:none;animation:none }
.sg-stripe-metric:hover { transform:none }
 }
@media print { .sg-metrics-grid { display:block }
.sg-stripe-metric { page-break-inside:avoid;break-inside:avoid;margin-bottom:var(--spacing-4) }
.sg-stripe-metric:hover { box-shadow:none;transform:none }
 }
.sg-metrics-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));margin:var(--spacing-6) 0;padding:0 }
.sg-metrics-grid>.sg-stripe-metric { display:flex;flex-direction:column;height:100% }
.skeleton { background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);animation:skeleton-shimmer var(--duration-slow) ease-in-out infinite }
.skeleton--icon { width:var(--spacing-12);height:var(--spacing-12);border-radius:var(--radius-xl) }
.skeleton--value { width:var(--skeleton-value-width);height:var(--spacing-12);margin-top:var(--spacing-4) }
.skeleton--label { width:var(--skeleton-label-width);height:var(--spacing-5);margin-top:var(--spacing-2) }
.skeleton--trend { width:var(--skeleton-trend-width);height:var(--spacing-6);margin-top:var(--spacing-3) }
.sg-stripe-metric--loading { padding:var(--spacing-7);background:var(--alpha-white-10);backdrop-filter:var(--backdrop-blur-medium);border-width:var(--border-width-1);border-style:solid;border-color:var(--alpha-white-20);border-radius:var(--radius-2xl) }
.sg-error-state { display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--spacing-6);padding:var(--spacing-12);text-align:center;background:var(--color-surface-primary);border-width:var(--border-width-1);border-style:solid;border-color:var(--color-border-default);border-radius:var(--radius-2xl) }
.sg-error-state__icon { color:var(--color-danger-foreground);font-size:var(--text-5xl);animation:errorPulse var(--duration-slow) ease-in-out infinite }
.sg-error-state__message { display:flex;flex-direction:column;gap:var(--spacing-2) }
.sg-error-state__message h3 { margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-semibold) }
.sg-error-state__message p { margin:0;color:var(--color-text-secondary);font-size:var(--text-base) }
@media (max-width:768px) { .charts-grid,.stats-grid { gap:var(--spacing-4);grid-template-columns:1fr }
.stat-card { min-width:auto }
.chart-card__body { height:var(--col-width-extra-wide) }
 }
@media (max-width:400px) { .stat-value { font-size:var(--text-2xl) }
.chart-card__body { height:var(--col-width-wide) }
 }
@media (prefers-reduced-motion:reduce) { .stat-card,.threshold-fill,.trend-indicator { transition:none;animation:none }
 }
@media (max-width:768px) { .stat-card[data-tooltip]:hover:before { position:fixed;top:var(--radius-full);left:var(--radius-full);z-index:2000;max-width:90vw;transform:translate(calc(var(--radius-full)*-1),calc(var(--radius-full)*-1)) }
 }
@media (max-width:400px) { .stat-card[data-tooltip]:hover:before { padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-xs);line-height:var(--line-height-enhanced) }
 }
@media (prefers-reduced-motion:reduce) { .connection-status.polling { animation:none }
 }
@media (max-width:768px) { .chart-controls { flex-direction:column;align-items:stretch }
.chart-controls__export,.chart-controls__period { justify-content:center;width:100% }
.export-btn { flex:1 }
 }
@media (prefers-reduced-motion:reduce) { .shimmer { background:var(--color-surface-elevated);animation:none }
 }
:root { --text-secondary-enhanced:var(--color-text-muted);--typographic-scale:1.125;--line-height-enhanced:1.4;--letter-spacing-enhanced:0.025em;--border-radius-enhanced:var(--radius-lg);--shadow-enhanced:0 var(--spacing-1) var(--spacing-4) var(--alpha-black-10);--transition-smooth:all 0.3s cubic-bezier(0.4,0,0.2,1);--gradient-primary:linear-gradient(135deg,var(--color-brand-primary) 0%,var(--color-brand-primary-light) 100%);--gradient-success:linear-gradient(135deg,var(--color-success) 0%,var(--color-success-dark) 100%);--gradient-warning:linear-gradient(135deg,var(--color-warning) 0%,var(--color-warning-dark) 100%);--gradient-info:linear-gradient(135deg,var(--color-info) 0%,var(--color-info-dark) 100%) }
.stat-card { min-width:var(--card-min-width-sm);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-overlay) 100%);border-radius:var(--border-radius-enhanced);box-shadow:var(--shadow-enhanced);transition:var(--transition-smooth) }
.stat-card:hover { border-color:var(--accent,var(--color-brand-primary));box-shadow:0 var(--spacing-2) var(--spacing-8) var(--color-brand-primary-alpha-20),0 0 0 var(--spacing-px) var(--color-brand-primary-alpha-10);transform:translateY(-4px) scale(1.02) }
.stat-card:focus-within { outline:var(--border-width-2) solid var(--accent,var(--color-brand-primary));outline-offset:var(--spacing-0-5) }
.stat-card--primary { background:linear-gradient(135deg,var(--color-brand-primary-alpha-10) 0,var(--color-brand-primary-subtle) 100%);border-color:var(--color-brand-primary-alpha-30) }
.stat-card__header { display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;width:100%;margin-bottom:var(--spacing-3) }
.stat-label { overflow:visible;flex-shrink:0;width:auto;color:var(--text-secondary-enhanced);letter-spacing:var(--letter-spacing-enhanced);text-overflow:clip;white-space:nowrap }
.stat-value { margin:var(--spacing-2) 0;font-weight:var(--font-light);line-height:var(--line-height-enhanced) }
.stat-icon { width:var(--spacing-10);height:var(--spacing-10);color:var(--color-text-inverse);border-radius:var(--radius-lg) }
.stat-description { overflow:visible;color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--line-height-enhanced);white-space:normal }
.stats-grid { display:grid;grid-gap:var(--spacing-8);gap:var(--spacing-8);grid-template-columns:repeat(auto-fit,minmax(calc(var(--card-min-width-sm) + var(--spacing-7-5)),1fr));width:100%;margin-bottom:var(--spacing-8) }
.charts-grid { display:grid;grid-gap:var(--spacing-8);gap:var(--spacing-8);grid-template-columns:repeat(auto-fit,minmax(var(--chart-height-desktop),1fr));margin-top:var(--spacing-8) }
.chart-card { padding:var(--spacing-6);background:var(--color-surface-primary);border-radius:var(--border-radius-enhanced);box-shadow:var(--shadow-enhanced) }
.chart-card__header { margin-bottom:var(--spacing-4) }
.chart-controls { flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-4) }
.chart-controls__export,.chart-controls__period { display:flex;gap:var(--spacing-2) }
.chart-control-btn { min-width:var(--spacing-16);transition:var(--transition-smooth) }
.chart-control-btn:hover { color:var(--color-text-primary);background:var(--color-surface-elevated);border-color:var(--color-brand-primary-alpha-30) }
.chart-control-btn:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.chart-control-btn.active { color:var(--color-white);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.chart-card__body { height:var(--card-min-width-lg) }
.performance-badge { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-semibold);text-transform:uppercase;border-radius:var(--radius-full) }
.performance-badge--excellent { color:var(--color-text-inverse);background:var(--gradient-success) }
.performance-badge--good { color:var(--color-text-inverse);background:var(--gradient-info) }
.performance-badge--fair { color:var(--color-text-inverse);background:var(--gradient-warning) }
.threshold-indicator { position:relative;height:var(--spacing-1);margin:var(--spacing-2) 0;background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.threshold-fill { height:100%;border-radius:var(--radius-full);transition:var(--transition-smooth) }
.threshold-fill.excellent { background:var(--color-success) }
.threshold-fill.good { background:var(--color-info) }
.threshold-fill.fair { background:var(--color-warning) }
.trend-indicator { display:inline-flex;align-items:center;gap:var(--spacing-1);font-size:var(--text-xs);font-weight:var(--font-medium) }
.trend-indicator.u-hidden { display:none }
.stat-card[data-tooltip] { position:relative }
.stat-card[data-tooltip]:hover:before { position:absolute;top:calc(var(--spacing-12)*-1);left:var(--radius-full);z-index:1000;max-width:var(--col-width-wide);padding:var(--spacing-3) var(--spacing-4);color:var(--text-primary,var(--color-text-primary));font-size:var(--text-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-enhanced);text-align:center;white-space:normal;background:var(--color-surface-overlay);border:1px solid var(--color-brand-primary-alpha-30);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);opacity:0;transform:translateX(calc(var(--radius-full)*-1)) translateY(-5px);animation:tooltip-in .2s ease-out forwards;content:attr(data-tooltip);backdrop-filter:blur(10px) }
.stat-card[data-tooltip]:hover:after { position:absolute;top:calc(var(--spacing-4)*-1);left:var(--radius-full);z-index:999;border-top-color:transparent;opacity:0;transform:translateX(calc(var(--radius-full)*-1));animation:tooltip-in .2s ease-out .1s forwards;content:"";border:var(--spacing-1-5) solid transparent;border-top:var(--spacing-1-5) solid var(--color-surface-overlay) }
.chart-loading { position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:var(--color-surface-primary);border-radius:var(--border-radius-enhanced) }
.chart-loading.u-hidden { display:none }
.connection-status { display:inline-flex;padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-full);transition:all .3s ease }
.connection-status.connected { color:var(--color-success-dark);background:var(--color-success-subtle);border:var(--spacing-px) solid var(--color-success-light) }
.connection-status.disconnected { color:var(--color-danger-dark);background:var(--color-danger-subtle);border:var(--spacing-px) solid var(--color-danger-light) }
.connection-status.polling { color:var(--color-warning-dark);background:var(--color-warning-subtle);border:var(--spacing-px) solid var(--color-warning-light);animation:pulse-polling 2s ease-in-out infinite }
.connection-status.demo-mode { color:var(--color-info-dark);background:var(--color-info-subtle);border:var(--spacing-px) solid var(--color-info-light) }
.connection-status i { font-size:var(--text-base) }
.health-status.health-excellent i { color:var(--chart-color-success) }
.health-status.health-warning i { color:var(--chart-color-orange) }
.health-status.health-danger i { color:var(--chart-color-danger) }
.export-btn { display:inline-flex;align-items:center;gap:var(--spacing-2);min-width:auto;min-height:var(--spacing-10);padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-medium);letter-spacing:var(--tracking-wider);text-transform:uppercase;background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-base);transition:var(--transition-smooth);cursor:pointer }
.export-btn:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-brand-primary-alpha-30);box-shadow:0 var(--spacing-1) var(--spacing-3) var(--alpha-black-10);transform:translateY(-1px) }
.export-btn:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.export-btn:active { transform:translateY(0) }
.export-btn--csv:hover { color:var(--color-success-dark);border-color:var(--color-success-border) }
.export-btn--csv:hover i { color:var(--color-success) }
.export-btn--json:hover { color:var(--color-info-dark);border-color:var(--color-info-border) }
.export-btn--json:hover i { color:var(--color-info) }
.export-btn--loading { opacity:60%;cursor:wait }
.export-btn--loading i { animation:spin 1s linear infinite }
.export-btn i { font-size:var(--text-sm);transition:var(--transition-smooth) }
.shimmer { background:linear-gradient(90deg,var(--color-surface-elevated) 0,var(--color-surface-hover) 50%,var(--color-surface-elevated) 100%);border-radius:var(--radius-base);animation:skeleton-shimmer var(--duration-shimmer) linear infinite }
.cache-metrics__demo-banner { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-6);padding:var(--spacing-4) var(--spacing-6);color:var(--color-warning-text);font-size:var(--text-sm);background:var(--color-warning-subtle);border:var(--border-width-1) solid var(--color-warning-border);border-radius:var(--radius-lg) }
.cache-metrics__demo-banner i { flex-shrink:0;color:var(--color-warning);font-size:var(--text-lg) }
.cache-metrics__real-data-badge { display:flex;align-items:center;gap:var(--spacing-2);width:fit-content;margin-bottom:var(--spacing-4);padding:var(--spacing-2) var(--spacing-4);color:var(--color-success-text);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--color-success-subtle);border:var(--border-width-1) solid var(--color-success-border);border-radius:var(--radius-full) }
.cache-metrics__real-data-badge i { color:var(--color-success);font-size:var(--text-base) }
@media (prefers-reduced-motion:reduce) { .category-card--loading .category-card__description,.category-card--loading .category-card__name,.category-card--loading .category-card__stat-value,.category-card__progress-fill:after { animation:none }
 }
.category-card { position:relative;overflow:hidden;padding:var(--spacing-5);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);transition:all var(--duration-fast) var(--ease-out) }
.category-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-lg);transform:translateY(-2px) }
.category-card:before { position:absolute;top:0;bottom:0;left:0;width:var(--spacing-1);background:var(--category-color,var(--color-brand-primary));transition:width var(--duration-fast) var(--ease-out);content:"" }
.category-card:hover:before { width:var(--spacing-1-5) }
.category-card__header { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-4) }
.category-card__info { flex:1 }
.category-card__icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);margin-bottom:var(--spacing-3);color:var(--category-color,var(--color-brand-primary));font-size:var(--text-xl);background:var(--color-surface-elevated);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.category-card:hover .category-card__icon { color:var(--color-text-inverse);background:var(--category-color,var(--color-brand-primary));transform:scale(1.1) }
.category-card__name { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.category-card__description { display:-webkit-box;overflow:hidden;color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical }
.category-card__badges { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-3) }
.category-card__badge { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-surface-elevated);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out) }
.category-card__badge i { font-size:var(--text-xs);opacity:70% }
.category-card__badge--active { color:var(--color-success);background:var(--color-success-subtle) }
.category-card__badge--rules { color:var(--color-info);background:var(--color-info-subtle) }
.category-card__badge--emails { color:var(--color-warning);background:var(--color-warning-subtle) }
.category-card__stats { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:repeat(3,1fr);margin-top:var(--spacing-4);padding-top:var(--spacing-4);border-top:1px solid var(--color-border-subtle) }
.category-card__stat { text-align:center }
.category-card__stat-value { display:block;margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-bold) }
.category-card__stat-label { color:var(--color-text-tertiary);font-size:var(--text-xs);letter-spacing:var(--tracking-wider);text-transform:uppercase }
.category-card__progress { margin-top:var(--spacing-4) }
.category-card__progress-header { display:flex;justify-content:space-between;margin-bottom:var(--spacing-2);font-size:var(--text-sm) }
.category-card__progress-label { color:var(--color-text-secondary) }
.category-card__progress-value { color:var(--color-text-primary);font-weight:var(--font-semibold) }
.category-card__progress-bar { position:relative;overflow:hidden;height:var(--spacing-2);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.category-card__progress-fill { position:relative;height:100%;background:linear-gradient(90deg,var(--category-color,var(--color-brand-primary)) 0,var(--category-color-light,var(--color-brand-primary-light)) 100%);border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.category-card__progress-fill:after { position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--alpha-white-30),transparent);transform:translateX(-100%);animation:categoryShimmer 2s infinite;content:"" }
.category-card__actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-4) }
.category-card__action { display:flex;flex:1;justify-content:center;align-items:center;gap:var(--spacing-1);padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:transparent;border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.category-card__action:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.category-card__action--primary { color:var(--color-text-inverse);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.category-card__action--primary:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark) }
.category-card__action--danger { color:var(--color-danger);border-color:var(--color-danger-subtle) }
.category-card__action--danger:hover { background:var(--color-danger-subtle);border-color:var(--color-danger) }
.category-card__entity-type { position:absolute;top:var(--spacing-3);right:var(--spacing-3);padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs);letter-spacing:var(--tracking-wider);text-transform:uppercase;background:var(--color-surface-elevated);border-radius:var(--radius-md) }
.category-card--loading { pointer-events:none }
.category-card--loading .category-card__description,.category-card--loading .category-card__name,.category-card--loading .category-card__stat-value { color:transparent;background:var(--color-surface-elevated);border-radius:var(--radius-sm);animation:categoryPulse 1.5s infinite }
.category-card--empty { display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:var(--card-min-height-category-empty);text-align:center;background:var(--color-surface-elevated);border-style:dashed;cursor:pointer }
.category-card--empty:hover { background:var(--color-surface-hover);border-color:var(--color-brand-primary) }
.category-card--empty .category-card__icon { margin-bottom:var(--spacing-3);color:var(--color-text-muted);background:transparent }
.category-card--empty .category-card__name { color:var(--color-text-secondary) }
.category-card--empty .category-card__description { color:var(--color-text-muted) }
.category-card--compact { padding:var(--spacing-3) }
.category-card--compact .category-card__icon { width:var(--spacing-8);height:var(--spacing-8);font-size:var(--text-base) }
.category-card--compact .category-card__progress,.category-card--compact .category-card__stats { display:none }
.theme-option-interactive { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);background-color:transparent;border-radius:var(--radius-md);transition:background-color var(--duration-fast);cursor:pointer }
.theme-option-interactive:hover { background-color:var(--color-surface-hover) }
.theme-indicator { flex-shrink:0;width:var(--spacing-5);height:var(--spacing-5);border:2px solid var(--color-border-default);border-radius:var(--radius-full) }
.theme-selector-menu { position:absolute;top:100%;right:0;z-index:1000;min-width:200px;padding:var(--spacing-2);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg) }
.theme-selector-toggle { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);background:var(--color-surface-secondary);border:1px solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast);cursor:pointer }
.theme-selector-toggle:hover { background:var(--color-surface-hover) }
@container (max-width: 768px) { .theme-selector-menu { right:var(--spacing-4);left:var(--spacing-4);min-width:auto }
 }
@media (prefers-color-scheme:dark) { .skeleton { background:linear-gradient(90deg,var(--color-surface-elevated) 25%,var(--color-surface-overlay) var(--radius-full),var(--color-surface-elevated) 75%) }
 }
.skeleton { animation:skeleton-loading 1.5s infinite }
.skeleton--text { height:var(--text-base);margin:var(--spacing-2) 0 }
.skeleton--title { height:var(--text-2xl);margin:var(--spacing-3) 0 }
.skeleton--paragraph { height:var(--text-base) }
.skeleton--paragraph:not(:last-child) { margin-bottom:var(--spacing-2) }
.skeleton--avatar { width:var(--spacing-12);height:var(--spacing-12);border-radius:var(--radius-full) }
.skeleton--avatar-sm { width:var(--spacing-8);height:var(--spacing-8);border-radius:var(--radius-full) }
.skeleton--avatar-lg { width:var(--spacing-16);height:var(--spacing-16);border-radius:var(--radius-full) }
.skeleton--button { width:var(--col-width-narrow);height:var(--spacing-10);border-radius:var(--radius-lg) }
.skeleton--card { height:var(--col-width-medium);border-radius:var(--radius-xl) }
.skeleton--image { width:100%;height:var(--col-width-medium);border-radius:var(--radius-lg) }
.skeleton--thumbnail { width:var(--spacing-20);height:var(--spacing-20);border-radius:var(--radius-md) }
.skeleton-container { padding:var(--spacing-4) }
.skeleton-card { margin-bottom:var(--spacing-4);padding:var(--spacing-5) }
.skeleton-card__header { align-items:center;gap:var(--spacing-3) }
.skeleton-card__body .skeleton--text:last-child { width:70% }
.skeleton-card__footer { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-4) }
.skeleton-table { width:100% }
.skeleton-table__row { display:flex;gap:var(--spacing-3);padding:var(--spacing-3) 0;border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.skeleton-table__cell { flex:1;height:var(--text-base) }
.skeleton-table__cell--narrow { flex:0.5 }
.skeleton-table__cell--wide { flex:2 }
.skeleton-list__item { align-items:center;padding:var(--spacing-3) 0 }
.skeleton-list__item:not(:last-child) { border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.skeleton-form__group { margin-bottom:var(--spacing-4) }
.skeleton-form__label { width:var(--col-width-date);height:var(--text-sm);margin-bottom:var(--spacing-2) }
.skeleton-form__input { width:100%;height:var(--spacing-10);border-radius:var(--radius-md) }
.skeleton-chart { width:100% }
.skeleton-chart:after { content:"";position:absolute;inset:var(--spacing-4);border:var(--spacing-0-5) solid var(--color-surface-hover);border-radius:var(--radius-md) }
.skeleton-shimmer { position:absolute;inset:0;background:linear-gradient(90deg,transparent 0,var(--alpha-white-40) 50%,transparent 100%);animation:shimmer 1.5s infinite;pointer-events:none }
.skeleton--pulse { background:var(--color-surface-elevated);animation:skeleton-pulse 1.5s ease-in-out infinite }
.skeleton-email-card { padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);margin-bottom:var(--spacing-3);animation:skeleton-card-fade-in var(--duration-medium) var(--ease-out) backwards }
.skeleton-email-card__header { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-3) }
.skeleton-email-card__title { display:flex;align-items:center;gap:var(--spacing-2);flex:1 }
.skeleton-email-card__badge { width:var(--spacing-14);height:var(--spacing-5);border-radius:var(--radius-sm) }
.skeleton-email-card__subject { width:70%;height:var(--text-lg);border-radius:var(--radius-sm) }
.skeleton-email-card__meta { display:flex;gap:var(--spacing-3) }
.skeleton-email-card__meta-item { width:var(--spacing-20);height:var(--text-sm);border-radius:var(--radius-sm) }
.skeleton-email-card__preview { margin-bottom:var(--spacing-3) }
.skeleton-email-card__preview-line { height:var(--text-base);margin-bottom:var(--spacing-2);border-radius:var(--radius-sm) }
.skeleton-email-card__preview-line:last-child { width:60% }
.skeleton-email-card__actions { display:flex;gap:var(--spacing-2) }
.skeleton-email-card__action { width:var(--col-width-date);height:var(--spacing-9);border-radius:var(--radius-md) }
.skeleton-email-card:first-child { animation-delay:0s }
.skeleton-email-card:nth-child(2) { animation-delay:50ms }
.skeleton-email-card:nth-child(3) { animation-delay:.1s }
.skeleton-email-card:nth-child(4) { animation-delay:.15s }
.skeleton-email-card:nth-child(5) { animation-delay:.2s }
.skeleton-email-card:nth-child(6) { animation-delay:.25s }
.skeleton-email-card:nth-child(7) { animation-delay:.3s }
.skeleton-email-card:nth-child(8) { animation-delay:.35s }
@media (prefers-reduced-motion:reduce) { .skeleton-email-card { animation:none }
.skeleton-email-card .skeleton { animation:none;background:var(--color-surface-hover) }
 }
@media (max-width:768px) { .skeleton-email-card__header { flex-direction:column;gap:var(--spacing-2) }
.skeleton-email-card__meta { width:100% }
.skeleton-email-card__subject { width:90% }
.skeleton-email-card__actions { flex-direction:column }
.skeleton-email-card__action { width:100% }
 }
.skeleton { background:var(--skeleton-gradient) }
.skeleton--brand { background:linear-gradient(90deg,var(--skeleton-base) 0,var(--skeleton-brand-hint) 25%,var(--skeleton-highlight) 50%,var(--skeleton-brand-hint) 75%,var(--skeleton-base) 100%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite }
.skeleton-card,.skeleton-email-card { background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-light);-webkit-backdrop-filter:var(--backdrop-blur-light);border-color:var(--glass-border-subtle) }
.skeleton-stat-card { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-3);padding:var(--spacing-6);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-light);-webkit-backdrop-filter:var(--backdrop-blur-light);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-lg) }
.skeleton-stat-card__value { width:var(--spacing-20);height:var(--spacing-10);border-radius:var(--radius-md) }
.skeleton-stat-card__label { width:var(--spacing-24);height:var(--spacing-3);border-radius:var(--radius-sm) }
.skeleton-communication-card { padding:var(--spacing-4);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-light);-webkit-backdrop-filter:var(--backdrop-blur-light);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-lg);margin-bottom:var(--spacing-3) }
.skeleton-communication-card__header { display:flex;justify-content:space-between;gap:var(--spacing-3);margin-bottom:var(--spacing-3) }
.skeleton-communication-card__subject { flex:1;height:var(--spacing-5) }
.skeleton-communication-card__status { width:var(--spacing-12);height:var(--spacing-5) }
.skeleton-communication-card__meta { display:flex;flex-direction:column;gap:var(--spacing-2) }
.skeleton-communication-card__recipient { height:var(--spacing-4);width:60% }
.skeleton-communication-card__date { height:var(--spacing-3);width:30% }
.skeleton-metric-row { display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-4);background:var(--glass-bg-dark);border-radius:var(--radius-md) }
.skeleton-metric-row__icon { flex-shrink:0;width:var(--spacing-10);height:var(--spacing-10);border-radius:var(--radius-md) }
.skeleton-metric-row__content { display:flex;flex:1;flex-direction:column;gap:var(--spacing-2) }
.skeleton-metric-row__label { height:var(--spacing-3);width:40% }
.skeleton-metric-row__value { height:var(--spacing-6);width:25% }
.skeleton-stagger>.skeleton:first-child,.skeleton-stagger>[class*=skeleton-]:first-child { animation-delay:0s }
.skeleton-stagger>.skeleton:nth-child(2),.skeleton-stagger>[class*=skeleton-]:nth-child(2) { animation-delay:.1s }
.skeleton-stagger>.skeleton:nth-child(3),.skeleton-stagger>[class*=skeleton-]:nth-child(3) { animation-delay:.2s }
.skeleton-stagger>.skeleton:nth-child(4),.skeleton-stagger>[class*=skeleton-]:nth-child(4) { animation-delay:.3s }
.skeleton-stagger>.skeleton:nth-child(5),.skeleton-stagger>[class*=skeleton-]:nth-child(5) { animation-delay:.4s }
@media (prefers-reduced-motion:reduce) { .skeleton--brand { animation:none;background:var(--skeleton-base);background-size:auto }
.skeleton-communication-card .skeleton,.skeleton-metric-row .skeleton,.skeleton-stat-card .skeleton { animation:none }
 }
.spinner { position:relative;display:inline-block;width:40px;height:40px }
.spinner:after { display:block;width:100%;height:100%;border-radius:var(--radius-full);animation:spinner-rotate .8s linear infinite;content:"";border:3px solid var(--color-border-default);border-top-color:var(--color-brand-primary) }
.spinner--sm { width:20px;height:20px }
.spinner--sm:after { border-width:2px }
.spinner--lg { width:60px;height:60px }
.spinner--lg:after { border-width:4px }
.spinner--xl { width:80px;height:80px }
.spinner--xl:after { border-width:5px }
.spinner--primary:after { border-top-color:var(--color-brand-primary) }
.spinner--success:after { border-top-color:var(--color-success) }
.spinner--warning:after { border-top-color:var(--color-warning) }
.spinner--danger:after { border-top-color:var(--color-danger) }
.spinner--white:after { border-color:var(--color-white-alpha-20);border-top-color:var(--color-text-inverse) }
.spinner-dots { display:inline-flex;align-items:center;gap:var(--spacing-2) }
.spinner-dots__dot { width:10px;height:10px;background:var(--color-brand-primary);border-radius:var(--radius-full);animation:dots-pulse 1.4s ease-in-out infinite both }
.spinner-dots__dot:first-child { animation-delay:-.32s }
.spinner-dots__dot:nth-child(2) { animation-delay:-.16s }
.spinner-pulse { display:inline-block;width:40px;height:40px;background:var(--color-brand-primary);border-radius:var(--radius-full);animation:pulse-spin 1.2s cubic-bezier(.455,.03,.515,.955) infinite }
.spinner-ring { display:inline-block;width:64px;height:64px }
.spinner-ring div { position:absolute;display:block;box-sizing:border-box;width:51px;height:51px;margin:6px;border:6px solid var(--color-brand-primary);border-color:var(--color-brand-primary) transparent transparent transparent;border-radius:var(--radius-full);animation:ring-rotate 1.2s cubic-bezier(.5,0,.5,1) infinite }
.spinner-ring div:first-child { animation-delay:-.45s }
.spinner-ring div:nth-child(2) { animation-delay:-.3s }
.spinner-ring div:nth-child(3) { animation-delay:-.15s }
.spinner-bars { display:inline-flex;align-items:center;gap:var(--spacing-1);height:40px }
.spinner-bars__bar { width:4px;height:100%;background:var(--color-brand-primary);border-radius:var(--radius-sm);animation:bars-wave 1s ease-in-out infinite }
.spinner-bars__bar:first-child { animation-delay:0s }
.spinner-bars__bar:nth-child(2) { animation-delay:.1s }
.spinner-bars__bar:nth-child(3) { animation-delay:.2s }
.spinner-bars__bar:nth-child(4) { animation-delay:.3s }
.spinner-bars__bar:nth-child(5) { animation-delay:.4s }
.loading-overlay { z-index:var(--z-modal);display:flex;background:var(--overlay-bg);backdrop-filter:blur(4px) }
.loading-overlay__content { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-4);padding:var(--spacing-6);background:var(--color-surface-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl) }
.loading-overlay__text { color:var(--color-text-secondary);font-size:var(--text-base);text-align:center }
.loading-inline { display:inline-flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-secondary) }
.loading-inline__spinner { width:16px;height:16px }
.loading-inline__spinner:after { border-width:2px }
.btn--loading { position:relative;color:transparent;pointer-events:none }
.btn--loading:after { position:absolute;top:50%;left:50%;width:16px;height:16px;margin-top:-8px;margin-left:-8px;border-radius:var(--radius-full);animation:spinner-rotate .8s linear infinite;content:"";border:2px solid var(--color-text-inverse);border-top:2px solid transparent }
.spinner-progress { position:relative;width:80px;height:80px }
.spinner-progress__circle { width:100%;height:100%;transform:rotate(-90deg) }
.spinner-progress__bg { fill:none;stroke:var(--color-surface-elevated);stroke-width:8 }
.spinner-progress__fill { fill:none;stroke:var(--color-brand-primary);stroke-width:8;stroke-linecap:round;stroke-dasharray:220;stroke-dashoffset:220;transition:stroke-dashoffset var(--duration-slow) var(--ease-out) }
.spinner-progress__text { position:absolute;inset:0;display:flex;justify-content:center;align-items:center;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-bold) }
.loading-text { background:linear-gradient(90deg,var(--color-text-tertiary) 0,var(--color-text-primary) 50%,var(--color-text-tertiary) 100%);background-size:200% 100%;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer-text 2s infinite }
@media (prefers-reduced-motion:reduce) { .btn--loading:after,.spinner-ring div,.spinner:after { animation:none }
.spinner-bars__bar,.spinner-dots__dot,.spinner-pulse { animation:none;opacity:100%;transform:none }
.spinner-bars__bar { transform:scaleY(.7) }
.loading-text { animation:none;background:none;-webkit-text-fill-color:var(--color-text-secondary) }
 }
.page-header { margin-bottom:var(--spacing-6) }
.page-header__title { margin:0 0 var(--spacing-2) 0;font-weight:var(--font-bold);line-height:var(--leading-tight) }
.page-header__subtitle { margin:0;line-height:var(--leading-relaxed) }
.main-content { min-height:calc(100vh - var(--header-height, 60px) - var(--footer-height, 60px)) }
.page-intro { margin-bottom:var(--spacing-10);padding:var(--spacing-10) var(--spacing-5);color:var(--color-neutral-0);text-align:center;background:linear-gradient(135deg,var(--color-brand-primary) 0,var(--color-brand-secondary) 100%) }
.page-intro h1 { margin-bottom:var(--spacing-1-25);font-size:var(--spacing-12);font-weight:600 }
.page-intro p { max-width:var(--container-md-lg);margin:0 auto;font-size:var(--spacing-4-5);opacity:90% }
.footer { margin-top:var(--spacing-10);padding:var(--spacing-5) 0;color:var(--color-neutral-600);font-size:var(--spacing-3-5);text-align:center;background:var(--color-neutral-0);border-top:var(--spacing-px) solid var(--color-neutral-200) }
@media (max-width:768px) { .page-intro h1 { font-size:var(--spacing-7) }
.page-intro p { font-size:var(--spacing-1-5) }
 }
.status-indicator { display:inline-flex;gap:var(--spacing-1-5);padding:var(--spacing-1) var(--spacing-3);font-size:var(--spacing-3);font-weight:500;border-radius:var(--spacing-5) }
.status-healthy,.status-indicator--healthy { color:var(--color-success-text);background:var(--color-success-bg) }
.status-indicator--warning,.status-warning { color:var(--color-text-muted);background:var(--color-warning-bg) }
.status-error,.status-indicator--error { color:var(--color-text-muted);background:var(--color-danger-bg) }
.status-dot { background:currentcolor;border-radius:var(--radius-full) }
.status-indicator--connected { color:var(--monitoring-success,var(--color-success)) }
.status-indicator--disconnected { color:var(--monitoring-warning,var(--color-warning)) }
.loading-screen { display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:var(--card-min-width-lg);color:var(--color-neutral-600) }
.loading-spinner-main { width:var(--spacing-12);height:var(--spacing-12);margin-bottom:var(--spacing-5);border:var(--spacing-1) solid var(--color-neutral-100);border-top:var(--spacing-1) solid var(--color-success);border-radius:var(--radius-full);animation:spin 1s linear infinite }
@media (prefers-reduced-motion:reduce) { .loading-spinner-main { animation:none;border-top-color:var(--color-success);opacity:80% }
 }
.auth-container { width:90%;max-width:var(--chart-height-desktop);padding:var(--spacing-10);background:var(--color-surface-primary);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-1) var(--spacing-1-5) var(--alpha-black-30) }
.auth-subtitle { margin-bottom:var(--spacing-7-5);color:var(--color-text-tertiary);text-align:center }
.status-card { margin-bottom:var(--spacing-5);padding:var(--spacing-5);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-strong);border-radius:var(--spacing-2) }
.status-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-1-25) }
.status-icon { display:inline-flex;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6);color:var(--color-neutral-0);font-weight:700;border-radius:var(--radius-full) }
.status-icon--connected { background:var(--color-success) }
.status-icon--disconnected { background:var(--color-danger) }
.auth-email { color:var(--color-info);font-weight:500 }
.info-box { margin-bottom:var(--spacing-5);padding:var(--spacing-1-5);background:var(--color-info-text);border:var(--spacing-px) solid var(--color-info-dark);border-radius:var(--spacing-1-5) }
.info-box h3 { margin-bottom:var(--spacing-2);color:var(--color-info-light);font-size:var(--spacing-1-5) }
.info-box p { color:var(--color-text-muted);font-size:var(--spacing-3-5);line-height:1.5 }
.accounts-list { margin-top:var(--spacing-5) }
.account-item { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2-5);padding:var(--spacing-3);background:var(--color-surface-base);border-radius:var(--spacing-1-5) }
.account-actions { display:flex;gap:var(--spacing-2-5) }
.accounts-heading { margin-bottom:var(--spacing-2-5) }
.back-link { display:inline-block;margin-top:var(--spacing-5);color:var(--color-info);font-size:var(--spacing-3-5);text-decoration:none }
.back-link:hover { text-decoration:underline }
.auth-body { display:flex;justify-content:center;align-items:center;min-height:100vh;color:var(--color-neutral-200);font-family:-apple-system,blinkmacsystemfont,Segoe UI,Roboto,sans-serif;background:var(--color-surface-base) }
.button { display:flex;justify-content:center;align-items:center;gap:var(--spacing-2-5);width:100%;padding:var(--spacing-3) var(--spacing-6);color:var(--color-text-on-dark);font-size:var(--text-sm);font-weight:var(--font-semibold);text-decoration:none;background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-primary-dark));border:var(--border-width-1) solid transparent;border-radius:var(--radius-lg);transition:transform var(--duration-fast) var(--ease-bounce),box-shadow var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);cursor:pointer }
.button:hover { background:linear-gradient(135deg,var(--color-brand-primary-light),var(--color-brand-primary));box-shadow:var(--shadow-md);border-color:var(--color-brand-primary-light);transform:translateY(-2px) }
.button:active { transform:translateY(-2px) scale(.98) }
.button:disabled { opacity:var(--opacity-50);filter:grayscale(100%);cursor:not-allowed;pointer-events:none }
.button--secondary { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-neutral-600),var(--color-neutral-700));border-color:transparent }
.button--secondary:hover { background:linear-gradient(135deg,var(--color-neutral-500),var(--color-neutral-600));box-shadow:var(--shadow-md);border-color:var(--color-neutral-400);transform:translateY(-2px) }
.button--secondary:active { transform:translateY(-2px) scale(.98) }
.button--danger { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-danger-light),var(--color-danger-dark));border-color:transparent }
.button--danger:hover { background:linear-gradient(135deg,var(--color-danger),var(--color-danger-light));box-shadow:var(--shadow-md);border-color:var(--color-danger-light);transform:translateY(-2px) }
.button--danger:active { transform:translateY(-2px) scale(.98) }
.button--small { padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-on-dark);font-size:var(--text-sm);background:linear-gradient(135deg,var(--color-neutral-700),var(--color-neutral-800));border:var(--border-width-1) solid transparent;border-radius:var(--radius-md);transition:transform var(--duration-fast) var(--ease-bounce),box-shadow var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);cursor:pointer }
.button--small:hover { background:linear-gradient(135deg,var(--color-neutral-600),var(--color-neutral-700));box-shadow:var(--shadow-sm);border-color:var(--color-neutral-500);transform:translateY(-2px) }
.button--small:active { transform:translateY(-2px) scale(.98) }
.button__google-icon { width:var(--spacing-5);height:var(--spacing-5) }
@media (prefers-reduced-motion:reduce) { .button--danger,.button--secondary,.button--small,.button { transition-duration:.01ms }
 }
.operations-grid { display:grid;grid-gap:var(--space-4,var(--spacing-4));gap:var(--space-4,var(--spacing-4));grid-template-columns:1fr;width:100%;margin:0 auto }
@media (min-width:768px) { .operations-grid { grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1536px) { .operations-grid { grid-template-columns:repeat(3,1fr) }
 }
.operation-card { position:relative;padding:var(--space-5,var(--spacing-5));background:var(--color-surface-primary,var(--gray-800));border:var(--spacing-px) solid var(--color-border,var(--gray-700));border-radius:var(--radius-lg,var(--spacing-2));transition:all .2s ease }
.operation-card:hover { border-color:var(--color-primary,var(--color-brand-primary));box-shadow:0 var(--spacing-2) var(--spacing-1-5) var(--alpha-black-10);transform:translateY(-2px) }
.operation-stats { margin-bottom:var(--spacing-3);padding:var(--space-3,var(--spacing-3));background:var(--color-surface-alt,var(--color-brand-primary-subtle));border-radius:var(--spacing-1-5) }
.operation-stats p { display:flex;justify-content:space-between;align-items:center;margin:var(--space-1,var(--spacing-1)) 0 }
.operation-stats strong { color:var(--color-primary,var(--color-brand-primary)) }
.stats-grid { grid-gap:var(--space-4,var(--spacing-4));gap:var(--space-4,var(--spacing-4));grid-template-columns:repeat(auto-fit,minmax(var(--col-width-medium),1fr));margin-bottom:var(--space-6,var(--spacing-6)) }
.stat-card { padding:var(--space-4,var(--spacing-4));background:var(--color-surface-primary,var(--gray-800));border:var(--spacing-px) solid var(--color-border,var(--gray-700));border-radius:var(--radius-lg,var(--spacing-2)) }
.stat-value { color:var(--color-primary,var(--color-brand-primary)) }
.stat-label { margin-top:var(--space-2,var(--spacing-2));color:var(--color-text-secondary,var(--gray-400));letter-spacing:var(--letter-spacing-wide) }
.clubs-list { margin-top:var(--space-3,var(--spacing-3));padding:var(--space-2,var(--spacing-2));font-size:var(--text-sm);background:var(--color-surface-secondary,var(--gray-700));border-radius:var(--radius-sm,var(--spacing-1)) }
.clubs-list strong { display:block;margin-bottom:var(--space-1,var(--spacing-1));color:var(--color-text-primary,var(--gray-100)) }
.create-operation-btn { position:fixed;right:var(--space-6,var(--spacing-6));bottom:var(--space-6,var(--spacing-6));z-index:var(--z-index-overlay);display:flex;justify-content:center;align-items:center;width:var(--nav-height);height:var(--nav-height);color:var(--color-neutral-0);background:linear-gradient(135deg,var(--color-brand-primary),var(--purple-600));border:none;border-radius:var(--radius-full);box-shadow:0 var(--spacing-1) var(--spacing-3) var(--color-brand-primary-subtle);transition:all .3s ease;cursor:pointer }
.create-operation-btn:hover { box-shadow:0 var(--spacing-1-5) var(--spacing-5) var(--color-brand-primary-alpha-80);transform:scale(1.1) }
.progress-container { margin-top:var(--space-4,var(--spacing-4)) }
.progress-bar { margin-bottom:var(--space-2,var(--spacing-2));background:var(--color-surface-secondary,var(--gray-700)) }
.progress-fill { width:var(--progress-width,0);background:linear-gradient(90deg,var(--color-brand-primary),var(--purple-600));box-shadow:0 0 var(--spacing-2-5) var(--color-brand-primary-subtle) }
.progress-text { display:block;color:var(--color-text-secondary,var(--gray-400));font-size:var(--text-sm);font-weight:600;text-align:right }
.status-badge { position:absolute;top:var(--space-3,var(--spacing-3));right:var(--space-3,var(--spacing-3));z-index:10;padding:var(--spacing-1) var(--spacing-3);font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border-radius:var(--spacing-5) }
.status-badge--active { color:var(--color-neutral-0);background:linear-gradient(135deg,var(--green-500),var(--green-600));box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--color-success-border);animation:pulse 2s infinite }
.status-badge--pending { color:var(--color-neutral-0);background:linear-gradient(135deg,var(--amber-500),var(--amber-600));box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--color-warning-border) }
.status-badge--completed { color:var(--color-neutral-0);background:linear-gradient(135deg,var(--blue-500),var(--blue-600));box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--color-info-border) }
.status-badge--paused { color:var(--color-neutral-0);background:linear-gradient(135deg,var(--gray-500),var(--gray-600));box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--color-border-strong) }
.status-badge--success { color:var(--color-neutral-0);background:linear-gradient(135deg,var(--green-500),var(--green-600));box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--color-success-border) }
.status-badge--error { color:var(--color-neutral-0);background:linear-gradient(135deg,var(--red-500),var(--red-600));box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--color-error-border) }
@media (prefers-reduced-motion:reduce) { .status-badge--active { animation:none }
 }
.showcase-container { max-width:var(--container-md);margin:0 auto;padding:var(--spacing-8) }
.showcase-body { min-height:var(--viewport-h,100vh);color:var(--color-neutral-0);font-family:system-ui,-apple-system,sans-serif;background:linear-gradient(135deg,var(--color-brand-primary) 0,var(--color-brand-primary-dark) 100%) }
.showcase-section { margin-bottom:var(--spacing-16);padding:var(--spacing-8);background:var(--alpha-white-10);border-radius:var(--spacing-1-5);backdrop-filter:blur(var(--spacing-2-5)) }
.showcase-section h2 { margin-bottom:var(--spacing-6);font-size:var(--spacing-8);text-align:center;backdrop-filter:blur(var(--spacing-2-5)) }
.demo-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-wide),1fr));margin-top:var(--spacing-8) }
.demo-card { padding:var(--spacing-6);text-align:center;background:var(--alpha-white-20);border:var(--spacing-px) solid var(--alpha-white-20);border-radius:var(--spacing-3);backdrop-filter:blur(var(--spacing-2-5)) }
.demo-button { min-width:var(--col-width-narrow);margin:var(--spacing-2);padding:var(--spacing-3) var(--spacing-6);color:var(--color-neutral-0);font-size:var(--spacing-1-5);background:linear-gradient(45deg,var(--color-success),var(--color-info));border:none;border-radius:var(--spacing-2);cursor:pointer;backdrop-filter:blur(var(--spacing-2-5)) }
.showcase-loading { display:flex;justify-content:center;align-items:center;height:var(--col-width-medium);backdrop-filter:blur(var(--spacing-2-5)) }
.showcase-back { position:fixed;top:var(--spacing-5);left:var(--spacing-5);padding:var(--spacing-3) var(--spacing-5);color:var(--color-neutral-0);text-decoration:none;background:var(--alpha-white-20);border:var(--spacing-px) solid var(--alpha-white-30);border-radius:var(--spacing-2);backdrop-filter:blur(var(--spacing-2-5)) }
.analytics-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-extra-wide),1fr));margin-bottom:var(--spacing-8) }
.analytics-metric-card { padding:var(--spacing-6);background:var(--bg-primary);border:var(--spacing-px) solid var(--border-primary);border-radius:var(--spacing-2) }
.metric-value { font-size:var(--spacing-8) }
.chart-container { height:var(--col-width-extra-wide);margin-top:var(--spacing-4) }
.recommendations-list { padding:0;list-style:none }
.recommendation-item { display:flex;align-items:start;margin-bottom:var(--spacing-2);padding:var(--spacing-4);background:var(--bg-secondary);border-left:var(--spacing-1) solid var(--color-primary);border-radius:var(--spacing-1-5) }
.recommendation-priority { display:inline-block;margin-bottom:var(--spacing-2);padding:var(--spacing-1) var(--spacing-2);font-size:var(--spacing-3);font-weight:600;border-radius:var(--spacing-1) }
.priority-high { color:var(--red-600);background:var(--color-danger-bg) }
.priority-medium { color:var(--amber-600);background:var(--color-warning-bg) }
.priority-low { color:var(--color-success-dark);background:var(--color-success-bg) }
.analytics-error { padding:var(--spacing-4);color:var(--red-600);background:var(--color-danger-bg);border:var(--spacing-px) solid var(--color-danger-light);border-radius:var(--spacing-1-5) }
.round-analytics__chart-container { position:relative;min-height:var(--size-chart-sm);padding:var(--spacing-4) }
.round-analytics__mini-chart { height:var(--size-chart-mini);margin-top:var(--spacing-4) }
.round-analytics__legend { display:flex;flex-wrap:wrap;gap:var(--spacing-4);padding-top:var(--spacing-4);border-top:var(--border-width-1) solid var(--color-border-subtle);margin-top:var(--spacing-4) }
.round-analytics__legend-item { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-sm) }
.round-analytics__legend-color { width:var(--spacing-3);height:var(--spacing-3);border-radius:var(--radius-sm);flex-shrink:0 }
.round-analytics__legend-label { color:var(--color-text-secondary) }
.round-analytics__legend-value { color:var(--color-text-primary);font-weight:var(--font-semibold);font-family:var(--font-mono) }
.round-analytics__club-link { color:var(--color-text-primary);transition:color var(--duration-fast) var(--ease-out) }
.sg-table__row--clickable { cursor:pointer;animation:fadeInUp var(--duration-medium) var(--ease-out) backwards }
.sg-table__row--clickable:hover { background:var(--color-surface-hover) }
.sg-table__row--clickable:hover .round-analytics__club-link { color:var(--color-brand-primary-light) }
.round-analytics__access-badge { display:inline-flex;align-items:center;justify-content:center;min-width:var(--spacing-12);padding:var(--spacing-1) var(--spacing-2);background:var(--color-brand-primary-subtle);color:var(--color-brand-primary-light);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-semibold);font-family:var(--font-mono) }
.round-analytics__search { position:relative;max-width:var(--size-results-min);margin-bottom:var(--spacing-6) }
.round-analytics__search-results { position:absolute;top:100%;left:0;right:0;z-index:var(--z-dropdown);display:none;max-height:var(--size-dropdown-list-max);overflow-y:auto;background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-top:none;border-radius:0 0 var(--radius-lg) var(--radius-lg);box-shadow:var(--shadow-lg) }
.round-analytics__search-item { display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-3) var(--spacing-4);cursor:pointer;transition:background var(--duration-fast) var(--ease-out) }
.round-analytics__search-item--active,.round-analytics__search-item:hover { background:var(--color-surface-hover) }
.round-analytics__search-item-name { color:var(--color-text-primary);font-weight:var(--font-medium) }
.round-analytics__search-item-meta { color:var(--color-text-muted);font-size:var(--text-sm) }
.round-analytics__search-empty { padding:var(--spacing-4);text-align:center;color:var(--color-text-muted);font-size:var(--text-sm) }
.round-analytics__detail-panel { margin-top:var(--spacing-6);padding:var(--spacing-6);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-xl) }
.round-analytics__club-header { display:flex;align-items:flex-start;justify-content:space-between;gap:var(--spacing-4);padding-bottom:var(--spacing-4);border-bottom:var(--border-width-1) solid var(--color-border-subtle);margin-bottom:var(--spacing-6) }
.round-analytics__club-info { flex:1 }
.round-analytics__club-name { margin:0 0 var(--spacing-2) 0;font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--color-text-primary) }
.round-analytics__club-meta { display:flex;gap:var(--spacing-2) }
.round-analytics__club-metrics { display:grid;grid-template-columns:repeat(4,1fr);grid-gap:var(--spacing-4);gap:var(--spacing-4);margin-bottom:var(--spacing-6) }
.round-analytics__club-stat { padding:var(--spacing-4);background:var(--color-surface-primary);border-radius:var(--radius-lg);text-align:center }
.round-analytics__club-stat-value { font-size:var(--text-2xl);font-weight:var(--font-semibold);font-family:var(--font-mono);color:var(--color-text-primary);margin-bottom:var(--spacing-1) }
.round-analytics__club-stat-label { font-size:var(--text-sm);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide) }
.round-analytics__club-channels { margin-bottom:var(--spacing-6) }
.round-analytics__section-title { font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:var(--tracking-wide);margin:0 0 var(--spacing-4) 0 }
.round-analytics__channel-bar { margin-bottom:var(--spacing-3) }
.round-analytics__channel-bar-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-1) }
.round-analytics__channel-name { font-size:var(--text-sm);color:var(--color-text-secondary) }
.round-analytics__channel-value { font-size:var(--text-sm);font-family:var(--font-mono);color:var(--color-text-primary) }
.round-analytics__channel-bar-track { height:var(--spacing-2);background:var(--color-surface-hover);border-radius:var(--radius-full);overflow:hidden }
.round-analytics__channel-bar-fill { height:100%;border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.round-analytics__empty-state { display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-12) var(--spacing-6);text-align:center }
.round-analytics__empty-icon { font-size:var(--text-5xl);color:var(--color-text-muted);margin-bottom:var(--spacing-4);opacity:var(--opacity-30) }
.round-analytics__empty-text { max-width:var(--size-dropdown-list-max);color:var(--color-text-muted);font-size:var(--text-sm);margin:0 }
.round-analytics__error { display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-8);text-align:center;color:var(--color-danger) }
.round-analytics__error i { font-size:var(--text-3xl);margin-bottom:var(--spacing-3) }
.round-analytics__error p { margin:0;font-size:var(--text-sm) }
.sg-skeleton--chart { height:var(--size-chart-sm);background:var(--skeleton-gradient);background-size:200% 100%;animation:skeleton-shimmer var(--duration-shimmer) ease-in-out infinite;border-radius:var(--radius-lg) }
.sg-skeleton--table { height:var(--size-dropdown-list-max);background:var(--skeleton-gradient);background-size:200% 100%;animation:skeleton-shimmer var(--duration-shimmer) ease-in-out infinite;border-radius:var(--radius-lg) }
.sg-skeleton--w-50 { width:50% }
.sg-skeleton--w-60 { width:60% }
.sg-skeleton--w-70 { width:70% }
.sg-skeleton--w-80 { width:80% }
.sg-tabs { display:flex;gap:var(--spacing-1);padding:var(--spacing-1);background:var(--color-surface-primary);border-radius:var(--radius-lg) }
.sg-tabs__tab { flex:1;padding:var(--spacing-2) var(--spacing-4);background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-text-muted);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:all var(--duration-fast) var(--ease-out) }
.sg-tabs__tab:hover { color:var(--color-text-secondary);background:var(--color-surface-hover) }
.sg-tabs__tab--active { background:var(--color-surface-elevated);color:var(--color-text-primary);box-shadow:var(--shadow-sm) }
.sg-tab-panel[hidden] { display:none }
.page-header__controls { display:flex;align-items:center;gap:var(--spacing-3) }
.sg-input-group { position:relative }
.sg-input-group__icon { position:absolute;left:var(--spacing-3);top:50%;transform:translateY(-50%);color:var(--color-text-muted);pointer-events:none }
.sg-input--with-icon { padding-left:var(--spacing-10) }
.sg-table__th--rank { width:var(--spacing-12);text-align:center }
.sg-table__td--rank { text-align:center;color:var(--color-text-muted);font-family:var(--font-mono) }
.sg-table__td--number,.sg-table__th--number { text-align:right;font-family:var(--font-mono) }
@media (max-width:1024px) { .round-analytics__club-metrics { grid-template-columns:repeat(2,1fr) }
 }
@media (max-width:768px) { .round-analytics__legend { flex-direction:column;gap:var(--spacing-2) }
.round-analytics__club-metrics { grid-template-columns:1fr }
.sg-tabs { flex-wrap:wrap }
.sg-tabs__tab { flex:1 1 45% }
.page-header__controls { flex-wrap:wrap }
.round-analytics__club-header { flex-direction:column }
 }
@media (prefers-reduced-motion:reduce) { .round-analytics__channel-bar-fill,.sg-skeleton--chart,.sg-skeleton--table,.sg-table__row--clickable { animation:none }
 }
.sg-dropdown { position:relative;display:inline-block }
.sg-dropdown__menu { position:absolute;top:100%;left:0;z-index:1000;visibility:hidden;min-width:var(--spacing-60);margin-top:var(--spacing-1);padding:var(--spacing-2) 0;background:var(--color-neutral-0);border:var(--spacing-px) solid var(--gray-200);border-radius:var(--spacing-2);box-shadow:0 var(--spacing-1) var(--spacing-1-5) calc(var(--spacing-px)*-1) var(--alpha-black-10),0 var(--spacing-0-5) var(--spacing-1) calc(var(--spacing-px)*-1) var(--alpha-black-5);opacity:0;transform:translateY(calc(var(--spacing-2)*-1));transition:all .15s ease-out }
.sg-dropdown--open .sg-dropdown__menu { visibility:visible;opacity:100%;transform:translateY(0) }
.sg-dropdown__item { display:block;width:100%;padding:var(--spacing-3) var(--spacing-1-5);color:var(--gray-700);font-size:var(--spacing-3-5);line-height:1.4;text-align:left;text-decoration:none;background:none;border:none;transition:background-color .15s ease;cursor:pointer }
.sg-dropdown__item:hover { background-color:var(--gray-50) }
.sg-dropdown__item:focus { background-color:var(--gray-100);outline:var(--spacing-0-5) solid var(--color-focus);outline-offset:calc(var(--spacing-px)*-1) }
.sg-dropdown__item i { width:var(--spacing-1-5);margin-right:var(--spacing-2);color:var(--gray-500) }
.sg-dropdown__item small { display:block;margin-top:var(--spacing-0-5);color:var(--gray-400);font-size:var(--spacing-3) }
.sg-dropdown__item--selected { color:var(--color-info-dark);background-color:var(--color-info-subtle) }
.sg-dropdown__item--selected i { color:var(--color-info-dark) }
.sg-dropdown__item--disabled { opacity:50%;cursor:not-allowed;pointer-events:none }
.sg-dropdown__header { color:var(--gray-700);font-size:var(--spacing-3);font-weight:600;letter-spacing:.05em;text-transform:uppercase }
.sg-dropdown__divider { height:var(--spacing-px);margin:var(--spacing-2) 0;background-color:var(--gray-200) }
.sg-button-group .sg-dropdown { margin-right:var(--spacing-2);margin-left:var(--spacing-2) }
.sg-button .fa-chevron-down { margin-left:var(--spacing-1);font-size:.75em;transition:transform .15s ease }
.sg-dropdown--open .sg-button .fa-chevron-down { transform:rotate(180deg) }
.drafts-container { max-width:var(--spacing-192);margin:0 auto }
.drafts-body { padding:var(--spacing-5);font-family:-apple-system,blinkmacsystemfont,Segoe UI,sans-serif;background:var(--color-surface-primary) }
.draft-card { gap:var(--spacing-4);min-height:var(--card-min-height-draft);margin-bottom:var(--spacing-4);background:var(--color-card-background);border:1px solid var(--color-card-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.draft-card:hover { background:var(--color-card-background-hover);border-color:var(--color-card-border-hover);box-shadow:var(--shadow-md);transform:translateY(-1px) }
.draft-card:focus-within { border-color:var(--color-brand-primary);outline:2px solid var(--color-brand-primary);outline-offset:2px }
.draft-card:active { box-shadow:var(--shadow-sm);transform:translateY(0) }
.draft-card.draft-card--selected { padding-left:calc(var(--spacing-6) - 3px);background:var(--color-card-background-selected);border-left:4px solid var(--color-brand-primary) }
.draft-card--selected:hover { background:var(--color-card-background-selected-hover);box-shadow:var(--draft-card-shadow-selected-hover),0 0 0 2px var(--color-card-background-selected) }
@media (prefers-reduced-motion:reduce) { .draft-card { animation:none }
.draft-card:active,.draft-card:hover,.draft-card { transform:none;transition:none }
 }
.draft-header { display:flex;justify-content:space-between;align-items:start;margin-bottom:var(--spacing-3) }
.draft-title { color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.draft-badge { padding:var(--spacing-1) var(--spacing-3);color:var(--color-neutral-0);font-size:var(--spacing-3);font-weight:600;background:var(--green-500);border-radius:var(--spacing-5) }
.draft-meta { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm) }
.draft-content { margin-bottom:var(--spacing-1-5);color:var(--color-text-primary);line-height:var(--leading-relaxed) }
.draft-actions { display:flex;gap:var(--spacing-2-5) }
.draft-status { margin-bottom:var(--spacing-5) }
.sg-card__sources { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-2) }
.sg-card__footer-meta { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-3) }
.draft-alert { margin-bottom:var(--spacing-5);padding:var(--spacing-3) var(--spacing-5);border-radius:var(--spacing-1-5) }
.draft-alert--warning { color:var(--color-warning-text);background:var(--amber-100);border:var(--spacing-px) solid var(--amber-500) }
.sg-text--clamp-3 { display:-webkit-box;overflow:hidden;-webkit-line-clamp:3;-webkit-box-orient:vertical }
.c-draft-card__recipient-name { display:flex;align-items:center;gap:var(--spacing-2);margin:0;margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-weight-semibold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight) }
.c-draft-card__recipient-icon { flex-shrink:0;width:var(--size-icon-sm);height:var(--size-icon-sm);color:var(--color-brand-primary-light) }
.c-draft-card__recipient-email { display:flex;align-items:center;gap:var(--spacing-1-5);margin-top:var(--spacing-1);margin-bottom:var(--spacing-3);color:var(--color-text-secondary);line-height:var(--leading-normal);opacity:60% }
.c-draft-card__email-icon { flex-shrink:0;width:var(--spacing-3-5);height:var(--spacing-3-5);opacity:70% }
.c-draft-card__subject { display:flex;align-items:flex-start;gap:var(--spacing-2);margin-top:var(--spacing-3);margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-base);font-weight:var(--font-weight-medium);line-height:var(--leading-snug) }
.c-draft-card__subject span[data-role=subject] { display:-webkit-box;overflow:hidden;min-height:calc(var(--text-base)*var(--leading-snug)*2);text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical }
.c-draft-card__subject-icon { flex-shrink:0;width:var(--spacing-4);height:var(--spacing-4);margin-top:var(--spacing-0-5);color:var(--color-text-tertiary) }
.c-draft-card__preview { display:-webkit-box;overflow:hidden;min-height:calc(var(--text-sm)*var(--leading-relaxed)*2);margin:0;margin-top:var(--spacing-2);margin-bottom:var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-weight-normal);line-height:var(--leading-relaxed);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2 }
.c-draft-card__metadata { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3);margin-top:var(--spacing-5);padding-top:var(--spacing-5);border-top:1px solid var(--color-card-divider) }
.c-draft-card__footer { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);margin-top:var(--spacing-5);padding-top:var(--spacing-5);border-top:1px solid var(--color-card-divider) }
.c-draft-card__footer-left { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-2) }
.c-draft-card__footer-right { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3);margin-left:auto }
.c-draft-card__metadata-item { display:flex;align-items:center;gap:var(--spacing-1-5);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-weight-medium);line-height:var(--leading-normal);letter-spacing:var(--tracking-wide) }
.c-draft-card__metadata-icon { flex-shrink:0;width:var(--spacing-3-5);height:var(--spacing-3-5) }
.c-draft-card__metadata-icon--time { color:var(--color-neutral-400) }
.c-draft-card__metadata-icon--type { color:var(--color-brand-primary-light) }
.c-draft-card__metadata-icon--ai { color:var(--color-info-light) }
.c-draft-card__metadata-badge { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2-5);font-size:var(--text-badge);font-weight:var(--font-weight-semibold);letter-spacing:.5px;text-transform:uppercase;border-radius:var(--radius-md) }
.c-draft-card__metadata-badge--ai { color:var(--badge-ai-color);background:var(--badge-ai-bg);border:1px solid var(--badge-ai-border) }
.c-draft-card__metadata-badge--inbound { color:var(--badge-inbound-color);background:var(--badge-inbound-bg);border:1px solid var(--badge-inbound-border) }
.c-draft-card__metadata-badge--draft-type { color:var(--badge-draft-type-color);background:var(--badge-draft-type-bg);border:1px solid var(--badge-draft-type-border) }
.c-draft-card__metadata-item--ai { padding:var(--spacing-1) var(--spacing-2);color:var(--color-info);font-weight:var(--font-weight-semibold);background:var(--color-info-subtle);border-radius:var(--radius-base) }
.c-draft-card__confidence { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-4) }
.c-draft-card__confidence-badge { display:inline-flex;justify-content:center;align-items:center;padding:var(--confidence-badge-padding);font-size:var(--confidence-badge-font-size);font-weight:var(--confidence-badge-font-weight);line-height:1;letter-spacing:var(--confidence-badge-letter-spacing);text-transform:uppercase;white-space:nowrap;border-radius:var(--radius-full);transition:transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);cursor:help }
.c-draft-card__confidence-badge--high { color:var(--color-text-on-dark);background:var(--confidence-badge-high-gradient);box-shadow:var(--confidence-badge-shadow-high) }
.c-draft-card__confidence-badge--medium { color:var(--color-text-on-dark);background:var(--confidence-badge-medium-gradient);box-shadow:var(--confidence-badge-shadow-medium) }
.c-draft-card__confidence-badge--low { color:var(--color-text-on-dark);background:var(--confidence-badge-low-gradient);box-shadow:var(--confidence-badge-shadow-low) }
.c-draft-card__confidence-progress { position:relative;overflow:hidden;flex:1;max-width:var(--confidence-progress-max-width);height:var(--confidence-progress-bar-height);background:var(--confidence-progress-track-bg);border-radius:var(--confidence-progress-bar-radius) }
.c-draft-card__confidence-bar { position:relative;width:calc(var(--width, 0)*1%);height:100%;border-radius:var(--confidence-progress-bar-radius);transition:var(--confidence-progress-transition);animation:progressFillIn .6s var(--ease-out) forwards }
.c-draft-card__confidence-bar--high { background:var(--confidence-badge-high-gradient) }
.c-draft-card__confidence-bar--medium { background:var(--confidence-badge-medium-gradient) }
.c-draft-card__confidence-bar--low { background:var(--confidence-badge-low-gradient) }
@media (max-width:480px) { .c-draft-card__confidence { flex-direction:column;align-items:flex-start;gap:var(--spacing-2) }
.c-draft-card__confidence-progress { width:100%;max-width:100% }
.c-draft-card__metadata { gap:var(--spacing-2) }
 }
@media (prefers-reduced-motion:reduce) { .c-draft-card__confidence-badge,.c-draft-card__confidence-bar { transition:none;animation:none }
 }
.c-draft-card__actions { display:flex;align-items:center;gap:var(--spacing-3);margin-top:var(--spacing-4);padding-top:var(--spacing-4);border-top:1px solid var(--color-border-subtle) }
.c-draft-card__button { display:inline-flex;justify-content:center;align-items:center;gap:var(--spacing-2);min-height:var(--spacing-10);padding:var(--spacing-2) var(--spacing-4);font-size:var(--text-sm);font-weight:var(--font-weight-medium);line-height:var(--leading-none);white-space:nowrap;border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer;-webkit-user-select:none;user-select:none }
.c-draft-card__button-icon { flex-shrink:0 }
.c-draft-card__button--send { min-height:var(--size-touch-min);padding:var(--spacing-2-5) var(--spacing-5);color:var(--color-text-on-dark);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);letter-spacing:var(--tracking-wide);background:var(--button-gradient-send);border:none;border-radius:var(--radius-lg);box-shadow:var(--button-shadow-send) }
.c-draft-card__button--send:hover { background:var(--button-gradient-send-hover);box-shadow:var(--button-shadow-send-hover);transform:translateY(-1px) }
.c-draft-card__button--send:active { box-shadow:var(--shadow-sm);transform:translateY(0) }
.c-draft-card__button--send:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.c-draft-card__button--send:disabled { opacity:50%;transform:none;cursor:not-allowed }
.c-draft-card__button--edit { padding:var(--spacing-2-5) var(--spacing-5);color:var(--button-text-edit);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);background:var(--button-bg-edit);border:1px solid var(--button-border-edit);border-radius:var(--radius-lg) }
.c-draft-card__button--edit:hover { color:var(--color-text-primary);background:var(--button-bg-edit-hover);border-color:var(--button-border-edit-hover);box-shadow:var(--shadow-sm) }
.c-draft-card__button--edit:active { transform:scale(.98) }
.c-draft-card__button--edit:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.c-draft-card__button--mark-sent { padding:var(--spacing-2-5) var(--spacing-5);color:var(--color-text-on-dark);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);background:var(--button-bg-mark-sent);border:none;border-radius:var(--radius-lg);box-shadow:var(--button-shadow-mark-sent) }
.c-draft-card__button--mark-sent:hover { background:var(--button-bg-mark-sent-hover);box-shadow:var(--button-shadow-mark-sent-hover);transform:translateY(-1px) }
.c-draft-card__button--mark-sent:active { transform:translateY(0) }
.c-draft-card__button--mark-sent:focus-visible { outline:2px solid var(--color-success);outline-offset:2px }
.c-draft-card__button--delete { padding:var(--spacing-2-5) var(--spacing-5);color:var(--button-text-delete);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);background:var(--button-bg-delete);border:1px solid var(--button-border-delete);border-radius:var(--radius-lg) }
.c-draft-card__button--delete:hover { color:var(--button-text-delete-hover);background:var(--button-bg-delete-hover);border-color:var(--button-border-delete-hover);box-shadow:var(--button-ring-delete) }
.c-draft-card__button--delete:active { background:var(--color-danger-bg);transform:scale(.98) }
.c-draft-card__button--delete:focus-visible { outline:2px solid var(--color-danger);outline-offset:2px }
.c-draft-card__button--loading { position:relative;color:transparent;pointer-events:none }
.c-draft-card__button--loading:after { content:"";position:absolute;top:50%;left:50%;width:var(--spacing-4);height:var(--spacing-4);margin-top:calc(var(--spacing-4)/-2);margin-left:calc(var(--spacing-4)/-2);border-radius:50%;border:2px solid;border-top:2px solid transparent;animation:spin .6s linear infinite }
@media (max-width:640px) { .c-draft-card__actions { flex-direction:column;align-items:stretch }
.c-draft-card__button { width:100% }
 }
@media (prefers-reduced-motion:reduce) { .c-draft-card__button:active,.c-draft-card__button:hover,.c-draft-card__button { transform:none;transition:none }
.c-draft-card__button--loading:after { animation:none }
 }
.c-draft-card__checkbox-wrapper { position:absolute;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-10);display:flex;justify-content:center;align-items:center;min-width:var(--touch-target-min);min-height:var(--touch-target-min);margin:calc(var(--spacing-2)*-1);padding:var(--spacing-2);cursor:pointer }
.c-draft-card__checkbox { position:absolute;width:1px;height:1px;opacity:0;pointer-events:none }
.c-draft-card__checkbox-custom { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-5);height:var(--spacing-5);background:var(--color-surface-elevated);border:2px solid var(--color-border-default);border-radius:var(--radius-base);transition:all var(--duration-fast) var(--ease-out) }
.c-draft-card__checkbox-wrapper:hover .c-draft-card__checkbox-custom { border-color:var(--color-brand-primary);box-shadow:0 0 0 3px var(--color-brand-primary-subtle) }
.c-draft-card__checkbox:checked+.c-draft-card__checkbox-custom { background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.c-draft-card__checkbox-custom:after { content:"";display:none;width:var(--size-icon-xs);height:var(--size-icon-checkmark-height);border:solid var(--color-text-on-dark);border-width:0 var(--border-width-2) var(--border-width-2) 0;transform:rotate(45deg) }
.c-draft-card__checkbox:checked+.c-draft-card__checkbox-custom:after { display:block }
.c-draft-card__checkbox:focus-visible+.c-draft-card__checkbox-custom { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.c-draft-card__checkbox:disabled+.c-draft-card__checkbox-custom { opacity:50%;cursor:not-allowed }
.c-draft-card__checkbox-wrapper:has(.c-draft-card__checkbox:disabled) { cursor:not-allowed }
.draft-card--selected { padding-left:calc(var(--spacing-6) - 3px);background:var(--color-brand-primary-subtle);border-left:4px solid var(--color-brand-primary);box-shadow:var(--shadow-md),0 0 0 2px var(--color-brand-primary-subtle) }
.draft-card--selected:hover { background:var(--color-surface-elevated);box-shadow:var(--shadow-lg),0 0 0 2px var(--color-brand-primary-subtle) }
.c-drafts-selection-toolbar { position:sticky;top:0;z-index:var(--z-sticky);display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-4);padding:var(--spacing-4) var(--spacing-6);background:var(--color-surface-primary);border-bottom:1px solid var(--color-border-default);box-shadow:var(--shadow-md);opacity:0;transform:translateY(-100%);transition:transform var(--duration-moderate) var(--ease-out);pointer-events:none }
.c-drafts-selection-toolbar--visible { opacity:100%;transform:translateY(0);pointer-events:auto }
.c-drafts-selection-toolbar__count { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold) }
.c-drafts-selection-toolbar__count:before { content:"";display:inline-block;width:var(--spacing-2);height:var(--spacing-2);background:var(--color-brand-primary);border-radius:50%;animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite }
.c-drafts-selection-toolbar__actions { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3);margin-left:auto }
.c-drafts-container { max-width:var(--container-2xl);margin:0 auto;padding:var(--spacing-8) }
@media (max-width:1024px) { .c-drafts-container { padding:var(--spacing-6) }
 }
@media (max-width:640px) { .c-drafts-container { padding:var(--spacing-4) }
 }
.c-drafts-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fill,minmax(380px,1fr)) }
@media (min-width:1920px) { .c-drafts-grid { gap:var(--spacing-8);grid-template-columns:repeat(auto-fill,minmax(420px,1fr)) }
 }
@media (max-width:768px) { .c-drafts-grid { gap:var(--spacing-4);grid-template-columns:1fr }
 }
@media (max-width:400px) { .c-drafts-grid { gap:var(--spacing-3) }
 }
.draft-card { position:relative;display:flex;flex-direction:column;gap:var(--spacing-3);padding:var(--spacing-6) }
.c-draft-card__recipient-section { display:flex;flex-direction:column;gap:var(--spacing-1);margin-bottom:var(--spacing-2) }
@media (prefers-reduced-motion:reduce) { .c-draft-card__checkbox-custom,.c-draft-card__checkbox-wrapper:hover .c-draft-card__checkbox-custom,.c-drafts-selection-toolbar--visible,.c-drafts-selection-toolbar { transform:none;transition:none;animation:none }
.c-drafts-selection-toolbar__count:before { animation:none }
 }
.draft-card:focus-within { box-shadow:0 0 0 3px var(--color-card-background-selected) }
.c-draft-card:focus-visible,.draft-card:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px;box-shadow:var(--shadow-lg),0 0 0 4px var(--color-card-background-selected-hover) }
.draft-card--keyboard-focus { animation:keyboardFocusPulse 1s ease-out }
.sr-only { position:absolute;overflow:hidden;clip:rect(0,0,0,0);width:1px;height:1px;margin:calc(var(--spacing-px)*-1);padding:0;white-space:nowrap;border-width:0 }
.skip-link { top:calc(var(--spacing-10)*-1);left:0;z-index:var(--z-modal);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-on-dark);background:var(--color-brand-primary);border-radius:var(--radius-md);transition:top var(--duration-fast) }
.skip-link:focus { top:var(--spacing-2) }
.c-keyboard-shortcuts { position:fixed;inset:0;z-index:var(--z-modal);display:flex;justify-content:center;align-items:center;opacity:0;transition:opacity var(--duration-moderate);pointer-events:none }
.c-keyboard-shortcuts--visible { opacity:100%;pointer-events:auto }
.c-keyboard-shortcuts__backdrop { position:absolute;inset:0;background:var(--overlay-bg);backdrop-filter:blur(4px) }
.c-keyboard-shortcuts__content { position:relative;overflow-y:auto;width:90%;max-width:var(--modal-max-width-sm);max-height:90vh;padding:var(--spacing-8);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl) }
.c-keyboard-shortcuts__title { margin:0 0 var(--spacing-6) 0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-bold) }
.c-keyboard-shortcuts__list { display:grid;grid-gap:var(--spacing-3) var(--spacing-6);gap:var(--spacing-3) var(--spacing-6);grid-template-columns:auto 1fr;margin:0 0 var(--spacing-6) 0 }
.c-keyboard-shortcuts__list dt { display:flex;gap:var(--spacing-1);color:var(--color-text-primary);font-weight:var(--font-weight-semibold) }
.c-keyboard-shortcuts__list dd { margin:0;color:var(--color-text-secondary) }
.c-keyboard-shortcuts__list kbd { display:inline-block;padding:var(--spacing-1) var(--spacing-2);font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);line-height:1;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-base);box-shadow:var(--shadow-sm) }
@media (max-width:768px) { .c-draft-card,.draft-card { padding:var(--spacing-5) }
.c-draft-card__checkbox-wrapper { top:var(--spacing-3);right:var(--spacing-3);margin:calc(var(--spacing-3)*-1);padding:var(--spacing-3) }
.c-draft-card__checkbox-custom { width:var(--spacing-6);height:var(--spacing-6) }
.c-draft-card__actions { flex-direction:column;gap:var(--spacing-2) }
.c-draft-card__button { justify-content:center;width:100% }
.c-draft-card__recipient-name { font-size:var(--text-lg) }
.c-draft-card__subject { font-size:var(--text-base) }
.c-draft-card__metadata { flex-wrap:wrap;gap:var(--spacing-2) }
.c-keyboard-shortcuts__content { width:95%;padding:var(--spacing-6) }
.c-keyboard-shortcuts__list { gap:var(--spacing-2) var(--spacing-4) }
 }
@media (max-width:375px) { .c-drafts-container { padding:var(--spacing-3) }
.c-drafts-grid { gap:var(--spacing-3) }
.c-draft-card,.c-keyboard-shortcuts__content,.draft-card { padding:var(--spacing-4) }
 }
@media (max-width:768px) and (prefers-reduced-motion:reduce) { .c-draft-card:active,.c-draft-card:hover,.c-draft-card,.draft-card:active,.draft-card:hover,.draft-card { transform:none;transition:none;animation:none }
 }
.sg-card__title { font-size:var(--text-2xl);font-weight:var(--font-weight-bold);line-height:var(--leading-tight) }
.c-draft-card__recipient-name { color:var(--color-text-secondary);font-size:var(--text-base);font-weight:var(--font-weight-medium) }
.c-draft-card__recipient-email { color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-weight-normal) }
.draft-card { background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);overflow:hidden }
.draft-card:before { content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0,var(--color-brand-primary-05) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;border-radius:inherit;z-index:0 }
.draft-card:hover:before { opacity:1 }
.draft-card>:not(.c-draft-card__checkbox-wrapper) { position:relative;z-index:1 }
.c-draft-card__preview { background:var(--glass-bg-darker);backdrop-filter:var(--backdrop-blur-light);-webkit-backdrop-filter:var(--backdrop-blur-light);padding:var(--spacing-3);border-radius:var(--radius-md);border-left:2px solid var(--glass-border) }
.c-draft-card__button:active { transform:scale(.95);transition:transform .1s var(--ease-bounce) }
.draft-card:hover { background:var(--glass-bg-medium);border-color:var(--color-border-strong);box-shadow:var(--shadow-lg),0 0 var(--spacing-6) var(--color-brand-primary-15);transform:translateY(-2px) }
.draft-card--selected { background:var(--glass-bg-medium);backdrop-filter:var(--backdrop-blur-heavy);-webkit-backdrop-filter:var(--backdrop-blur-heavy) }
.draft-card--selected:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-brand) }
.c-draft-card__confidence-badge:hover { transform:scale(1.05) translateY(-1px) }
.c-draft-card__confidence-badge--high:hover { box-shadow:var(--shadow-glow-sm-success) }
.c-draft-card__confidence-badge--medium:hover { box-shadow:var(--shadow-glow-sm-warning) }
.c-draft-card__confidence-badge--low:hover { box-shadow:var(--shadow-glow-sm-danger) }
.draft-card { animation:draftCardEnterSpring var(--duration-slow) var(--ease-bounce) backwards }
.c-drafts-grid .draft-card:first-child { animation-delay:var(--delay-stagger-fine-1) }
.c-drafts-grid .draft-card:nth-child(2) { animation-delay:var(--delay-stagger-fine-2) }
.c-drafts-grid .draft-card:nth-child(3) { animation-delay:var(--delay-stagger-fine-3) }
.c-drafts-grid .draft-card:nth-child(4) { animation-delay:var(--delay-stagger-fine-4) }
.c-drafts-grid .draft-card:nth-child(5) { animation-delay:var(--delay-stagger-fine-5) }
.c-drafts-grid .draft-card:nth-child(6) { animation-delay:var(--delay-stagger-fine-6) }
.c-drafts-grid .draft-card:nth-child(7) { animation-delay:var(--delay-stagger-fine-7) }
.c-drafts-grid .draft-card:nth-child(8) { animation-delay:var(--delay-stagger-fine-8) }
.c-draft-card__button--send:hover { box-shadow:var(--button-shadow-send-hover),var(--shadow-glow-brand) }
.c-draft-card__button--mark-sent:hover { box-shadow:var(--button-shadow-mark-sent-hover),var(--shadow-glow-teal) }
@media (prefers-reduced-motion:reduce) { .draft-card { animation:none }
.draft-card:before { transition:none }
.c-draft-card__button:active { transform:none;transition:none }
.c-draft-card__confidence-badge:hover { transform:none }
 }
.c-draft-card__confidence-label,.c-draft-card__metadata-label,.c-draft-card__priority-label { display:none }
.draft-card.c-draft-card--stripe { padding:var(--spacing-5);gap:var(--spacing-3);background:var(--stripe-card-bg);border:1px solid var(--stripe-card-border);border-radius:var(--radius-lg);box-shadow:var(--stripe-card-shadow);animation:none;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out) }
.draft-card.c-draft-card--stripe:before { display:none }
.draft-card.c-draft-card--stripe:hover { background:var(--stripe-card-bg-hover);border-color:var(--stripe-card-border-hover);box-shadow:var(--stripe-card-shadow-hover);transform:none }
.draft-card.c-draft-card--stripe.draft-card--selected { padding-left:var(--spacing-5);background:var(--stripe-card-bg-selected);border-color:var(--stripe-card-border-selected);border-left-width:1px }
.draft-card.c-draft-card--stripe:focus-within { border-color:var(--color-brand-primary);outline:2px solid var(--color-brand-primary);outline-offset:2px }
.c-draft-card--stripe .sg-card__header { display:flex;flex-wrap:wrap;gap:var(--spacing-3);align-items:flex-start;padding-bottom:var(--spacing-3);border-bottom:1px solid var(--stripe-card-border) }
.c-draft-card--stripe .sg-card__title-group { flex:1;min-width:0 }
.c-draft-card--stripe .sg-card__title { margin-bottom:var(--spacing-1);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);letter-spacing:var(--tracking-tight) }
.c-draft-card--stripe .sg-card__badges { display:flex;flex-wrap:wrap;gap:var(--spacing-2);align-items:center }
.draft-card.c-draft-card--stripe .c-draft-card__confidence { display:inline-flex;flex-direction:row;gap:var(--spacing-1);align-items:baseline;margin-bottom:0 }
.draft-card.c-draft-card--stripe .c-draft-card__confidence-label { display:inline;font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:var(--tracking-wide) }
.draft-card.c-draft-card--stripe .c-draft-card__confidence-badge { display:inline;padding:0;font-size:var(--text-sm);font-weight:var(--font-medium);background:none;border:none;box-shadow:none }
.draft-card.c-draft-card--stripe .c-draft-card__priority-label { display:inline;font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:var(--tracking-wide) }
.c-draft-card--stripe .c-draft-card__confidence-progress { display:none }
.c-draft-card--stripe .c-draft-card__confidence-badge--high { color:var(--stripe-confidence-excellent) }
.c-draft-card--stripe .c-draft-card__confidence-badge--medium { color:var(--stripe-confidence-fair) }
.c-draft-card--stripe .c-draft-card__confidence-badge--low { color:var(--stripe-confidence-low) }
.c-draft-card--stripe .sg-badge { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-medium);text-transform:uppercase;letter-spacing:var(--tracking-wide);background:transparent;border:1px solid;border-radius:var(--radius-base) }
.c-draft-card--stripe .sg-badge--high { color:var(--color-danger) }
.c-draft-card--stripe .sg-badge--medium { color:var(--color-warning) }
.c-draft-card--stripe .sg-badge--low { color:var(--color-success) }
.c-draft-card--stripe .sg-card__body { display:flex;flex-direction:column;gap:var(--spacing-3);padding:var(--spacing-3) 0 }
.c-draft-card--stripe .c-draft-card__recipient-name { display:block;font-size:var(--text-base);font-weight:var(--font-medium);color:var(--color-text-primary) }
.c-draft-card--stripe .c-draft-card__recipient-icon { display:none }
.c-draft-card--stripe .c-draft-card__recipient-email { display:block;margin-top:var(--spacing-1);font-size:var(--text-sm);color:var(--color-text-tertiary) }
.c-draft-card--stripe .c-draft-card__email-icon { display:none }
.c-draft-card--stripe .c-draft-card__subject { display:block;margin-top:var(--spacing-2);font-size:var(--text-base);font-weight:var(--font-medium);color:var(--color-text-secondary) }
.c-draft-card--stripe .c-draft-card__subject-icon { display:none }
.c-draft-card--stripe .c-draft-card__preview { display:-webkit-box;margin-top:var(--spacing-2);overflow:hidden;font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--color-text-muted);-webkit-box-orient:vertical;-webkit-line-clamp:2 }
.c-draft-card--stripe .sg-card__footer { display:flex;flex-direction:column;gap:var(--spacing-3);padding-top:var(--spacing-3);border-top:1px solid var(--stripe-card-border) }
.c-draft-card--stripe .c-draft-card__metadata { display:flex;flex-direction:column;gap:0 }
.c-draft-card--stripe .c-draft-card__metadata-item { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) 0;border-bottom:1px solid var(--color-border-subtle) }
.c-draft-card--stripe .c-draft-card__metadata-item:last-child { border-bottom:none }
.c-draft-card--stripe .c-draft-card__metadata-icon { display:none }
.c-draft-card--stripe .c-draft-card__metadata-label { display:inline;font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:var(--tracking-wide) }
.c-draft-card--stripe .c-draft-card__metadata-value { font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-primary);text-align:right }
.c-draft-card--stripe .c-draft-card__metadata-item--sources .c-draft-card__metadata-value { display:flex;flex-wrap:wrap;gap:var(--spacing-1);justify-content:flex-end }
.c-draft-card--stripe .sg-badge--neutral { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);color:var(--color-text-secondary);background:transparent;border:1px solid var(--color-border-default) }
.c-draft-card--stripe .c-draft-card__actions { display:flex;flex-wrap:wrap;gap:var(--spacing-2);justify-content:flex-end;align-items:center;padding-top:var(--spacing-3) }
.c-draft-card--stripe .c-draft-card__button { padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-secondary);background:transparent;border:1px solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:none;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out) }
.c-draft-card--stripe .c-draft-card__button:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:none;transform:none }
.c-draft-card--stripe .c-draft-card__button--send { color:var(--color-text-on-dark);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.c-draft-card--stripe .c-draft-card__button--send:hover { color:var(--color-text-on-dark);background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark) }
.c-draft-card--stripe .c-draft-card__button--send .c-draft-card__button-icon,.c-draft-card--stripe .c-draft-card__button--send .fas,.c-draft-card--stripe .c-draft-card__button--send .fas:before,.c-draft-card--stripe .c-draft-card__button--send [class*=fa-],.c-draft-card--stripe .c-draft-card__button--send [class*=fa-]:before { color:var(--color-white) }
.c-draft-card--stripe .c-draft-card__button--edit { color:var(--color-text-secondary) }
.c-draft-card--stripe .c-draft-card__button--mark-sent { color:var(--color-success);border-color:var(--color-success) }
.c-draft-card--stripe .c-draft-card__button--mark-sent:hover { color:var(--color-text-on-dark);background:var(--color-success);border-color:var(--color-success) }
.c-draft-card--stripe .c-draft-card__button--delete { color:var(--color-danger);background:transparent;border:none }
.c-draft-card--stripe .c-draft-card__button--delete:hover { color:var(--color-danger-dark);background:var(--color-danger-bg);border:none }
.c-draft-card--stripe .c-draft-card__button--context { color:var(--color-text-tertiary) }
@media (max-width:768px) { .draft-card.c-draft-card--stripe { padding:var(--spacing-4) }
.c-draft-card--stripe .c-draft-card__actions { flex-direction:column;align-items:stretch }
.c-draft-card--stripe .c-draft-card__button { justify-content:center;width:100% }
 }
@media (prefers-reduced-motion:reduce) { .c-draft-card--stripe .c-draft-card__button,.draft-card.c-draft-card--stripe:hover,.draft-card.c-draft-card--stripe { transition:none }
 }
.c-draft-card--stripe .c-draft-card__body-wrapper { display:flex;flex-direction:column;gap:var(--spacing-2) }
.c-draft-card--stripe .c-draft-card__full-body { overflow:hidden;max-height:0;opacity:0;transition:max-height var(--duration-medium) var(--ease-out),opacity var(--duration-fast) var(--ease-out) }
.c-draft-card--stripe .c-draft-card__full-body[data-collapsed=false] { opacity:1 }
.c-draft-card--stripe .c-draft-card__full-body-content { padding:var(--spacing-3) 0;font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--color-text-secondary);white-space:pre-wrap;word-break:break-word }
.c-draft-card--stripe .c-draft-card__toggle-body { display:inline-flex;align-items:center;gap:var(--spacing-1-5);padding:var(--spacing-1) 0;font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-tertiary);background:transparent;border:none;cursor:pointer;transition:color var(--duration-fast) var(--ease-out) }
.c-draft-card--stripe .c-draft-card__toggle-body:hover { color:var(--color-text-secondary) }
.c-draft-card--stripe .c-draft-card__toggle-body:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px;border-radius:var(--radius-sm) }
.c-draft-card--stripe .c-draft-card__toggle-icon { width:var(--spacing-3);height:var(--spacing-3);transition:transform var(--duration-fast) var(--ease-out) }
.c-draft-card--stripe .c-draft-card__toggle-icon--expanded { transform:rotate(180deg) }
.c-draft-card--stripe .c-draft-card__inbound-section { margin-top:var(--spacing-3);padding-top:var(--spacing-3);border-top:1px dashed var(--color-border-subtle) }
.c-draft-card--stripe .c-draft-card__inbound-section[data-collapsed=true] .c-draft-card__inbound-content { max-height:0;opacity:0 }
.c-draft-card--stripe .c-draft-card__inbound-toggle { display:flex;align-items:center;gap:var(--spacing-2);width:100%;padding:var(--spacing-2) 0;font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-tertiary);text-align:left;background:transparent;border:none;cursor:pointer;transition:color var(--duration-fast) var(--ease-out) }
.c-draft-card--stripe .c-draft-card__inbound-toggle:hover { color:var(--color-text-secondary) }
.c-draft-card--stripe .c-draft-card__inbound-toggle:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px;border-radius:var(--radius-sm) }
.c-draft-card--stripe .c-draft-card__inbound-toggle span { flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
.c-draft-card--stripe .c-draft-card__inbound-icon { flex-shrink:0;width:var(--spacing-4);height:var(--spacing-4);color:var(--color-info-light) }
.c-draft-card--stripe .c-draft-card__inbound-content { overflow:hidden;max-height:0;opacity:0;transition:max-height var(--duration-medium) var(--ease-out),opacity var(--duration-fast) var(--ease-out) }
.c-draft-card--stripe .c-draft-card__inbound-section[data-collapsed=false] .c-draft-card__inbound-content { opacity:1 }
.c-draft-card--stripe .c-draft-card__inbound-body { padding:var(--spacing-3);margin-top:var(--spacing-2);background:var(--color-surface-alt);border-radius:var(--radius-md);border-left:3px solid var(--color-info-light) }
.c-draft-card--stripe .c-draft-card__inbound-meta { margin-bottom:var(--spacing-2);font-size:var(--text-xs);color:var(--color-text-muted) }
.c-draft-card--stripe .c-draft-card__inbound-text { font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--color-text-secondary);white-space:pre-wrap;word-break:break-word }
.c-draft-card--stripe .c-draft-card__metadata--inline { display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--spacing-2);padding:0;border-top:none;border-bottom:none }
.c-draft-card--stripe .c-draft-card__metadata--inline .c-draft-card__metadata-item { display:contents;padding:0;border-bottom:none }
.c-draft-card--stripe .c-draft-card__metadata-text { font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:var(--tracking-wide) }
.c-draft-card--stripe .c-draft-card__metadata-separator { color:var(--color-text-muted);font-size:var(--text-sm);-webkit-user-select:none;user-select:none }
.c-draft-card--stripe .c-draft-card__metadata-sources { display:inline-flex;flex-wrap:wrap;gap:var(--spacing-1);align-items:center }
@media (max-width:768px) { .c-draft-card--stripe .c-draft-card__inbound-body { padding:var(--spacing-2) }
.c-draft-card--stripe .c-draft-card__metadata--inline { flex-direction:column;align-items:flex-start;gap:var(--spacing-1) }
.c-draft-card--stripe .c-draft-card__metadata-separator { display:none }
 }
@media (prefers-reduced-motion:reduce) { .c-draft-card--stripe .c-draft-card__full-body,.c-draft-card--stripe .c-draft-card__inbound-content,.c-draft-card--stripe .c-draft-card__inbound-toggle,.c-draft-card--stripe .c-draft-card__toggle-body,.c-draft-card--stripe .c-draft-card__toggle-icon { transition:none }
 }
.c-email-thread { font-family:var(--font-family-system) }
.c-email-thread__empty { padding:var(--spacing-4);text-align:center;color:var(--color-text-muted);font-style:italic }
.c-email-thread__message { position:relative }
.c-email-thread__message--primary { padding-bottom:var(--spacing-3) }
.c-email-thread__message--quoted { margin-top:var(--spacing-4);padding:var(--spacing-3);background:var(--color-surface-alt);border-radius:var(--radius-md);border-left:3px solid var(--color-border-default) }
.c-email-thread__message--quoted+.c-email-thread__message--quoted { margin-top:var(--spacing-3);margin-left:var(--spacing-3);border-left-color:var(--color-border-subtle) }
.c-email-thread__header { display:flex;flex-direction:column;gap:var(--spacing-1);padding-bottom:var(--spacing-3);margin-bottom:var(--spacing-3);border-bottom:1px solid var(--color-border-subtle) }
.c-email-thread__header--quoted { padding:var(--spacing-2);margin-bottom:var(--spacing-2);background:hsla(0,0%,100%,.03);border-radius:var(--radius-sm);border-bottom:none }
.c-email-thread__field { display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--spacing-2);font-size:var(--text-sm);line-height:var(--leading-normal) }
.c-email-thread__field--subject { margin-top:var(--spacing-1) }
.c-email-thread__label { flex-shrink:0;min-width:var(--size-label-min);font-weight:var(--font-semibold);color:var(--color-text-tertiary);text-transform:capitalize }
.c-email-thread__value { flex:1;min-width:0;color:var(--color-text-secondary);word-break:break-word }
.c-email-thread__field--subject .c-email-thread__value { font-weight:var(--font-medium);color:var(--color-text-primary) }
.c-email-thread__body { font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--color-text-secondary);word-break:break-word;overflow-wrap:break-word }
.c-email-thread__message--quoted .c-email-thread__body { font-size:var(--text-xs);color:var(--color-text-tertiary) }
.c-email-thread__link { color:var(--color-info-light);text-decoration:none;word-break:break-all }
.c-email-thread__link:hover { text-decoration:underline }
.c-email-thread__signature { margin-top:var(--spacing-3);padding-top:var(--spacing-2);border-top:1px solid var(--color-border-subtle);font-size:var(--text-xs);color:var(--color-text-muted);line-height:var(--leading-normal) }
.c-email-thread__separator { margin-bottom:var(--spacing-2);padding-bottom:var(--spacing-1);font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide);border-bottom:1px dashed var(--color-border-subtle) }
@media (max-width:768px) { .c-email-thread__field { flex-direction:column;gap:0 }
.c-email-thread__label { min-width:auto;font-size:var(--text-xs) }
.c-email-thread__message--quoted { margin-left:0;padding:var(--spacing-2) }
.c-email-thread__message--quoted+.c-email-thread__message--quoted { margin-left:var(--spacing-2) }
 }
@media (prefers-reduced-motion:reduce) { .c-email-thread__link { transition:none }
 }
.control-panel-body { max-width:var(--container-md-lg);margin:var(--spacing-8) auto;padding:0 var(--spacing-4);font-family:-apple-system,blinkmacsystemfont,Segoe UI,Roboto,sans-serif;background:var(--gray-50) }
.panel { margin-bottom:var(--spacing-8);padding:var(--spacing-8);background:var(--color-neutral-0);border-radius:var(--spacing-2);box-shadow:var(--shadow-sm) }
.control-status { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);font-weight:500;border-radius:var(--radius-full) }
.control-status--enabled { color:var(--color-success-text);background:var(--green-100) }
.control-status--disabled { color:var(--color-danger-text);background:var(--red-100) }
.control-btn { margin-right:var(--spacing-4);padding:var(--spacing-3) var(--spacing-6);font-size:var(--spacing-4);border:none;border-radius:var(--spacing-1-5);transition:all .15s ease;cursor:pointer }
.control-btn--enable { color:var(--color-neutral-0);background:var(--green-500) }
.control-btn--enable:hover { background:var(--green-600) }
.control-btn--disable { color:var(--color-neutral-0);background:var(--red-500) }
.control-btn--disable:hover { background:var(--red-600) }
.checklist { margin-top:var(--spacing-8) }
.checklist h3 { margin-bottom:var(--spacing-4) }
.checklist label { display:block;margin-bottom:var(--spacing-2);cursor:pointer }
.checklist input[type=checkbox] { margin-right:var(--spacing-2) }
.control-warning { margin-top:var(--spacing-8);padding:var(--spacing-4);background:var(--amber-100);border:var(--spacing-px) solid var(--amber-500);border-radius:var(--spacing-1-5) }
.control-success { margin-top:var(--spacing-8);padding:var(--spacing-4);background:var(--green-100);border:var(--spacing-px) solid var(--green-500);border-radius:var(--spacing-1-5) }
.control-error { margin-top:var(--spacing-8);padding:var(--spacing-4);background:var(--red-100);border:var(--spacing-px) solid var(--red-500);border-radius:var(--spacing-1-5) }
.control-kbd { padding:.125rem var(--spacing-1-5);font-family:monospace;font-size:var(--text-sm);background:var(--gray-100);border:var(--spacing-px) solid var(--gray-300);border-radius:var(--spacing-1) }
.progress-section { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2) }
.progress-item { display:flex;align-items:center;gap:var(--spacing-2) }
.progress-icon { font-size:var(--spacing-5) }
.test-links { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);margin-top:var(--spacing-4) }
.test-link { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) var(--spacing-4);color:var(--gray-700);text-decoration:none;background:var(--gray-100);border-radius:var(--spacing-1-5);transition:all .15s ease }
.test-link:hover { background:var(--gray-200);transform:translateX(var(--spacing-1)) }
.test-link-arrow { color:var(--gray-400) }
.health-status--healthy,.health-status--success { color:var(--color-success) }
.health-status--degraded,.health-status--warning { color:var(--color-warning) }
.health-status--critical,.health-status--error { color:var(--color-danger) }
.health-status--info { color:var(--color-info) }
.health-status { display:flex;align-items:center;gap:var(--spacing-4) }
.health-status__icon { font-size:var(--spacing-8) }
.endpoint-card { margin-bottom:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-primary);border-left:var(--spacing-1) solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-moderate) }
.endpoint-card--healthy { border-left-color:var(--color-success) }
.endpoint-card--degraded { border-left-color:var(--color-warning) }
.endpoint-card--critical,.endpoint-card--error { border-left-color:var(--color-danger) }
.health-check-item { display:flex;align-items:center;gap:var(--spacing-4);margin:var(--spacing-4) 0;padding:var(--spacing-4);border-radius:var(--radius-md);transition:all var(--duration-moderate) }
.health-check-item--pass { color:var(--color-success);background:var(--color-success-subtle);border:var(--border-width) solid var(--color-success-border,var(--color-success)) }
.health-check-item--fail { color:var(--color-danger);background:var(--color-danger-subtle);border:var(--border-width) solid var(--color-danger-border,var(--color-danger)) }
.health-check-item--warning { color:var(--color-warning);background:var(--color-warning-subtle);border:var(--border-width) solid var(--color-warning-border,var(--color-warning)) }
.response-time-bar { overflow:hidden;height:var(--spacing-2);background:var(--color-surface-secondary);border-radius:var(--radius-sm) }
.response-time-fill { height:100%;background:linear-gradient(90deg,var(--color-success) 0,var(--color-warning) 50%,var(--color-danger) 100%);transition:width var(--duration-moderate) }
.performance-meter { display:flex;align-items:center;gap:var(--spacing-2) }
.performance-value { font-weight:var(--font-weight-medium);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.setup-steps { margin-top:var(--spacing-6) }
.setup-step { display:flex;margin-bottom:var(--spacing-6);padding:var(--spacing-5);background:var(--color-surface-primary);border:var(--border-width) solid var(--color-border-default);border-radius:var(--radius-lg) }
.setup-step__number { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);margin-right:var(--spacing-4);color:var(--color-on-primary);font-weight:var(--font-weight-semibold);background:var(--color-primary);border-radius:var(--radius-full) }
.setup-step__content { flex:1 }
.setup-step__title { margin-bottom:var(--spacing-2);font-weight:var(--font-weight-semibold) }
.health-page-container { max-width:var(--container-md-lg);margin:0 auto;padding:var(--spacing-8);font-family:var(--font-system);background:var(--color-surface-base) }
.health-page-header { margin-bottom:var(--spacing-12);text-align:center }
.health-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(300px,1fr)) }
.connection-status { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-weight-medium);border-radius:var(--radius-md) }
.connection-status--connected { color:var(--color-success);background:var(--color-success-subtle) }
.connection-status--disconnected { color:var(--color-danger);background:var(--color-danger-subtle) }
.connection-status--connecting { color:var(--color-warning);background:var(--color-warning-subtle) }
.stats-grid { grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-wide),1fr));margin-bottom:var(--spacing-8) }
.stat-card { position:relative;text-align:center;background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border:var(--spacing-px) solid var(--glass-border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden;transition:all var(--duration-medium) var(--ease-out);animation:statEnterSpring var(--duration-slow) var(--ease-bounce) backwards }
.stat-card:hover { background:var(--glass-bg-medium);border-color:var(--color-border-strong);box-shadow:var(--shadow-xl),0 0 var(--spacing-7-5) var(--color-brand-primary-alpha-20);transform:translateY(-3px) }
.stat-card:before { content:"";position:absolute;inset:0;opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;border-radius:inherit;z-index:0 }
.stat-card>* { position:relative;z-index:1 }
.stat-card--patterns:before { background:linear-gradient(135deg,var(--color-info-very-subtle) 0,transparent 100%) }
.stat-card--accuracy:before { background:linear-gradient(135deg,var(--color-success-very-subtle) 0,transparent 100%) }
.stat-card--responses:before { background:linear-gradient(135deg,var(--color-brand-primary-05) 0,transparent 100%) }
.stat-card--learning:before { background:linear-gradient(135deg,var(--color-warning-very-subtle) 0,transparent 100%) }
.stat-card:hover:before { opacity:1 }
.stat-card--patterns:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-info) }
.stat-card--accuracy:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-success) }
.stat-card--responses:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-brand) }
.stat-card--learning:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-warning) }
.stat-value { margin-bottom:var(--spacing-2);color:var(--color-accent-primary);font-size:var(--spacing-10);background:var(--text-gradient-primary);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:stat-pulse-spring 2.5s var(--ease-bounce) 3 }
.stat-label { color:var(--color-text-secondary);font-size:var(--text-sm);letter-spacing:.05em;text-transform:uppercase }
.stat-update { animation:stat-pulse var(--duration-slow) var(--ease-out) }
.stats-grid .stat-card:first-child { animation-delay:var(--delay-stagger-fine-1) }
.stats-grid .stat-card:nth-child(2) { animation-delay:var(--delay-stagger-fine-3) }
.stats-grid .stat-card:nth-child(3) { animation-delay:var(--delay-stagger-fine-4) }
.stats-grid .stat-card:nth-child(4) { animation-delay:var(--delay-stagger-fine-5) }
.stats-grid .stat-card:nth-child(5) { animation-delay:var(--delay-stagger-fine-7) }
.stats-grid .stat-card:nth-child(6) { animation-delay:var(--delay-stagger-fine-8) }
.loading-state { display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:var(--col-width-extra-wide);color:var(--color-text-secondary) }
.learning-spinner { width:var(--spacing-10);height:var(--spacing-10);margin-bottom:var(--spacing-4);border:var(--spacing-0-75) solid var(--bg-secondary);border-radius:var(--radius-full);animation:spin 1s linear infinite;border-top-color:var(--accent) }
.error-state { padding:var(--spacing-8);text-align:center;background:var(--bg-secondary);border:var(--spacing-px) solid var(--danger);border-radius:var(--spacing-2) }
.error-state .fa-exclamation-triangle { margin-bottom:var(--spacing-4);color:var(--danger);font-size:var(--spacing-8) }
.learning-section .card { position:relative;padding:var(--spacing-4);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden;transition:all var(--duration-medium) var(--ease-out) }
.learning-section .card:hover { background:var(--glass-bg-medium);border-color:var(--color-accent-primary);box-shadow:var(--shadow-lg),var(--shadow-glow-brand);transform:translateY(-2px) }
.learning-section .card:before { content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0,var(--color-brand-primary-05) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;border-radius:inherit }
.learning-section .card:hover:before { opacity:1 }
@media (prefers-reduced-motion:reduce) { .learning-section .card,.stat-card,.stat-value { animation:none }
.learning-section .card:before,.stat-card:before { transition:none }
.learning-section .card:hover,.stat-card:hover { transform:none }
 }
.badge-success { padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-inverse);font-size:var(--text-xs);font-weight:600;background:var(--color-success-primary);border-radius:var(--radius-full) }
.badge-timing { padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-inverse);font-size:var(--text-xs);font-weight:600;background:var(--color-warning-primary);border-radius:var(--radius-full) }
.badge-content { padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-inverse);font-size:var(--text-xs);font-weight:600;background:var(--color-info-primary);border-radius:var(--radius-full) }
.badge-regional { padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-inverse);font-size:var(--text-xs);font-weight:600;background:var(--color-accent-primary);border-radius:var(--radius-full) }
.badge-followup { padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-inverse);font-size:var(--text-xs);font-weight:600;background:var(--color-primary);border-radius:var(--radius-full) }
.badge-priority { padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-inverse);font-size:var(--text-xs);font-weight:600;background:var(--color-danger-primary);border-radius:var(--radius-full) }
.pattern-item { margin-bottom:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-secondary);border-radius:var(--radius-lg);transition:background-color .2s ease }
.pattern-item:hover { background:var(--color-surface-hover) }
.learning-section { margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg) }
.metric-card { text-align:center;background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);transition:all .3s ease }
.metric-card:hover { background:var(--color-surface-secondary);border-color:var(--color-accent-primary);box-shadow:var(--shadow-xl),0 0 var(--spacing-7-5) var(--color-brand-primary-alpha-20) }
.metric-value { margin-bottom:var(--spacing-2);color:var(--color-accent-primary);font-size:var(--text-3xl);font-weight:700 }
.metric-label { color:var(--color-text-secondary);letter-spacing:.05em;text-transform:uppercase }
.is-loading { opacity:60%;cursor:not-allowed;pointer-events:none }
.context-recommendations.sg-hidden,.pattern-editor-fields.sg-hidden,.sg-modal__actions.sg-hidden { display:none }
.context-data.context-data--visible,.context-recommendations.context-recommendations--visible,.context-state.context-state--visible,.context-warnings.context-warnings--visible { display:block }
.lifecycle-reason { display:none }
.lifecycle-reason.lifecycle-reason--visible { display:block;margin-top:var(--spacing-4) }
.recommendations__list { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fill,minmax(var(--col-width-wide),1fr)) }
.context-recommendations { margin-top:var(--spacing-4);padding:var(--spacing-4);background:var(--color-surface-secondary);border-radius:var(--radius-base) }
.context-recommendations h4 { margin-bottom:var(--spacing-2);color:var(--color-info-primary);font-size:var(--text-base);font-weight:600 }
.context-recommendations ul { margin-left:var(--spacing-5);list-style:disc }
.context-recommendations li { margin-bottom:var(--spacing-1);color:var(--color-text-secondary) }
.context-warnings { display:none;margin-top:var(--spacing-4);padding:var(--spacing-4);background:var(--color-warning-surface);border-left:var(--spacing-1) solid var(--color-warning-primary);border-radius:var(--radius-base) }
.context-warnings h4 { margin-bottom:var(--spacing-2);color:var(--color-warning-primary);font-size:var(--text-base);font-weight:600 }
.context-warnings ul { margin-left:var(--spacing-5);list-style:disc }
.context-warnings li { margin-bottom:var(--spacing-1);color:var(--color-text-primary) }
.context-state { padding:var(--spacing-4);border-radius:var(--radius-base) }
.context-state--flex { display:flex;align-items:center;gap:var(--spacing-3) }
.context-data { display:none }
.quality-indicator { margin-top:var(--spacing-3) }
.quality-bar-container { position:relative;overflow:hidden;width:100%;height:var(--spacing-2);background:var(--color-surface-tertiary);border-radius:var(--radius-full) }
.quality-bar { height:100%;border-radius:var(--radius-full);transition:width .3s ease }
.quality-bar--high { width:85%;background:var(--color-success-primary) }
.quality-bar--medium { width:60%;background:var(--color-warning-primary) }
.quality-bar--low { width:35%;background:var(--color-danger-primary) }
.help-tooltip { position:fixed;top:var(--tooltip-top,0);left:var(--tooltip-left,0);z-index:1000;display:none;max-width:var(--col-width-extra-wide);padding:var(--spacing-4);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-base);box-shadow:var(--shadow-xl) }
.help-tooltip.help-tooltip--visible { display:block }
.help-tooltip strong { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary) }
.help-tooltip ul { margin-left:var(--spacing-4);list-style:disc }
.help-tooltip li { margin-bottom:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
.help-icon { margin-left:var(--spacing-1);color:var(--color-text-secondary);transition:color .2s ease;cursor:help }
.help-icon:hover { color:var(--color-accent-primary) }
.controls-bar { display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--spacing-4);margin-bottom:var(--spacing-6);padding:var(--spacing-4);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg) }
.controls-bar .sg-form-group { flex:1 1 var(--col-width-narrow);min-width:var(--col-width-narrow) }
.controls-bar .sg-form-group--search { flex:2 1 var(--col-width-wide) }
.controls-bar .sg-btn { flex:0 0 auto }
.insights-container { display:flex;flex-direction:column;gap:var(--spacing-8) }
.insight-section { padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-md) }
.insight-section .section-title { display:flex;align-items:center;margin-bottom:var(--spacing-6);padding-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:700;border-bottom:var(--spacing-0-5) solid var(--color-border-accent) }
.insight-section .section-title i { margin-right:var(--spacing-2);color:var(--color-accent-primary) }
.insight-section__empty { padding:var(--spacing-8);color:var(--color-text-tertiary);font-style:italic;text-align:center }
.knowledge-patterns-page .sg-table th { font-size:var(--text-sm);font-weight:600;letter-spacing:.05em;text-transform:uppercase }
.knowledge-patterns-page .sg-table td { vertical-align:middle }
.confidence-score { display:inline-flex;align-items:center;gap:var(--spacing-2) }
.confidence-score__bar { position:relative;overflow:hidden;width:var(--col-width-extra-narrow);height:var(--spacing-2);background:var(--color-surface-tertiary);border-radius:var(--radius-full) }
.confidence-score__fill { position:absolute;top:0;left:0;height:100%;border-radius:var(--radius-full);transition:width .3s ease,background-color .3s ease }
.confidence-score__fill[data-confidence=high] { background:linear-gradient(90deg,var(--color-success-primary),var(--color-success-secondary)) }
.confidence-score__fill[data-confidence=medium] { background:linear-gradient(90deg,var(--color-warning-primary),var(--color-warning-secondary)) }
.confidence-score__fill[data-confidence=low] { background:linear-gradient(90deg,var(--color-error-primary),var(--color-error-secondary)) }
.confidence-score__text { min-width:var(--spacing-11);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:600;text-align:right }
.success-rate { display:inline-flex;align-items:center;gap:var(--spacing-2) }
.success-rate__value { min-width:var(--spacing-10);font-weight:600 }
.success-rate__value[data-rate=high] { color:var(--color-success-primary) }
.success-rate__value[data-rate=medium] { color:var(--color-warning-primary) }
.success-rate__value[data-rate=low] { color:var(--color-error-primary) }
.application-count { display:inline-flex;justify-content:center;align-items:center;min-width:var(--spacing-10);padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:600;background:var(--color-surface-tertiary);border-radius:var(--radius-full) }
.application-count[data-count=high] { color:var(--color-success-text);background:var(--color-success-surface) }
.application-count[data-count=medium] { color:var(--color-warning-text);background:var(--color-warning-surface) }
.application-count[data-count=low] { color:var(--color-info-text);background:var(--color-info-surface) }
.insight-status { display:inline-flex;align-items:center;gap:var(--spacing-1-5);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:600;letter-spacing:.05em;text-transform:uppercase;border-radius:var(--radius-md) }
.insight-status--active { color:var(--color-success-text);background:var(--color-success-surface) }
.insight-status--active:before { display:inline-block;width:var(--spacing-2);height:var(--spacing-2);background:var(--color-success-primary);border-radius:var(--radius-full);content:"" }
.insight-status--inactive { color:var(--color-neutral-text);background:var(--color-neutral-surface) }
.insight-status--inactive:before { display:inline-block;width:var(--spacing-2);height:var(--spacing-2);background:var(--color-neutral-primary);border-radius:var(--radius-full);content:"" }
.category-badge { display:inline-block;padding:var(--spacing-1) var(--spacing-2-5);color:var(--color-text-primary);font-size:var(--text-xs);font-weight:600;background:var(--color-surface-tertiary);border:var(--spacing-px) solid var(--color-border-secondary);border-radius:var(--radius-md) }
.category-badge--pricing { color:var(--color-info-text);background:var(--color-info-surface);border-color:var(--color-info-border) }
.category-badge--integration { color:var(--color-warning-text);background:var(--color-warning-surface);border-color:var(--color-warning-border) }
.category-badge--timeline { color:var(--color-success-text);background:var(--color-success-surface);border-color:var(--color-success-border) }
.category-badge--support { color:var(--color-accent-text);background:var(--color-accent-surface);border-color:var(--color-accent-border) }
.club-specific-indicator { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);color:var(--color-brand-text);font-size:var(--text-xs);font-weight:600;background:var(--color-brand-surface);border-radius:var(--radius-sm) }
.club-specific-indicator i { font-size:var(--text-xs) }
.insight-actions { display:flex;gap:var(--spacing-2) }
.insight-actions .sg-btn { padding:var(--spacing-1-5) var(--spacing-3);font-size:var(--text-xs) }
.insight-details { display:flex;flex-direction:column;gap:var(--spacing-6) }
.insight-details__section { padding:var(--spacing-4);background:var(--color-surface-secondary);border-radius:var(--radius-md) }
.insight-details__section h3 { margin-bottom:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:600 }
.insight-details__field { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:var(--col-width-wide) 1fr;padding:var(--spacing-2) 0;border-bottom:var(--spacing-px) solid var(--color-border-tertiary) }
.insight-details__field:last-child { border-bottom:none }
.insight-details__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:600 }
.insight-details__value { color:var(--color-text-primary);font-size:var(--text-sm) }
.insight-details__value code { padding:var(--spacing-1) var(--spacing-2);color:var(--color-accent-primary);font-family:var(--font-mono);font-size:var(--text-xs);background:var(--color-surface-tertiary);border-radius:var(--radius-sm) }
.evidence-list { display:flex;flex-direction:column;gap:var(--spacing-2);padding-left:var(--spacing-5);list-style:disc }
.evidence-list li { color:var(--color-text-secondary);font-size:var(--text-sm) }
.performance-summary { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-narrow),1fr));padding:var(--spacing-4);background:var(--color-surface-tertiary);border-radius:var(--radius-md) }
.performance-summary__metric { display:flex;flex-direction:column;align-items:center;text-align:center }
.performance-summary__value { margin-bottom:var(--spacing-1);color:var(--color-accent-primary);font-size:var(--text-2xl);font-weight:700 }
.performance-summary__label { color:var(--color-text-tertiary);font-size:var(--text-xs);letter-spacing:.05em;text-transform:uppercase }
@media (max-width:1024px) { .controls-bar { flex-direction:column }
.controls-bar .sg-btn,.controls-bar .sg-form-group,.controls-bar .sg-form-group--search { width:100% }
.insight-details__field { gap:var(--spacing-1);grid-template-columns:1fr }
.performance-summary { grid-template-columns:repeat(2,1fr) }
 }
@media (max-width:640px) { .insight-section { padding:var(--spacing-4) }
.insight-section .section-title { font-size:var(--text-xl) }
.performance-summary { grid-template-columns:1fr }
.confidence-score__bar { width:var(--col-width-extra-narrow) }
 }
.insight-loading { background:linear-gradient(90deg,var(--color-surface-secondary) 0,var(--color-surface-tertiary) 50%,var(--color-surface-secondary) 100%);background-size:200% 100%;animation:insight-shimmer 1.5s ease-in-out infinite }
.recommendation-card { margin-bottom:var(--spacing-4);padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);transition:all .3s ease }
.recommendation-card:hover { background:var(--color-surface-secondary);border-color:var(--color-accent-primary);transform:translateY(-2px) }
.badge { display:inline-block;padding:var(--spacing-1) var(--spacing-2);font-size:var(--spacing-3);font-weight:600;text-transform:uppercase;border-radius:var(--radius-sm) }
.badge--primary { color:var(--color-neutral-0);background:var(--color-accent-primary) }
.badge--warning { color:var(--color-neutral-0);background:var(--warning) }
.badge--info { color:var(--color-neutral-0);background:var(--info) }
.badge--secondary { color:var(--color-text-primary);background:var(--color-surface-secondary) }
.response-badge { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-medium);line-height:1;border:var(--border-width-1) solid transparent;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:all var(--duration-fast) var(--ease-out) }
.response-badge--confirmed { color:var(--color-text-primary);background:var(--color-success);border-color:var(--color-success-border) }
.response-badge--suggested { color:var(--color-text-primary);font-family:inherit;background:var(--color-warning);border-color:var(--color-warning-border);cursor:pointer;appearance:none }
.response-badge--suggested:hover { background:var(--color-warning-dark);border-color:var(--color-warning-border);box-shadow:var(--shadow-md);transform:var(--transform-hover-lift-micro) }
.response-badge--suggested:focus { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset);box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
.response-badge--suggested:active { box-shadow:var(--shadow-xs);transform:translateY(0) }
@media (prefers-reduced-motion:reduce) { .response-badge { transition:none }
 }
@media (prefers-contrast:high) { .response-badge { border-width:var(--border-width-2) }
.response-badge--confirmed { background:var(--color-success-high-contrast) }
.response-badge--suggested { background:var(--color-warning-high-contrast) }
 }
.modal { position:fixed;top:0;left:0;z-index:var(--z-modal);display:flex;visibility:visible;justify-content:center;align-items:center;width:100%;height:100%;opacity:100%;transition:opacity var(--duration-normal) var(--ease-out),visibility var(--duration-normal) var(--ease-out) }
.modal[hidden] { visibility:hidden;opacity:0;pointer-events:none }
.modal__overlay { position:absolute;top:0;left:0;width:100%;height:100%;background:var(--alpha-black-60);cursor:pointer }
.modal__container { position:relative;z-index:1;display:flex;flex-direction:column;width:90%;max-width:900px;max-height:90vh;background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-2xl) }
.modal__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-6);border-bottom:var(--border-width-1) solid var(--color-border-default) }
.modal__title { display:flex;align-items:center;gap:var(--spacing-3);margin:0;color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.modal__title i { color:var(--color-brand-primary) }
.modal__close { display:flex;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);padding:0;color:var(--color-text-secondary);background:transparent;border:none;border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);cursor:pointer }
.modal__close:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.modal__close:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.modal__body { overflow-y:auto;flex:1;padding:var(--spacing-6) }
.modal__footer { display:flex;justify-content:flex-end;gap:var(--spacing-3);padding:var(--spacing-6);border-top:var(--border-width-1) solid var(--color-border-default) }
.modal__button { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-6);font-size:var(--text-base);font-weight:var(--font-semibold);border:var(--border-width-1) solid transparent;border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.modal__button:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.modal__button--primary { color:var(--color-white);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.modal__button--primary:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.modal__button--secondary { color:var(--color-text-primary);background:var(--color-surface-elevated);border-color:var(--color-border-default) }
.modal__button--secondary:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.response-review { display:flex;flex-direction:column;gap:var(--spacing-6) }
.response-review__confidence { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.response-review__confidence-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.response-review__confidence-value { color:var(--color-brand-primary);font-size:var(--text-lg);font-weight:var(--font-bold) }
.response-review__section { display:flex;flex-direction:column;gap:var(--spacing-3) }
.response-review__section-title { margin:0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.response-review__email-card { padding:var(--spacing-5);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.response-review__email-meta { margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--line-height-relaxed);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.response-review__email-meta strong { color:var(--color-text-primary);font-weight:var(--font-semibold) }
.response-review__email-body { overflow-y:auto;max-height:300px;color:var(--color-text-primary);font-size:var(--text-base);line-height:var(--line-height-relaxed);white-space:pre-wrap;overflow-wrap:break-word }
@media (max-width:640px) { .modal__container { width:95%;max-height:95vh }
.modal__body,.modal__footer,.modal__header { padding:var(--spacing-4) }
.modal__footer { flex-direction:column }
.modal__button { justify-content:center;width:100% }
.response-review__email-body { max-height:200px }
 }
.response-analytics { margin-bottom:var(--spacing-8);padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg) }
.response-analytics[hidden] { display:none }
.response-analytics__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-6);padding-bottom:var(--spacing-4);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.response-analytics__title { display:flex;align-items:center;gap:var(--spacing-3);margin:0;color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.response-analytics__title i { color:var(--color-brand-primary) }
.response-analytics__controls { display:flex;align-items:center;gap:var(--spacing-3) }
.response-analytics__period-select { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-out);cursor:pointer }
.response-analytics__period-select:hover { border-color:var(--color-border-strong) }
.response-analytics__period-select:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.response-analytics__toggle { display:flex;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);padding:0;color:var(--color-text-secondary);background:transparent;border:none;border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);cursor:pointer }
.response-analytics__toggle:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.response-analytics__toggle:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.response-analytics__grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--grid-min-column),1fr));margin-bottom:var(--spacing-6) }
.analytics-card { display:flex;gap:var(--spacing-4);padding:var(--spacing-5);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:transform var(--duration-fast) var(--ease-out) }
.analytics-card:hover { transform:translateY(calc(var(--spacing-1)*-1)) }
.analytics-card__icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);border-radius:var(--radius-md) }
.analytics-card--primary .analytics-card__icon { color:var(--color-brand-primary);background:var(--color-brand-primary-subtle) }
.analytics-card--success .analytics-card__icon { color:var(--color-success-text);background:var(--color-success-subtle) }
.analytics-card--warning .analytics-card__icon { color:var(--color-warning-text);background:var(--color-warning-subtle) }
.analytics-card--info .analytics-card__icon { color:var(--color-info-text);background:var(--color-info-subtle) }
.analytics-card__content { display:flex;flex:1;flex-direction:column;gap:var(--spacing-1);min-width:0 }
.analytics-card__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.analytics-card__value { color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold);line-height:1.2 }
.analytics-card__meta { color:var(--color-text-tertiary);font-size:var(--text-xs) }
.response-analytics__section { margin-bottom:var(--spacing-6) }
.response-analytics__section:last-child { margin-bottom:0 }
.response-analytics__section-title { margin:0 0 var(--spacing-4) 0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.confidence-chart { padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.confidence-chart__loading { padding:var(--spacing-8);color:var(--color-text-secondary);font-size:var(--text-sm);text-align:center }
.confidence-chart__bars { display:flex;flex-direction:column;gap:var(--spacing-3) }
.confidence-bar { display:flex;align-items:center;gap:var(--spacing-3) }
.confidence-bar__label { flex-shrink:0;width:var(--spacing-20);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);text-align:right }
.confidence-bar__track { position:relative;overflow:hidden;flex:1;height:var(--spacing-6);background:var(--color-surface-secondary);border-radius:var(--radius-sm) }
.confidence-bar__fill { height:100%;background:var(--color-brand-primary);border-radius:var(--radius-sm);transition:width var(--duration-normal) var(--ease-out) }
.confidence-bar__count { min-width:var(--spacing-10);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);text-align:right }
.top-clubs-list { padding:var(--spacing-4);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.top-clubs-list__loading { padding:var(--spacing-8);color:var(--color-text-secondary);font-size:var(--text-sm);text-align:center }
.top-clubs-list__items { display:flex;flex-direction:column;gap:var(--spacing-2) }
.club-item { padding:var(--spacing-3);background:var(--color-surface-secondary);border-radius:var(--radius-sm);transition:background var(--duration-fast) var(--ease-out) }
.club-item:hover { background:var(--color-surface-card-hover) }
.club-item:hover .club-item__name { color:var(--color-text-card-hover) }
.club-item:hover .club-item__meta { color:var(--color-text-card-hover-secondary) }
.club-item__info { display:flex;flex:1;flex-direction:column;gap:var(--spacing-1);min-width:0 }
.club-item__name { overflow:hidden;color:var(--color-text-card);font-size:var(--text-base);font-weight:var(--font-medium);text-overflow:ellipsis;white-space:nowrap;transition:color var(--duration-fast) var(--ease-out) }
.club-item__meta { color:var(--color-text-card-secondary);font-size:var(--text-xs);transition:color var(--duration-fast) var(--ease-out) }
.club-item__count { display:flex;justify-content:center;align-items:center;min-width:var(--spacing-10);padding:var(--spacing-1) var(--spacing-2);color:var(--color-brand-primary);font-size:var(--text-sm);font-weight:var(--font-bold);background:var(--color-brand-primary-subtle);border-radius:var(--radius-sm) }
@media (max-width:40rem) { .response-analytics { padding:var(--spacing-4) }
.response-analytics__header { flex-direction:column;align-items:flex-start;gap:var(--spacing-3) }
.response-analytics__controls { justify-content:space-between;width:100% }
.response-analytics__period-select { flex:1 }
.response-analytics__grid { grid-template-columns:1fr }
.analytics-card__value { font-size:var(--text-2xl) }
.confidence-bar__label { width:var(--spacing-14);font-size:var(--text-xs) }
 }
.health-header { padding:var(--spacing-4) var(--spacing-8);background:var(--white);border-bottom:var(--spacing-px) solid var(--color-neutral-200);box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--alpha-black-10) }
.health-header h1 { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary) }
.status-overview { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-extra-wide),1fr));margin-bottom:var(--spacing-8) }
.health-status-card { padding:var(--spacing-6);background:var(--color-neutral-0);border-left:var(--spacing-1) solid var(--color-neutral-500);border-radius:var(--spacing-2);box-shadow:0 var(--spacing-0-5) var(--spacing-2) var(--alpha-black-10) }
.health-status-card--healthy { border-left-color:var(--color-success) }
.health-status-card--degraded,.health-status-card--unhealthy { border-left-color:var(--color-text-muted) }
.health-status-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4) }
.health-status-badge { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1) var(--spacing-3);color:var(--color-neutral-0);font-size:var(--text-sm);font-weight:500;background:var(--color-neutral-500);border-radius:var(--spacing-4) }
.health-status-badge--healthy { background:var(--color-success) }
.health-status-badge--degraded { background:var(--color-warning) }
.health-status-badge--unhealthy { background:var(--color-danger) }
.health-status-dot { width:var(--spacing-2);height:var(--spacing-2);background:currentcolor;border-radius:var(--radius-full) }
.metric-row { display:flex;justify-content:space-between;margin-bottom:var(--spacing-2) }
.metric-label { color:var(--color-neutral-500);font-size:var(--text-sm) }
.metric-value { font-weight:600 }
.health-actions { display:flex;gap:var(--spacing-4);margin-top:var(--spacing-4) }
.health-last-updated { margin-top:var(--spacing-8);color:var(--color-neutral-500);font-size:var(--text-sm);text-align:center }
.alerts-section { margin-bottom:var(--spacing-8);border-radius:var(--spacing-2) }
.alert-item { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-2);padding:var(--spacing-3);border:var(--spacing-px) solid var(--color-neutral-200);border-radius:var(--spacing-1) }
.alert-item--critical { background:var(--color-danger-bg);border-left:var(--spacing-1) solid var(--color-danger) }
.alert-item--warning { background:var(--color-warning-bg);border-left:var(--spacing-1) solid var(--color-warning) }
.alert-item--info { background:var(--color-info-bg);border-left:var(--spacing-1) solid var(--color-info) }
.alert-icon { font-size:var(--spacing-5) }
.alert-content { flex:1 }
.alert-service { color:var(--color-text-on-light);font-size:var(--text-sm);font-weight:600 }
.alert-message { color:var(--color-text-on-light-secondary);font-size:var(--text-sm) }
.alert-time { color:var(--color-text-on-light-secondary);font-size:var(--spacing-3) }
.monitoring-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--card-min-width-sm),1fr));margin:var(--spacing-4) 0 }
.monitoring-card { padding:var(--spacing-4);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm) }
.monitoring-card__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3) }
.monitoring-card__title { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:600 }
.monitoring-card__status { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-sm);font-weight:500;letter-spacing:.05em;text-transform:uppercase;border-radius:var(--radius-sm) }
.monitoring-card__status--healthy { color:var(--color-success);background:var(--color-success-subtle) }
.monitoring-card__status--warning { color:var(--color-warning);background:var(--color-warning-subtle) }
.monitoring-card__status--critical { color:var(--color-danger);background:var(--color-danger-subtle) }
.monitoring-metric-value { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:700 }
.monitoring-metric-label { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.metric-details { display:flex;flex-direction:column;gap:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
.health-score { position:relative;display:flex;justify-content:center;align-items:center;width:var(--spacing-30);height:var(--spacing-30);margin:0 auto var(--spacing-3);background:conic-gradient(var(--color-success) 0deg,var(--color-success) var(--score-angle,0deg),var(--color-gray-200) var(--score-angle,0deg) 1turn);border-radius:var(--radius-full) }
.health-score__inner { display:flex;flex-direction:column;justify-content:center;align-items:center;width:var(--spacing-20);height:var(--spacing-20);background:var(--color-surface-base);border-radius:var(--radius-full) }
.health-score__value { color:var(--color-text-primary);font-size:var(--text-xl);font-weight:700 }
.health-score__label { color:var(--color-text-secondary);font-size:var(--text-xs) }
.monitoring-status-indicators { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-30),1fr));margin-top:var(--spacing-3) }
.monitoring-status-indicator { padding:var(--spacing-2);text-align:center;background:var(--color-gray-50);border-radius:var(--radius-sm) }
.monitoring-status-indicator__icon { margin-bottom:var(--spacing-1);font-size:var(--text-lg) }
.monitoring-status-indicator__label { color:var(--color-text-secondary);font-size:var(--text-xs);letter-spacing:.05em;text-transform:uppercase }
.monitoring-refresh { display:flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-2) var(--spacing-3);color:var(--color-white);font-size:var(--text-sm);background:var(--color-brand-primary);border:none;border-radius:var(--radius-sm);transition:background-color .2s ease;cursor:pointer }
.monitoring-refresh:hover { background:var(--color-brand-primary-light) }
.realtime-data { font-family:var(--font-mono);font-size:var(--text-sm) }
[data-sg-theme=dark] .monitoring-card { background:var(--color-surface-elevated) }
[data-sg-theme=dark] .monitoring-status-indicator { background:var(--color-gray-800) }
[data-sg-theme=dark] .health-score__inner { background:var(--color-surface-elevated) }
@media (prefers-reduced-motion:reduce) { .empty-state--animated { animation:none }
 }
.empty-state { min-height:200px;padding:var(--spacing-12) }
.empty-state__icon { margin-bottom:var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-5xl);opacity:30% }
.empty-state__title { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.empty-state__description { max-width:400px;color:var(--color-text-muted) }
.empty-state__action { display:flex;gap:var(--spacing-3) }
.empty-state--chart { min-height:300px;background:var(--color-surface-elevated);border:2px dashed var(--color-border-subtle);border-radius:var(--radius-lg) }
.empty-state--inline { min-height:auto;padding:var(--spacing-6) }
.empty-state--small { min-height:150px;padding:var(--spacing-4) }
.empty-state--small .empty-state__icon { font-size:var(--text-3xl) }
.empty-state--small .empty-state__title { font-size:var(--text-lg) }
.empty-state--small .empty-state__description { font-size:var(--text-sm) }
.empty-state--animated { animation:fadeInUp var(--duration-medium) var(--ease-out) }
.empty-state { display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:var(--card-min-width-lg);padding:var(--spacing-12) var(--spacing-6);text-align:center }
.empty-state__icon { position:relative;display:flex;justify-content:center;align-items:center;width:120px;height:120px;margin-bottom:var(--spacing-6);background:var(--color-surface-elevated);border-radius:var(--radius-full);animation:float-icon 3s ease-in-out infinite }
.empty-state__icon i { color:var(--color-text-muted);font-size:var(--text-5xl);opacity:50% }
.empty-state__icon--primary { background:var(--color-brand-primary-subtle) }
.empty-state__icon--primary i { color:var(--color-brand-primary);opacity:100% }
.empty-state__icon--success { background:var(--color-success-subtle) }
.empty-state__icon--success i { color:var(--color-success);opacity:100% }
.empty-state__title { margin-bottom:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold) }
.empty-state__description { max-width:var(--chart-height-desktop);margin-bottom:var(--spacing-6);color:var(--color-text-secondary);font-size:var(--text-base);line-height:var(--leading-relaxed) }
.empty-state__actions { display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing-3) }
.empty-state__action { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-5);color:var(--color-text-inverse);font-size:var(--text-sm);font-weight:var(--font-semibold);text-decoration:none;background:var(--color-brand-primary);border:none;border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.empty-state__action:hover { background:var(--color-brand-primary-dark);box-shadow:var(--shadow-lg);transform:translateY(-2px) }
.empty-state__action--secondary { color:var(--color-text-secondary);background:transparent;border:var(--spacing-px) solid var(--color-border-strong) }
.empty-state__action--secondary:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.empty-state__decoration { position:absolute;pointer-events:none }
.empty-state__decoration--dots { width:var(--nav-height);height:var(--nav-height);background-image:radial-gradient(circle,var(--color-brand-primary-subtle) var(--spacing-0-5),transparent var(--spacing-0-5));background-size:var(--spacing-1-25) var(--spacing-1-25);opacity:50% }
.empty-state__decoration--top-left { top:calc(var(--spacing-7-5)*-1);left:calc(var(--spacing-7-5)*-1);animation:rotate 20s linear infinite }
.empty-state__decoration--bottom-right { right:calc(var(--spacing-7-5)*-1);bottom:calc(var(--spacing-7-5)*-1);animation:rotate 20s linear infinite reverse }
.empty-state--compact { min-height:var(--col-width-medium);padding:var(--spacing-8) var(--spacing-4) }
.empty-state--compact .empty-state__icon { width:80px;height:80px }
.empty-state--compact .empty-state__icon i { font-size:var(--text-3xl) }
.empty-state--compact .empty-state__title { font-size:var(--text-lg) }
.empty-state--compact .empty-state__description { font-size:var(--text-sm) }
.empty-state--search .empty-state__icon { background:var(--color-warning-subtle) }
.empty-state--search .empty-state__icon i { color:var(--color-warning);opacity:100% }
.empty-state--error .empty-state__icon { background:var(--color-danger-subtle);animation:shake .5s }
.empty-state--error .empty-state__icon i { color:var(--color-danger);opacity:100% }
.empty-state--list,.empty-state--upload { background:var(--color-surface-elevated);border:var(--spacing-0-5) dashed var(--color-border-strong);border-radius:var(--radius-xl) }
.empty-state--upload { transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.empty-state--upload:hover { background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary) }
.empty-state--upload.is-dragover { background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary);transform:scale(1.02) }
.empty-state--progress .empty-state__progress { width:100%;max-width:var(--col-width-extra-wide);margin-top:var(--spacing-4) }
.empty-state__progress-bar { overflow:hidden;height:var(--spacing-2);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.empty-state__progress-fill { height:100%;background:var(--color-brand-primary);border-radius:var(--radius-full);animation:progress-fill 2s ease-out forwards }
.empty-state__checklist { margin-top:var(--spacing-4);text-align:left }
.empty-state__checklist-item { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-2) 0;color:var(--color-text-secondary);font-size:var(--text-sm) }
.empty-state__checklist-icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6);color:var(--color-text-muted);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.empty-state__checklist-item--completed .empty-state__checklist-icon { color:var(--color-success);background:var(--color-success-subtle) }
.empty-state__checklist-item--completed .empty-state__checklist-text { text-decoration:line-through;opacity:70% }
@media (prefers-reduced-motion:reduce) { .empty-state__decoration--bottom-right,.empty-state__decoration--top-left,.empty-state__icon { animation:none }
.empty-state__progress-fill { animation:none;width:70% }
.empty-state--error .empty-state__icon { animation:none }
.empty-state--upload,.empty-state__action { transition:none }
 }
@media (max-width:640px) { .toast-container { right:var(--spacing-4);left:var(--spacing-4);max-width:none }
.toast-container--center { left:var(--spacing-4);transform:none }
.toast { min-width:0 }
 }
.toast-container { position:fixed;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-notification);display:flex;flex-direction:column;gap:var(--spacing-3);max-width:var(--card-min-width-lg);pointer-events:none }
.toast-container--bottom { top:auto;bottom:var(--spacing-4) }
.toast-container--left { right:auto;left:var(--spacing-4) }
.toast-container--center { left:var(--radius-full);transform:translateX(-9999px) }
.toast { position:relative;display:flex;overflow:hidden;align-items:flex-start;gap:var(--spacing-3);min-width:var(--col-width-extra-wide);max-width:100%;padding:var(--spacing-4);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);animation:toast-slide-in var(--duration-fast) var(--ease-out);pointer-events:all }
.toast-container--left .toast { animation-name:toast-slide-in-left }
.toast-container--bottom .toast { animation-name:toast-slide-up }
.toast--exiting { animation:toast-slide-out var(--duration-fast) var(--ease-in) forwards }
.toast-container--left .toast--exiting { animation-name:toast-slide-out-left }
.toast__icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6);border-radius:var(--radius-full) }
.toast__icon i { font-size:var(--text-base) }
.toast__content { flex:1;min-width:0 }
.toast__title { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.toast__message { color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.toast__actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-3) }
.toast__action { padding:var(--spacing-1) var(--spacing-2);color:var(--color-brand-primary);font-size:var(--text-sm);font-weight:var(--font-medium);text-decoration:none;background:transparent;border:none;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.toast__action:hover { color:var(--color-brand-primary-dark);background:var(--color-surface-hover) }
.toast__close { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6);color:var(--color-text-tertiary);background:transparent;border:none;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.toast__close:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.toast__progress { position:absolute;right:0;bottom:0;left:0;height:var(--spacing-0-75);background:var(--color-surface-elevated) }
.toast__progress-bar { height:100%;background:var(--color-brand-primary);animation:toast-progress var(--duration-toast,var(--duration-slow,5s)) linear forwards }
.toast--success { border-left:var(--spacing-1) solid var(--color-success) }
.toast--success .toast__icon { color:var(--color-success);background:var(--color-success-subtle) }
.toast--success .toast__progress-bar { background:var(--color-success) }
.toast--warning { border-left:var(--spacing-1) solid var(--color-warning) }
.toast--warning .toast__icon { color:var(--color-warning);background:var(--color-warning-subtle) }
.toast--warning .toast__progress-bar { background:var(--color-warning) }
.toast--error { border-left:var(--spacing-1) solid var(--color-danger) }
.toast--error .toast__icon { color:var(--color-danger);background:var(--color-danger-subtle) }
.toast--error .toast__progress-bar { background:var(--color-danger) }
.toast--info { border-left:var(--spacing-1) solid var(--color-info) }
.toast--info .toast__icon { color:var(--color-info);background:var(--color-info-subtle) }
.toast--info .toast__progress-bar { background:var(--color-info) }
.toast--loading .toast__icon { background:transparent }
.toast--loading .toast__icon:after { content:"";width:var(--spacing-5);height:var(--spacing-5);border:var(--spacing-0-5) solid var(--color-border-default);border-top-color:var(--color-brand-primary);border-radius:var(--radius-full);animation:spin .8s linear infinite }
.toast--compact { min-width:auto;padding:var(--spacing-2) var(--spacing-3) }
.toast--compact .toast__title { margin-bottom:0 }
.toast--compact .toast__message { display:none }
.toast--compact .toast__actions { margin-top:0;margin-left:var(--spacing-3) }
.toast:not(:first-child) { margin-top:var(--spacing-2) }
.toast__badge { position:absolute;top:calc(var(--spacing-1-5)*-1);right:calc(var(--spacing-1-5)*-1);display:flex;justify-content:center;align-items:center;min-width:var(--spacing-5);height:var(--spacing-5);padding:0 var(--spacing-1);color:var(--color-text-inverse);font-size:var(--text-xs);font-weight:var(--font-bold);background:var(--color-danger);border-radius:var(--radius-full);box-shadow:var(--shadow-sm) }
.toast__image { flex-shrink:0;width:var(--spacing-12);height:var(--spacing-12);border-radius:var(--radius-md);object-fit:cover }
.toast-group { padding:var(--spacing-1);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);animation:toast-slide-in var(--duration-fast) var(--ease-out);pointer-events:all }
.toast-group .toast { border:none;box-shadow:none;animation:none }
.toast-group .toast:not(:last-child) { border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.activity-feed { display:flex;overflow:hidden;flex-direction:column;height:100%;max-height:600px;background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-xl) }
.activity-feed__header { flex-shrink:0;background:var(--color-surface-elevated);border-bottom:1px solid var(--color-border-subtle) }
.activity-feed__title { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.activity-feed__title i { color:var(--color-brand-primary) }
.activity-feed__live-indicator { width:8px;height:8px;background:var(--color-success);border-radius:var(--radius-full);animation:pulse 2s infinite }
.activity-feed__controls { display:flex;gap:var(--spacing-1);opacity:0;transition:opacity var(--duration-fast) var(--ease-out) }
.activity-feed:hover .activity-feed__controls { opacity:100% }
.activity-feed__control-btn { display:flex;justify-content:center;align-items:center;width:28px;height:28px;color:var(--color-text-tertiary);background:transparent;border:1px solid transparent;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.activity-feed__control-btn:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-default) }
.activity-feed__control-btn:disabled { opacity:30%;cursor:not-allowed }
.activity-feed__list { overflow-y:auto;flex:1;padding:var(--spacing-2);scrollbar-width:thin;scrollbar-color:var(--color-border-subtle) transparent }
.activity-feed__list::-webkit-scrollbar { width:6px }
.activity-feed__list::-webkit-scrollbar-track { background:transparent }
.activity-feed__list::-webkit-scrollbar-thumb { background:var(--color-border-subtle);border-radius:var(--radius-full) }
.activity-feed__list::-webkit-scrollbar-thumb:hover { background:var(--color-border-default) }
.activity-feed__item { display:flex;gap:var(--spacing-3);padding:var(--spacing-3);border-radius:var(--radius-lg);transition:background var(--duration-fast) var(--ease-out);animation:slide-in var(--duration-medium) var(--ease-out) }
.activity-feed__item:hover { background:var(--color-surface-hover) }
.activity-feed__item-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;color:var(--color-brand-primary);background:var(--color-brand-primary-subtle);border-radius:var(--radius-full) }
.activity-feed__item-icon--success { color:var(--color-success-text);background:var(--color-success-subtle) }
.activity-feed__item-icon--warning { color:var(--color-warning-text);background:var(--color-warning-subtle) }
.activity-feed__item-icon--error { color:var(--color-danger-text);background:var(--color-danger-subtle) }
.activity-feed__item-icon--info { color:var(--color-info-text);background:var(--color-info-subtle) }
.activity-feed__item-content { flex:1;min-width:0 }
.activity-feed__item-meta { display:flex;gap:var(--spacing-2);margin-bottom:var(--spacing-1);color:var(--color-text-tertiary);font-size:var(--text-xs) }
.activity-feed__item-time { display:flex;align-items:center;gap:var(--spacing-1) }
.activity-feed__item-type { padding:var(--spacing-0-5) var(--spacing-2);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase;background:var(--color-surface-elevated);border-radius:var(--radius-sm) }
.activity-feed__item-description { color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.activity-feed__item--highlight { background:var(--color-brand-primary-subtle);border-left:3px solid var(--color-brand-primary) }
.activity-feed__empty { display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:var(--spacing-8);color:var(--color-text-muted);text-align:center }
.activity-feed__empty-icon { margin-bottom:var(--spacing-3);font-size:var(--text-3xl);opacity:30% }
.activity-feed__empty-text { font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.activity-feed__item--welcome { background:linear-gradient(135deg,var(--color-brand-primary-subtle) 0,transparent 100%);border:1px solid var(--color-brand-primary-subtle) }
.activity-feed--collapsed { max-height:48px;cursor:pointer }
.activity-feed--collapsed .activity-feed__empty,.activity-feed--collapsed .activity-feed__list { display:none }
.activity-feed--collapsed .activity-feed__header { border-bottom:none }
.activity-feed__count { min-width:20px;padding:var(--spacing-0-5) var(--spacing-2);color:var(--color-neutral-0);font-size:var(--text-xs);font-weight:var(--font-semibold);text-align:center;background:var(--color-brand-primary);border-radius:var(--radius-full) }
.loading { display:inline-flex;justify-content:center;align-items:center }
.loading__spinner { width:var(--spacing-8);height:var(--spacing-8);border:var(--spacing-0-75) solid var(--color-neutral-300);border-top-color:var(--color-brand-primary);border-radius:var(--radius-full);animation:spin var(--duration-slower) linear infinite }
.loading__text { margin-left:var(--spacing-3);color:var(--color-text-secondary) }
@media (max-width:768px) { .dashboard-header__btn-text { display:none }
.dashboard-header { padding:var(--spacing-4) var(--spacing-4) }
.dashboard-header__title,.dashboard-header__title i { font-size:var(--text-xl) }
 }
.dashboard-header { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-6);margin-bottom:var(--spacing-6);padding:var(--spacing-6) var(--spacing-8);background:var(--color-surface-primary);border-bottom:var(--spacing-px) solid var(--color-border-default) }
.dashboard-header--unified { background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%) }
.dashboard-header__left { display:flex;flex:1;align-items:center;gap:var(--spacing-6);min-width:0 }
.dashboard-header__title { display:flex;align-items:center;gap:var(--spacing-3);margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:var(--leading-tight) }
.dashboard-header__title i { color:var(--color-brand-primary);font-size:var(--text-2xl) }
.dashboard-header__status { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.dashboard-header__status-dot { width:var(--spacing-2);height:var(--spacing-2);border-radius:var(--radius-full);animation:pulse 2s infinite }
.dashboard-header__status-dot--connected { background:var(--color-success) }
.dashboard-header__status-dot--disconnected { background:var(--color-warning) }
.dashboard-header__status-dot--error { background:var(--color-danger) }
.dashboard-header__status-dot--loading { background:var(--color-info) }
.dashboard-header__status-text { color:var(--color-text-primary);font-weight:var(--font-medium) }
.dashboard-header__divider { color:var(--color-text-tertiary);opacity:50% }
.dashboard-header__last-update { color:var(--color-text-tertiary) }
.dashboard-header__controls { display:flex;align-items:center;gap:var(--spacing-3) }
.dashboard-header__timeframe-select { padding:var(--spacing-2) var(--spacing-3);padding-right:var(--spacing-8);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-primary);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' viewBox='0 0 10 6'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m1 1 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacing-2) center;background-size:var(--spacing-3);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer;appearance:none }
.dashboard-header__timeframe-select:hover { background-color:var(--color-surface-hover);border-color:var(--color-border-strong) }
.dashboard-header__timeframe-select:focus { outline:var(--spacing-0-5) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.dashboard-header__btn { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);white-space:nowrap;background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.dashboard-header__btn:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:var(--shadow-sm);transform:translateY(-1px) }
.dashboard-header__btn:active { box-shadow:none;transform:translateY(0) }
.dashboard-header__btn:disabled { opacity:50%;transform:none;cursor:not-allowed }
.dashboard-header__btn--refresh { color:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.dashboard-header__btn--refresh:hover { background:var(--color-brand-primary-subtle) }
.dashboard-header__btn--export { color:var(--color-neutral-0);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.dashboard-header__btn--export:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark) }
.dashboard-header--loading .dashboard-header__btn i { animation:spin 1s linear infinite }
.skeleton { position:relative;overflow:hidden;background:linear-gradient(90deg,var(--color-surface-elevated) 25%,var(--color-surface-hover) var(--radius-full),var(--color-surface-elevated) 75%) }
.skeleton-text { height:var(--text-base);margin:var(--spacing-2) 0;border-radius:var(--radius-sm) }
.skeleton-text--title { width:60%;height:var(--text-2xl) }
.skeleton-text--subtitle { width:40%;height:var(--text-lg) }
.skeleton-text--paragraph { width:100%;height:var(--text-base) }
.skeleton-card { padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl) }
.skeleton-card__header { display:flex;justify-content:space-between;margin-bottom:var(--spacing-4) }
.skeleton-card__value { width:120px;height:var(--text-4xl);margin-bottom:var(--spacing-2) }
.skeleton-card__label { width:80px;height:var(--text-sm) }
.skeleton-chart { position:relative;overflow:hidden;height:var(--col-width-extra-wide);background:var(--color-surface-elevated);border-radius:var(--radius-lg) }
.skeleton-chart:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 30%,var(--color-surface-hover) var(--radius-full),transparent 70%);animation:skeleton-wave 2s ease-in-out infinite }
.skeleton-list { display:flex;flex-direction:column;gap:var(--spacing-2) }
.skeleton-list__item { display:flex;gap:var(--spacing-3);padding:var(--spacing-3) }
.skeleton-list__avatar { flex-shrink:0;width:var(--spacing-10);height:var(--spacing-10);border-radius:var(--radius-full) }
.skeleton-list__content { flex:1 }
.skeleton-list__line { height:var(--text-sm);margin-bottom:var(--spacing-1) }
.skeleton-list__line:first-child { width:70% }
.skeleton-list__line:last-child { width:40% }
.skeleton-button { width:120px;height:var(--spacing-10);border-radius:var(--radius-md) }
.skeleton--default { height:80px;margin-bottom:var(--spacing-4);border-radius:var(--radius-lg) }
.shimmer { display:inline-block;min-width:var(--nav-height);color:transparent;background:linear-gradient(90deg,var(--color-surface-elevated) 25%,var(--color-surface-hover) var(--radius-full),var(--color-surface-elevated) 75%);background-size:200% 100%;border-radius:var(--radius-sm);animation:shimmer 2s infinite }
@media (prefers-reduced-motion:reduce) { .shimmer,.skeleton { animation:none;background-position:50% 0 }
.skeleton-chart:before { animation:none;transform:none;opacity:50% }
.sg-card--stat,.sg-metric__icon,.sg-metric__value { transform:none;transition:none;animation:none }
 }
@media (prefers-contrast:more) { .sg-card--stat { border-width:var(--spacing-0-5) }
.sg-metric__value { color:var(--color-text-primary);background:none;-webkit-text-fill-color:var(--color-text-primary) }
 }
.sg-card--stat { position:relative;overflow:visible;min-height:var(--metric-card-min-height);padding:var(--metric-card-padding);background:var(--metric-card-bg-gradient);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--metric-card-radius);box-shadow:var(--metric-card-shadow);transition:var(--metric-transition-smooth);backdrop-filter:blur(var(--spacing-1)) }
.sg-card--stat:hover { border-color:var(--metric-card-border-hover);box-shadow:var(--metric-card-shadow-hover);transform:var(--metric-hover-transform) }
[data-card-id=total-drafts-card].sg-card--stat { background:var(--metric-card-bg-primary);border-color:var(--metric-card-border-primary) }
[data-card-id=ready-to-send-card].sg-card--stat { background:var(--metric-card-bg-success);border-color:var(--color-success-border,var(--color-border-default)) }
[data-card-id=sent-today-card].sg-card--stat { background:var(--metric-card-bg-info);backdrop-filter:blur(var(--spacing-1));border-color:var(--color-info-border,var(--color-border-default)) }
[data-card-id=high-confidence-card].sg-card--stat { background:var(--metric-card-bg-warning);border-color:var(--color-warning-border,var(--color-border-default)) }
.sg-card--stat .sg-stat__value { color:var(--color-text-on-dark);background:var(--metric-value-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent }
.sg-card--stat .sg-stat__label { color:var(--color-text-on-dark-secondary) }
.sg-card--stat .sg-stat__icon { color:var(--color-text-on-dark) }
.sg-metric__value { margin-bottom:var(--spacing-2);color:var(--metric-value-color);font-size:var(--metric-value-font-size);font-weight:var(--metric-value-font-weight);line-height:var(--metric-value-line-height);letter-spacing:var(--metric-value-letter-spacing);background:var(--metric-value-gradient);background-clip:text }
.sg-metric__label { color:var(--metric-label-color);font-size:var(--metric-label-font-size);font-weight:var(--metric-label-font-weight);line-height:var(--metric-label-line-height);letter-spacing:var(--metric-label-letter-spacing);text-transform:var(--metric-label-transform) }
.sg-metric__icon { display:flex;justify-content:center;align-items:center;width:var(--metric-icon-size);height:var(--metric-icon-size);border-radius:var(--metric-icon-radius);transition:var(--metric-transition-smooth) }
.sg-metric__icon i { color:var(--color-neutral-0);font-size:var(--spacing-6) }
[data-card-id=total-drafts-card] .sg-metric__icon { background:var(--gradient-primary-enhanced);box-shadow:var(--metric-icon-shadow-primary) }
[data-card-id=ready-to-send-card] .sg-metric__icon { background:var(--gradient-success-enhanced);box-shadow:var(--metric-icon-shadow-success) }
[data-card-id=sent-today-card] .sg-metric__icon { background:var(--gradient-info-enhanced);box-shadow:var(--metric-icon-shadow-info) }
[data-card-id=high-confidence-card] .sg-metric__icon { background:var(--gradient-warning-enhanced);box-shadow:var(--metric-icon-shadow-warning) }
.sg-metric__icon:hover { transform:var(--metric-icon-hover-transform) }
.sg-metric__value.c-metric-updating { animation:metric-pulse .3s ease-in-out }
.sg-metric__value.c-metric-increased { animation:metric-value-increase .5s ease-out }
.sg-card--stat.c-metric-loading { opacity:80% }
.sg-card--stat.metric-loading .sg-metric__value { background:linear-gradient(90deg,var(--alpha-white-30) 25%,var(--color-brand-primary-subtle) 50%,var(--alpha-white-30) 75%);background-size:200% 100%;background-clip:text;animation:loading-shimmer 1.5s infinite }
.sg-card--stat:focus-within .sg-metric__value { text-shadow:0 0 var(--spacing-2-5) var(--color-brand-primary-subtle) }
@media (min-width:768px) { .metrics-grid--patterns { gap:var(--spacing-6);grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1024px) { .metrics-grid--patterns { grid-template-columns:repeat(4,1fr) }
.metric-comparison { align-items:center;grid-template-columns:1fr auto 1fr }
 }
@media (max-width:1023px) { .comparison-divider { padding:var(--spacing-4) 0 }
.comparison-divider:before { position:absolute;top:50%;right:0;left:0;height:var(--spacing-px);background:var(--color-border-subtle);content:"" }
 }
@media (prefers-reduced-motion:reduce) { .ab-test-section *,.comparison-divider__content,.metric-card-v2,.metric-card-v2__progress-fill:after,.patterns-section *,.shimmer,.shimmer:after,.test-status-badge--active:before { transition:none;animation:none }
.metric-card-v2:hover,.pattern-item:hover,.variant-metric:hover { transform:none }
 }
.patterns-section { position:relative;margin-bottom:var(--spacing-8);padding:var(--spacing-8);background:linear-gradient(135deg,var(--color-surface-primary-translucent) 0,var(--color-surface-elevated-translucent) 100%);backdrop-filter:blur(12px);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg),inset 0 1px 0 var(--alpha-white-10) }
.patterns-section__header { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-6) }
.patterns-section__title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight) }
.patterns-section__actions { display:flex;align-items:center;gap:var(--spacing-3) }
.metrics-grid--patterns { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:1fr;margin-bottom:var(--spacing-8) }
.metric-card-v2[data-card-id=total-patterns-card] { position:relative;background:linear-gradient(135deg,var(--color-brand-primary-15) 0,var(--color-brand-primary-light-10) 100%);border-color:var(--color-brand-primary);transform:translateZ(0);transition:all var(--duration-medium) var(--ease-out) }
.metric-card-v2[data-card-id=total-patterns-card]:before { position:absolute;inset:0;background:var(--gradient-primary-enhanced);border-radius:var(--radius-xl);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;content:"" }
.metric-card-v2[data-card-id=total-patterns-card]:hover:before { opacity:var(--opacity-10) }
.metric-card-v2[data-card-id=total-patterns-card]:hover { border-color:var(--color-brand-primary-light);box-shadow:0 20px 40px -8px var(--color-brand-primary-subtle),0 10px 20px -5px var(--alpha-black-30);transform:translateY(-4px) }
.metric-card-v2[data-card-id=active-patterns-card] { background:linear-gradient(135deg,var(--color-success-15) 0,var(--color-success-subtle) 100%);border-color:var(--color-success-border) }
.metric-card-v2[data-card-id=active-patterns-card]:before { background:var(--gradient-success-enhanced) }
.metric-card-v2[data-card-id=active-patterns-card]:hover { border-color:var(--color-success);box-shadow:0 20px 40px -8px var(--color-success-hover),0 10px 20px -5px var(--alpha-black-30);transform:translateY(-4px) }
.metric-card-v2[data-card-id=usage-rate-card] { background:linear-gradient(135deg,var(--color-info-subtle) 0,var(--color-info-subtle) 100%);border-color:var(--color-info-border) }
.metric-card-v2[data-card-id=usage-rate-card]:before { background:var(--gradient-info-enhanced) }
.metric-card-v2[data-card-id=usage-rate-card]:hover { border-color:var(--color-info);box-shadow:0 20px 40px -8px var(--color-info-hover),0 10px 20px -5px var(--alpha-black-30);transform:translateY(-4px) }
.metric-card-v2[data-card-id=avg-confidence-card] { background:linear-gradient(135deg,var(--color-warning-moderate-subtle) 0,var(--color-warning-subtle) 100%);border-color:var(--color-warning-border) }
.metric-card-v2[data-card-id=avg-confidence-card]:before { background:var(--gradient-warning-enhanced) }
.metric-card-v2[data-card-id=avg-confidence-card]:hover { border-color:var(--color-warning);box-shadow:0 20px 40px -8px var(--color-warning-hover),0 10px 20px -5px var(--alpha-black-30);transform:translateY(-4px) }
.metric-card-v2__value { font-weight:var(--font-bold);line-height:var(--leading-tight);background:linear-gradient(135deg,var(--color-text-primary) 0,var(--alpha-white-80) 100%);background-clip:text;-webkit-text-fill-color:transparent }
.metric-card-v2 { animation:spring-up var(--duration-slow) var(--ease-bounce) backwards }
.metric-card-v2:first-child { animation-delay:0s }
.metric-card-v2:nth-child(2) { animation-delay:50ms }
.metric-card-v2:nth-child(3) { animation-delay:.1s }
.metric-card-v2:nth-child(4) { animation-delay:.15s }
.pattern-list-container { padding:var(--spacing-6);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-subtle);border-radius:var(--radius-xl) }
.pattern-list-container__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4) }
.pattern-list-container__title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.pattern-list { display:flex;overflow-y:auto;flex-direction:column;gap:var(--spacing-2);max-height:var(--list-max-height-scrollable);padding-right:var(--spacing-2) }
.pattern-list::-webkit-scrollbar { width:var(--spacing-2) }
.pattern-list::-webkit-scrollbar-track { background:var(--color-surface-hover);border-radius:var(--radius-full) }
.pattern-list::-webkit-scrollbar-thumb { background:var(--color-border-strong);border-radius:var(--radius-full);transition:background var(--duration-fast) var(--ease-out) }
.pattern-list::-webkit-scrollbar-thumb:hover { background:var(--color-brand-primary) }
.pattern-item { display:flex;justify-content:space-between;align-items:center;min-height:var(--touch-target-min);padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-subtle);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.pattern-item:hover { background:var(--color-surface-hover);border-color:var(--color-border-default);box-shadow:var(--shadow-sm);transform:translateX(4px) }
.pattern-item:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.pattern-item__info { display:flex;flex-direction:column;gap:var(--spacing-1) }
.pattern-item__name { color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-medium) }
.pattern-item__meta { display:flex;align-items:center;gap:var(--spacing-3) }
.pattern-item__count { color:var(--color-text-tertiary);font-size:var(--text-sm) }
.pattern-type { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out) }
.pattern-type.badge--subject { color:var(--color-indigo);background:var(--color-indigo-subtle);border:var(--spacing-px) solid var(--color-indigo-border) }
.pattern-type.badge--subject:hover { background:var(--color-indigo-hover);box-shadow:0 0 20px var(--color-indigo-border) }
.pattern-type.badge--greeting { color:var(--color-success-light);background:var(--color-success-15);border:var(--spacing-px) solid var(--color-success-border) }
.pattern-type.badge--greeting:hover { background:var(--color-success-hover);box-shadow:0 0 20px var(--color-success-border) }
.pattern-type.badge--closing { color:var(--color-brand-primary-light);background:var(--color-brand-primary-subtle);border:var(--spacing-px) solid var(--color-primary-border) }
.pattern-type.badge--closing:hover { background:var(--color-brand-primary-hover);box-shadow:0 0 20px var(--color-primary-border) }
.pattern-type.badge--context { color:var(--color-warning-light);background:var(--color-warning-subtle);border:var(--spacing-px) solid var(--color-warning-border) }
.pattern-type.badge--context:hover { background:var(--color-warning-hover);box-shadow:0 0 20px var(--color-warning-border) }
.pattern-type.badge--signature { color:var(--color-info-light);background:var(--color-info-subtle);border:var(--spacing-px) solid var(--color-info-border) }
.pattern-type.badge--signature:hover { background:var(--color-info-hover);box-shadow:0 0 20px var(--color-info-border) }
.pattern-legend { display:flex;flex-wrap:wrap;gap:var(--spacing-4);margin-top:var(--spacing-4);padding-top:var(--spacing-4);border-top:var(--spacing-px) solid var(--color-border-subtle) }
.legend-item { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);transition:color var(--duration-fast) var(--ease-out);cursor:pointer }
.legend-item:hover { color:var(--color-text-primary) }
.legend-item__indicator { width:var(--spacing-4);height:var(--spacing-4);border:var(--spacing-px) solid;border-radius:var(--radius-full) }
.ab-test-section { position:relative;margin-bottom:var(--spacing-8);padding:var(--spacing-8);background:linear-gradient(135deg,var(--color-surface-primary-translucent) 0,var(--color-surface-elevated-translucent) 100%);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg),inset 0 1px 0 var(--alpha-white-10);backdrop-filter:blur(12px) }
.ab-test-section__header { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-6) }
.ab-test-section__title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:var(--leading-tight) }
.test-status-badge { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-full) }
.test-status-badge--active { color:var(--color-success);background:var(--color-success-15);border-color:var(--color-success-border) }
.test-status-badge--active:before { display:inline-block;width:var(--spacing-2);height:var(--spacing-2);background:var(--color-success);border-radius:var(--radius-full);animation:pulse var(--duration-pulse) ease-in-out infinite;content:"" }
.test-status-badge--completed { color:var(--color-text-tertiary);background:var(--badge-draft-type-bg);border-color:var(--badge-draft-type-border) }
.test-metadata { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:var(--spacing-8);padding:var(--spacing-6);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-subtle);border-radius:var(--radius-xl) }
.test-metadata__item { display:flex;flex-direction:column;gap:var(--spacing-1) }
.test-metadata__label { color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.test-metadata__value { color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.metric-comparison { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6) }
.variant-metric { position:relative;padding:var(--spacing-6);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl);transition:all var(--duration-medium) var(--ease-out) }
.variant-metric--control { border-color:var(--badge-draft-type-border) }
.variant-metric--variant { background:linear-gradient(135deg,var(--color-brand-primary-05) 0,var(--color-surface-elevated) 100%);border-color:var(--color-brand-primary) }
.variant-metric:hover { box-shadow:var(--shadow-md);transform:translateY(-2px) }
.variant-metric__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4) }
.variant-metric__label { color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.variant-metric__stats { display:flex;flex-direction:column;gap:var(--spacing-4) }
.variant-stat { display:flex;justify-content:space-between;align-items:baseline;padding-bottom:var(--spacing-3);border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.variant-stat:last-child { padding-bottom:var(--spacing-0);border-bottom:none }
.variant-stat__label { color:var(--color-text-secondary);font-size:var(--text-sm) }
.variant-stat__value { color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-bold) }
.comparison-divider { position:relative;display:flex;justify-content:center;align-items:center }
.comparison-divider__content { display:flex;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-bold);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-full);animation:float var(--duration-pulse) ease-in-out infinite }
.difference-indicator { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-semibold);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out) }
.difference-indicator--positive { color:var(--color-success);background:var(--color-success-15);border:var(--spacing-px) solid var(--color-success-border) }
.difference-indicator--positive:hover { background:var(--color-success-hover);box-shadow:var(--shadow-badge-glow-success) }
.difference-indicator--negative { color:var(--color-danger);background:var(--color-error-15);border:var(--spacing-px) solid var(--color-danger-border) }
.difference-indicator--negative:hover { background:var(--color-danger-border);box-shadow:var(--shadow-badge-glow-danger) }
.difference-indicator--neutral { color:var(--color-text-tertiary);background:var(--badge-draft-type-bg);border:var(--spacing-px) solid var(--badge-draft-type-border) }
.significance-badge { padding:var(--spacing-2) var(--spacing-4);font-size:var(--text-sm);font-weight:var(--font-semibold);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out);backdrop-filter:blur(8px) }
.significance-badge[data-significant=true] { color:var(--color-success);background:color-mix(in srgb,var(--color-success) 20%,transparent);border:var(--spacing-px) solid color-mix(in srgb,var(--color-success) 40%,transparent);box-shadow:0 0 20px color-mix(in srgb,var(--color-success) 20%,transparent),inset 0 1px 0 var(--alpha-white-10) }
.significance-badge[data-significant=false] { color:var(--color-warning);background:color-mix(in srgb,var(--color-warning) 20%,transparent);border:var(--spacing-px) solid color-mix(in srgb,var(--color-warning) 40%,transparent) }
.effect-scale { position:relative;overflow:hidden;height:var(--spacing-8);margin:var(--spacing-4) 0;background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-success-subtle) 50%,color-mix(in srgb,var(--color-success) 20%,transparent) 100%);border-radius:var(--radius-full) }
.effect-scale__indicator { position:absolute;top:50%;width:var(--spacing-1);height:100%;background:var(--color-brand-primary);border-radius:var(--radius-full);box-shadow:0 0 20px var(--color-brand-primary-subtle);transform:translateY(-50%);transition:left var(--duration-medium) var(--ease-bounce) }
.effect-scale__labels { display:flex;justify-content:space-between;margin-top:var(--spacing-2) }
.effect-scale__label { color:var(--color-text-tertiary);font-size:var(--text-xs) }
.scale-marker { position:absolute }
.scale-marker--small { left:20% }
.scale-marker--medium { left:50% }
.scale-marker--large { left:80% }
.scale-indicator { position:absolute }
.scale-indicator--start { left:0 }
.recommendation-panel { margin-top:var(--spacing-8);padding:var(--spacing-6);background:linear-gradient(135deg,var(--color-brand-primary-10) 0,var(--color-brand-primary-light-05) 100%);border:var(--spacing-px) solid var(--color-brand-primary);border-radius:var(--radius-xl) }
.recommendation-panel__header { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-4) }
.recommendation-panel__icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);color:var(--color-white);font-size:var(--text-xl);background:var(--color-brand-primary);border-radius:var(--radius-lg);box-shadow:var(--metric-icon-shadow-primary) }
.recommendation-panel__title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-bold) }
.recommendation-panel__content { color:var(--color-text-secondary);font-size:var(--text-base);line-height:var(--leading-relaxed) }
.recommendation-panel__actions { display:flex;gap:var(--spacing-3);margin-top:var(--spacing-6) }
.metric-card-v2__progress-track { overflow:hidden;height:var(--spacing-2);background:var(--color-surface-hover);border-radius:var(--radius-full) }
.metric-card-v2__progress-fill { position:relative;height:100%;background:var(--gradient-success-enhanced);border-radius:var(--radius-full);box-shadow:0 0 20px var(--color-success-border),inset 0 1px 0 var(--alpha-white-20);transition:width var(--duration-medium) var(--ease-out) }
.metric-card-v2__progress-fill--initial { width:0 }
.metric-card-v2__progress-fill:after { content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0,color-mix(in srgb,var(--color-white) 40%,transparent) 50%,transparent 100%);animation:progress-shine 2s ease-in-out infinite }
.shimmer { position:relative;overflow:hidden;background:var(--color-surface-hover);border-radius:var(--radius-md) }
.shimmer:after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0,var(--overlay-light-20) 50%,transparent 100%);transform:translateX(-100%);animation:shimmer-slide var(--duration-shimmer) ease-in-out infinite }
.shimmer--small { width:var(--size-shimmer-small);height:var(--spacing-4) }
.shimmer--medium { width:var(--size-shimmer-medium);height:var(--spacing-6) }
.shimmer--large { width:var(--size-shimmer-large);height:var(--spacing-8) }
.legend-item:focus-visible,.pattern-item:focus-visible,.variant-metric:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
@media (max-width:1024px) { .template-chat-panel { top:var(--spacing-16);right:2.5vw;left:auto;width:95vw;max-width:none }
 }
@media (max-width:768px) { .template-chat-panel { top:var(--spacing-14);right:var(--spacing-2);width:calc(100vw - var(--spacing-4));min-width:auto }
.template-chat-panel .sg-card__body,.template-chat-panel .sg-card__header { padding:var(--spacing-4) }
.template-chat-panel .c-chat-presets { gap:var(--spacing-1) }
.template-chat-panel .c-chat-presets button { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs) }
 }
.template-chat-panel { position:fixed;top:calc(var(--nav-height) + var(--spacing-3));right:var(--spacing-5);z-index:var(--z-popover);overflow:auto;width:45rem;min-width:20rem;max-width:calc(100vw - var(--spacing-10));min-height:15rem;max-height:88vh;background:var(--color-surface-overlay);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);resize:both;backdrop-filter:blur(var(--spacing-2-5)) }
.template-chat-panel .sg-card__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4) var(--spacing-6);color:var(--color-text-primary);font-weight:var(--font-semibold);background:var(--color-surface-elevated);border-bottom:var(--spacing-px) solid var(--color-border-subtle);border-radius:var(--radius-xl) var(--radius-xl) 0 0 }
.template-chat-panel .sg-card__body { overflow-y:auto;max-height:calc(88vh - 120px);padding:var(--spacing-6) }
.template-chat-panel .c-chat-presets { display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin-bottom:var(--spacing-4) }
.template-chat-panel .c-chat-presets button { padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-xs);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out) }
.template-chat-panel .chat-actions button { padding:var(--spacing-2) var(--spacing-4);font-size:var(--text-sm);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.c-chat-presets__button--hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.template-chat-panel .c-chat-history { overflow-y:auto;min-height:100%;max-height:24rem;margin-bottom:var(--spacing-4);padding:var(--spacing-2);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-subtle);border-radius:var(--radius-lg) }
.template-chat-panel textarea { width:100%;min-height:4.5rem;padding:var(--spacing-3);color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-sm);line-height:var(--leading-normal);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);resize:vertical }
.template-chat-panel textarea:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.template-chat-panel .chat-actions { display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin-top:var(--spacing-3) }
.template-preview-card,.template-versions-card { margin-top:var(--spacing-4);padding:var(--spacing-6);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl) }
.template-versions-card { overflow:auto;max-height:calc(var(--nav-height)*2) }
.template-batch-drawer,.template-diff-view { margin-top:var(--spacing-4);padding:var(--spacing-6);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl) }
.u-scrollable-container { overflow:auto;max-height:calc(var(--nav-height)*2);scrollbar-width:thin;scrollbar-color:var(--color-border-default) transparent }
.u-scrollable-container::-webkit-scrollbar { width:var(--spacing-1-5) }
.u-scrollable-container::-webkit-scrollbar-track { background:transparent }
.u-scrollable-container::-webkit-scrollbar-thumb { background-color:var(--color-border-default);border-radius:var(--radius-full) }
.u-scrollable-container::-webkit-scrollbar-thumb:hover { background-color:var(--color-border-strong) }
.u-panel-overlay { position:fixed;top:var(--nav-height);right:var(--spacing-5);left:auto;z-index:var(--z-popover);width:45rem;max-width:calc(100vw - var(--spacing-10)) }
.u-panel-side-by-side { position:fixed;top:var(--nav-height);right:auto;left:auto;z-index:var(--z-popover) }
.template-chat-panel:focus-within { outline:var(--spacing-0-5) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
.template-chat-panel.is-loading:after { position:absolute;inset:0;z-index:var(--z-index-base);display:flex;justify-content:center;align-items:center;color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--overlay-dark);border-radius:var(--radius-xl);content:"Loading..." }
.training-container { max-width:var(--breakpoint-xl);margin:0 auto;padding:var(--space-6) }
.training-header { margin-bottom:var(--space-8);padding:var(--space-8);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg) }
.header-title { display:flex;align-items:center;gap:var(--spacing-1-25);margin-bottom:var(--spacing-5) }
.header-title h1 { margin:0;color:var(--color-text-primary);font-size:var(--font-size-3xl);font-weight:var(--font-weight-semibold) }
.progress-bar { height:var(--spacing-5);margin-bottom:var(--space-3);background:var(--color-surface-tertiary);border:var(--spacing-px) solid var(--color-border-secondary);border-radius:var(--radius-full) }
.progress-fill { display:flex;justify-content:center;align-items:center;color:var(--color-neutral-0);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);background:var(--color-brand-primary);transition:width var(--duration-base) var(--ease-in-out) }
.progress-text { color:var(--color-text-secondary);font-size:var(--font-size-sm);text-align:center }
.accuracy-stats { display:grid;grid-gap:var(--spacing-1-25);gap:var(--spacing-1-25);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-narrow),1fr));margin-top:var(--spacing-5) }
.training-stat-card { padding:var(--space-5);text-align:center;background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-tertiary);border-radius:var(--radius-lg) }
.training-stat-value { color:var(--color-brand-primary);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold) }
.training-stat-label { margin-top:var(--space-1);color:var(--color-text-secondary);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase }
.email-card { margin-bottom:var(--space-8);padding:var(--space-8);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-md) }
.email-header { margin-bottom:var(--space-5);padding-bottom:var(--space-5);border-bottom:var(--spacing-px) solid var(--color-border-secondary) }
.email-meta { display:flex;flex-wrap:wrap;gap:var(--space-5);color:var(--color-text-secondary);font-size:var(--font-size-sm) }
.email-meta-item { display:flex;align-items:center;gap:var(--space-2) }
.email-subject { margin:var(--space-5) 0;color:var(--color-text-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold) }
.email-body { overflow-y:auto;max-height:var(--col-width-extra-wide);padding:var(--space-5);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);white-space:pre-wrap;overflow-wrap:anywhere;background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-tertiary);border-radius:var(--radius-lg) }
.claude-analysis { margin:var(--space-5) 0;padding:var(--space-5);background:var(--color-brand-primary-subtle);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg) }
.claude-analysis h3 { display:flex;align-items:center;gap:var(--space-2);margin:0 0 var(--space-4) 0;color:var(--color-brand-primary);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold) }
.analysis-items { display:flex;flex-direction:column;gap:var(--space-2) }
.analysis-item { display:flex;align-items:center;gap:var(--space-2);color:var(--color-brand-primary);font-size:var(--font-size-sm) }
.analysis-item.positive { color:var(--color-state-success) }
.analysis-item.negative { color:var(--color-state-error) }
.confidence-meter { display:flex;align-items:center;gap:var(--space-4);margin-top:var(--space-4) }
.confidence-bar { overflow:hidden;flex:1;height:var(--spacing-2);background:var(--color-surface-tertiary);border-radius:var(--radius-sm) }
.confidence-fill { height:100%;transition:width var(--duration-base) var(--ease-in-out) }
.confidence-low { background:var(--color-state-error) }
.confidence-medium { background:var(--color-state-warning) }
.confidence-high { background:var(--color-state-success) }
.confidence-text { min-width:var(--spacing-12);color:var(--color-text-primary);font-weight:var(--font-weight-semibold) }
.training-action-buttons { display:flex;gap:var(--space-4);margin-top:var(--space-8) }
.training-btn { display:flex;flex:1;justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--touch-target-min);padding:var(--space-4) var(--space-6);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);border:none;border-radius:var(--radius-lg);transition:all var(--duration-base) var(--ease-in-out);cursor:pointer }
.training-btn:hover { box-shadow:var(--shadow-md);transform:translateY(-2px) }
.training-btn-success { color:var(--color-neutral-0);background:var(--color-state-success) }
.training-btn-success:hover { background:var(--color-success-800) }
.training-btn-danger { color:var(--color-neutral-0);background:var(--color-state-error) }
.training-btn-danger:hover { background:var(--color-error-800) }
.training-btn-secondary { color:var(--color-text-primary);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary) }
.training-btn-secondary:hover { background:var(--color-surface-tertiary) }
.keyboard-hint { margin-top:var(--space-4);color:var(--color-text-secondary);font-size:var(--font-size-sm);text-align:center }
.training-loading { padding:var(--space-10);color:var(--color-text-secondary);text-align:center }
.completion-message { margin-top:var(--space-8);padding:var(--space-8);text-align:center;background:var(--color-success-subtle);border:var(--spacing-px) solid var(--color-state-success);border-radius:var(--radius-xl) }
.completion-message h2 { margin:0 0 var(--space-4) 0;color:var(--color-state-success) }
.completion-message p { margin:0;color:var(--color-success-700) }
@media (max-width:768px) { .training-action-buttons { flex-direction:column }
.email-meta { flex-direction:column;gap:var(--spacing-2-5) }
 }
.alerts-dashboard { max-width:var(--container-2xl);margin:0 auto;padding:var(--spacing-5) }
.alerts-header { margin-bottom:var(--spacing-7-5);padding:var(--spacing-7-5);color:var(--color-neutral-0);background:linear-gradient(135deg,var(--color-brand-primary) 0,var(--color-brand-primary-dark) 100%);border-radius:var(--spacing-3) }
.alerts-stats { display:grid;grid-gap:var(--spacing-5);gap:var(--spacing-5);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-wide),1fr));margin-bottom:var(--spacing-7-5) }
.alerts-stat-card { padding:var(--spacing-6);text-align:center;background:var(--color-neutral-0);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-0-5) var(--spacing-2) var(--alpha-black-10);transition:transform .2s ease }
.alerts-stat-card:hover { transform:translateY(calc(var(--spacing-0-5)*-1)) }
.alerts-stat-value { margin-bottom:var(--spacing-2);font-size:var(--spacing-8);font-weight:700 }
.alerts-stat-value.critical { color:var(--color-critical) }
.alerts-stat-value.warning { color:var(--color-warning) }
.alerts-stat-value.info { color:var(--color-info) }
.alerts-stat-value.success { color:var(--color-success) }
.alerts-stat-label { color:var(--color-neutral-600);font-size:var(--spacing-3-5);letter-spacing:.05em;text-transform:uppercase }
.alerts-grid { display:grid;grid-gap:var(--spacing-7-5);gap:var(--spacing-7-5);grid-template-columns:1fr 1fr;margin-bottom:var(--spacing-7-5) }
.alerts-section { padding:var(--spacing-6);background:var(--color-neutral-0);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-0-5) var(--spacing-2) var(--alpha-black-10) }
.alerts-section-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-5);padding-bottom:var(--spacing-1-25);border-bottom:var(--spacing-px) solid var(--color-neutral-200) }
.alerts-section-title { color:var(--color-neutral-800);font-size:var(--spacing-4-5);font-weight:600 }
.golf-alert-item { margin-bottom:var(--spacing-3);padding:var(--spacing-1-5);background:var(--color-surface-base);border-left:var(--spacing-1) solid;border-radius:var(--spacing-2);transition:all .2s ease }
.golf-alert-item:hover { background:var(--color-neutral-100) }
.golf-alert-item.critical { border-left-color:var(--color-danger);background:var(--color-danger-subtle) }
.golf-alert-item.warning { border-left-color:var(--color-warning);background:var(--color-warning-subtle) }
.golf-alert-item.info { border-left-color:var(--color-info);background:var(--color-info-bg) }
.golf-alert-header { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-2) }
.golf-alert-type { color:var(--color-neutral-800);font-weight:600 }
.golf-alert-time { color:var(--color-neutral-600);font-size:var(--spacing-3) }
.golf-alert-message { margin-bottom:var(--spacing-2);color:var(--color-neutral-600);font-size:var(--spacing-3-5) }
.golf-alert-context { display:flex;gap:var(--spacing-1-25);color:var(--color-neutral-500);font-size:var(--spacing-3) }
.golf-alert-actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-3) }
.alerts-config-section { margin-bottom:var(--spacing-7-5);padding:var(--spacing-6);background:var(--color-neutral-0);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-0-5) var(--spacing-2) var(--alpha-black-10) }
.alerts-config-grid { display:grid;grid-gap:var(--spacing-5);gap:var(--spacing-5);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-extra-wide),1fr)) }
.alerts-config-item { display:flex;flex-direction:column;gap:var(--spacing-2) }
.alerts-config-label { color:var(--color-neutral-800);font-weight:500 }
.alerts-config-input { padding:var(--spacing-2-5);font-size:var(--spacing-3-5);border:var(--spacing-px) solid var(--color-neutral-300);border-radius:var(--spacing-1-5) }
.alerts-config-description { color:var(--color-neutral-600);font-size:var(--spacing-3) }
.alerts-test-section { padding:var(--spacing-6);background:var(--color-neutral-0);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-0-5) var(--spacing-2) var(--alpha-black-10) }
.alerts-test-form { display:grid;grid-gap:var(--spacing-5);gap:var(--spacing-5);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-wide),1fr));margin-bottom:var(--spacing-5) }
.webhook-status { margin-bottom:var(--spacing-5);padding:var(--spacing-1-5);background:var(--color-surface-base);border-radius:var(--spacing-2) }
.webhook-status h4 { margin:0 0 var(--spacing-3);color:var(--color-neutral-800) }
.webhook-metrics { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-30),1fr)) }
.webhook-metric { text-align:center }
.webhook-metric-value { color:var(--color-brand-primary);font-size:var(--spacing-5);font-weight:600 }
.webhook-metric-label { color:var(--color-neutral-600);font-size:var(--spacing-3) }
.alerts-trend-indicator { display:inline-flex;align-items:center;margin-left:var(--spacing-2);font-size:var(--spacing-3) }
.alerts-trend-up { color:var(--color-success) }
.alerts-trend-down { color:var(--color-danger) }
.alerts-trend-stable { color:var(--color-neutral-600) }
@media (max-width:768px) { .alerts-grid { grid-template-columns:1fr }
 }
.enhanced-batch-container { max-width:var(--spacing-192);margin:0 auto;padding:var(--spacing-4) }
.batch-header-section { margin-bottom:var(--spacing-6);padding:var(--spacing-6);color:var(--color-text-primary);text-align:center;background:linear-gradient(135deg,var(--color-accent-secondary) 0,var(--color-accent-primary) 100%);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg) }
.batch-stats-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-medium),1fr));margin-bottom:var(--spacing-6) }
.batch-stat-card { position:relative;overflow:hidden;padding:var(--spacing-4);text-align:center;background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:all var(--transition-base);backdrop-filter:blur(var(--spacing-5)) }
.batch-stat-card:before { position:absolute;top:0;right:0;left:0;height:var(--spacing-1);background:linear-gradient(90deg,var(--color-accent-secondary),var(--color-accent-primary),var(--color-accent-tertiary));opacity:80%;content:"" }
.batch-stat-card:hover { background:var(--color-surface-secondary);box-shadow:var(--shadow-xl),var(--shadow-glow);transform:translateY(calc(var(--spacing-1)*-1)) }
.batch-stat-value { margin:var(--spacing-2) 0;color:var(--color-text-primary);font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold) }
.batch-stat-label { color:var(--color-text-tertiary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);letter-spacing:.05em;text-transform:uppercase }
.batch-form-section { margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);backdrop-filter:blur(var(--spacing-5)) }
.batch-form-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:1fr 1fr;margin-bottom:var(--spacing-4) }
.batch-form-group { margin-bottom:var(--spacing-4) }
.batch-form-group label { display:block;margin-bottom:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium) }
.batch-form-group input,.batch-form-group select,.batch-form-group textarea { width:100%;padding:var(--spacing-2);color:var(--color-text-primary);font-family:inherit;font-size:var(--font-size-base);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-md);transition:all var(--transition-base) }
.batch-form-group input:focus,.batch-form-group select:focus,.batch-form-group textarea:focus { background:var(--color-surface-secondary);border-color:var(--color-accent-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.batch-form-group input::placeholder,.batch-form-group textarea::placeholder { color:var(--color-text-tertiary) }
.batch-preview-section { display:none;margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);backdrop-filter:blur(var(--spacing-5)) }
.batch-email-preview { overflow:hidden;margin-bottom:var(--spacing-4);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-md) }
.batch-email-header { padding:var(--spacing-3);color:var(--color-text-secondary);background:var(--color-surface-tertiary);border-bottom:var(--spacing-px) solid var(--color-border-primary) }
.batch-email-body { overflow-y:auto;max-height:var(--col-width-extra-wide);padding:var(--spacing-4);color:var(--color-text-primary) }
.batch-cache-indicator { display:inline-block;margin-left:var(--spacing-2);padding:var(--spacing-1) var(--spacing-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border-radius:var(--radius-sm) }
.batch-cache-hit { color:var(--color-success);background:var(--color-success-subtle) }
.batch-cache-miss { color:var(--color-error);background:var(--color-danger-subtle) }
.batch-progress-section { display:none;padding:var(--spacing-6);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);backdrop-filter:blur(var(--spacing-5)) }
.batch-progress-bar { overflow:hidden;width:100%;height:var(--spacing-5);margin-bottom:var(--spacing-3);background:var(--color-surface-secondary);border-radius:var(--radius-full) }
.batch-progress-fill { width:0;height:100%;background:linear-gradient(90deg,var(--color-accent-secondary),var(--color-accent-primary));transition:width var(--transition-slow) }
.batch-metrics-grid { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-narrow),1fr));margin-top:var(--spacing-4) }
.batch-metric-item { padding:var(--spacing-3);text-align:center;background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-secondary);border-radius:var(--radius-md) }
.batch-metric-value { color:var(--color-accent-primary);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold) }
.batch-metric-label { margin-top:var(--spacing-1);color:var(--color-text-tertiary);font-size:var(--font-size-xs);letter-spacing:.05em;text-transform:uppercase }
.batch-recommendation { margin-bottom:var(--spacing-3);padding:var(--spacing-3);border-radius:var(--radius-md) }
.batch-recommendation.success { color:var(--color-success-light);background:var(--color-success-subtle);border-left:var(--spacing-1) solid var(--color-success) }
.batch-recommendation.warning { color:var(--color-warning-light);background:var(--color-warning-subtle);border-left:var(--spacing-1) solid var(--color-warning) }
.batch-recommendation.info { color:var(--color-info-light);background:var(--color-info-subtle);border-left:var(--spacing-1) solid var(--color-info) }
@media (max-width:768px) { .batch-form-grid,.batch-stats-grid { grid-template-columns:1fr }
 }
.scheduler-header { padding:var(--spacing-7-5) var(--spacing-5);color:var(--color-neutral-0);text-align:center;background:linear-gradient(135deg,var(--color-info-dark) 0,var(--color-info-text) 100%);box-shadow:0 var(--spacing-0-5) var(--spacing-2-5) var(--alpha-var(--color-neutral-900)-10) }
.scheduler-header h1 { margin-bottom:var(--spacing-2);font-size:var(--spacing-7);font-weight:600 }
.scheduler-header p { font-size:var(--spacing-1-5);opacity:90% }
.scheduler-section { padding:var(--spacing-5);background:var(--color-neutral-0);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-0-5) var(--spacing-2-5) var(--alpha-var(--color-neutral-900)-5) }
.scheduler-section-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-5) }
.scheduler-section-header h2 { font-size:var(--spacing-6);font-weight:600 }
.scheduler-controls { display:flex;gap:var(--spacing-2-5) }
.scheduler-status { display:flex;gap:var(--spacing-5);margin-bottom:var(--spacing-5);padding:var(--spacing-1-25);background:var(--color-neutral-100);border-radius:var(--spacing-2) }
.scheduler-status-item { display:flex;align-items:center;gap:var(--spacing-2) }
.scheduler-status-label { color:var(--color-neutral-600);font-size:var(--spacing-3-5) }
.scheduler-status-value { color:var(--color-neutral-800);font-size:var(--spacing-1-5);font-weight:600 }
.scheduler-tabs { display:flex;gap:var(--spacing-2-5);margin-bottom:var(--spacing-5);border-bottom:var(--spacing-0-5) solid var(--color-neutral-200) }
.scheduler-tab-btn { position:relative;padding:var(--spacing-2-5) var(--spacing-5);color:var(--color-neutral-600);font-size:var(--spacing-3-5);font-weight:500;background:none;border:none;transition:color .2s;cursor:pointer }
.scheduler-tab-btn.active { color:var(--color-info-dark) }
.scheduler-tab-btn.active:after { position:absolute;right:0;bottom:calc(var(--spacing-0-5)*-1);left:0;height:var(--spacing-0-5);background:var(--color-info-dark);content:"" }
.scheduler-tab-content { display:none }
.scheduler-tab-content.active { display:block }
.scheduled-task-list { display:flex;flex-direction:column;gap:var(--spacing-1-25) }
.scheduled-task-card { padding:var(--spacing-5);border:var(--spacing-px) solid var(--color-neutral-200);border-radius:var(--spacing-2);transition:all .2s }
.scheduled-task-card:hover { box-shadow:0 var(--spacing-0-5) var(--spacing-2) var(--alpha-var(--color-neutral-900)-10) }
.scheduled-task-card.running { background:var(--color-info-subtle);border-color:var(--color-info) }
.scheduled-task-card.error { background:var(--color-danger-subtle);border-color:var(--color-danger) }
.scheduled-task-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-1-25) }
.scheduled-task-header h3 { color:var(--color-neutral-800);font-size:var(--spacing-4-5);font-weight:600 }
.scheduled-task-status { padding:var(--spacing-1) var(--spacing-3);font-size:var(--spacing-3);font-weight:500;border-radius:var(--spacing-1) }
.scheduled-task-status.enabled { color:var(--color-success-text);background:var(--color-success-subtle) }
.scheduled-task-status.disabled { color:var(--color-danger-700);background:var(--color-danger-subtle) }
.scheduled-task-details { display:grid;grid-gap:var(--spacing-2-5);gap:var(--spacing-2-5);grid-template-columns:repeat(2,1fr);margin-bottom:var(--spacing-1-25) }
.scheduled-detail-row { display:flex;align-items:center;gap:var(--spacing-2) }
.scheduled-detail-label { min-width:var(--spacing-20);color:var(--color-neutral-600);font-size:var(--spacing-0-75) }
.scheduled-detail-value { color:var(--color-neutral-800);font-size:var(--spacing-3-5);font-weight:500 }
.scheduled-task-actions { display:flex;gap:var(--spacing-2-5);padding-top:var(--spacing-1-25);border-top:var(--spacing-px) solid var(--color-neutral-200) }
.scheduler-history-list { display:flex;flex-direction:column;gap:var(--spacing-2-5) }
.scheduler-history-entry { display:grid;align-items:center;grid-gap:var(--spacing-1-25);gap:var(--spacing-1-25);grid-template-columns:var(--col-width-narrow) 1fr auto var(--col-width-date);padding:var(--spacing-1-25);border:var(--spacing-px) solid var(--color-neutral-200);border-radius:var(--spacing-1-5) }
.scheduler-history-entry.completed { border-color:var(--color-success) }
.scheduler-history-entry.failed { border-color:var(--color-danger) }
.scheduler-history-entry.skipped { border-color:var(--color-warning) }
.scheduler-history-time { color:var(--color-neutral-600);font-size:var(--spacing-0-75) }
.scheduler-history-task { font-weight:500 }
.scheduler-history-duration { color:var(--color-neutral-600);font-size:var(--spacing-0-75);text-align:right }
.scheduler-history-error { grid-column:1/-1;margin-top:var(--spacing-2-5);padding:var(--spacing-2-5);color:var(--color-danger-700);font-size:var(--spacing-0-75);background:var(--color-danger-subtle);border-radius:var(--spacing-1) }
.scheduler-upcoming-calendar { display:flex;flex-direction:column;gap:var(--spacing-5) }
.scheduler-upcoming-day { padding:var(--spacing-5);border:var(--spacing-px) solid var(--color-neutral-200);border-radius:var(--spacing-2) }
.scheduler-upcoming-day h4 { margin-bottom:var(--spacing-1-25);color:var(--color-neutral-800);font-size:var(--spacing-1-5);font-weight:600 }
.scheduler-upcoming-tasks { display:flex;flex-direction:column;gap:var(--spacing-2-5) }
.scheduler-upcoming-task { display:flex;align-items:center;gap:var(--spacing-1-25);padding:var(--spacing-2-5);background:var(--color-neutral-100);border-radius:var(--spacing-1-5) }
.scheduler-task-time { min-width:var(--spacing-20);color:var(--color-info-dark);font-size:var(--spacing-3-5);font-weight:500 }
.scheduler-task-name { color:var(--color-neutral-800);font-size:var(--spacing-3-5) }
.scheduler-modal-overlay { position:fixed;inset:0;z-index:var(--z-index-overlay);display:flex;justify-content:center;align-items:center;background:var(--color-neutral-950-alpha-50) }
.scheduler-modal-content { overflow:auto;max-width:90%;max-height:90vh;background:var(--color-neutral-0);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-1) var(--spacing-5) var(--alpha-var(--color-neutral-900)-20) }
.scheduler-modal-header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-5);border-bottom:var(--spacing-px) solid var(--color-neutral-200) }
.scheduler-modal-header h3 { margin:0;font-size:var(--spacing-5);font-weight:600 }
.scheduler-modal-close { display:flex;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);color:var(--color-neutral-600);font-size:var(--spacing-6);background:none;border:none;border-radius:var(--spacing-1);cursor:pointer }
.scheduler-modal-close:hover { background:var(--color-neutral-100) }
.scheduler-modal-body { padding:var(--spacing-5) }
@media (max-width:768px) { .scheduled-task-details { grid-template-columns:1fr }
.scheduler-history-entry { gap:var(--spacing-2-5);grid-template-columns:1fr }
.scheduler-section-header { flex-direction:column;gap:var(--spacing-1-25) }
.scheduler-controls { justify-content:center;width:100% }
 }
.sheets-header { padding:var(--spacing-5);color:var(--color-neutral-0);background:linear-gradient(135deg,var(--color-success-dark) 0,var(--color-success) 100%);box-shadow:0 var(--spacing-0-5) var(--spacing-2-5) var(--shadow-sm) }
.sheets-header h1 { display:flex;align-items:center;gap:var(--spacing-2-5);font-size:var(--spacing-7);font-weight:600 }
.sheets-tabs { display:flex;gap:var(--spacing-2-5);margin-bottom:var(--spacing-5);border-bottom:var(--spacing-0-5) solid var(--color-neutral-200) }
.sheets-tab { padding:var(--spacing-2-5) var(--spacing-5);color:var(--color-text-tertiary);font-size:var(--spacing-1-5);background:none;border:none;border-bottom:var(--spacing-0-75) solid transparent;transition:all .3s ease;cursor:pointer }
.sheets-tab:hover { color:var(--color-success-dark) }
.sheets-tab.active { color:var(--color-success-dark);font-weight:600;border-bottom-color:var(--color-success-dark) }
.sheets-content-panel { display:none }
.sheets-content-panel.active { display:block }
.sheets-analysis-card { margin-bottom:var(--spacing-5);padding:var(--spacing-5);background:var(--color-neutral-0);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--shadow-sm) }
.sheet-selector { display:flex;align-items:center;gap:var(--spacing-2-5);margin-bottom:var(--spacing-5) }
.sheet-selector input { flex:1;padding:var(--spacing-3);font-size:var(--text-sm);border:var(--spacing-px) solid var(--color-neutral-300);border-radius:var(--radius-base) }
.sheets-analysis-type-selector { display:flex;flex-wrap:wrap;gap:var(--spacing-2-5);margin-bottom:var(--spacing-5) }
.sheets-analysis-type { padding:var(--spacing-2) var(--spacing-1-5);background:var(--color-neutral-0);border:var(--spacing-0-5) solid var(--color-neutral-200);border-radius:var(--spacing-5);transition:all .3s ease;cursor:pointer }
.sheets-analysis-type:hover { border-color:var(--color-success) }
.sheets-analysis-type.selected { color:var(--color-neutral-0);background:var(--color-success-dark);border-color:var(--color-success-dark) }
.sheets-results-container { display:none }
.sheets-results-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-5) }
.sheets-results-meta { color:var(--color-text-tertiary);font-size:var(--spacing-3-5) }
.sheets-summary-box { margin-bottom:var(--spacing-5);padding:var(--spacing-1-25);background:var(--color-success-50);border-left:var(--spacing-1) solid var(--color-success-dark);border-radius:var(--spacing-1) }
.sheets-metrics-grid { display:grid;grid-gap:var(--spacing-1-25);gap:var(--spacing-1-25);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-medium),1fr));margin-bottom:var(--spacing-5) }
.sheets-metric-card { padding:var(--spacing-1-25);text-align:center;background:var(--color-neutral-100);border-radius:var(--spacing-2) }
.sheets-metric-value { color:var(--color-success-dark);font-size:var(--spacing-7);font-weight:700 }
.sheets-metric-label { margin-top:var(--spacing-1-25);color:var(--color-text-tertiary);font-size:var(--spacing-3-5) }
.sheets-recommendations-container { margin-top:var(--spacing-7-5) }
.sheets-recommendation-card { margin-bottom:var(--spacing-1-25);padding:var(--spacing-5);background:var(--color-neutral-0);border:var(--spacing-px) solid var(--color-neutral-200);border-radius:var(--spacing-2);transition:all .3s ease }
.sheets-recommendation-card:hover { box-shadow:0 var(--spacing-1) var(--spacing-3) var(--shadow-sm) }
.sheets-recommendation-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2-5) }
.sheets-recommendation-title { color:var(--color-text-primary);font-size:var(--spacing-4-5);font-weight:600 }
.sheets-recommendation-status { padding:var(--spacing-1) var(--spacing-3);font-size:var(--spacing-3);font-weight:500;border-radius:var(--spacing-5) }
.sheets-status-suggested { color:var(--color-warning-text);background:var(--color-warning-bg) }
.sheets-status-approved { color:var(--color-success-text);background:var(--color-success-subtle) }
.sheets-status-declined { color:var(--color-danger-text);background:var(--color-error-50) }
.sheets-status-hold { color:var(--color-info-text);background:var(--color-info-50) }
.sheets-recommendation-description { margin-bottom:var(--spacing-1-25);color:var(--color-text-tertiary) }
.sheets-recommendation-details { margin-bottom:var(--spacing-1-25);padding:var(--spacing-1-25);font-size:var(--spacing-3-5);background:var(--color-neutral-50);border-radius:var(--spacing-1-5) }
.sheets-recommendation-actions { display:flex;flex-wrap:wrap;gap:var(--spacing-2-5) }
.sheets-editable { padding:var(--spacing-0-5) var(--spacing-1);border:var(--spacing-px) dashed transparent;border-radius:var(--spacing-1);transition:all .2s ease }
.sheets-editable:hover { background:var(--color-neutral-50);border-color:var(--color-neutral-300);cursor:text }
.sheets-editable.editing { padding:var(--spacing-1) var(--spacing-2);background:var(--color-neutral-0);border:var(--spacing-0-5) solid var(--color-success-dark) }
.sheets-edit-actions { display:none;gap:var(--spacing-1-25);margin-top:var(--spacing-2-5) }
.sheets-edit-actions.active { display:flex }
.sheets-version-history { display:none;margin-top:var(--spacing-2-5);padding:var(--spacing-2-5);font-size:var(--spacing-3);background:var(--color-neutral-50);border-radius:var(--spacing-1-5) }
.sheets-version-history.show { display:block }
.sheets-version-item { padding:var(--spacing-1-25) 0;border-bottom:var(--spacing-px) solid var(--color-neutral-200) }
.sheets-version-item:last-child { border-bottom:none }
.sheets-modal { position:fixed;top:0;left:0;z-index:var(--z-index-overlay);display:none;width:100%;height:100%;background:var(--color-neutral-900-50) }
.sheets-modal-content { position:relative;width:90%;max-width:var(--spacing-150);margin:var(--spacing-50px) auto;padding:var(--spacing-7-5);background:var(--color-neutral-0);border-radius:var(--spacing-3) }
.sheets-modal-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-5) }
.sheets-modal-title { font-size:var(--spacing-6);font-weight:600 }
.sheets-feedback-form textarea { width:100%;min-height:var(--col-width-narrow);margin-bottom:var(--spacing-5);padding:var(--spacing-3);font-size:var(--text-sm);border:var(--spacing-px) solid var(--color-neutral-300);border-radius:var(--radius-base);resize:vertical }
.sheets-history-item { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2-5);padding:var(--spacing-1-25);background:var(--color-neutral-0);border-radius:var(--spacing-2);box-shadow:var(--shadow-xs) }
.sheets-history-date { color:var(--color-text-tertiary);font-size:var(--spacing-3-5) }
.sheets-history-type { color:var(--color-success-dark);font-weight:600 }
.sheets-stats-grid { display:grid;grid-gap:var(--spacing-5);gap:var(--spacing-5);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-wide),1fr));margin-bottom:var(--spacing-7-5) }
.sheets-stat-card { padding:var(--spacing-5);text-align:center;background:var(--color-neutral-0);border-radius:var(--spacing-3);box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--shadow-sm) }
.sheets-stat-icon { margin-bottom:var(--spacing-2-5);font-size:var(--spacing-10) }
.sheets-stat-value { color:var(--color-success-dark);font-size:var(--spacing-8);font-weight:700 }
.sheets-stat-label { margin-top:var(--spacing-1-25);color:var(--color-text-tertiary) }
.sheets-keyboard-hint { position:fixed;right:var(--spacing-5);bottom:var(--spacing-5);display:none;padding:var(--spacing-2-5) var(--spacing-1-25);color:var(--color-neutral-0);font-size:var(--spacing-3);background:var(--color-neutral-900-80);border-radius:var(--spacing-2) }
.sheets-keyboard-hint.show { display:block }
@media (prefers-color-scheme:dark) { :root { --bg-primary:var(--gray-900);--bg-secondary:var(--gray-800);--text-primary:var(--gray-50);--text-secondary:var(--gray-300);--border-color:var(--gray-700) }
 }
@media screen and (max-width:768px) { .c-unified-dashboard { gap:var(--spacing-4);grid-template-areas:"header" "summary" "charts" "insights" "benchmarks" "activity";grid-template-columns:1fr;padding:var(--spacing-4) }
 }
:root { --primary-color:var(--blue-500);--success-color:var(--green-500);--warning-color:var(--amber-500);--danger-color:var(--red-500);--info-color:var(--color-info);--bg-primary:var(--color-surface-secondary);--bg-secondary:var(--white);--text-primary:var(--gray-800);--text-secondary:var(--gray-500);--border-color:var(--gray-200);--shadow-sm:var(--shadow-xs);--shadow-md:0 var(--spacing-1) var(--spacing-1-5) calc(var(--spacing-px)*-1) var(--alpha-black-10);--shadow-lg:0 var(--spacing-2-5) var(--spacing-1-25) calc(var(--spacing-0-75)*-1) var(--alpha-black-10);--border-radius:var(--spacing-2);--transition:all 0.2s ease }
.c-unified-dashboard { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template:"header header header" auto "summary summary activity" auto "charts charts activity" 1fr "insights insights activity" auto "benchmarks benchmarks activity" auto/1fr 1fr var( --card-min-width-sm );min-height:100vh;padding:var(--spacing-6);font-family:var(--font-sans);background-color:var(--bg-primary) }
.c-dashboard-header { display:flex;justify-content:space-between;align-items:center;grid-area:header;padding:var(--spacing-6);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm) }
.c-header-left { display:flex;align-items:center;gap:var(--spacing-4) }
.c-header-left h1 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--spacing-7);font-weight:700 }
.c-status-indicator { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.c-status-dot { width:var(--spacing-2);height:var(--spacing-2);background:var(--danger-color);border-radius:var(--radius-full);transition:var(--transition) }
.c-status-dot.c-connected { background:var(--success-color);animation:pulse-success 2s infinite }
.c-header-controls { display:flex;align-items:center;gap:var(--spacing-3) }
.c-timeframe-select { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.c-timeframe-select:hover { border-color:var(--primary-color) }
.c-btn-export,.c-btn-refresh { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.c-btn-refresh:hover { color:var(--color-neutral-0);background:var(--primary-color);border-color:var(--primary-color) }
.c-btn-export:hover { color:var(--color-neutral-0);background:var(--success-color);border-color:var(--success-color) }
.c-loading-overlay { position:fixed;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);z-index:var(--z-index-overlay);display:flex;visibility:hidden;flex-direction:column;justify-content:center;align-items:center;background:var(--alpha-black-50);opacity:0;transition:var(--transition) }
.c-loading-overlay.c-show { visibility:visible;opacity:100% }
.c-loading-spinner { width:var(--spacing-10);height:var(--spacing-10);margin-bottom:var(--spacing-4);border:var(--spacing-1) solid var(--alpha-white-30);border-top:var(--spacing-1) solid var(--color-neutral-0);border-radius:var(--radius-full);animation:spin 1s linear infinite }
.c-summary-cards { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-area:summary;grid-template-columns:repeat(auto-fit,minmax(var(--col-width-medium),1fr)) }
.c-metric-card { position:relative;padding:var(--spacing-6);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm);transition:var(--transition) }
.c-metric-card:hover { box-shadow:var(--shadow-md);transform:translateY(-2px) }
.c-metric-card__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4) }
.c-metric-card__header h3 { margin:var(--spacing-0);color:var(--color-text-secondary);font-size:var(--spacing-4);font-weight:600;letter-spacing:.05em;text-transform:uppercase }
.c-card-actions { display:flex;gap:var(--spacing-2) }
.c-btn-drill-down { font-size:var(--spacing-4);background:none;border:none;opacity:60%;transition:var(--transition);cursor:pointer }
.c-btn-drill-down:hover { opacity:100%;transform:scale(1.1) }
.c-metric-value { margin:var(--spacing-2) 0;color:var(--color-text-primary);font-size:var(--spacing-10);font-weight:700 }
.c-metric-detail { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.c-metric-benchmark { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--spacing-3) }
.c-metric-trend { margin:var(--spacing-2) 0;font-size:var(--text-sm);font-weight:600 }
.c-metric-good { color:var(--success-color) }
.c-metric-warning { color:var(--warning-color) }
.c-metric-poor { color:var(--danger-color) }
.c-trend-up { color:var(--success-color) }
.c-trend-down { color:var(--danger-color) }
.c-trend-flat { color:var(--color-text-secondary) }
.c-metric-progress { margin-top:var(--spacing-4) }
.c-progress-bar { overflow:hidden;width:100%;height:var(--spacing-1);background:var(--border-color);border-radius:var(--spacing-0-5) }
.c-progress-fill { height:100%;background:var(--success-color);border-radius:var(--spacing-0-5);transition:width .5s ease }
.c-learning-breakdown,.pattern-list,.response-breakdown { margin-top:var(--spacing-3) }
.c-learning-item,.pattern-item,.response-item { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-1) 0;color:var(--color-text-secondary);font-size:var(--spacing-3) }
.c-pattern-effectiveness-value { color:var(--success-color);font-weight:600 }
@media screen and (max-width:768px) { .c-charts-container { grid-template-columns:1fr }
 }
.c-charts-container { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-area:charts;grid-template-columns:1fr 1fr }
.c-chart-section { padding:var(--spacing-6);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm) }
.c-section-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-6) }
.c-section-header h2 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--spacing-5);font-weight:600 }
.c-chart-controls { display:flex;gap:var(--spacing-1);padding:var(--spacing-1);background:var(--bg-primary);border-radius:var(--border-radius) }
.c-btn-chart-option { padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--spacing-3);background:transparent;border:none;border-radius:calc(var(--border-radius) - var(--spacing-0-5));transition:var(--transition);cursor:pointer }
.c-btn-chart-option.c-active { color:var(--color-text-primary);background:var(--bg-secondary);box-shadow:var(--shadow-sm) }
.c-chart-container { position:relative;height:var(--col-width-extra-wide);margin-bottom:var(--spacing-4) }
.c-chart-container canvas { max-height:100% }
.c-correlation-matrix { margin-top:var(--spacing-4);padding:var(--spacing-4);background:var(--bg-primary);border-radius:var(--border-radius) }
.c-correlation-matrix h4 { margin:var(--spacing-0) 0 var(--spacing-3) var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:600 }
.c-correlation-list { margin:var(--spacing-0);padding:var(--spacing-0);list-style:none }
.c-correlation-item { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) 0;font-size:var(--text-sm);border-bottom:var(--spacing-px) solid var(--border-color) }
.c-correlation-item:last-child { border-bottom:none }
.c-pattern-combo { color:var(--color-text-primary);font-weight:500 }
.c-correlation-value { color:var(--success-color);font-weight:600 }
.c-insights-loading,.correlation-loading { padding:var(--spacing-8);color:var(--color-text-secondary);font-style:italic;text-align:center }
.c-chart-error { display:flex;flex-direction:column;justify-content:center;align-items:center;height:var(--col-width-extra-wide);padding:var(--spacing-8);color:var(--color-text-secondary);text-align:center;background-color:var(--bg-secondary);border:var(--spacing-0-5) dashed var(--border-color);border-radius:var(--border-radius) }
.chart-error p { margin:var(--spacing-2) 0 }
.chart-error p:first-child { margin-bottom:var(--spacing-4);color:var(--danger-color);font-weight:600 }
.c-insights-section { grid-area:insights;padding:var(--spacing-6);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm) }
.c-insights-refresh { display:flex;align-items:center }
.c-btn-secondary { padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-primary);font-size:var(--spacing-3);background:var(--bg-primary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.c-btn-secondary:hover { background:var(--border-color) }
.c-insights-tabs { display:flex;overflow-x:auto;gap:var(--spacing-2);margin-bottom:var(--spacing-6);border-bottom:var(--spacing-0-5) solid var(--border-color) }
.c-tab-btn { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);white-space:nowrap;background:none;border:none;border-bottom:var(--spacing-0-5) solid transparent;transition:var(--transition);cursor:pointer }
.c-tab-btn:hover { color:var(--color-text-primary) }
.c-tab-btn.c-active { color:var(--primary-color);border-bottom-color:var(--primary-color) }
.c-count { display:inline-flex;justify-content:center;align-items:center;min-width:var(--spacing-5);height:var(--spacing-5);padding:var(--spacing-0) var(--spacing-1);color:var(--color-neutral-0);font-size:var(--spacing-2-5);font-weight:600;background:var(--primary-color);border-radius:var(--radius-full) }
.c-insights-content { min-height:var(--col-width-medium) }
.anomalies-list,.c-improvements-list,.experiments-list,.recommendations-list { display:flex;flex-direction:column;gap:var(--spacing-4) }
.c-anomaly-card,.c-experiment-card,.c-improvement-card,.c-recommendation-card { padding:var(--spacing-4);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition) }
.c-experiment-card:hover,.c-recommendation-card:hover { border-color:var(--primary-color);box-shadow:0 var(--spacing-0-5) var(--spacing-2) var(--color-info-subtle) }
.c-anomaly-card { background:var(--color-warning-subtle);border-color:var(--warning-color) }
.c-improvement-card { background:var(--color-success-subtle);border-color:var(--success-color) }
.c-card-title { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-weight:600 }
.c-card-description { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm) }
.c-card-meta { display:flex;gap:var(--spacing-4);margin-bottom:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--spacing-3) }
.c-experiment-actions .c-card-actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-4) }
.c-btn-apply-recommendation,.c-btn-start-experiment { padding:var(--spacing-2) var(--spacing-4);color:var(--color-neutral-0);font-size:var(--text-sm);background:var(--success-color);border:none;border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.c-btn-apply-recommendation:hover,.c-btn-start-experiment:hover { background:var(--green-600) }
.c-btn-dismiss { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);background:transparent;border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.c-btn-dismiss:hover { background:var(--border-color) }
.c-benchmarks-section { grid-area:benchmarks;padding:var(--spacing-6);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm) }
.c-benchmarks-period { color:var(--color-text-secondary);font-size:var(--text-sm) }
.c-benchmarks-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-medium),1fr));margin-top:var(--spacing-4) }
.c-benchmark-card { padding:var(--spacing-4);text-align:center;background:var(--bg-primary);border-radius:var(--border-radius);transition:var(--transition) }
.c-benchmark-card:hover { box-shadow:var(--shadow-sm);transform:translateY(-2px) }
.c-benchmark-icon { margin-bottom:var(--spacing-2);font-size:var(--spacing-8) }
.c-benchmark-title { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--spacing-3);font-weight:600;letter-spacing:.05em;text-transform:uppercase }
.c-benchmark-value { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--spacing-6);font-weight:700 }
.c-benchmark-date,.c-benchmark-effectiveness { color:var(--color-text-secondary);font-size:var(--spacing-3) }
@media screen and (max-width:768px) { .c-unified-dashboard { gap:var(--spacing-3);padding:var(--spacing-3) }
.c-dashboard-header { flex-direction:column;gap:var(--spacing-4);padding:var(--spacing-4) }
.c-header-controls { justify-content:space-between;width:100% }
.c-summary-cards { grid-template-columns:1fr }
.c-metric-card { padding:var(--spacing-4) }
.c-metric-value { font-size:var(--spacing-8) }
.c-insights-tabs { flex-wrap:wrap }
.c-tab-btn { padding:var(--spacing-2) var(--spacing-3);font-size:var(--spacing-3) }
.c-benchmarks-grid { grid-template-columns:repeat(2,1fr) }
 }
@media screen and (max-width:480px) { .c-benchmarks-grid { grid-template-columns:1fr }
.c-chart-container { height:var(--col-width-wide) }
.c-activity-feed { max-height:var(--card-min-width-lg) }
 }
.c-activity-feed { display:flex;flex-direction:column;grid-area:activity;height:fit-content;max-height:var(--container-xl);background:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm) }
.activity-feed__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4);border-bottom:var(--spacing-px) solid var(--border-color) }
.activity-feed__header h3 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--spacing-4);font-weight:600 }
.c-btn-clear { color:var(--color-text-secondary);font-size:var(--spacing-3);background:none;border:none;transition:var(--transition);cursor:pointer }
.c-btn-clear:hover { color:var(--color-text-primary) }
.c-activity-list { overflow-y:auto;flex:1;padding:var(--spacing-2) }
.c-activity-item { display:flex;align-items:flex-start;gap:var(--spacing-3);margin-bottom:var(--spacing-2);padding:var(--spacing-3);font-size:var(--text-sm);border-radius:var(--border-radius);transition:var(--transition);animation:fade-in .3s ease-in }
.c-activity-item:hover { background:var(--bg-primary) }
.c-activity-item--welcome { background:var(--color-info-subtle);border:var(--spacing-px) solid var(--color-info-border) }
.c-activity-time { min-width:var(--spacing-12);color:var(--color-text-secondary);font-size:var(--spacing-3);white-space:nowrap }
.c-activity-type { min-width:var(--text-4xl);color:var(--primary-color);font-weight:600 }
.c-activity-desc { flex:1;color:var(--color-text-primary) }
.c-modal { position:fixed;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);z-index:var(--z-index-overlay);display:flex;visibility:hidden;justify-content:center;align-items:center;background:var(--alpha-black-50);opacity:0;transition:var(--transition) }
.c-modal.is-show { visibility:visible;opacity:100% }
.c-modal-content { overflow:hidden;width:90%;max-width:var(--container-xl);max-height:80vh;background:var(--bg-secondary);border-radius:var(--border-radius);box-shadow:var(--shadow-lg) }
.c-modal-header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4) var(--spacing-6);border-bottom:var(--spacing-px) solid var(--border-color) }
.c-modal__header h3 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:600 }
.c-modal-close { padding:var(--spacing-0);color:var(--color-text-secondary);font-size:var(--spacing-6);background:none;border:none;transition:var(--transition);cursor:pointer }
.c-modal-close:hover { color:var(--color-text-primary) }
.c-modal-body { overflow-y:auto;max-height:calc(80vh - var(--spacing-32));padding:var(--spacing-6) }
.c-notifications-container { position:fixed;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-index-popover);display:flex;flex-direction:column;gap:var(--spacing-2) }
.c-notification { max-width:var(--col-width-extra-wide);padding:var(--spacing-3) var(--spacing-4);color:var(--color-neutral-0);font-size:var(--text-sm);border-radius:var(--border-radius);box-shadow:var(--shadow-md);animation:slide-in .3s ease-out }
.c-notification.c-success { background:var(--success-color) }
.c-notification.c-error { background:var(--danger-color) }
.c-notification.c-warning { background:var(--warning-color) }
.c-notification.c-info { background:var(--info-color) }
.loading .c-metric-value { color:transparent;background:linear-gradient(90deg,var(--border-color) 25%,var(--color-neutral-200) 50%,var(--border-color) 75%);background-size:200% 100%;border-radius:var(--spacing-1);animation:loading 1.5s infinite }
.loading-overlay--improved { position:fixed;top:var(--spacing-0);left:var(--spacing-0);z-index:var(--z-index-overlay);display:flex;visibility:hidden;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;background-color:var(--overlay-medium);opacity:0;transition:var(--transition) }
.loading-overlay--improved.c-show { visibility:visible;opacity:100% }
.loading-spinner--improved { width:var(--spacing-10);height:var(--spacing-10);margin-bottom:var(--spacing-4);border:var(--spacing-1) solid var(--border-color);border-top:var(--spacing-1) solid var(--primary-color);border-radius:var(--radius-full);animation:spin 1s linear infinite }
.notifications-container--improved { position:fixed;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-index-popover);display:flex;flex-direction:column;gap:var(--spacing-2) }
.notification--improved { position:relative;max-width:var(--card-min-width-lg);padding:var(--spacing-3) var(--spacing-4);font-size:var(--text-sm);background-color:var(--bg-secondary);border:var(--spacing-px) solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-lg);animation:slide-in-right .3s ease }
.notification--improved.c-success { color:var(--color-success-text);background-color:var(--color-success-bg);border-color:var(--success-color) }
.notification--improved.c-error { color:var(--color-danger-text);background-color:var(--color-danger-bg);border-color:var(--danger-color) }
.notification--improved.c-info { color:var(--color-info-text);background-color:var(--color-info-bg);border-color:var(--info-color) }
@media (prefers-reduced-motion:reduce) { .c-activity-item,.c-notification,.loading-spinner--improved,.loading .c-metric-value,.notification--improved { animation:none }
.c-activity-item,.c-btn-clear,.c-modal,.loading-overlay--improved { transition:none }
 }
.sg-container { width:100%;max-width:min(var(--container-2xl,1536px),95vw);margin:var(--spacing-0) auto;padding:var(--space-4,var(--spacing-4)) }
@media (min-width:1920px) { .sg-container { max-width:min(var(--max-width-full),90vw) }
 }
.sg-grid--responsive,.sg-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:1fr;padding:var(--spacing-8) var(--spacing-8) }
@media (min-width:769px) { .sg-grid--responsive { grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1536px) { .sg-grid--responsive { grid-template-columns:repeat(auto-fill,minmax(var(--card-min-width-md,380px),1fr)) }
 }
@media (max-width:768px) { .sg-grid--responsive,.sg-grid { gap:var(--spacing-4);padding:var(--spacing-4) }
 }
.sg-stat-card { display:flex;flex-direction:column;min-height:var(--spacing-30);padding:var(--space-5,var(--spacing-5));background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);transition:all .2s ease }
.sg-stat-card:hover { box-shadow:0 var(--spacing-1) var(--spacing-3) var(--alpha-black-10);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.sg-stat-card__value { margin-bottom:var(--space-2,var(--spacing-2));color:var(--color-accent-primary);font-size:var(--spacing-10);font-weight:700;line-height:1 }
.sg-stat-card__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:600;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase }
.sg-stat-card__change { display:flex;align-items:center;gap:var(--space-1,var(--spacing-1));margin-top:auto;padding-top:var(--space-2,var(--spacing-2));font-size:var(--text-xs) }
.sg-stat-card__change--positive { color:var(--color-success) }
.sg-stat-card__change--negative { color:var(--color-danger) }
.sg-chart-container { position:relative;min-height:var(--card-min-width-lg);padding:var(--space-5,var(--spacing-5));background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg) }
.sg-chart-container__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4,var(--spacing-4)) }
.sg-chart-container__title { color:var(--color-text-primary);font-size:var(--text-lg);font-weight:600 }
.sg-action-group { display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3,var(--spacing-3)) }
.sg-progress { overflow:hidden;width:100%;height:var(--spacing-2);background:var(--color-surface-secondary);border-radius:var(--radius-base) }
.sg-progress__bar { background:var(--color-accent-primary);border-radius:var(--radius-base);transition:width .3s ease }
.sg-progress__bar--success { background:var(--color-success) }
.sg-progress__bar--warning { background:var(--color-warning) }
.sg-progress__bar--danger { background:var(--color-danger) }
.sg-alert { display:flex;align-items:flex-start;gap:var(--space-3,var(--spacing-3));padding:var(--space-4,var(--spacing-4));border:var(--spacing-px) solid;border-radius:var(--radius-base) }
.sg-alert--info { color:var(--color-info-text);background:var(--color-info-subtle);border-color:var(--color-info) }
.activity-list--preview { overflow-y:auto;max-height:var(--size-inbox-preview,var(--spacing-96));padding-right:var(--space-2,var(--spacing-2));scroll-behavior:smooth;scrollbar-gutter:stable }
@media (prefers-reduced-motion:reduce) { .activity-list--preview { scroll-behavior:auto }
 }
.dashboard-page { --dashboard-bg:var(--color-surface-base);--dashboard-surface:var(--color-surface-primary);--dashboard-surface-alt:var(--color-surface-elevated);--dashboard-surface-card:var(--color-card-background);--dashboard-surface-card-hover:var(--color-card-background-hover);--dashboard-border:var(--color-border-default);--dashboard-border-strong:var(--color-border-strong);--dashboard-text-primary:var(--color-text-primary);--dashboard-text-secondary:var(--color-text-secondary);--dashboard-text-muted:var(--color-text-tertiary);--dashboard-accent:var(--color-brand-primary);--dashboard-accent-dark:var(--color-brand-primary-dark,var(--color-brand-primary));--color-bg-primary:var(--dashboard-bg);--color-bg-secondary:var(--dashboard-surface);--color-bg-tertiary:var(--dashboard-surface-alt);--color-surface-primary:var(--dashboard-surface);--color-surface-secondary:var(--dashboard-surface-alt);--color-border-default:var(--dashboard-border);--color-border-strong:var(--dashboard-border-strong);--color-text-primary:var(--dashboard-text-primary);--color-text-secondary:var(--dashboard-text-secondary);--color-text-muted:var(--dashboard-text-muted);color:var(--dashboard-text-primary);background:var(--dashboard-bg) }
.dashboard-page .card,.dashboard-page .metric-card,.dashboard-page .sg-card,.dashboard-page .sg-card-content { color:var(--dashboard-text-primary);background:var(--dashboard-surface-card);border:1px solid var(--dashboard-border-strong);box-shadow:none }
.dashboard-page .card:hover,.dashboard-page .metric-card:hover,.dashboard-page .sg-card:hover { background:var(--dashboard-surface-card-hover);border-color:var(--dashboard-border-strong) }
.dashboard-page .card-header,.dashboard-page .card__title,.dashboard-page .metric-card__value,.dashboard-page .sg-card-title,.dashboard-page h1,.dashboard-page h2,.dashboard-page h3 { color:var(--dashboard-text-primary) }
.dashboard-page .page-header__title { color:var(--color-text-primary) }
.dashboard-page .card__body,.dashboard-page .card__footer,.dashboard-page .metric-card__label,.dashboard-page p,.dashboard-page time { color:var(--dashboard-text-secondary) }
.dashboard-page .card__body .text-muted,.dashboard-page .card__footer .text-muted,.dashboard-page .text-muted { color:var(--dashboard-text-muted) }
.dashboard-page .btn--primary,.dashboard-page .sg-btn--primary { color:var(--color-text-primary);background:linear-gradient(135deg,var(--dashboard-accent),var(--dashboard-accent-dark));border:none }
.dashboard-page .btn--primary:hover,.dashboard-page .sg-btn--primary:hover { box-shadow:var(--shadow-md);transform:translateY(-1px) }
.dashboard-page .btn--secondary,.dashboard-page .sg-btn--secondary { color:var(--dashboard-text-primary);background:transparent;border:1px solid var(--dashboard-border-strong) }
.dashboard-page .btn--secondary:hover,.dashboard-page .sg-btn--secondary:hover { background:rgb(248 250 252/8%);border-color:var(--dashboard-border-strong) }
.dashboard-page .metric-card { background:var(--dashboard-surface-alt);border-color:var(--dashboard-border-strong) }
.dashboard-page .metric-card__icon { color:var(--dashboard-accent) }
.dashboard-page .card-footer,.dashboard-page .card-header,.dashboard-page .sg-card__footer,.dashboard-page .sg-card__header { border-color:var(--dashboard-border-strong) }
.dashboard-page .badge--neutral { color:var(--dashboard-text-secondary);background:color-mix(in srgb,var(--dashboard-text-secondary) 12%,transparent);border:1px solid color-mix(in srgb,var(--dashboard-border-strong) 40%,transparent) }
.sg-alert--success { color:var(--color-success-text);background:var(--color-success-subtle);border-color:var(--color-success) }
.sg-alert--warning { color:var(--color-warning-text);background:var(--color-warning-subtle);border-color:var(--color-warning) }
.sg-alert--danger { color:var(--color-danger-text);background:var(--color-danger-subtle);border-color:var(--color-danger) }
.sg-card__header { display:flex;justify-content:space-between;align-items:center;padding:var(--space-4,var(--spacing-4));border-bottom:var(--spacing-px) solid var(--color-border-default) }
.sg-card__title { color:var(--color-text-primary);font-size:var(--text-lg);font-weight:600 }
.sg-card__subtitle { margin-top:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-empty-state { padding:var(--spacing-12) var(--spacing-4);color:var(--color-text-secondary);text-align:center }
.sg-empty-state__icon { margin-bottom:var(--spacing-4);color:var(--color-neutral-300);font-size:var(--spacing-12) }
.sg-empty-state__title { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:600 }
.sg-empty-state__description { color:var(--color-text-secondary);font-size:var(--text-base) }
@media (max-width:768px) { .sg-stat-card__value { font-size:var(--spacing-8) }
.sg-chart-container { min-height:var(--col-width-extra-wide) }
 }
@media (max-width:640px) { .sg-action-group { flex-direction:column;width:100% }
.sg-action-group>* { width:100% }
 }
.page-header__icon { margin-right:var(--spacing-3);color:var(--color-brand-primary);font-size:var(--text-2xl);vertical-align:middle }
.dashboard-page .dashboard-grid--4 { margin-bottom:var(--spacing-8) }
.dashboard-page .sg-card { margin-bottom:var(--spacing-6) }
.dashboard-page .dashboard-grid--2 { margin-top:var(--spacing-4) }
.dashboard-page .sg-card-title { display:flex;align-items:center;gap:var(--spacing-2);margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-bold);letter-spacing:-.01em;text-transform:none }
.dashboard-page .activity-list .card__title { font-size:var(--text-base);font-weight:var(--font-medium);color:var(--color-text-primary) }
.dashboard-page .activity-list .card { padding:var(--spacing-4);margin-bottom:var(--spacing-3);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.dashboard-page .activity-list .card:last-child { margin-bottom:var(--spacing-0) }
.dashboard-page .activity-list .card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-md);transform:translateY(-1px) }
.dashboard-page .activity-list .card__header { margin-bottom:var(--spacing-2);padding-bottom:var(--spacing-2);border-bottom:1px solid var(--color-border-subtle) }
.dashboard-page .activity-list .card__body { margin-bottom:var(--spacing-2) }
.dashboard-page .activity-list .card__footer { padding-top:var(--spacing-2);border-top:1px solid var(--color-border-subtle) }
.dashboard-page .learning-insights { color:var(--color-text-primary) }
.dashboard-page .insight-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));grid-gap:var(--spacing-4);gap:var(--spacing-4);padding:var(--spacing-2) var(--spacing-0) }
.dashboard-page .insight-item { padding:var(--spacing-4);text-align:center;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.dashboard-page .insight-item:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-sm) }
.dashboard-page .insight-value { margin-bottom:var(--spacing-1);color:var(--color-brand-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:var(--leading-tight) }
.dashboard-page .insight-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.dashboard-page .insight-action,.dashboard-page .insight-info { margin-top:var(--spacing-4);padding-top:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);border-top:1px solid var(--color-border-subtle) }
.dashboard-page .insight-action a,.dashboard-page .insight-info a { color:var(--color-brand-primary);text-decoration:underline;text-underline-offset:2px }
.dashboard-page .insight-action a:hover,.dashboard-page .insight-info a:hover { color:var(--color-brand-primary-light) }
.sg-thread-toggle { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-6);padding:var(--spacing-4);background:var(--color-surface-base);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.sg-thread-toggle__checkbox { width:var(--spacing-6);height:var(--spacing-6);margin:0;cursor:pointer;accent-color:var(--color-brand-primary) }
.sg-thread-toggle__label { display:flex;align-items:center;gap:var(--spacing-2);margin:0;color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-weight-medium);cursor:pointer;-webkit-user-select:none;user-select:none }
.sg-thread-toggle__icon { color:var(--color-brand-primary) }
.sg-filter-toolbar { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-6);padding:var(--spacing-4);background:var(--color-surface-base);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.sg-filter-control { display:flex;align-items:center;gap:var(--spacing-2);margin-left:auto }
.sg-filter-control__checkbox { width:var(--spacing-6);height:var(--spacing-6);margin:0;cursor:pointer;accent-color:var(--color-brand-primary) }
.sg-filter-control__label { display:flex;align-items:center;gap:var(--spacing-2);margin:0;color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-medium);cursor:pointer;-webkit-user-select:none;user-select:none }
.sg-filter-control__icon { color:var(--color-brand-primary) }
.sg-button--filter { position:relative;transition:all var(--duration-fast) var(--ease-in-out) }
.sg-button--filter:hover { background:var(--color-surface-elevated);border-color:var(--color-border-strong) }
.sg-button--filter:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--border-width-2) }
.sg-button--filter[aria-pressed=true] { color:var(--color-brand-primary);background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary) }
.sg-stats-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--card-min-width-sm),1fr));margin-bottom:var(--spacing-6) }
.sg-stat-card { padding:var(--spacing-6);text-align:center;background:var(--color-surface-base);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-fast) var(--ease-in-out) }
.sg-stat-card:hover { box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.sg-stat__value { margin-bottom:var(--spacing-1);color:var(--color-brand-primary);font-size:var(--text-3xl);font-weight:var(--font-weight-bold);line-height:1.2 }
.sg-stat__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-medium);letter-spacing:var(--tracking-wider);text-transform:uppercase }
.sg-triage-bar { margin-bottom:var(--spacing-6);padding:var(--spacing-4);background:var(--color-surface-base);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.sg-section[data-email-list=true] { min-height:var(--section-min-height-email-list);margin-bottom:var(--spacing-6) }
.sg-loading { display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--spacing-4);min-height:var(--card-min-height-category-empty);color:var(--color-text-secondary) }
.sg-loading i { font-size:var(--text-3xl);animation:spin 1s linear infinite }
.sg-email-detail { padding:var(--spacing-6);background:var(--color-surface-base);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-md) }
.sg-pagination { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);padding:var(--spacing-6);background:var(--color-surface-base);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md) }
.sg-pagination__info { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-medium) }
.sg-pagination__info span { color:var(--color-text-primary);font-weight:var(--font-weight-semibold) }
.sg-filter-control__checkbox:focus-visible,.sg-thread-toggle__checkbox:focus-visible { outline:var(--border-width-2) solid var(--color-brand-primary);outline-offset:var(--border-width-2) }
@media (max-width:768px) { .sg-stats-grid { grid-template-columns:repeat(2,1fr) }
.sg-filter-toolbar { flex-direction:column;align-items:stretch }
.sg-filter-control { margin-left:0 }
.sg-pagination { flex-direction:column;text-align:center }
 }
@media (max-width:480px) { .sg-stats-grid { grid-template-columns:1fr }
 }
.sg-hidden { display:none }
.scroll-sentinel { padding:var(--spacing-6);text-align:center }
.scroll-sentinel__loader { display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.scroll-sentinel__loader i { font-size:var(--text-lg);color:var(--color-brand-primary) }
.scroll-sentinel__loader { animation:scroll-sentinel-fade-in var(--duration-medium) var(--ease-out) }
@media (prefers-reduced-motion:reduce) { .scroll-sentinel__loader { animation:none }
 }
.sg-stat-card { position:relative;background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);overflow:hidden }
.sg-stat-card:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--color-brand-primary-15) 0,var(--color-brand-primary-05) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;border-radius:inherit }
.sg-stat-card:hover:before { opacity:1 }
.sg-stat-card>* { position:relative;z-index:1 }
.sg-stat-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-lg),var(--shadow-glow-brand);transform:translateY(-3px) }
.sg-stat__value { background:var(--text-gradient-primary);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent }
.sg-stat-card--primary { background:linear-gradient(135deg,var(--color-brand-primary-15) 0,var(--color-brand-primary-05) 100%) }
.sg-stat-card--primary:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-brand) }
.sg-stat-card--success:before { background:linear-gradient(135deg,var(--color-success-very-subtle) 0,transparent 100%) }
.sg-stat-card--success:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-success) }
.sg-stat-card--warning:before { background:linear-gradient(135deg,var(--color-warning-very-subtle) 0,transparent 100%) }
.sg-stat-card--warning:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-warning) }
.sg-stat-card--danger:before { background:linear-gradient(135deg,var(--color-danger-very-subtle) 0,transparent 100%) }
.sg-stat-card--danger:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-danger) }
.sg-stat-card { animation:statCardEnter .5s var(--ease-bounce) backwards }
.sg-stats-grid .sg-stat-card:first-child { animation-delay:0s }
.sg-stats-grid .sg-stat-card:nth-child(2) { animation-delay:80ms }
.sg-stats-grid .sg-stat-card:nth-child(3) { animation-delay:.16s }
.sg-stats-grid .sg-stat-card:nth-child(4) { animation-delay:.24s }
@media (prefers-reduced-motion:reduce) { .sg-stat-card { animation:none;transition:none }
.sg-stat-card:hover { transform:none }
.sg-stat-card:before { transition:none }
.loading-spinner--improved,.sg-loading i { animation:none }
 }
.sg-email-card { margin-bottom:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-base);transition:all .2s ease;cursor:pointer }
.sg-email-card:hover { background:var(--color-surface-hover);border-color:var(--color-border-hover);box-shadow:0 4px 6px var(--shadow-md);transform:translateY(-1px) }
.sg-email-card--selected { background:var(--color-primary-subtle);border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-subtle) }
.sg-email-card--selected:hover { background:var(--color-primary-subtle);border-color:var(--color-primary) }
.sg-email-card__header { display:flex;flex-direction:column;gap:var(--spacing-2);margin-bottom:var(--spacing-3) }
.sg-email-card__title { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-2) }
.sg-email-card__subject { flex:1;min-width:var(--col-width-medium);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.sg-email-card__meta { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-email-card__meta-item { display:flex;align-items:center;gap:var(--spacing-1) }
.sg-email-card__badge { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-weight-medium);letter-spacing:.5px;text-transform:uppercase;border-radius:var(--radius-sm) }
.sg-email-card__badge--gm { color:var(--color-success-text);background:var(--color-success-subtle);border:1px solid var(--color-success) }
.sg-email-card__badge--ops { color:var(--color-info-text);background:var(--color-info-subtle);border:1px solid var(--color-info) }
.sg-email-card__badge--partner { color:var(--color-warning-text);background:var(--color-warning-subtle);border:1px solid var(--color-warning) }
.sg-email-card__badge--unknown { color:var(--color-danger-text);background:var(--color-danger-subtle);border:1px solid var(--color-danger) }
.sg-email-card__badge--automation-systems { color:var(--color-info-text);background:var(--color-info-subtle);border:1px solid var(--color-info-border) }
.sg-email-card__badge--external-vendors { color:var(--color-warning-text);background:var(--color-warning-subtle);border:1px solid var(--color-warning-border) }
.sg-email-card__badge--facilities-management { color:var(--color-success-text);background:var(--color-success-subtle);border:1px solid var(--color-success-border) }
.sg-email-card__badge--internal-notifications { color:var(--color-primary);background:var(--color-primary-subtle);border:1px solid var(--color-primary-border) }
.sg-email-card__badge--nbc-partners { color:var(--color-cyan);background:var(--color-cyan-subtle);border:1px solid var(--color-cyan-border) }
.sg-email-card__badge--troon-corporate { color:var(--color-indigo);background:var(--color-indigo-subtle);border:1px solid var(--color-indigo-border) }
.sg-email-card__badge--troon-digital-team { color:var(--color-primary);background:var(--color-primary-subtle);border:1px solid var(--color-primary-border) }
.sg-email-card__status { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-weight-medium);border-radius:var(--radius-sm) }
.sg-email-card__status--unprocessed { color:var(--color-warning-text);background:var(--color-warning-subtle) }
.sg-email-card__status--draft-created { color:var(--color-info-text);background:var(--color-info-subtle) }
.sg-email-card__status--no-draft { color:var(--color-success-text);background:var(--color-success-subtle) }
.sg-email-card__status--processed { color:var(--color-info-text);background:var(--color-info-subtle) }
.sg-email-card__direction { display:inline-flex;align-items:center;gap:var(--spacing-1);color:var(--color-text-tertiary);font-size:var(--text-sm) }
.sg-email-card__direction--inbound { color:var(--color-info) }
.sg-email-card__direction--sent { color:var(--color-success) }
.sg-email-card__actions { display:flex;gap:var(--spacing-2);margin-bottom:var(--spacing-3) }
.sg-email-card__action-button { display:flex;flex:1;justify-content:center;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-weight-medium);border:none;border-radius:var(--radius-base);transition:all .2s ease;cursor:pointer }
.sg-email-card__action-button:disabled { opacity:50%;cursor:not-allowed }
.sg-email-card__action-button--primary { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-brand-primary-light) 0,var(--color-primary) 100%) }
.sg-email-card__action-button--primary:hover:not(:disabled) { background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-dark) 100%);box-shadow:0 2px 4px var(--shadow-sm);transform:translateY(-1px) }
.sg-email-card__action-button--secondary { color:var(--color-text-secondary);background:transparent;border:1px solid var(--color-border-subtle) }
.sg-email-card__action-button--secondary:hover:not(:disabled) { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-hover) }
.sg-email-card__action-button--ghost { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-dark) 100%) }
.sg-email-card__action-button--ghost:hover:not(:disabled) { background:var(--color-primary-dark);box-shadow:0 2px 4px var(--shadow-sm);transform:translateY(-1px) }
.sg-email-card__action-button--ghost .fas,.sg-email-card__action-button--ghost i,.sg-email-card__action-button--primary .fas,.sg-email-card__action-button--primary i { color:var(--color-text-on-dark) }
.sg-email-card__preview { margin:var(--spacing-2) 0 var(--spacing-3);padding:var(--spacing-2);background:var(--color-surface-primary);border-left:2px solid var(--color-border-subtle);border-radius:var(--radius-sm) }
.sg-email-card__preview-text { display:-webkit-box;overflow:hidden;margin:0;color:var(--color-text-secondary);font-size:var(--text-sm);line-height:1.5;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical }
.sg-email-body { color:var(--color-text-primary);font-size:var(--text-base);line-height:1.6;white-space:pre-wrap;overflow-wrap:break-word }
.sg-thread-group { margin-bottom:var(--spacing-4);padding:var(--spacing-4);background:var(--color-surface-primary);border:2px solid var(--color-primary);border-radius:var(--radius-lg) }
.sg-thread-group__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3);border-radius:var(--radius-base);transition:all .2s ease;cursor:pointer }
.sg-thread-group__header:hover { background:var(--color-surface-hover) }
.sg-thread-group__title { display:flex;align-items:center;gap:var(--spacing-3) }
.sg-thread-group__subject { color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.sg-thread-group__count { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-on-dark);font-size:var(--text-xs);font-weight:var(--font-weight-bold);background:var(--color-primary);border-radius:var(--radius-full) }
.sg-thread-group__meta { color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-thread-group__emails { margin-top:var(--spacing-3);padding-left:var(--spacing-4);border-left:2px solid var(--color-border-subtle) }
.sg-thread-group__emails--collapsed { display:none }
@media (max-width:768px) { .sg-email-card { padding:var(--spacing-3) }
.sg-email-card__actions { flex-direction:column }
.sg-email-card__meta { flex-direction:column;align-items:flex-start }
.sg-thread-group { padding:var(--spacing-3) }
 }
.sg-email-card:focus-visible,.sg-email-card__disclosure:focus-visible { outline:2px solid var(--color-primary);outline-offset:2px }
.sg-email-card--loading { position:relative;opacity:60%;pointer-events:none }
.sg-email-card--loading:after { position:absolute;top:50%;left:50%;width:var(--spacing-5);height:var(--spacing-5);border-radius:50%;transform:translate(-50%,-50%);animation:spin .6s linear infinite;content:"";border:2px solid var(--color-border-subtle);border-top-color:var(--color-primary) }
.sg-email-detail { overflow-y:auto;height:fit-content;min-height:var(--spacing-32);max-height:calc(100vh - var(--spacing-24));padding:var(--spacing-6);background:var(--color-surface-elevated);border-radius:var(--radius-base) }
.sg-email-detail__header { margin-bottom:var(--spacing-6);padding-bottom:var(--spacing-4);border-bottom:1px solid var(--color-border-subtle) }
.sg-email-detail__title { display:flex;align-items:flex-start;gap:var(--spacing-2);margin-bottom:var(--spacing-3) }
.sg-email-detail__subject { margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-bold);line-height:1.3 }
.sg-email-detail__meta { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-email-detail__meta-item { display:flex;align-items:center;gap:var(--spacing-1) }
.sg-email-detail__direction { display:inline-flex;align-items:center;gap:var(--spacing-1);font-size:var(--text-sm) }
.sg-email-detail__direction--inbound { color:var(--color-info) }
.sg-email-detail__direction--sent { color:var(--color-success) }
.sg-email-detail__recipient,.sg-email-detail__sender { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-base) }
.sg-email-detail__recipient strong,.sg-email-detail__sender strong { margin-right:var(--spacing-2);color:var(--color-text-primary) }
.sg-email-detail__cc { margin-bottom:var(--spacing-3);color:var(--color-text-tertiary);font-size:var(--text-sm) }
.sg-email-detail__cc strong { margin-right:var(--spacing-2);color:var(--color-text-secondary) }
.sg-email-detail__body { margin-top:var(--spacing-6);padding:var(--spacing-4);background:var(--color-surface-primary);border:1px solid var(--color-border-subtle);border-radius:var(--radius-base) }
.sg-email-detail__body-heading { margin:0 0 var(--spacing-3) 0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
@media (max-width:1024px) { .sg-email-detail { max-height:none;margin-top:var(--spacing-4) }
 }
.sg-email-card--processed { background:var(--color-info-subtle);border:1px solid var(--color-info-border,var(--color-info)) }
.sg-email-card--processed .sg-email-card__subject { color:var(--color-info);text-decoration:line-through }
.processed-checkbox-label { display:inline-flex;align-items:center;gap:var(--spacing-2);cursor:pointer;-webkit-user-select:none;user-select:none }
.processed-checkbox { width:var(--spacing-4);height:var(--spacing-4);cursor:pointer;accent-color:var(--color-primary) }
.processed-checkbox:disabled { opacity:50%;cursor:not-allowed }
.processed-checkbox:focus-visible { outline:2px solid var(--color-primary);outline-offset:2px }
.processed-checkbox-text { color:var(--color-text-secondary);font-size:var(--text-sm) }
.processed-checkbox:checked+.processed-checkbox-text { color:var(--color-text-primary);font-weight:var(--font-weight-medium) }
.sg-email-card__suggestions { display:flex;flex-direction:column;align-items:stretch;gap:var(--spacing-3);margin:var(--spacing-3) 0;padding:var(--spacing-3);background:var(--color-surface-primary);border:1px dashed var(--color-border-subtle);border-radius:var(--radius-base) }
.sg-email-card__suggestions:empty { display:none }
.sg-email-card__suggestions-label { display:flex;align-items:center;gap:var(--spacing-2);width:100%;margin-bottom:var(--spacing-2);padding-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-weight-medium);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--color-border-subtle) }
.sg-email-card__suggestions-label:before { content:"💡";font-size:var(--text-sm) }
@media (max-width:768px) { .sg-email-card__suggestions { flex-direction:column }
 }
.sg-email-card { position:relative;background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border-color:var(--glass-border-subtle);overflow:hidden }
.sg-email-card:before { content:"";position:absolute;inset:0;opacity:1;pointer-events:none;border-radius:inherit;transition:opacity var(--duration-medium) var(--ease-out);z-index:0 }
.sg-email-card[data-classification=hot]:before { background:var(--gradient-classification-hot) }
.sg-email-card[data-classification=warm]:before { background:var(--gradient-classification-warm) }
.sg-email-card[data-classification=new]:before { background:var(--gradient-classification-new) }
.sg-email-card[data-classification=cold]:before { background:var(--gradient-classification-cold) }
.sg-email-card>* { position:relative;z-index:1 }
.sg-email-card:hover { background:var(--glass-bg-medium);border-color:var(--color-border-strong);box-shadow:var(--shadow-lg),0 0 20px var(--color-brand-primary-15);transform:translateY(-2px) }
.sg-email-card[data-classification=hot]:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-sm-danger);border-color:var(--color-danger-border) }
.sg-email-card[data-classification=warm]:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-sm-warning);border-color:var(--color-warning-border) }
.sg-email-card[data-classification=new]:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-sm-brand);border-color:var(--color-info-border) }
.sg-email-card:hover:before { opacity:1 }
.sg-email-card--selected { background:var(--glass-bg-medium);backdrop-filter:var(--backdrop-blur-heavy);-webkit-backdrop-filter:var(--backdrop-blur-heavy);border-color:var(--color-brand-primary) }
.sg-email-card { animation:emailCardEnter .4s var(--ease-bounce) backwards }
.sg-email-card:first-child { animation-delay:0s }
.sg-email-card:nth-child(2) { animation-delay:30ms }
.sg-email-card:nth-child(3) { animation-delay:60ms }
.sg-email-card:nth-child(4) { animation-delay:90ms }
.sg-email-card:nth-child(5) { animation-delay:.12s }
.sg-email-card:nth-child(6) { animation-delay:.15s }
.sg-email-card:nth-child(7) { animation-delay:.18s }
.sg-email-card:nth-child(8) { animation-delay:.21s }
.sg-email-card:nth-child(9) { animation-delay:.24s }
.sg-email-card:nth-child(10) { animation-delay:.27s }
.sg-thread-group__header { background:var(--glass-bg-medium);backdrop-filter:var(--backdrop-blur-heavy);-webkit-backdrop-filter:var(--backdrop-blur-heavy);border-bottom:1px solid var(--glass-border) }
.sg-thread-group__header:hover { background:var(--glass-bg-light) }
.sg-email-card__preview { background:var(--glass-bg-darker);backdrop-filter:var(--backdrop-blur-light);-webkit-backdrop-filter:var(--backdrop-blur-light);border-left-color:var(--glass-border) }
@media (prefers-reduced-motion:reduce) { .sg-email-card { animation:none;transition:none }
.sg-email-card:hover { transform:none }
.sg-email-card:before { transition:none }
 }
.sg-email-body { white-space:normal }
.email-body__paragraph { margin:0 0 var(--spacing-4) 0;color:var(--color-text-primary);font-size:var(--text-base);line-height:var(--leading-relaxed) }
.email-body__paragraph:last-child { margin-bottom:0 }
.email-body__empty { color:var(--color-text-muted);font-style:italic;padding:var(--spacing-4);text-align:center }
.email-body__thread-header { position:relative;margin:var(--spacing-6) 0;padding:var(--spacing-4);background:var(--color-surface-overlay);backdrop-filter:var(--backdrop-blur-light);-webkit-backdrop-filter:var(--backdrop-blur-light);border-radius:var(--radius-lg);border:var(--border-width-1) solid var(--color-border-default);border-left:var(--border-width-3) solid var(--color-brand-primary);color:var(--color-text-secondary);font-size:var(--text-sm);font-family:var(--font-mono);white-space:pre-wrap;transition:transform var(--duration-fast) var(--ease-out),opacity var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out) }
.email-body__thread-header:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-05) 100%);opacity:0;border-radius:var(--radius-lg);transition:opacity var(--duration-fast) var(--ease-out);pointer-events:none }
.email-body__thread-header:hover:before { opacity:1 }
.email-body__thread-header:hover { transform:translateX(var(--spacing-1));box-shadow:var(--shadow-md) }
.email-body__thread-header:first-child { margin-top:0 }
.email-body__separator { display:flex;align-items:center;gap:var(--spacing-4);margin:var(--spacing-8) 0;color:var(--color-text-tertiary);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-wide) }
.email-body__separator:after,.email-body__separator:before { content:"";flex:1;height:var(--border-width-1);background:linear-gradient(90deg,transparent 0,var(--color-border-subtle) 50%,transparent 100%) }
.email-body__quote-attribution { margin:var(--spacing-6) 0 var(--spacing-2) 0;padding-left:var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-sm);font-style:italic;border-left:var(--border-width-2) solid var(--color-border-subtle) }
.email-body__quote { position:relative;margin:var(--spacing-3) 0 var(--spacing-4) 0;padding:var(--spacing-4);background:var(--color-surface-hover);border-left:var(--border-width-3) solid var(--color-info);border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);white-space:pre-wrap;transition:transform var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out) }
.email-body__quote:hover { background:var(--color-surface-overlay) }
.email-body__quote--level-1 { border-left-color:var(--color-info);background:var(--color-info-bg) }
.email-body__quote--level-2 { margin-left:var(--spacing-4);border-left-color:var(--color-warning);background:var(--color-warning-bg) }
.email-body__quote--level-3 { margin-left:var(--spacing-8);border-left-color:var(--color-text-muted);background:var(--color-surface-hover);opacity:var(--opacity-80) }
.email-body__signature { margin-top:var(--spacing-8);padding-top:var(--spacing-4);border-top:var(--border-width-1) dashed var(--color-border-subtle);color:var(--color-text-tertiary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
@media (max-width:768px) { .email-body__thread-header { font-size:var(--text-xs);padding:var(--spacing-3) }
.email-body__quote--level-2,.email-body__quote--level-3 { margin-left:var(--spacing-2) }
 }
@media (prefers-reduced-motion:reduce) { .email-body__quote,.email-body__thread-header,.email-body__thread-header:before { transition:none }
.email-body__thread-header:hover { transform:none }
 }
.inbox-undo-button { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);color:var(--color-warning);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-warning-border);border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.inbox-undo-button:hover:not(:disabled):not(.inbox-undo-button--loading) { background:var(--color-warning-subtle);border-color:var(--color-warning);transform:translateY(-1px) }
.inbox-undo-button:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.inbox-undo-button:disabled { opacity:50%;cursor:not-allowed }
.inbox-undo-button__icon { flex-shrink:0;font-size:var(--text-base);line-height:1 }
.inbox-undo-button__text { white-space:nowrap }
.inbox-undo-button__timer { padding-left:var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-xs);white-space:nowrap;border-left:var(--border-width-1) solid var(--color-border-subtle);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.inbox-undo-button--urgent { color:var(--color-danger);border-color:var(--color-danger-border) }
.inbox-undo-button--urgent:hover:not(:disabled):not(.inbox-undo-button--loading) { background:var(--color-danger-subtle);border-color:var(--color-danger) }
.inbox-undo-button--urgent .inbox-undo-button__timer { color:var(--color-danger);animation:undo-timer-pulse var(--duration-pulse) ease-in-out infinite }
.inbox-undo-button--loading { cursor:wait;pointer-events:none }
.inbox-undo-button--loading .inbox-undo-button__icon { animation:undo-button-spin var(--duration-slowest) linear infinite }
.inbox-undo-button--loading .inbox-undo-button__text:after { content:"...";animation:undo-loading-dots var(--duration-shimmer) steps(4) infinite }
.inbox-undo-notification { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);border-radius:var(--radius-md);animation:undo-notification-slide-in var(--duration-medium) var(--ease-out) }
.inbox-undo-notification--success { color:var(--color-success);background:var(--color-success-subtle);border:var(--border-width-1) solid var(--color-success-border) }
.inbox-undo-notification--error { color:var(--color-danger);background:var(--color-danger-subtle);border:var(--border-width-1) solid var(--color-danger-border) }
.inbox-undo-notification--info { color:var(--color-info);background:var(--color-info-subtle);border:var(--border-width-1) solid var(--color-info-border) }
.undo-modal .modal__content { max-width:var(--modal-max-width-sm) }
.undo-modal__description { margin-bottom:var(--spacing-4);color:var(--color-text-secondary);line-height:var(--leading-relaxed) }
.undo-modal__email-preview { margin-bottom:var(--spacing-4);padding:var(--spacing-3);color:var(--color-text-tertiary);font-size:var(--text-sm);background:var(--color-surface-alt);border-radius:var(--radius-md) }
.undo-modal__email-preview strong { display:block;margin-bottom:var(--spacing-1);color:var(--color-text-primary) }
.undo-modal__reason-group { display:flex;flex-direction:column;gap:var(--spacing-2) }
.undo-modal__reason-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.undo-modal__select { padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-sm);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-out);cursor:pointer }
.undo-modal__select:hover { border-color:var(--color-border-strong) }
.undo-modal__select:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
.undo-modal .modal__footer { gap:var(--spacing-3) }
.undo-modal__confirm-button { color:var(--color-text-primary);background:var(--color-warning) }
.undo-modal__confirm-button:hover:not(:disabled) { background:var(--color-warning-dark) }
@media (max-width:768px) { .inbox-undo-button { padding:var(--spacing-2) }
.inbox-undo-button__text { position:absolute;overflow:hidden;clip-path:inset(100%);width:var(--spacing-px);height:var(--spacing-px);margin:calc(var(--spacing-px)*-1);padding:0;white-space:nowrap;border:0 }
.inbox-undo-button__timer { padding-left:var(--spacing-0);border-left:none }
 }
@media (prefers-reduced-motion:reduce) { .inbox-undo-button--hiding,.inbox-undo-button--loading .inbox-undo-button__icon,.inbox-undo-button--loading .inbox-undo-button__text:after,.inbox-undo-button--urgent .inbox-undo-button__timer,.inbox-undo-notification { animation:none }
.inbox-undo-button:hover,.inbox-undo-button,.undo-modal__select { transition:none }
 }
.inbox-undo-button--hiding { animation:undo-button-fade-out var(--duration-medium) var(--ease-out) forwards }
.automation-reasoning-panel { margin-bottom:var(--spacing-4);padding:var(--spacing-3);background:var(--color-surface-secondary);border:var(--border-width-1) solid var(--color-border-subtle);border-radius:var(--radius-md) }
.automation-reasoning-panel__header { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3) }
.automation-reasoning-panel__badge { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1) var(--spacing-2);color:var(--color-info);font-size:var(--text-xs);font-weight:var(--font-medium);background:var(--color-info-subtle);border:var(--border-width-1) solid var(--color-info-border);border-radius:var(--radius-sm) }
.automation-reasoning-panel__badge i { font-size:var(--text-sm) }
.automation-reasoning-panel__trigger { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.automation-reasoning-panel__confidence { color:var(--color-success);font-size:var(--text-sm);font-weight:var(--font-semibold);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.automation-reasoning__undo { margin-left:auto }
.automation-reasoning-panel__details { margin-top:var(--spacing-3);padding-top:var(--spacing-3);border-top:var(--border-width-1) solid var(--color-border-subtle) }
.automation-reasoning-panel__details summary { color:var(--color-text-tertiary);font-size:var(--text-sm);transition:color var(--duration-fast) var(--ease-out);cursor:pointer;-webkit-user-select:none;user-select:none }
.automation-reasoning-panel__details summary:hover { color:var(--color-text-secondary) }
.automation-reasoning-panel__details summary:focus-visible { border-radius:var(--radius-sm);outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.automation-reasoning-panel__details[open] summary { margin-bottom:var(--spacing-3) }
.automation-reasoning-panel__no-factors { color:var(--color-text-muted);font-size:var(--text-sm);font-style:italic }
.automation-factors-list { margin:0 0 var(--spacing-3) 0;padding:0;list-style:none }
.automation-factor { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) 0;border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.automation-factor:last-child { border-bottom:none }
.automation-factor__icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6);color:var(--color-text-tertiary);font-size:var(--text-sm);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.automation-factor__label { flex:1;color:var(--color-text-secondary);font-size:var(--text-sm) }
.automation-factor__confidence { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border-radius:var(--radius-sm);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.automation-reasoning-panel__meta { display:flex;flex-wrap:wrap;gap:var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-xs) }
.automation-reasoning-panel__meta span { display:inline-flex;align-items:center;gap:var(--spacing-1) }
.automation-reasoning-panel__meta i { color:var(--color-text-tertiary);font-size:var(--text-sm) }
@media (max-width:640px) { .automation-reasoning-panel__header { flex-direction:column;align-items:flex-start;gap:var(--spacing-2) }
.automation-reasoning__undo { margin-top:var(--spacing-2);margin-left:0 }
.automation-reasoning-panel__meta { flex-direction:column;gap:var(--spacing-2) }
 }
@media (prefers-reduced-motion:reduce) { .automation-reasoning-panel__details summary { transition:none }
 }
.inbox-response-filters { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-6);padding:var(--spacing-4);background:var(--color-surface-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg) }
.inbox-response-filter { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-5);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.inbox-response-filter:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.inbox-response-filter:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.inbox-response-filter--active,.inbox-response-filter[aria-pressed=true] { color:var(--color-white);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.inbox-response-filter--active:hover,.inbox-response-filter[aria-pressed=true]:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark) }
.inbox-response-filter__count { display:inline-block;padding:var(--spacing-0-5) var(--spacing-2);color:inherit;font-size:var(--text-xs);font-weight:var(--font-bold);background:var(--alpha-white-10);border-radius:var(--radius-full) }
.inbox-response-filter--active .inbox-response-filter__count,.inbox-response-filter[aria-pressed=true] .inbox-response-filter__count { background:var(--alpha-white-20) }
.inbox-response-filter__icon { font-size:var(--text-base);color:inherit }
.inbox-response-filter--active .fas,.inbox-response-filter--active .inbox-response-filter__icon,.inbox-response-filter--active i,.inbox-response-filter[aria-pressed=true] .fas,.inbox-response-filter[aria-pressed=true] .inbox-response-filter__icon,.inbox-response-filter[aria-pressed=true] i { color:var(--color-white) }
@media (max-width:640px) { .inbox-response-filters { flex-direction:column;align-items:stretch }
.inbox-response-filter { justify-content:center;width:100% }
 }
.sg-email-card__badge--saving { position:relative;opacity:60%;cursor:wait;pointer-events:none }
.sg-email-card__badge--saving:after { content:"";position:absolute;top:50%;right:var(--spacing-1);width:var(--spacing-3);height:var(--spacing-3);margin-top:calc(var(--spacing-1-5)*-1);border:2px solid;border-top:2px solid transparent;border-radius:50%;animation:classification-spin .6s linear infinite }
.sg-email-card--classification-updated { animation:classification-flash .5s ease-out }
.email-detail--classification-updated { animation:classification-flash-detail .5s ease-out }
.sg-email-card__badge--pending { animation:classification-pulse 1.5s ease-in-out infinite }
.sg-email-card--classification-error { animation:classification-shake .5s ease-in-out }
.sg-email-card__badge--error { color:var(--color-danger);background:var(--color-danger-subtle);border-color:var(--color-danger) }
.toast-container { position:fixed;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-index-notification);display:flex;flex-direction:column;gap:var(--spacing-2);pointer-events:none }
.toast { min-width:min(var(--col-width-extra-wide),80vw);max-width:min(var(--modal-max-width-sm),90vw);padding:var(--spacing-3) var(--spacing-4);font-size:var(--text-sm);font-weight:var(--font-weight-medium);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);opacity:0;transform:translateX(100%);transition:all .3s cubic-bezier(.4,0,.2,1);pointer-events:auto }
.toast--show { opacity:100%;transform:translateX(0) }
.toast--success { color:var(--color-text-on-dark);background:var(--color-success) }
.toast--error { color:var(--color-text-on-dark);background:var(--color-danger) }
.toast--info { color:var(--color-text-on-dark);background:var(--color-info) }
.toast--warning { color:var(--color-surface);background:var(--color-warning) }
.sg-email-card--saving { cursor:wait;pointer-events:none }
.sg-email-card--saving .sg-email-card__badge { opacity:70% }
.sg-email-card__badge:focus-visible { outline:2px solid var(--color-primary);outline-offset:2px }
@media (prefers-reduced-motion:reduce) { .email-detail--classification-updated,.sg-email-card--classification-error,.sg-email-card--classification-updated,.sg-email-card__badge--pending,.toast { animation:none }
.sg-email-card__badge--saving:after { opacity:50%;animation:none }
.toast { transition:opacity .2s ease }
 }
@media (prefers-contrast:high) { .sg-email-card__badge--saving,.toast { border:2px solid }
 }
@media (prefers-color-scheme:dark) { .sg-email-card--classification-updated { animation-name:classification-flash-dark }
 }
.sg-email-card__badge--skeleton { color:transparent;background:linear-gradient(90deg,var(--color-border) 25%,var(--color-surface-elevated) 50%,var(--color-border) 75%);background-size:200% 100%;animation:classification-skeleton 1.5s ease-in-out infinite }
.sg-email-card--classification-error,.sg-email-card--classification-updated,.sg-email-card__badge--saving:after,.toast { will-change:transform }
.sg-email-card__badge--pending,.sg-email-card__badge--saving { contain:layout style }
@media (max-width:1024px) { .sg-communication-detail { max-height:none;margin-top:var(--spacing-4) }
 }
@media (max-width:768px) { .sg-communication-card { padding:var(--spacing-3) }
.sg-communication-detail { padding:var(--spacing-4) }
 }
.sg-communication-card { margin-bottom:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-base);transition:all .2s ease;cursor:pointer }
.sg-communication-card:hover { background:var(--color-surface-hover);border-color:var(--color-border-hover);box-shadow:0 4px 6px var(--shadow-md);transform:var(--transform-hover-lift-micro) }
.sg-communication-card--selected { background:var(--color-primary-subtle);border-color:var(--color-primary);box-shadow:0 0 0 var(--focus-ring-offset) var(--color-primary-subtle) }
.sg-communication-card--selected:hover { background:var(--color-primary-subtle);border-color:var(--color-primary) }
.sg-communication-card:focus-visible { outline:var(--focus-ring-offset) solid var(--color-primary);outline-offset:var(--focus-ring-offset) }
.sg-communication-card__header { display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-2);margin-bottom:var(--spacing-2) }
.sg-communication-card__subject { overflow:hidden;flex:1;margin:0;color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold);text-overflow:ellipsis;white-space:nowrap }
.sg-communication-card__status { display:flex;flex-shrink:0;gap:var(--spacing-1) }
.sg-communication-card__status-icon { font-size:var(--text-lg) }
.sg-communication-card__meta { display:flex;flex-direction:column;gap:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-communication-card__recipient { overflow:hidden;font-weight:var(--font-medium);text-overflow:ellipsis;white-space:nowrap }
.sg-communication-card__date { color:var(--color-text-tertiary);font-size:var(--text-xs) }
.sg-communication-detail { overflow-y:auto;height:fit-content;min-height:var(--spacing-32);max-height:calc(100vh - var(--spacing-24));padding:var(--spacing-6);background:var(--color-surface-elevated);border-radius:var(--radius-base) }
.sg-communication-detail__header { margin-bottom:var(--spacing-6);padding-bottom:var(--spacing-4);border-bottom:1px solid var(--color-border-subtle) }
.sg-communication-detail__title { margin-bottom:var(--spacing-3) }
.sg-communication-detail__subject { margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:1.3 }
.sg-communication-detail__meta { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-communication-detail__meta-item { display:flex;align-items:center;gap:var(--spacing-1) }
.sg-divider { color:var(--color-border-default) }
.sg-communication-detail__info { margin-bottom:var(--spacing-6) }
.sg-communication-detail__recipient,.sg-communication-detail__sender { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-base) }
.sg-communication-detail__recipient strong,.sg-communication-detail__sender strong { margin-right:var(--spacing-2);color:var(--color-text-primary) }
.sg-communication-detail__body { padding:var(--spacing-4);background:var(--color-surface-primary);border:1px solid var(--color-border-subtle);border-radius:var(--radius-base) }
.sg-communication-detail__body-heading { margin:0 0 var(--spacing-3) 0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.sg-communication-body { color:var(--color-text-primary);font-size:var(--text-base);line-height:1.6;white-space:pre-wrap;overflow-wrap:break-word }
.sg-communication-card { position:relative;background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border-color:var(--glass-border-subtle);overflow:hidden }
.sg-communication-card:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-05) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;border-radius:inherit;z-index:0 }
.sg-communication-card>* { position:relative;z-index:1 }
.sg-communication-card:hover:before { opacity:1 }
.sg-communication-card:after { content:"";position:absolute;left:0;top:0;bottom:0;width:var(--spacing-0-75);background:var(--color-border-default);transition:background var(--duration-medium) var(--ease-out);border-radius:var(--radius-base) 0 0 var(--radius-base) }
.sg-communication-card--sent:after { background:linear-gradient(180deg,var(--color-success) 0,var(--color-success-foreground) 100%) }
.sg-communication-card--draft:after { background:linear-gradient(180deg,var(--color-warning) 0,var(--color-warning-foreground) 100%) }
.sg-communication-card--received:after { background:linear-gradient(180deg,var(--color-info) 0,var(--color-info-foreground) 100%) }
.sg-communication-card:hover { background:var(--glass-bg-medium);border-color:var(--color-border-strong);box-shadow:var(--shadow-lg),var(--shadow-glow-brand);transform:translateY(-2px) }
.sg-communication-card--sent:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-success) }
.sg-communication-card--draft:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-warning) }
.sg-communication-card--selected { background:var(--glass-bg-medium);backdrop-filter:var(--backdrop-blur-strong);-webkit-backdrop-filter:var(--backdrop-blur-strong) }
.sg-communication-card { animation:communicationCardEnter .4s var(--ease-bounce) backwards }
.sg-communication-card:first-child { animation-delay:0s }
.sg-communication-card:nth-child(2) { animation-delay:40ms }
.sg-communication-card:nth-child(3) { animation-delay:80ms }
.sg-communication-card:nth-child(4) { animation-delay:.12s }
.sg-communication-card:nth-child(5) { animation-delay:.16s }
.sg-communication-card:nth-child(6) { animation-delay:.2s }
.sg-communication-card:nth-child(7) { animation-delay:.24s }
.sg-communication-card:nth-child(8) { animation-delay:.28s }
.sg-communication-card:nth-child(9) { animation-delay:.32s }
.sg-communication-card:nth-child(10) { animation-delay:.36s }
.sg-communication-detail { background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border:1px solid var(--glass-border-subtle) }
.sg-communication-detail__body { background:var(--glass-bg-darker);backdrop-filter:var(--backdrop-blur-light);-webkit-backdrop-filter:var(--backdrop-blur-light);border-color:var(--glass-border-subtle) }
@media (prefers-reduced-motion:reduce) { .sg-communication-card { animation:none }
.sg-communication-card:after,.sg-communication-card:before { transition:none }
.sg-communication-card:hover { transform:none }
 }
@media (max-width:1024px) { .sg-template-detail { max-height:none;margin-top:var(--spacing-4) }
.sg-template-card__stats { gap:var(--spacing-2) }
 }
@media (max-width:768px) { .sg-template-card { padding:var(--spacing-3) }
.sg-template-detail__name { font-size:var(--text-xl) }
.sg-template-detail__actions { flex-direction:column }
.sg-template-detail__actions button { width:100% }
 }
.sg-template-card { margin-bottom:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-base);transition:all var(--duration-fast) var(--ease-ease);cursor:pointer }
.sg-template-card:hover { background:var(--color-surface-hover);border-color:var(--color-border-hover);box-shadow:var(--shadow-md);transform:var(--transform-hover-lift-micro) }
.sg-template-card--selected { background:var(--color-primary-subtle);border-color:var(--color-primary);box-shadow:0 0 0 var(--focus-ring-offset) var(--color-primary-subtle) }
.sg-template-card:focus-visible { outline:var(--focus-ring-offset) solid var(--color-primary);outline-offset:var(--focus-ring-offset) }
.sg-template-card__header { display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-2);margin-bottom:var(--spacing-3) }
.sg-template-card__name { overflow:hidden;flex:1;margin:0;color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold);text-overflow:ellipsis;white-space:nowrap }
.sg-template-card__stats { display:flex;gap:var(--spacing-4);margin-top:var(--spacing-2) }
.sg-template-card__stat { display:flex;flex-direction:column;align-items:center;font-size:var(--text-sm) }
.sg-template-card__stat-value { color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-bold) }
.sg-template-card__stat-label { color:var(--color-text-muted);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.sg-badge { padding:var(--spacing-1) var(--spacing-2);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);border-radius:var(--radius-base) }
.sg-badge--follow-up { color:var(--color-info);background:var(--color-info-subtle);border:1px solid var(--color-info-border) }
.sg-badge--welcome { color:var(--color-success);background:var(--color-success-subtle);border:1px solid var(--color-success-border) }
.sg-badge--reminder { color:var(--color-warning);background:var(--color-warning-subtle);border:1px solid var(--color-warning-border) }
.sg-badge--unknown { color:var(--color-text-muted);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle) }
.sg-template-detail { overflow-y:auto;height:fit-content;min-height:var(--spacing-32);max-height:calc(100vh - var(--spacing-24));padding:var(--spacing-6);background:var(--color-surface-elevated);border-radius:var(--radius-base) }
.sg-template-detail__header { margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-4);border-bottom:1px solid var(--color-border-subtle) }
.sg-template-detail__title { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-2) }
.sg-template-detail__name { margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold) }
.sg-template-detail__meta { display:flex;align-items:center;gap:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-template-detail__meta-item { display:flex;align-items:center;gap:var(--spacing-1) }
.sg-divider { color:var(--color-border-subtle) }
.sg-template-detail__body,.sg-template-detail__description { margin-bottom:var(--spacing-4) }
.sg-template-detail__section-heading { margin:0 0 var(--spacing-2) 0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.sg-template-detail__description p { margin:0;color:var(--color-text-secondary);line-height:var(--leading-relaxed) }
.sg-template-body { overflow-y:auto;max-height:var(--template-body-max-height);padding:var(--spacing-4);color:var(--color-text-primary);font-family:var(--font-mono);font-size:var(--text-sm);white-space:pre-wrap;word-break:break-word;background:var(--color-surface-primary);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md) }
.sg-template-detail__actions { display:flex;flex-wrap:wrap;gap:var(--spacing-2);padding-top:var(--spacing-4);border-top:1px solid var(--color-border-subtle) }
:root { --dark-bg-primary:var(--color-surface-base);--dark-bg-secondary:var(--color-surface-primary);--dark-bg-tertiary:var(--color-surface-overlay);--dark-bg-elevated:var(--color-neutral-800);--dark-text-primary:var(--color-text-primary);--dark-text-secondary:var(--color-text-secondary);--dark-text-muted:var(--color-text-tertiary);--dark-text-disabled:var(--color-text-muted);--dark-border-primary:var(--color-border-strong);--dark-border-secondary:var(--color-neutral-800);--dark-border-subtle:var(--color-surface-overlay);--dark-accent-primary:var(--color-info);--dark-accent-secondary:var(--color-info-dark);--dark-success:var(--color-success);--dark-success-muted:var(--color-success-dark);--dark-warning:var(--color-warning);--dark-warning-muted:var(--color-warning-dark);--dark-error:var(--color-danger);--dark-error-muted:var(--color-danger-dark);--dark-info:var(--color-info-light);--dark-info-muted:var(--color-info-dark);--dark-chart-primary:var(--color-info);--dark-chart-secondary:var(--color-brand-primary-light);--dark-chart-tertiary:var(--color-success);--dark-chart-quaternary:var(--color-warning);--dark-chart-quinary:var(--color-brand-primary-light);--dark-chart-senary:var(--color-danger-light);--dark-focus:var(--color-info);--dark-hover:var(--alpha-white-10);--dark-active:var(--alpha-white-10);--dark-selected:var(--color-info-subtle);--dark-shadow-sm:0 var(--spacing-px) var(--spacing-0-75) var(--alpha-black-50);--dark-shadow-md:0 var(--spacing-1) var(--spacing-1-5) var(--alpha-black-40);--dark-shadow-lg:0 var(--spacing-2-5) var(--spacing-1-25) var(--alpha-black-30);--dark-shadow-xl:0 var(--spacing-5) var(--spacing-2-5) var(--alpha-black-30);--dark-overlay-heavy:var(--alpha-black-50);--dark-transition-fast:all 0.15s ease;--dark-transition-normal:all 0.25s ease;--dark-transition-slow:all 0.35s ease }
.monitoring-dashboard--dark,.theme-dark,[data-theme=dark] { color:var(--dark-text-primary);background-color:var(--dark-bg-primary);transition:var(--dark-transition-normal) }
.theme-dark .monitoring-dashboard__content,[data-theme=dark] .monitoring-dashboard__content { background-color:var(--dark-bg-primary) }
.theme-dark .metric-card,.theme-dark .monitoring-card,[data-theme=dark] .metric-card,[data-theme=dark] .monitoring-card { background-color:var(--dark-bg-tertiary);border-color:var(--dark-border-primary);box-shadow:var(--dark-shadow-md) }
.theme-dark .metric-card:hover,.theme-dark .monitoring-card:hover,[data-theme=dark] .metric-card:hover,[data-theme=dark] .monitoring-card:hover { background-color:var(--dark-bg-elevated);box-shadow:var(--dark-shadow-lg) }
.theme-dark .header-bar,.theme-dark .monitoring-dashboard__header,[data-theme=dark] .header-bar,[data-theme=dark] .monitoring-dashboard__header { background-color:var(--dark-bg-secondary);border-color:var(--dark-border-primary);box-shadow:var(--dark-shadow-md) }
.theme-dark .header-bar__title,[data-theme=dark] .header-bar__title { color:var(--dark-text-primary) }
.theme-dark .header-bar__subtitle,[data-theme=dark] .header-bar__subtitle { color:var(--dark-text-secondary) }
.theme-dark .monitoring-dashboard__status-bar,[data-theme=dark] .monitoring-dashboard__status-bar { background-color:var(--dark-bg-secondary);border-color:var(--dark-border-primary) }
.theme-dark .status-bar__text,[data-theme=dark] .status-bar__text { color:var(--dark-text-muted) }
.theme-dark h1,.theme-dark h2,.theme-dark h3,.theme-dark h4,.theme-dark h5,.theme-dark h6,[data-theme=dark] h1,[data-theme=dark] h2,[data-theme=dark] h3,[data-theme=dark] h4,[data-theme=dark] h5,[data-theme=dark] h6 { color:var(--dark-text-primary) }
.theme-dark div,.theme-dark p,.theme-dark span,[data-theme=dark] div,[data-theme=dark] p,[data-theme=dark] span { color:var(--dark-text-secondary) }
.theme-dark .text-muted,[data-theme=dark] .text-muted { color:var(--dark-text-muted) }
.theme-dark .btn,[data-theme=dark] .btn { transition:var(--dark-transition-fast) }
.theme-dark .btn--primary,[data-theme=dark] .btn--primary { color:var(--dark-bg-primary);background-color:var(--dark-accent-primary);border-color:var(--dark-accent-primary) }
.theme-dark .btn--primary:hover,[data-theme=dark] .btn--primary:hover { background-color:var(--dark-accent-secondary);box-shadow:var(--dark-shadow-md) }
.theme-dark .btn--secondary,[data-theme=dark] .btn--secondary { color:var(--dark-text-primary);background-color:transparent;border-color:var(--dark-border-primary) }
.theme-dark .btn--secondary:hover,[data-theme=dark] .btn--secondary:hover { background-color:var(--dark-bg-elevated);border-color:var(--dark-accent-primary) }
.theme-dark input,.theme-dark select,.theme-dark textarea,[data-theme=dark] input,[data-theme=dark] select,[data-theme=dark] textarea { color:var(--dark-text-primary);background-color:var(--dark-bg-secondary);border-color:var(--dark-border-primary) }
.theme-dark input:focus,.theme-dark select:focus,.theme-dark textarea:focus,[data-theme=dark] input:focus,[data-theme=dark] select:focus,[data-theme=dark] textarea:focus { border-color:var(--dark-focus);box-shadow:0 0 0 var(--spacing-0-75) var(--dark-selected) }
.theme-dark table,[data-theme=dark] table { background-color:var(--dark-bg-tertiary) }
.theme-dark th,[data-theme=dark] th { color:var(--dark-text-primary);background-color:var(--dark-bg-secondary);border-color:var(--dark-border-primary) }
.theme-dark td,[data-theme=dark] td { color:var(--dark-text-secondary);border-color:var(--dark-border-subtle) }
.theme-dark tr:hover,[data-theme=dark] tr:hover { background-color:var(--dark-bg-elevated) }
.theme-dark .status--success,[data-theme=dark] .status--success { color:var(--color-success-text);background-color:var(--dark-success-muted) }
.theme-dark .status--warning,[data-theme=dark] .status--warning { color:var(--color-warning-text);background-color:var(--dark-warning-muted) }
.theme-dark .status--error,[data-theme=dark] .status--error { color:var(--color-danger-text);background-color:var(--dark-error-muted) }
.theme-dark .status--info,[data-theme=dark] .status--info { color:var(--color-info-text);background-color:var(--dark-info-muted) }
.theme-dark .chart-container,[data-theme=dark] .chart-container { background-color:var(--dark-bg-tertiary);border-color:var(--dark-border-primary) }
.theme-dark .modal__content,[data-theme=dark] .modal__content { background-color:var(--dark-bg-tertiary);border-color:var(--dark-border-primary);box-shadow:var(--dark-shadow-xl) }
.theme-dark .modal__overlay,[data-theme=dark] .modal__overlay { background-color:var(--dark-overlay-heavy) }
.theme-dark .skeleton,[data-theme=dark] .skeleton { background:linear-gradient(90deg,var(--dark-bg-secondary) 25%,var(--dark-bg-elevated) 50%,var(--dark-bg-secondary) 75%) }
.theme-dark::-webkit-scrollbar-track,[data-theme=dark]::-webkit-scrollbar-track { background:var(--dark-bg-secondary) }
.theme-dark::-webkit-scrollbar-thumb,[data-theme=dark]::-webkit-scrollbar-thumb { background:var(--dark-border-primary);border-radius:var(--radius-md) }
.theme-dark::-webkit-scrollbar-thumb:hover,[data-theme=dark]::-webkit-scrollbar-thumb:hover { background:var(--dark-accent-primary) }
.theme-dark code,.theme-dark pre,[data-theme=dark] code,[data-theme=dark] pre { color:var(--dark-text-primary);background-color:var(--dark-bg-secondary);border-color:var(--dark-border-subtle) }
.theme-dark :focus-visible,[data-theme=dark] :focus-visible { outline-color:var(--dark-focus);outline-offset:var(--spacing-0-5) }
:root { --theme-bg-primary:var(--color-surface-base);--theme-bg-secondary:var(--color-surface-primary);--theme-bg-tertiary:var(--color-surface-overlay);--theme-bg-elevated:var(--color-surface-overlay);--theme-surface-primary:var(--overlay-light);--theme-surface-secondary:var(--alpha-white-5);--theme-surface-tertiary:var(--overlay-light);--theme-surface-hover:var(--alpha-white-10);--theme-accent-primary:var(--color-brand-primary);--theme-accent-secondary:var(--color-brand-primary-600);--theme-accent-tertiary:var(--color-brand-primary-400);--theme-accent-light:var(--color-brand-primary-light);--theme-accent-dark:var(--color-brand-primary-700);--theme-text-primary:var(--color-text-primary);--theme-text-secondary:var(--color-text-secondary);--theme-text-tertiary:var(--color-text-tertiary);--theme-text-disabled:var(--alpha-white-30);--theme-success:var(--color-success);--theme-success-light:var(--color-success-light);--theme-warning:var(--color-warning);--theme-warning-light:var(--color-warning-light);--theme-error:var(--color-danger);--theme-error-light:var(--color-danger-light);--theme-info:var(--color-info);--theme-info-light:var(--color-info-light);--theme-border-primary:var(--alpha-white-10);--theme-border-secondary:var(--color-border-subtle);--theme-border-accent:var(--color-brand-primary);--theme-shadow-sm:0 var(--spacing-px) var(--spacing-0-5) var(--alpha-black-30);--theme-shadow-md:0 var(--spacing-1) var(--spacing-1-5) calc(var(--spacing-px)*-1) var(--alpha-black-40),0 var(--spacing-0-5) var(--spacing-1) calc(var(--spacing-px)*-1) var(--alpha-black-30);--theme-shadow-lg:0 var(--spacing-2-5) var(--spacing-1-25) calc(var(--spacing-0-75)*-1) var(--alpha-black-50),0 var(--spacing-1) var(--spacing-1-5) calc(var(--spacing-0-5)*-1) var(--alpha-black-40);--theme-shadow-xl:0 var(--spacing-5) var(--spacing-1-25) calc(var(--spacing-1-25)*-1) var(--alpha-black-50),0 var(--spacing-2-5) var(--spacing-2-5) calc(var(--spacing-1-25)*-1) var(--alpha-black-50);--theme-shadow-2xl:0 var(--spacing-1-25) var(--spacing-50px) calc(var(--spacing-3)*-1) var(--overlay-dark);--theme-shadow-glow:0 0 var(--spacing-5) var(--color-brand-primary-alpha-30);--glass-bg:var(--alpha-white-5);--glass-border:var(--alpha-var(--color-neutral-0)-10);--glass-shadow:0 var(--spacing-2) var(--spacing-8) var(--alpha-black-30);--glass-blur:blur(var(--spacing-10)) }
.glass-card { background:var(--glass-bg);border:var(--spacing-px) solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:var(--glass-shadow);transition:all .3s ease;backdrop-filter:var(--glass-blur) }
.glass-card:hover { background:var(--theme-surface-hover);box-shadow:var(--theme-shadow-lg),var(--theme-shadow-glow);transform:translateY(-2px) }
.theme-glassmorphic,[data-theme=glassmorphic] { color:var(--theme-text-primary);background:var(--theme-bg-primary) }
.theme-glassmorphic .surface-primary,[data-theme=glassmorphic] .surface-primary { background:var(--theme-surface-primary);border:var(--spacing-px) solid var(--theme-border-primary);backdrop-filter:var(--glass-blur) }
.theme-glassmorphic .surface-secondary,[data-theme=glassmorphic] .surface-secondary { background:var(--theme-surface-secondary);border:var(--spacing-px) solid var(--theme-border-secondary);backdrop-filter:var(--glass-blur) }
.neon-glow { box-shadow:0 0 var(--spacing-2) var(--theme-accent-primary),0 0 var(--spacing-5) var(--theme-accent-primary),0 0 var(--spacing-10) var(--theme-accent-primary),inset 0 0 var(--spacing-5) var(--theme-accent-primary);animation:neon-pulse 2s infinite }
.gradient-text { font-weight:var(--font-weight-bold);background:linear-gradient(135deg,var(--theme-accent-primary) 0,var(--theme-accent-light) 100%);background-clip:text;-webkit-text-fill-color:transparent }
.animated-gradient { background:linear-gradient(-45deg,var(--theme-accent-primary),var(--theme-accent-secondary),var(--theme-accent-tertiary),var(--theme-accent-light));background-size:400% 400%;animation:gradient-shift 15s ease infinite }
.btn-theme-primary { position:relative;overflow:hidden;padding:var(--spacing-3) var(--spacing-6);color:var(--color-neutral-0);font-weight:var(--font-weight-semibold);background:linear-gradient(135deg,var(--theme-accent-primary) 0,var(--theme-accent-secondary) 100%);border:none;border-radius:var(--radius-lg);box-shadow:var(--theme-shadow-md);transition:all .3s ease }
.btn-theme-primary:before { content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,var(--alpha-var(--color-neutral-0)-30),transparent);transition:left .5s ease }
.btn-theme-primary:hover:before { left:100% }
.btn-theme-primary:hover { box-shadow:var(--theme-shadow-lg),var(--theme-shadow-glow);transform:translateY(-2px) }
.theme-card { padding:var(--spacing-6);background:var(--theme-surface-primary);border:var(--spacing-px) solid var(--theme-border-primary);border-radius:var(--radius-xl);box-shadow:var(--theme-shadow-md);transition:all .3s ease;backdrop-filter:var(--glass-blur) }
.theme-card:hover { background:var(--theme-surface-hover);border-color:var(--theme-accent-primary);box-shadow:var(--theme-shadow-lg),var(--theme-shadow-glow);transform:translateY(-4px) }
.theme-status { display:inline-flex;align-items:center;padding:var(--spacing-2) var(--spacing-4);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);border-radius:var(--radius-full);backdrop-filter:var(--glass-blur) }
.theme-status--success { color:var(--theme-success-light);background:var(--alpha-success-20);border:var(--spacing-px) solid var(--theme-success) }
.theme-status--warning { color:var(--theme-warning-light);background:var(--alpha-warning-20);border:var(--spacing-px) solid var(--theme-warning) }
.theme-status--error { color:var(--theme-error-light);background:var(--alpha-danger-20);border:var(--spacing-px) solid var(--theme-error) }
.theme-status--info { color:var(--theme-info-light);background:var(--alpha-info-20);border:var(--spacing-px) solid var(--theme-info) }
.theme-skeleton { background:linear-gradient(90deg,var(--theme-surface-primary) 25%,var(--theme-surface-secondary) 50%,var(--theme-surface-primary) 75%);background-size:200% 100%;border-radius:var(--radius-md);animation:skeleton-shimmer 2s infinite }
.theme-glassmorphic::-webkit-scrollbar,[data-theme=glassmorphic]::-webkit-scrollbar { width:var(--spacing-3);height:var(--spacing-3) }
.theme-glassmorphic::-webkit-scrollbar-track,[data-theme=glassmorphic]::-webkit-scrollbar-track { background:var(--theme-bg-secondary);border-radius:var(--radius-full) }
.theme-glassmorphic::-webkit-scrollbar-thumb,[data-theme=glassmorphic]::-webkit-scrollbar-thumb { background:var(--theme-accent-primary);border:var(--spacing-px) solid var(--theme-bg-secondary);border-radius:var(--radius-full) }
.theme-glassmorphic::-webkit-scrollbar-thumb:hover,[data-theme=glassmorphic]::-webkit-scrollbar-thumb:hover { background:var(--theme-accent-light) }
@media (prefers-reduced-motion:reduce) { .animated-gradient,.btn-theme-primary:before,.neon-glow,.theme-skeleton { animation:none }
.btn-theme-primary,.glass-card,.theme-card { transition:none }
 }
@media (prefers-color-scheme:light) { :root { --glass-bg:var(--alpha-white-80);--glass-border:var(--alpha-var(--color-neutral-900)-10);--glass-shadow:0 var(--spacing-2) var(--spacing-8) var(--alpha-black-10) }
 }
.screen-reader-toggle { position:fixed;top:10px;right:10px;z-index:var(--z-index-modal);padding:var(--spacing-sm);color:var(--color-on-primary);font-size:var(--font-size-sm);background-color:var(--color-primary);border:none;border-radius:var(--border-radius-sm);cursor:pointer }
.screen-reader-toggle:focus,.screen-reader-toggle:hover { background-color:var(--color-primary-hover);outline:2px solid var(--color-focus);outline-offset:2px }
.focus-indicator { position:absolute;top:-10px;right:-10px;z-index:var(--z-index-modal);display:flex;justify-content:center;align-items:center;width:20px;height:20px;color:var(--color-on-danger);font-size:12px;font-weight:700;background:var(--color-danger);border-radius:50%;pointer-events:none }
.skip-link { position:absolute;top:-100px;left:50%;z-index:var(--z-index-skip-link,9999);display:inline-block;padding:var(--spacing-3) var(--spacing-6);color:var(--color-neutral-0);font-size:var(--text-base);font-weight:var(--font-weight-semibold);line-height:1.5;letter-spacing:.02em;text-align:center;text-decoration:none;white-space:nowrap;background-color:var(--color-neutral-950);border:2px solid transparent;border-radius:var(--radius-base);transform:translateX(-50%);transition:top var(--transition-base) var(--easing-decelerate),transform var(--transition-base) var(--easing-decelerate),box-shadow var(--transition-base) var(--easing-standard) }
.skip-link:focus { top:var(--spacing-4);background-color:var(--color-primary-700);border-color:var(--color-primary);outline:3px solid var(--color-primary);outline-offset:2px;box-shadow:var(--shadow-2xl),0 0 0 4px var(--color-primary-100);opacity:100% }
.skip-link:hover { color:var(--color-neutral-0);text-decoration:underline;background-color:var(--color-primary-800);text-underline-offset:2px }
.skip-link:active { background-color:var(--color-primary-900);transform:translateX(-50%) scale(.98) }
.skip-links { position:absolute;top:0;right:0;left:0;z-index:var(--z-index-skip-link,9999);display:flex;justify-content:center;gap:var(--spacing-2);transform:translateY(-100%);transition:transform var(--transition-base) var(--easing-decelerate) }
.skip-links:focus-within { transform:translateY(0) }
.skip-links .skip-link { position:static;top:auto;margin-top:var(--spacing-2);transform:none }
@media (prefers-contrast:more) { .skip-link:focus { font-weight:var(--font-weight-bold);border-width:3px;outline-width:4px }
 }
@media (prefers-reduced-motion:reduce) { .skip-link { transition-duration:.01ms }
 }
@media print { .skip-link,.skip-links { display:none }
 }
@media (prefers-color-scheme:dark) { .skip-link:focus { color:var(--color-neutral-950);background-color:var(--color-primary-400) }
 }
.table { overflow:hidden;width:100%;background:var(--color-surface-primary);border-radius:var(--radius-lg);border-collapse:collapse }
.table thead { background:var(--color-surface-secondary);border-bottom:2px solid var(--color-border-primary) }
.table th { padding:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);letter-spacing:.05em;text-align:left;text-transform:uppercase }
.table td { padding:var(--spacing-3);color:var(--color-text-secondary);border-bottom:1px solid var(--color-border-secondary) }
.table--compact td,.table--compact th { padding:var(--spacing-2);font-size:var(--text-sm) }
.table tbody tr:hover { background:var(--color-surface-secondary) }
.table tr:last-child td { border-bottom:none }
.table--sortable th { position:relative;padding-right:var(--spacing-6);transition:background-color var(--duration-fast);cursor:pointer;-webkit-user-select:none;user-select:none }
.table--sortable th:hover { background:var(--color-surface-hover) }
.table--sortable th:after { content:"⇅";position:absolute;right:var(--spacing-2);opacity:30%;transition:opacity var(--duration-fast) }
.table--sortable th.sorted-asc:after { color:var(--color-primary);opacity:100%;content:"↑" }
.table--sortable th.sorted-desc:after { color:var(--color-primary);opacity:100%;content:"↓" }
.table-responsive { margin:var(--spacing-4) 0;border:1px solid var(--color-border-secondary);border-radius:var(--radius-lg) }
.table-responsive .table { border:none;border-radius:0 }
.table--striped tbody tr:nth-child(2n) { background:var(--color-surface-subtle) }
.table--striped tr:nth-child(2n):hover { background:var(--color-surface-hover) }
.table .editable { padding:var(--spacing-1) var(--spacing-2);border:1px dashed transparent;border-radius:var(--radius-sm);transition:all var(--duration-fast);cursor:text }
.table .editable:hover { background:var(--color-surface-hover);border-color:var(--color-border-primary) }
.table .editable:focus { background:var(--color-surface-primary);border-color:var(--color-primary);outline:2px solid var(--color-primary);outline-offset:2px }
.table .status-indicator { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-weight-medium);letter-spacing:.05em;text-transform:uppercase;border-radius:var(--radius-full) }
.table .status-indicator--success { color:var(--color-success);background:var(--color-success-subtle) }
.table .status-indicator--warning { color:var(--color-warning);background:var(--color-warning-subtle) }
.table .status-indicator--danger { color:var(--color-danger);background:var(--color-danger-subtle) }
.table .status-indicator--neutral { color:var(--color-neutral-600);background:var(--color-neutral-subtle) }
.table--loading { opacity:60%;pointer-events:none }
.table--loading tbody:after { position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--color-surface-hover),transparent);animation:table-loading 1.5s ease-in-out infinite;content:"" }
.table--empty tbody:after { display:table-cell;padding:var(--spacing-8);color:var(--color-text-tertiary);font-style:italic;text-align:center;content:attr(data-empty-message) }
.table-actions { display:flex;justify-content:flex-end;gap:var(--spacing-2);margin:var(--spacing-4) 0 }
.table-actions .btn { font-size:var(--text-sm) }
@container (max-width: 768px) { .table-responsive { font-size:var(--text-sm) }
.table td,.table th { padding:var(--spacing-2) }
.table--sortable th { padding-right:var(--spacing-4) }
.table--sortable th:after { right:var(--spacing-1) }
 }
[class*=fa-]:before { display:inline-block;width:var(--size-icon-inline);margin-right:var(--spacing-2);font-size:1em;font-style:normal;text-align:center;color:var(--color-brand-primary) }
[class*=fa-] { color:var(--color-brand-primary) }
.inbox-response-filter--active [class*=fa-],.inbox-response-filter--active i.fas,.inbox-response-filter[aria-pressed=true] [class*=fa-],.inbox-response-filter[aria-pressed=true] i.fas,.sg-email-card__action-button--ghost.sg-email-card__action-button i,.sg-email-card__action-button--ghost [class*=fa-],.sg-email-card__action-button--ghost i.fas,.sg-email-card__action-button--primary.sg-email-card__action-button i,.sg-email-card__action-button--primary [class*=fa-],.sg-email-card__action-button--primary i.fas { color:var(--color-text-on-dark) }
.sg-btn [class*=fa-],.sg-btn [class*=fa-]:before,.sg-btn i.fab,.sg-btn i.far,.sg-btn i.fas { color:inherit }
.inbox-response-filter--active [class*=fa-]:before,.inbox-response-filter[aria-pressed=true] [class*=fa-]:before,.sg-email-card__action-button--ghost [class*=fa-]:before,.sg-email-card__action-button--primary [class*=fa-]:before,button.inbox-response-filter--active>i,button.inbox-response-filter[aria-pressed=true]>i,button.sg-email-card__action-button--ghost>i,button.sg-email-card__action-button--primary>i { color:var(--color-text-on-dark) }
.fa-chart-line:before { content:"📊" }
.fa-robot:before { content:"🤖" }
.fa-clock:before { content:"🕐" }
.fa-tasks:before { content:"📋" }
.fa-search:before { content:"🔍" }
.fa-envelope:before { content:"✉️" }
.fa-sync:before { content:"🔄" }
.fa-home:before { content:"🏠" }
.fa-user:before { content:"👤" }
.fa-users:before { content:"👥" }
.fa-cog:before,.fa-settings:before { content:"⚙️" }
.fa-file:before { content:"📄" }
.fa-folder:before { content:"📁" }
.fa-download:before { content:"⬇️" }
.fa-upload:before { content:"⬆️" }
.fa-edit:before { content:"✏️" }
.fa-trash:before { content:"🗑️" }
.fa-check:before { content:"✅" }
.fa-times:before { content:"❌" }
.fa-warning:before { content:"⚠️";color:var(--color-warning) }
.fa-info:before { content:"ℹ️" }
.fa-question:before { content:"❓" }
.fa-star:before { content:"⭐" }
.fa-heart:before { content:"❤️" }
.fa-thumbs-up:before { content:"👍" }
.fa-thumbs-down:before { content:"👎" }
.fa-calendar:before { content:"📅" }
.fa-bell:before { content:"🔔" }
.fa-database:before { content:"🗄️" }
.fa-server:before { content:"💾" }
.fa-network-wired:before { content:"🌐" }
.fa-lock:before { content:"🔒" }
.fa-unlock:before { content:"🔓" }
.fa-key:before { content:"🔑" }
.fa-shield:before { content:"🛡️" }
.fa-bug:before { content:"🐛" }
.fa-code:before { content:"💻" }
.fa-terminal:before { content:"⌨️" }
.fa-check-circle:before { content:"✅" }
.fa-exclamation-circle:before { content:"⚠️" }
.fa-times-circle:before { content:"❌" }
.fa-info-circle:before { content:"ℹ️" }
.fa-question-circle:before { content:"❓" }
.fa-arrow-up:before { content:"↑" }
.fa-arrow-down:before { content:"↓" }
.fa-arrow-left:before { content:"←" }
.fa-arrow-right:before { content:"→" }
.fa-chevron-up:before { content:"⌃" }
.fa-chevron-down:before { content:"⌄" }
.fa-chevron-left:before { content:"‹" }
.fa-chevron-right:before { content:"›" }
.fa-lg:before { font-size:1.2em }
.fa-xl:before { font-size:1.5em }
.fa-2x:before { font-size:2em }
.fa-primary:before { color:var(--color-primary) }
.fa-success:before { color:var(--color-success) }
.fa-danger:before { color:var(--color-danger) }
.fa-muted:before { color:var(--color-text-tertiary) }
.notification { position:fixed;top:var(--spacing-5);right:var(--spacing-5);z-index:1000;padding:var(--spacing-3) var(--spacing-5);color:var(--color-on-primary);font-size:var(--text-sm);font-weight:var(--font-weight-medium);overflow-wrap:break-word;border-radius:var(--radius-lg);animation:slide-in .3s var(--ease-decelerate);backdrop-filter:blur(8px) }
.notification--info { background-color:var(--color-primary);border:1px solid var(--color-primary-hover) }
.notification--success { background-color:var(--color-success);border:1px solid var(--color-success-hover) }
.notification--warning { color:var(--color-text-primary);background-color:var(--color-warning);border:1px solid var(--color-warning-hover) }
.notification--error { background-color:var(--color-danger);border:1px solid var(--color-danger-hover) }
.notification--with-icon { display:flex;align-items:center;gap:var(--spacing-2) }
.notification--with-icon:before { flex-shrink:0;font-size:var(--text-lg) }
.notification--info.notification--with-icon:before { content:"ℹ️" }
.notification--success.notification--with-icon:before { content:"✅" }
.notification--warning.notification--with-icon:before { content:"⚠️" }
.notification--error.notification--with-icon:before { content:"❌" }
.notification--slide-out { animation:slide-out .3s var(--ease-accelerate) }
.notification-stack { position:fixed;top:var(--spacing-5);right:var(--spacing-5);z-index:1000;display:flex;flex-direction:column;gap:var(--spacing-2);max-width:var(--spacing-100) }
.notification-stack .notification { position:relative;top:auto;right:auto;margin:0 }
.notification--dismissible { position:relative;padding-right:var(--spacing-12) }
.notification__close { position:absolute;top:var(--spacing-2);right:var(--spacing-2);padding:var(--spacing-1);color:currentcolor;background:none;border:none;border-radius:var(--radius-sm);opacity:70%;transition:opacity var(--duration-fast);cursor:pointer }
.notification__close:hover { opacity:100% }
.notification__close:before { content:"×";font-size:var(--text-xl);line-height:1 }
.notification--fallback { top:auto;bottom:var(--spacing-5) }
.notification--with-actions { padding-bottom:var(--spacing-4) }
.notification__actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-3) }
.notification__action { padding:var(--spacing-1) var(--spacing-3);color:currentcolor;font-size:var(--text-xs);font-weight:var(--font-weight-medium);background:transparent;border:1px solid;border-radius:var(--radius-md);transition:all var(--duration-fast);cursor:pointer }
.notification__action--primary,.notification__action:hover { color:var(--color-surface-primary);background:currentcolor }
.notification__action--primary:hover { opacity:80% }
@container (max-width: 768px) { .notification-stack,.notification { top:var(--spacing-4);right:var(--spacing-4);left:var(--spacing-4);max-width:none }
.notification { padding:var(--spacing-2) var(--spacing-4);font-size:var(--text-xs) }
 }
@media (prefers-reduced-motion:reduce) { .notification--slide-out,.notification { animation:none }
.notification__close { transition:none }
 }
@media (max-width:768px) { .dashboard-grid { grid-template-columns:1fr }
.main-content { padding:var(--space-4) }
.modal { margin:var(--space-4) }
 }
.container { width:100%;max-width:var(--container-7xl);margin:var(--spacing-0) auto;padding:var(--spacing-0) var(--space-6) }
.main-wrapper { display:flex;flex-direction:column;min-height:100vh }
.main-content { flex:1;width:100%;max-width:var(--container-7xl);margin:var(--spacing-0) auto;padding:var(--space-6) }
.card { padding:var(--space-6);background:var(--color-bg-primary);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-300) var(--ease-in-out) }
.card:hover { box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--color-border-strong);background:linear-gradient(135deg,var(--color-bg-primary) 0,var(--color-surface-elevated) 100%) }
.card-header { margin-bottom:var(--space-4);padding-bottom:var(--space-4);border-bottom:var(--border-width-1) solid var(--color-neutral-200) }
.card-title { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.card-body { color:var(--color-text-secondary) }
.card-footer { margin-top:var(--space-4);padding-top:var(--space-4);border-top:var(--border-width-1) solid var(--color-neutral-200) }
.card-footer__meta { margin-bottom:var(--space-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.card-footer__actions { display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:var(--space-2) }
.metric-card { position:relative;display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6);background:var(--color-bg-primary);transition:all var(--duration-200) var(--ease-in-out) }
.metric-card:hover { transform:translateY(-2px) }
.metric-card__label { margin:var(--spacing-0);color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.metric-card__value { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-4xl);font-weight:var(--font-bold);line-height:var(--leading-none) }
.metric-card__trend { display:flex;align-items:center;gap:var(--space-1);color:var(--color-text-tertiary);font-size:var(--text-sm) }
.metric-card__trend--positive { color:var(--color-success) }
.metric-card__trend--negative { color:var(--color-danger) }
.metric-card__icon { position:absolute;top:var(--space-4);right:var(--space-4);display:flex;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);color:var(--color-primary);background:var(--color-neutral-100);border-radius:var(--radius-lg) }
.btn { position:relative;display:inline-flex;overflow:hidden;justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);line-height:var(--leading-normal);text-decoration:none;white-space:nowrap;border-radius:var(--radius-md);transition:all var(--duration-200) var(--ease-in-out) }
.btn:focus { outline:none;box-shadow:0 0 0 3px var(--color-brand-primary-subtle) }
.btn:disabled { opacity:50%;transform:none;cursor:not-allowed }
.btn--primary { color:var(--color-text-inverse);background:linear-gradient(135deg,var(--color-primary),var(--color-primary-dark)) }
.btn--primary:hover:not(:disabled) { background:linear-gradient(135deg,var(--color-primary-dark),var(--color-primary));box-shadow:var(--shadow-md);transform:translateY(-1px) }
.btn--secondary { color:var(--color-gray-700);background:var(--color-white);border:var(--border-width-1) solid var(--color-gray-300) }
.btn--secondary:hover:not(:disabled) { background:var(--color-gray-50);border-color:var(--color-gray-400) }
.btn--success { color:var(--color-text-inverse);background:linear-gradient(135deg,var(--color-success),var(--color-success-dark)) }
.btn--success:hover:not(:disabled) { background:linear-gradient(135deg,var(--color-success-dark),var(--color-success));box-shadow:var(--shadow-md);transform:translateY(-1px) }
.btn--danger { color:var(--color-text-inverse);background:linear-gradient(135deg,var(--color-danger),var(--color-danger-dark)) }
.btn--danger:hover:not(:disabled) { background:linear-gradient(135deg,var(--color-danger-dark),var(--color-danger));box-shadow:var(--shadow-md);transform:translateY(-1px) }
.btn--outline { color:var(--color-primary);background:transparent;border:var(--border-width-2) solid var(--color-primary) }
.btn--outline:hover:not(:disabled) { color:var(--color-text-inverse);background:var(--color-primary) }
.btn--sm { padding:var(--space-1) var(--space-3);font-size:var(--text-xs) }
.btn--lg { padding:var(--space-3) var(--space-6);font-size:var(--text-base) }
.btn-group { display:inline-flex;gap:var(--space-2) }
.dashboard-grid { display:grid;grid-gap:var(--space-6);gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(280px,1fr)) }
.dashboard-grid--2 { grid-template-columns:repeat(auto-fit,minmax(400px,1fr)) }
.dashboard-grid--3 { grid-template-columns:repeat(auto-fit,minmax(320px,1fr)) }
.dashboard-grid--4 { grid-template-columns:repeat(auto-fit,minmax(250px,1fr)) }
.form-hint { margin-top:var(--space-1);color:var(--color-text-tertiary);font-size:var(--text-xs) }
.form-error { margin-top:var(--space-1);color:var(--color-danger);font-size:var(--text-xs) }
.input-group { display:flex;align-items:stretch }
.input-group__addon { display:flex;align-items:center;padding:var(--spacing-0) var(--space-3);color:var(--color-text-tertiary);font-size:var(--text-sm);background:var(--color-neutral-100);border:var(--border-width-1) solid var(--color-neutral-300) }
.input-group__addon--prefix { border-right:none;border-radius:var(--radius-lg) 0 0 var(--radius-lg) }
.input-group__addon--suffix { border-left:none;border-radius:0 var(--radius-lg) var(--radius-lg) 0 }
.input-group input { flex:1;border-radius:0 }
.input-group input:first-child { border-radius:var(--radius-lg) 0 0 var(--radius-lg) }
.input-group input:last-child { border-radius:0 var(--radius-lg) var(--radius-lg) 0 }
.alert { position:relative;display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-4);padding-left:var(--space-6);border-radius:var(--radius-lg) }
.alert:before { position:absolute;top:0;left:0;width:var(--border-width-4);height:100%;background:currentcolor;border-radius:var(--radius-lg) 0 0 var(--radius-lg);content:"" }
.alert__icon { flex-shrink:0;width:var(--spacing-5);height:var(--spacing-5) }
.alert__content { flex:1 }
.alert__title { margin-bottom:var(--space-1);font-weight:var(--font-semibold) }
.alert__message { font-size:var(--text-sm) }
.alert--info { color:var(--color-info-text);background:linear-gradient(135deg,var(--color-info-bg) 0,var(--color-info-subtle) 100%) }
.alert--success { color:var(--color-success-text);background:linear-gradient(135deg,var(--color-success-bg) 0,var(--color-success-subtle) 100%) }
.alert--warning { color:var(--color-warning-text);background:linear-gradient(135deg,var(--color-warning-bg) 0,var(--color-warning-subtle) 100%) }
.alert--danger { color:var(--color-danger-text);background:linear-gradient(135deg,var(--color-danger-bg) 0,var(--color-danger-subtle) 100%) }
.badge { display:inline-flex;align-items:center;padding:var(--space-1) var(--space-2);font-size:var(--text-xs);font-weight:var(--font-medium);line-height:1;border-radius:var(--radius-full) }
.badge--primary { color:var(--color-text-inverse);background:var(--color-primary) }
.badge--success { color:var(--color-text-inverse);background:var(--color-success) }
.badge--warning { color:var(--color-text-inverse);background:var(--color-warning) }
.badge--danger { color:var(--color-text-inverse);background:var(--color-danger) }
.badge--info { color:var(--color-text-inverse);background:var(--color-info) }
.badge--neutral { color:var(--color-text-secondary);background:var(--color-neutral-200) }
.badge--notification { animation:badgePulse var(--duration-pulse) var(--ease-in-out) infinite }
.table-container { overflow-x:auto;margin-bottom:var(--space-4) }
.table { overflow:hidden;width:100%;background:var(--color-bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm) }
.table th { padding:var(--space-3) var(--space-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-align:left;text-transform:uppercase;background:var(--color-neutral-50) }
.table td { padding:var(--space-3) var(--space-4);border-top:var(--border-width-1) solid var(--color-neutral-100) }
.table tbody tr { transition:all var(--duration-200) var(--ease-in-out) }
.table tbody tr:hover { transform:translateX(2px);box-shadow:var(--shadow-sm);background:var(--color-neutral-100) }
.skeleton { background:linear-gradient(90deg,var(--color-neutral-200) 25%,var(--color-neutral-100) 50%,var(--color-neutral-200) 75%);background-size:200% 100%;border-radius:var(--radius-md);animation:skeleton-loading 1.5s ease-in-out infinite }
.skeleton-text { height:var(--space-4);margin-bottom:var(--space-2) }
.skeleton-title { width:60%;height:var(--space-6);margin-bottom:var(--space-4) }
.skeleton-button { width:var(--space-24);height:var(--space-10) }
.modal-backdrop { inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);padding:var(--space-4);background:var(--color-neutral-950-alpha-50) }
.modal { display:flex;overflow:hidden;flex-direction:column;width:100%;max-width:var(--modal-max-width-md);max-height:90vh;background:var(--color-bg-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);animation:modalEnter var(--duration-slow) var(--ease-out) }
.modal__header { display:flex;justify-content:space-between;align-items:center;padding:var(--space-6);border-bottom:var(--border-width-1) solid var(--color-neutral-200) }
.modal__title { margin:var(--spacing-0);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.modal__close { padding:var(--space-2);color:var(--color-text-tertiary);background:transparent;border:none;border-radius:var(--radius-md);cursor:pointer }
.modal__close:hover { color:var(--color-text-primary);background:var(--color-neutral-100) }
.modal__body { overflow-y:auto;flex:1;padding:var(--space-6) }
.modal__footer { display:flex;justify-content:flex-end;gap:var(--space-3);padding:var(--space-6);border-top:var(--border-width-1) solid var(--color-neutral-200) }
.divider { height:var(--border-width-1);margin:var(--space-6) 0;background:var(--color-neutral-200) }
.spacer { flex:1 }
.progress { overflow:hidden;height:var(--space-2);margin-bottom:var(--space-2);background:var(--color-neutral-200);border-radius:var(--radius-full) }
.progress__bar { position:relative;overflow:hidden;height:100%;background:var(--color-primary);border-radius:var(--radius-full);transition:width var(--duration-300) var(--ease-in-out) }
.progress__bar--animated { background:linear-gradient(45deg,var(--color-primary) 25%,var(--color-primary-dark) 25%,var(--color-primary-dark) 50%,var(--color-primary) 50%,var(--color-primary) 75%,var(--color-primary-dark) 75%,var(--color-primary-dark));background-size:var(--spacing-10) var(--spacing-10);animation:progressStripes var(--duration-slowest,1s) linear infinite }
.tooltip { position:relative;display:inline-block }
.tooltip__content { position:absolute;bottom:100%;left:50%;z-index:var(--z-tooltip);visibility:hidden;margin-bottom:var(--space-2);padding:var(--space-2) var(--space-3);color:var(--color-text-inverse);font-size:var(--text-xs);white-space:nowrap;background:var(--color-neutral-900);border-radius:var(--radius-md);opacity:0;transform:translateX(-50%);transition:all var(--duration-200) var(--ease-in-out) }
.tooltip:hover .tooltip__content { visibility:visible;opacity:100% }
@media (prefers-reduced-motion:reduce) { .badge--notification,.modal,.progress__bar--animated,.table tbody tr { animation:none;transition-duration:.01ms }
.card:hover,.table tbody tr:hover { transform:none }
 }
.c-export-modal-overlay { position:fixed;inset:0;z-index:var(--z-index-overlay);display:flex;justify-content:center;align-items:center;padding:var(--spacing-5);background:var(--overlay-bg);animation:export-modal-overlay-enter .2s ease;backdrop-filter:blur(var(--spacing-1)) }
.c-export-modal { display:flex;flex-direction:column;width:100%;max-width:var(--spacing-150);max-height:90vh;background:var(--monitoring-card-bg,var(--var(--color-neutral-0)));border-radius:var(--spacing-3);box-shadow:0 var(--spacing-5) var(--spacing-10) var(--color-neutral-950-alpha-15);animation:export-modal-enter .3s ease }
.export-modal__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-6);padding:var(--spacing-6) var(--spacing-6) 0;border-bottom:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default)) }
.export-modal__title { margin:0;color:var(--monitoring-text,var(--color-text-primary));font-size:var(--spacing-6);font-weight:600 }
.export-modal__close { padding:var(--spacing-2);color:var(--monitoring-text-secondary,var(--color-text-secondary));font-size:var(--spacing-6);line-height:1;background:none;border:none;border-radius:var(--spacing-1-5);transition:all .2s ease;cursor:pointer }
.export-modal__close:hover { color:var(--monitoring-text,var(--color-text-primary));background:var(--monitoring-border,var(--color-border-default)) }
.export-modal__close:focus { outline:var(--spacing-0-5) solid var(--monitoring-primary,var(--color-brand-primary));outline-offset:var(--spacing-0-5) }
.export-modal__close:disabled { opacity:50%;cursor:not-allowed }
.export-modal__content { overflow-y:auto;flex:1;margin-bottom:var(--spacing-6);padding:0 var(--spacing-6) }
.export-modal__error { margin-bottom:var(--spacing-5);padding:var(--spacing-3) var(--spacing-1-5);color:var(--color-danger-text);font-size:var(--text-sm);background:var(--color-danger-subtle);border:var(--spacing-px) solid var(--color-danger-border);border-radius:var(--spacing-1-5) }
.export-modal__error-text { display:block;margin-top:var(--spacing-1);color:var(--color-danger-text);font-size:var(--spacing-3) }
.export-modal__section { margin-bottom:var(--spacing-6) }
.export-modal__section--collapsible { margin-bottom:var(--spacing-1-5) }
.export-modal__label { display:block;margin-bottom:var(--spacing-3);color:var(--monitoring-text,var(--color-text-primary));font-size:var(--text-sm);font-weight:600 }
.export-modal__radio-group { display:flex;flex-direction:column;gap:var(--spacing-3) }
.export-modal__radio { display:flex;align-items:flex-start;gap:var(--spacing-3);padding:var(--spacing-1-5);border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-2);transition:all .2s ease;cursor:pointer }
.export-modal__radio:hover { background:var(--color-brand-primary-subtle);border-color:var(--monitoring-primary,var(--color-brand-primary)) }
.export-modal__radio input[type=radio] { flex-shrink:0;width:var(--spacing-4-5);height:var(--spacing-4-5);margin:0 }
.export-modal__radio-label { margin-bottom:var(--spacing-1);color:var(--monitoring-text,var(--color-text-primary));font-weight:600 }
.export-modal__radio-description { color:var(--monitoring-text-secondary,var(--color-text-secondary));font-size:var(--spacing-3) }
.export-modal__checkbox-group { display:flex;flex-direction:column;gap:var(--spacing-2) }
.export-modal__checkbox { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) 0;cursor:pointer }
.export-modal__checkbox--small { padding:var(--spacing-1) 0;font-size:var(--text-sm) }
.export-modal__checkbox input[type=checkbox] { flex-shrink:0;width:var(--spacing-1-5);height:var(--spacing-1-5);margin:0 }
.export-modal__checkbox-label { flex:1;color:var(--monitoring-text,var(--color-text-primary)) }
.export-modal__metric-description { margin-left:auto;color:var(--monitoring-text-secondary,var(--color-text-secondary));font-size:var(--spacing-3) }
.export-modal__input,.export-modal__select { width:100%;padding:var(--spacing-3);color:var(--monitoring-text,var(--color-text-primary));font-size:var(--text-sm);background:var(--monitoring-card-bg,var(--var(--color-neutral-0)));border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-1-5);transition:border-color .2s ease }
.export-modal__input:focus,.export-modal__select:focus { border-color:var(--monitoring-primary,var(--color-brand-primary));outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.export-modal__input--error { border-color:var(--red-600) }
.export-modal__input--error:focus { border-color:var(--red-600);box-shadow:0 0 0 var(--spacing-0-75) var(--color-danger-subtle) }
.export-modal__date-range { display:grid;grid-gap:var(--spacing-1-5);gap:var(--spacing-1-5);grid-template-columns:1fr 1fr;margin-top:var(--spacing-3) }
.export-modal__field { display:flex;flex-direction:column }
.export-modal__field-label { margin-bottom:var(--spacing-1-5);color:var(--monitoring-text-secondary,var(--color-text-secondary));font-size:var(--spacing-3);font-weight:500 }
.export-modal__details { padding:0;border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-1-5) }
.export-modal__summary { padding:var(--spacing-3) var(--spacing-1-5);color:var(--monitoring-text,var(--color-text-primary));font-weight:500;background:var(--monitoring-bg,var(--color-surface-secondary));border-radius:var(--spacing-1-5) var(--spacing-1-5) 0 0;cursor:pointer;-webkit-user-select:none;user-select:none }
.export-modal__summary:hover { background:var(--monitoring-border,var(--color-border-default)) }
.export-modal__advanced { display:flex;flex-direction:column;gap:var(--spacing-1-5);padding:var(--spacing-1-5) }
.export-modal__metric-list { overflow-y:auto;max-height:var(--col-width-medium);padding:var(--spacing-2);border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-1-5) }
.export-modal__estimate { margin-bottom:var(--spacing-1-5);padding:var(--spacing-3) var(--spacing-1-5);background:var(--color-brand-primary-subtle);border:var(--spacing-px) solid var(--color-info-border);border-radius:var(--spacing-1-5) }
.export-modal__estimate-content { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-sm) }
.export-modal__estimate-label { color:var(--monitoring-text-secondary,var(--color-text-secondary)) }
.export-modal__estimate-value { color:var(--monitoring-text,var(--color-text-primary));font-weight:600 }
.export-modal__estimate-size { color:var(--monitoring-text-secondary,var(--color-text-secondary)) }
.export-modal__warning { display:flex;align-items:center;gap:var(--spacing-1-5);margin-top:var(--spacing-2);color:var(--monitoring-warning,var(--color-warning-text));font-size:var(--spacing-3) }
.export-modal__progress { margin-bottom:var(--spacing-1-5) }
.export-modal__progress-label { margin-bottom:var(--spacing-2);color:var(--monitoring-text,var(--color-text-primary));font-size:var(--text-sm);text-align:center }
.export-modal__progress-bar { overflow:hidden;width:100%;height:var(--spacing-2);background:var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-1) }
.export-modal__progress-fill { height:100%;background:var(--monitoring-primary,var(--color-brand-primary));border-radius:var(--spacing-1);transition:width .3s ease }
.export-modal__footer { display:flex;justify-content:flex-end;align-items:center;gap:var(--spacing-3);padding:var(--spacing-6);border-top:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default)) }
.export-modal__button { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-6);font-size:var(--text-sm);font-weight:500;border:none;border-radius:var(--spacing-1-5);transition:all .2s ease;cursor:pointer }
.export-modal__button--secondary { color:var(--monitoring-text,var(--color-text-primary));background:var(--monitoring-border,var(--color-border-default)) }
.export-modal__button--secondary:hover { background:var(--color-neutral-300) }
.export-modal__button--primary { color:var(--color-neutral-0);background:var(--monitoring-primary,var(--color-brand-primary)) }
.export-modal__button--primary:hover { background:var(--color-brand-primary-dark) }
.export-modal__button:focus { outline:var(--spacing-0-5) solid var(--monitoring-primary,var(--color-brand-primary));outline-offset:var(--spacing-0-5) }
.export-modal__button:disabled { opacity:50%;cursor:not-allowed }
.export-modal__spinner { width:var(--spacing-1-5);height:var(--spacing-1-5);border:var(--spacing-0-5) solid var(--color-neutral-0-alpha-30);border-top-color:var(--color-var(--color-neutral-0));border-radius:var(--radius-full);animation:spin .8s linear infinite }
.monitoring-dashboard--dark .c-export-modal { background:var(--dark-bg-secondary,var(--color-surface-primary));box-shadow:0 var(--spacing-5) var(--spacing-10) var(--color-neutral-950-alpha-40) }
.monitoring-dashboard--dark .export-modal__header { border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .export-modal__title { color:var(--dark-text-primary,var(--var(--color-neutral-0))) }
.monitoring-dashboard--dark .export-modal__close { color:var(--dark-text-muted,var(--color-text-muted)) }
.monitoring-dashboard--dark .export-modal__close:hover { color:var(--dark-text-primary,var(--var(--color-neutral-0)));background:var(--dark-hover,var(--overlay-light)) }
.monitoring-dashboard--dark .export-modal__close:focus { outline-color:var(--dark-focus,var(--color-info)) }
.monitoring-dashboard--dark .export-modal__error { color:var(--dark-error,var(--color-danger-text));background:var(--color-danger-subtle);border-color:var(--color-success-border) }
.monitoring-dashboard--dark .export-modal__error-text { color:var(--dark-error,var(--color-danger-text)) }
.monitoring-dashboard--dark .export-modal__label { color:var(--dark-text-primary,var(--var(--color-neutral-0))) }
.monitoring-dashboard--dark .export-modal__radio { background:var(--dark-bg-tertiary,var(--color-surface-tertiary));border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .export-modal__radio:hover { background:var(--color-info-subtle);border-color:var(--dark-accent-primary,var(--color-brand-primary)) }
.monitoring-dashboard--dark .export-modal__radio-label { color:var(--dark-text-primary,var(--var(--color-neutral-0))) }
.monitoring-dashboard--dark .export-modal__radio-description { color:var(--dark-text-muted,var(--color-text-muted)) }
.monitoring-dashboard--dark .export-modal__checkbox-label { color:var(--dark-text-secondary,var(--color-text-secondary)) }
.monitoring-dashboard--dark .export-modal__metric-description { color:var(--dark-text-muted,var(--color-text-muted)) }
.monitoring-dashboard--dark .export-modal__input,.monitoring-dashboard--dark .export-modal__select { color:var(--dark-text-primary,var(--var(--color-neutral-0)));background:var(--dark-bg-tertiary,var(--color-surface-tertiary));border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .export-modal__input:focus,.monitoring-dashboard--dark .export-modal__select:focus { border-color:var(--dark-focus,var(--color-brand-primary));box-shadow:0 0 0 var(--spacing-0-75) var(--color-info-border) }
.monitoring-dashboard--dark .export-modal__field-label { color:var(--dark-text-muted,var(--color-text-muted)) }
.monitoring-dashboard--dark .export-modal__details { border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .export-modal__summary { color:var(--dark-text-primary,var(--var(--color-neutral-0)));background:var(--dark-bg-tertiary,var(--color-surface-tertiary)) }
.monitoring-dashboard--dark .export-modal__summary:hover { background:var(--dark-bg-elevated,var(--color-surface-elevated)) }
.monitoring-dashboard--dark .export-modal__metric-list { background:var(--dark-bg-tertiary,var(--color-surface-tertiary));border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .export-modal__estimate { background:var(--color-info-subtle);border-color:var(--color-info-border) }
.monitoring-dashboard--dark .export-modal__estimate-label { color:var(--dark-text-muted,var(--color-text-muted)) }
.monitoring-dashboard--dark .export-modal__estimate-value { color:var(--dark-text-primary,var(--var(--color-neutral-0))) }
.monitoring-dashboard--dark .export-modal__estimate-size { color:var(--dark-text-muted,var(--color-text-muted)) }
.monitoring-dashboard--dark .export-modal__warning { color:var(--dark-warning,var(--color-warning-text)) }
.monitoring-dashboard--dark .export-modal__progress-label { color:var(--dark-text-primary,var(--var(--color-neutral-0))) }
.monitoring-dashboard--dark .export-modal__progress-bar { background:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .export-modal__progress-fill { background:var(--dark-accent-primary,var(--color-brand-primary)) }
.monitoring-dashboard--dark .export-modal__footer { border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .export-modal__button--secondary { color:var(--dark-text-primary,var(--var(--color-neutral-0)));background:var(--dark-bg-elevated,var(--color-surface-elevated)) }
.monitoring-dashboard--dark .export-modal__button--secondary:hover { background:var(--dark-hover,var(--overlay-light)) }
.monitoring-dashboard--dark .export-modal__button--primary { color:var(--dark-bg-primary,var(--color-surface-base));background:var(--dark-accent-primary,var(--color-info)) }
.monitoring-dashboard--dark .export-modal__button--primary:hover { background:var(--dark-accent-secondary,var(--color-brand-primary-hover)) }
@media (max-width:768px) { .c-export-modal-overlay { padding:var(--spacing-2-5) }
.c-export-modal { max-width:none;max-height:95vh }
.export-modal__content,.export-modal__footer,.export-modal__header { padding-right:var(--spacing-1-5);padding-left:var(--spacing-1-5) }
.export-modal__date-range { gap:var(--spacing-3);grid-template-columns:1fr }
.export-modal__footer { flex-direction:column;gap:var(--spacing-2) }
.export-modal__button { justify-content:center;width:100% }
 }
@media (max-width:200px) { .export-modal__header { padding:var(--spacing-1-5) var(--spacing-1-5) 0 }
.export-modal__title { font-size:var(--spacing-5) }
.export-modal__radio-group { gap:var(--spacing-2) }
.export-modal__radio { padding:var(--spacing-3) }
 }
@media (prefers-contrast:more) { .c-export-modal { border:var(--spacing-0-5) solid var(--monitoring-text,var(--color-text-primary)) }
.export-modal__checkbox,.export-modal__input,.export-modal__radio,.export-modal__select { border-width:var(--spacing-0-5) }
 }
@media (prefers-reduced-motion:reduce) { .export-modal-overlay,.export-modal,.export-modal__button,.export-modal__progress-fill { transition:none;animation:none }
.export-modal__spinner { animation:none }
 }
.header-bar { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-6);min-height:var(--spacing-20);padding:var(--spacing-1-5) var(--spacing-6);background:var(--monitoring-card-bg,var(--white));border-bottom:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));box-shadow:var(--monitoring-shadow-sm,var(--shadow-sm)) }
.header-bar__left { display:flex;flex:1;align-items:center;gap:var(--spacing-6);min-width:var(--col-width-medium) }
.header-bar__title-section { display:flex;flex-direction:column;gap:var(--spacing-1) }
.header-bar__title { margin:0;color:var(--monitoring-text,var(--color-text-primary));font-size:var(--spacing-6);font-weight:600;line-height:1.2 }
.header-bar__subtitle { margin:0;color:var(--monitoring-text-secondary,var(--color-text-secondary));font-size:var(--text-sm) }
.header-bar__stats { display:flex;align-items:center;gap:var(--spacing-1-5) }
.header-bar__stat { display:flex;align-items:center;gap:var(--spacing-1);font-size:var(--text-sm) }
.header-bar__stat-label { color:var(--monitoring-text-secondary,var(--color-text-secondary)) }
.header-bar__stat-value { color:var(--monitoring-text,var(--color-text-primary));font-weight:500 }
.header-bar__stat-value--connected { color:var(--monitoring-success,var(--color-success)) }
.header-bar__stat-value--disconnected { color:var(--monitoring-warning,var(--color-warning)) }
.header-bar__center { display:flex;flex:2;justify-content:center;align-items:center;min-width:var(--col-width-extra-wide) }
.header-bar__controls { display:flex;align-items:center;gap:var(--spacing-1-5);padding:var(--spacing-3) var(--spacing-1-5);background:var(--monitoring-bg,var(--color-surface-elevated));border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-2) }
.header-bar__control { display:flex;flex-direction:column;gap:var(--spacing-1);min-width:var(--spacing-20) }
.header-bar__control-label { color:var(--monitoring-text-secondary,var(--color-text-secondary));font-size:var(--spacing-3);font-weight:500;letter-spacing:var(--spacing-1-25);text-transform:uppercase }
.header-bar__control-label--checkbox { flex-direction:row;align-items:center;gap:var(--spacing-1-5);font-size:var(--text-sm);letter-spacing:normal;text-transform:none;cursor:pointer }
.header-bar__select { padding:var(--spacing-1-5) var(--spacing-2);color:var(--monitoring-text,var(--color-text-primary));font-size:var(--text-sm);background:var(--monitoring-card-bg,var(--white));border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-1);transition:border-color .2s ease;cursor:pointer }
.header-bar__select--small { min-width:var(--nav-height);padding:var(--spacing-1) var(--spacing-1-5);font-size:var(--spacing-3) }
.header-bar__select:focus { border-color:var(--monitoring-primary,var(--color-brand-primary));outline:none;box-shadow:0 0 0 var(--spacing-0-5) var(--color-brand-primary-alpha-20) }
.header-bar__checkbox { margin:0;cursor:pointer }
.header-bar__right { display:flex;flex:1;justify-content:flex-end;align-items:center;min-width:var(--col-width-medium) }
.header-bar__actions { display:flex;align-items:center;gap:var(--spacing-3) }
.header-bar__button { display:flex;align-items:center;gap:var(--spacing-1-5);padding:var(--spacing-2) var(--spacing-1-5);color:var(--monitoring-text,var(--color-text-primary));font-size:var(--text-sm);font-weight:500;background:var(--monitoring-card-bg,var(--white));border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-1-5);transition:all .2s ease;cursor:pointer }
.header-bar__button:hover { background:var(--color-brand-primary-alpha-5);border-color:var(--monitoring-primary,var(--color-brand-primary)) }
.header-bar__button:focus { outline:var(--spacing-0-5) solid var(--monitoring-primary,var(--color-brand-primary));outline-offset:var(--spacing-0-5) }
.header-bar__button:disabled { opacity:50%;cursor:not-allowed }
.header-bar__button--refresh:hover { background:var(--color-success-alpha-5);border-color:var(--monitoring-success,var(--color-success-border)) }
.header-bar__button--export { color:var(--color-neutral-0);background:var(--monitoring-primary,var(--color-brand-primary));border-color:var(--monitoring-primary,var(--color-brand-primary)) }
.header-bar__button--export:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark) }
.header-bar__button-icon { font-size:var(--spacing-4);line-height:1 }
.header-bar__refresh-icon { font-size:var(--text-sm);line-height:1;transition:transform .6s ease }
.header-bar__refresh-icon--spinning { animation:spin 1s linear infinite }
.header-bar__theme-toggle { margin-left:var(--spacing-2) }
.monitoring-dashboard--dark .header-bar { background:var(--dark-bg-secondary,var(--color-surface-primary));border-color:var(--dark-border-primary,var(--color-border-strong));box-shadow:var(--dark-shadow-md,0 var(--spacing-1) var(--spacing-1-5) var(--alpha-black-40)) }
.monitoring-dashboard--dark .header-bar__title { color:var(--dark-text-primary,var(--white)) }
.monitoring-dashboard--dark .header-bar__stat-label,.monitoring-dashboard--dark .header-bar__subtitle { color:var(--dark-text-muted,var(--color-text-muted)) }
.monitoring-dashboard--dark .header-bar__stat-value { color:var(--dark-text-secondary,var(--color-text-secondary)) }
.monitoring-dashboard--dark .header-bar__stat-value--connected { color:var(--dark-success,var(--color-success-light)) }
.monitoring-dashboard--dark .header-bar__stat-value--disconnected { color:var(--dark-warning,var(--color-warning-light)) }
.monitoring-dashboard--dark .header-bar__controls { background:var(--dark-bg-tertiary,var(--color-surface-overlay));border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .header-bar__control-label { color:var(--dark-text-muted,var(--color-text-muted)) }
.monitoring-dashboard--dark .header-bar__select { color:var(--dark-text-primary,var(--white));background:var(--dark-bg-elevated,var(--color-surface-hover));border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .header-bar__select:focus { border-color:var(--dark-focus,var(--color-info));box-shadow:0 0 0 var(--spacing-0-5) var(--color-info-alpha-30) }
.monitoring-dashboard--dark .header-bar__button { color:var(--dark-text-secondary,var(--color-text-secondary));background:var(--dark-bg-tertiary,var(--color-surface-tertiary));border-color:var(--dark-border-primary,var(--color-border-strong)) }
.monitoring-dashboard--dark .header-bar__button:hover { background:var(--color-info-alpha-10);border-color:var(--dark-accent-primary,var(--color-info)) }
.monitoring-dashboard--dark .header-bar__button:focus { outline-color:var(--dark-focus,var(--color-brand-primary)) }
.monitoring-dashboard--dark .header-bar__button--refresh:hover { background:var(--color-success-alpha-10);border-color:var(--dark-success,var(--color-success-border)) }
.monitoring-dashboard--dark .header-bar__button--export { color:var(--dark-bg-primary,var(--color-surface-base));background:var(--dark-accent-primary,var(--color-info));border-color:var(--dark-accent-primary,var(--color-info)) }
.monitoring-dashboard--dark .header-bar__button--export:hover { background:var(--dark-accent-secondary,var(--color-info-light));border-color:var(--dark-accent-secondary,var(--color-info-light)) }
@media (max-width:768px) { .header-bar,.header-bar__left { gap:var(--spacing-1-5) }
.header-bar__controls,.header-bar__stats { gap:var(--spacing-3) }
.header-bar__actions { gap:var(--spacing-2) }
.header-bar { flex-direction:column;align-items:stretch;gap:var(--spacing-1-5);min-height:auto;padding:var(--spacing-1-5) }
.header-bar__center,.header-bar__left,.header-bar__right { flex:none;min-width:auto }
.header-bar__center { justify-content:stretch }
.header-bar__controls { flex-wrap:wrap;justify-content:space-between;gap:var(--spacing-2) }
.header-bar__control { flex:1;min-width:auto }
.header-bar__right { justify-content:stretch }
.header-bar__actions { justify-content:space-between;width:100% }
.header-bar__button { flex:1;justify-content:center }
.header-bar__stats { flex-wrap:wrap;gap:var(--spacing-2) }
 }
@media (max-width:200px) { .header-bar { padding:var(--spacing-3) }
.header-bar__title { font-size:var(--spacing-5) }
.header-bar__subtitle { font-size:var(--spacing-3) }
.header-bar__controls { padding:var(--spacing-2) var(--spacing-3) }
.header-bar__control { min-width:var(--nav-height) }
.header-bar__actions { flex-direction:column;gap:var(--spacing-2) }
.header-bar__button { width:100% }
 }
@media (prefers-contrast:more) { .header-bar,.header-bar__button,.header-bar__controls,.header-bar__select { border-width:var(--spacing-0-5) }
 }
@media (prefers-reduced-motion:reduce) { .header-bar__button,.header-bar__refresh-icon,.header-bar__select { transition:none }
.header-bar__refresh-icon--spinning { animation:none }
 }
.c-theme-toggle { position:relative;display:inline-flex;flex-direction:column;gap:var(--spacing-1) }
.theme-toggle__label { margin-bottom:var(--spacing-1);color:var(--monitoring-text-secondary,var(--color-text-secondary));font-size:var(--text-sm);font-weight:500 }
.theme-toggle__button { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-2);min-width:var(--spacing-30);padding:var(--spacing-2) var(--spacing-3);color:var(--monitoring-text,var(--color-text-primary));font-size:var(--text-sm);font-weight:500;background:var(--monitoring-card-bg,var(--var(--color-neutral-0)));border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-1-5);transition:all .2s ease;cursor:pointer }
.theme-toggle__button:hover { border-color:var(--monitoring-primary,var(--color-brand-primary));box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--alpha-var(--color-neutral-900)-10) }
.theme-toggle__button:focus { border-color:var(--monitoring-primary,var(--color-brand-primary));outline:var(--spacing-0-5) solid var(--monitoring-primary,var(--color-brand-primary));outline-offset:var(--spacing-0-5) }
.theme-toggle__icon { font-size:var(--spacing-4);line-height:1 }
.theme-toggle__text { flex:1;text-align:left }
.theme-toggle__arrow { color:var(--monitoring-text-secondary,var(--color-text-secondary));font-size:var(--spacing-3);transition:transform .2s ease }
.theme-toggle__arrow--open { transform:rotate(180deg) }
.theme-toggle__dropdown { position:absolute;top:100%;right:0;left:0;z-index:var(--z-index-overlay);overflow:hidden;margin-top:var(--spacing-1);background:var(--monitoring-card-bg,var(--var(--color-neutral-0)));border:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default));border-radius:var(--spacing-1-5);box-shadow:0 var(--spacing-1) var(--spacing-3) var(--alpha-var(--color-neutral-900)-15);animation:theme-toggle-dropdown-enter .15s ease-out }
.theme-toggle__option { display:flex;align-items:center;gap:var(--spacing-3);width:100%;padding:var(--spacing-3);color:var(--monitoring-text,var(--color-text-primary));text-align:left;background:none;border:none;transition:all .15s ease;cursor:pointer }
.theme-toggle__option--focused,.theme-toggle__option:hover { color:var(--color-neutral-0);background:var(--monitoring-primary,var(--color-brand-primary)) }
.theme-toggle__option--active { color:var(--monitoring-primary,var(--color-brand-primary));background:var(--color-brand-primary-alpha-10) }
.theme-toggle__option--active.theme-toggle__option--focused,.theme-toggle__option--active:hover { color:var(--color-neutral-0);background:var(--monitoring-primary,var(--color-brand-primary)) }
.theme-toggle__option-icon { min-width:var(--spacing-5);font-size:1var (--text-125xl);line-height:1 }
.theme-toggle__option-content { display:flex;flex:1;flex-direction:column;gap:var(--spacing-0-5) }
.theme-toggle__option-label { font-size:var(--text-sm);font-weight:500 }
.theme-toggle__option-description { font-size:var(--spacing-3);opacity:80% }
.theme-toggle__option-check { min-width:var(--spacing-1-5);color:var(--monitoring-success,var(--color-success-500));font-size:var(--text-sm);font-weight:700 }
.monitoring-dashboard--dark .theme-toggle__option-check { color:var(--color-success-500) }
.theme-toggle__option--focused .theme-toggle__option-check,.theme-toggle__option:hover .theme-toggle__option-check { color:var(--color-neutral-0) }
.theme-toggle--small .theme-toggle__button { min-width:var(--col-width-date);padding:var(--spacing-1-5) var(--spacing-2-5);font-size:var(--spacing-3) }
.theme-toggle--small .theme-toggle__label { font-size:var(--spacing-3) }
.theme-toggle--small .theme-toggle__icon { font-size:var(--text-sm) }
.theme-toggle--small .theme-toggle__option { padding:var(--spacing-2) var(--spacing-2-5) }
.theme-toggle--small .theme-toggle__option-label { font-size:var(--spacing-3) }
.theme-toggle--small .theme-toggle__option-description { font-size:0var (--text-6875xl) }
.theme-toggle--large .theme-toggle__button { min-width:var(--spacing-35);padding:var(--spacing-3) var(--spacing-1-5);font-size:var(--spacing-4) }
.theme-toggle--large .theme-toggle__label { font-size:var(--spacing-4) }
.theme-toggle--large .theme-toggle__icon { font-size:var(--spacing-5) }
.theme-toggle--large .theme-toggle__option { padding:var(--spacing-1-5) }
.theme-toggle--large .theme-toggle__option-label { font-size:var(--spacing-4) }
.theme-toggle--large .theme-toggle__option-description { font-size:var(--text-sm) }
.theme-toggle--header { flex-direction:row;align-items:center;gap:var(--spacing-2) }
.theme-toggle--header .theme-toggle__label { margin-bottom:0;white-space:nowrap }
.theme-toggle--sidebar .theme-toggle__dropdown { top:0;left:100%;margin-top:0;margin-left:var(--spacing-2) }
.theme-toggle--floating { position:fixed;right:var(--spacing-6);bottom:var(--spacing-6);z-index:var(--z-index-overlay) }
.theme-toggle--floating .theme-toggle__button { box-shadow:0 var(--spacing-1) var(--spacing-3) var(--alpha-var(--color-neutral-900)-15) }
.theme-toggle--floating .theme-toggle__dropdown { top:auto;bottom:100%;margin-top:0;margin-bottom:var(--spacing-2) }
.monitoring-dashboard--dark .theme-toggle__label { color:var(--color-text-muted) }
.monitoring-dashboard--dark .theme-toggle__button { color:var(--dark-text-primary,var(--color-text-primary));background:var(--dark-bg-tertiary,var(--color-surface-overlay));border-color:var(--dark-border-primary,var(--color-border-strong)) }
.theme-toggle--loading .theme-toggle__button { opacity:60%;cursor:not-allowed }
.monitoring-dashboard--dark .theme-toggle__button:hover { border-color:var(--color-brand-primary);box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--alpha-var(--color-neutral-900)-30) }
.monitoring-dashboard--dark .theme-toggle__button:focus { border-color:var(--dark-focus,var(--color-info));outline-color:var(--color-focus) }
.monitoring-dashboard--dark .theme-toggle__arrow { color:var(--color-text-muted) }
.monitoring-dashboard--dark .theme-toggle__dropdown { background:var(--dark-bg-elevated,var(--color-neutral-800));border-color:var(--dark-border-primary,var(--color-border-strong));box-shadow:0 var(--spacing-1) var(--spacing-3) var(--alpha-black-40) }
.monitoring-dashboard--dark .theme-toggle__option { color:var(--color-text-secondary) }
.monitoring-dashboard--dark .theme-toggle__option--focused,.monitoring-dashboard--dark .theme-toggle__option:hover { color:var(--color-text-on-dark);background:var(--color-brand-primary) }
.monitoring-dashboard--dark .theme-toggle__option--active { color:var(--color-brand-primary);background:var(--color-info-alpha-20) }
.monitoring-dashboard--dark .theme-toggle__option--active.theme-toggle__option--focused,.monitoring-dashboard--dark .theme-toggle__option--active:hover { color:var(--color-text-on-dark);background:var(--color-brand-primary) }
.theme-toggle__option-check--dark-focused,.theme-toggle__option-check--dark-hover { color:var(--color-neutral-0) }
@media (prefers-contrast:more) { .theme-toggle__button { border-width:var(--spacing-0-5) }
.theme-toggle__option { border-bottom:var(--spacing-px) solid var(--monitoring-border,var(--color-border-default)) }
.theme-toggle__option:last-child { border-bottom:none }
.monitoring-dashboard--dark .theme-toggle__option { border-color:var(--border-color) }
 }
@media (prefers-reduced-motion:reduce) { .theme-toggle__arrow,.theme-toggle__button,.theme-toggle__option { transition:none }
.theme-toggle__dropdown { animation:none }
 }
@media (max-width:768px) { .theme-toggle--floating { right:var(--spacing-1-5);bottom:var(--spacing-1-5) }
.theme-toggle__dropdown { min-width:var(--col-width-medium) }
.theme-toggle--sidebar .theme-toggle__dropdown { right:0;left:auto;margin-left:0 }
 }
@media (max-width:200px) { .theme-toggle__button { min-width:var(--col-width-date);padding:var(--spacing-2) }
.theme-toggle--header .theme-toggle__label,.theme-toggle__text { display:none }
 }
.theme-toggle__option[role=menuitem]:focus { outline:var(--spacing-0-5) solid var(--monitoring-primary,var(--color-brand-primary));outline-offset:calc(var(--spacing-0-5)*-1) }
.theme-toggle__option--dark-focused { outline-color:var(--color-focus) }
.theme-toggle--loading .theme-toggle__icon:after { content:"⏳";position:absolute;animation:spin 1s linear infinite }
.c-sg-batch-panel { position:fixed;right:var(--spacing-0);bottom:var(--spacing-0);left:var(--spacing-0);z-index:var(--z-index-sticky);background:var(--color-background-elevated);border-top:var(--spacing-0-5) solid var(--color-primary);box-shadow:0 -var(--spacing-1) var(--spacing-3) var(--alpha-black-10);transform:translateY(100%);transition:transform .3s ease-out }
.sg-batch-panel[data-visible=true] { transform:translateY(0);animation:slide-up .3s ease-out forwards }
.sg-batch-panel__inner { display:flex;flex-direction:column;gap:var(--spacing-3);padding:var(--spacing-4) }
@media (min-width:768px) { .sg-batch-panel__inner { flex-direction:row;justify-content:space-between;align-items:center }
 }
.sg-batch-panel__info { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary) }
.sg-batch-panel__info i { color:var(--color-primary);font-size:var(--spacing-5) }
.sg-batch-panel__count { font-size:var(--font-size-base) }
.sg-batch-panel__count strong { color:var(--color-primary);font-weight:var(--font-weight-semibold) }
.sg-batch-panel__actions { display:flex;flex-wrap:wrap;gap:var(--spacing-2) }
.sg-batch-panel__progress { display:none;width:100%;margin-top:var(--spacing-3) }
.sg-batch-panel__progress[data-visible=true] { display:block }
.c-sg-progress { position:relative;overflow:hidden;width:100%;height:var(--spacing-6);background:var(--color-background-secondary);border-radius:var(--border-radius-md) }
.sg-progress__bar { position:relative;overflow:hidden;height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-hover));transition:width .3s ease-out }
.sg-progress__bar:after { position:absolute;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);background:linear-gradient(90deg,transparent,var(--alpha-white-20),transparent);transform:translateX(-100%);animation:progress-shimmer 2s infinite;content:"" }
.sg-progress__text { display:block;margin-top:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--font-size-sm);text-align:center }
.c-sg-drafts-header { display:none;margin-bottom:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);background:var(--color-background-secondary);border-radius:var(--border-radius-md) }
.sg-drafts-header[data-visible=true] { display:block }
.sg-drafts-header__controls { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-3) }
.sg-drafts-header__count { color:var(--color-text-secondary);font-size:var(--font-size-sm) }
.c-sg-checkbox-wrapper { display:flex;align-items:center;gap:var(--spacing-2);cursor:pointer;-webkit-user-select:none;user-select:none }
.sg-checkbox-wrapper--inline { display:inline-flex;margin-right:var(--spacing-3) }
.c-sg-checkbox-label { color:var(--color-text-primary);font-size:var(--font-size-base) }
.c-sg-checkbox { position:relative;width:var(--spacing-5);height:var(--spacing-5);background:var(--color-background-primary);border:var(--spacing-0-5) solid var(--color-border);border-radius:var(--border-radius-sm);transition:all .2s ease;cursor:pointer;-webkit-user-select:none;user-select:none }
.sg-checkbox:hover { border-color:var(--color-primary) }
.sg-checkbox:checked { background:var(--color-primary);border-color:var(--color-primary) }
.sg-checkbox:checked:after { position:absolute;top:var(--spacing-0-5);left:var(--spacing-1-5);width:var(--spacing-1-25);height:var(--spacing-2-5);border:solid var(--color-neutral-0);border-width:0 var(--spacing-0-5) var(--spacing-0-5) 0;transform:rotate(45deg);content:"" }
.sg-checkbox:indeterminate { background:var(--color-primary);border-color:var(--color-primary) }
.sg-checkbox:indeterminate:after { position:absolute;top:var(--spacing-2);left:var(--spacing-1);width:var(--spacing-2-5);height:var(--spacing-0-5);background:var(--color-neutral-0);content:"" }
.sg-checkbox:focus-visible { outline:var(--spacing-0-5) solid var(--color-primary);outline-offset:var(--spacing-0-5) }
.sg-checkbox:disabled { opacity:50%;cursor:not-allowed }
.sg-card--draft .sg-card__header { display:flex;align-items:flex-start;gap:var(--spacing-3) }
.sg-card--draft .c-sg-checkbox-wrapper { flex-shrink:0;margin-top:var(--spacing-0-5) }
.sg-card--draft .sg-card__title-group { flex:1;min-width:0 }
.sg-card--draft:has(.draft-checkbox:checked) { background:var(--color-background-hover);border-color:var(--color-primary);box-shadow:0 0 0 var(--spacing-px) var(--color-primary) }
.sg-button[disabled] { opacity:50%;cursor:not-allowed;pointer-events:none }
.sg-batch-panel[data-visible=false] { animation:slide-down .3s ease-out forwards }
@media (max-width:767px) { .sg-batch-panel__inner { padding:var(--spacing-3) }
.sg-batch-panel__actions { justify-content:stretch;width:100% }
.sg-batch-panel__actions .c-sg-button { flex:1;min-width:0 }
.sg-batch-panel__actions .sg-button--sm { padding:var(--spacing-2);font-size:var(--font-size-sm) }
 }
[data-sg-theme=dark] .c-sg-batch-panel { background:var(--color-background-elevated);border-top-color:var(--color-primary) }
[data-sg-theme=dark] .c-sg-progress { background:var(--color-background-tertiary) }
[data-sg-theme=dark] .c-sg-checkbox { background:var(--color-background-secondary);border-color:var(--color-border) }
[data-sg-theme=dark] .sg-checkbox:checked,[data-sg-theme=dark] .sg-checkbox:indeterminate { background:var(--color-primary);border-color:var(--color-primary) }
.sg-batch-panel:focus-within { box-shadow:0 -var(--spacing-1) var(--spacing-3) var(--alpha-black-15) }
.sg-button--processing { opacity:70%;pointer-events:none }
.sg-button--ghost-processing { opacity:100%;pointer-events:auto }
@media (min-width:768px) { .md\:grid-cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)) }
.md\:grid-cols-3 { grid-template-columns:repeat(3,minmax(0,1fr)) }
.md\:grid-cols-4 { grid-template-columns:repeat(4,minmax(0,1fr)) }
 }
.c-page-header { padding-bottom:var(--spacing-4);border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.c-gradient-text { font-weight:var(--font-weight-semibold);background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-primary-light));-webkit-text-fill-color:transparent;background-clip:text }
.c-metric-card { position:relative;transition:all var(--duration-medium) var(--ease-in-out) }
.c-metric-card:hover { box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-2px)*-1)) }
.c-metric-label { display:block;margin-bottom:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-medium);line-height:var(--metric-label-line-height) }
.c-metric-value { display:block;margin-bottom:var(--spacing-1);font-size:var(--text-2xl);font-weight:var(--font-weight-bold);line-height:var(--metric-value-line-height) }
.c-metric-change { display:block;color:var(--color-text-muted);font-size:var(--text-xs);line-height:var(--metric-description-line-height) }
.c-metric-change--positive,.metric-change.c-positive { color:var(--color-success) }
.c-metric-change--negative,.metric-change.c-negative { color:var(--color-danger) }
.c-sg-tabs { display:flex;margin-bottom:var(--spacing-4);border-bottom:var(--spacing-px) solid var(--color-border-default) }
.sg-tabs__tab { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-medium);background:transparent;border:none;border-bottom:var(--spacing-0-5) solid transparent;transition:all var(--duration-fast) var(--ease-in-out);cursor:pointer }
.sg-tabs__tab:hover { color:var(--color-text-primary);background:var(--color-surface-elevated) }
.sg-tabs__tab--active { color:var(--color-brand-primary);border-bottom-color:var(--color-brand-primary);background:var(--color-surface-base) }
.sg-tabs__panel { display:none }
.sg-tabs__panel--active { display:block }
.c-badge { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-weight-medium);line-height:var(--leading-none);border-radius:var(--radius-full) }
.c-badge-primary { color:var(--color-white);background:var(--color-brand-primary) }
.c-badge-success { color:var(--color-surface-base);background:var(--color-success) }
.c-badge-warning { color:var(--color-surface-base);background:var(--color-warning) }
.c-sg-toolbar { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-3) }
.c-sg-toolbar-group { display:flex;align-items:center;gap:var(--spacing-2) }
.sg-toolbar-group.flex-1 { flex:1;justify-content:flex-end }
.c-form-textarea,.form-input,.form-select { padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-sm);transition:border-color var(--duration-fast) var(--ease-in-out) }
.c-form-textarea:focus,.form-input:focus,.form-select:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:var(--shadow-focus) }
.c-form-input-sm,.c-form-select-sm { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs) }
.c-categories-grid { position:relative;min-height:var(--card-min-width-lg) }
.c-category-cards { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fill,minmax(var(--spacing-70),1fr)) }
.c-category-card { position:relative;overflow:hidden;padding:var(--spacing-4);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-medium) var(--ease-in-out) }
.c-category-card:hover { border-color:var(--color-brand-primary);box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-2px)*-1)) }
.c-category-card__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3) }
.c-category-card__title { margin:0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.c-category-card__type { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-weight-medium);background:var(--color-surface-elevated);border-radius:var(--radius-sm) }
.c-category-card__description { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-normal) }
.c-category-card__stats { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:1fr 1fr;margin-bottom:var(--spacing-3) }
.c-category-card__stat { text-align:center }
.c-category-card__stat-value { display:block;color:var(--color-brand-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.c-category-card__stat-label { display:block;color:var(--color-text-muted);font-size:var(--text-xs) }
.c-category-card__actions { display:flex;justify-content:flex-end;gap:var(--spacing-2) }
.c-category-card__color-indicator { position:absolute;top:0;left:0;width:var(--spacing-1);height:100%;border-radius:var(--radius-md) 0 0 var(--radius-md) }
.c-sg-table-wrapper { overflow-x:auto;border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md) }
.c-table-header--sticky { position:sticky;top:0;background:var(--color-surface-elevated);z-index:var(--z-sticky) }
.c-confidence { font-weight:var(--font-weight-semibold) }
.c-confidence--high { color:var(--color-success) }
.c-confidence--medium { color:var(--color-warning) }
.c-confidence--low { color:var(--color-text-tertiary) }
.sg-table tbody tr:hover { background:var(--color-surface-elevated) }
.c-chart-container { position:relative;max-width:var(--spacing-150);height:var(--card-min-width-lg);margin:0 auto;padding:var(--spacing-4);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md) }
.chart-container canvas { max-width:100%;height:auto;max-height:var(--col-width-extra-wide) }
.c-chart-title { margin-bottom:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold);text-align:center }
.c-metrics-section { padding:var(--spacing-5);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md) }
.c-section-title { margin-bottom:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.c-metric-item { padding:var(--spacing-3);text-align:center;background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-sm) }
.metric-item .c-metric-label { font-size:var(--text-xs) }
.metric-item .c-metric-value { margin-bottom:var(--spacing-1);font-size:var(--text-xl) }
.c-metric-trend { color:var(--color-text-muted);font-size:var(--text-xs) }
.c-settings-sections { max-width:var(--spacing-150) }
.c-settings-section { padding:var(--spacing-4);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md) }
.c-sg-form-group { margin-bottom:var(--spacing-4) }
.sg-form-group:last-child { margin-bottom:0 }
.c-sg-form-label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-medium) }
.sg-form-label input[type=checkbox] { margin-right:var(--spacing-2);accent-color:var(--color-brand-primary) }
.c-form-range { width:100%;height:var(--spacing-1-5);background:var(--color-surface-elevated);border:none;border-radius:var(--radius-full);outline:none;appearance:none }
.c-form-range::-webkit-slider-thumb { width:var(--spacing-4-5);height:var(--spacing-4-5);background:var(--color-brand-primary);border:var(--spacing-0-5) solid var(--color-surface-base);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);appearance:none;cursor:pointer }
.c-form-range::-moz-range-thumb { width:var(--spacing-4-5);height:var(--spacing-4-5);background:var(--color-brand-primary);border:var(--spacing-0-5) solid var(--color-surface-base);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);cursor:pointer }
.c-switch { position:relative;display:inline-block;width:var(--touch-target-min);height:var(--spacing-6) }
.c-switch input { width:0;height:0;opacity:0 }
.c-slider { position:absolute;inset:0;background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-full);transition:all var(--duration-medium) var(--ease-in-out);cursor:pointer }
.c-slider:before { position:absolute;top:var(--spacing-0-75);left:var(--spacing-0-75);width:var(--spacing-1-5);height:var(--spacing-1-5);background:var(--color-text-primary);border-radius:var(--radius-full);transition:all var(--duration-medium) var(--ease-in-out);content:"" }
input:checked+.c-slider { background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
input:checked+.c-slider:before { background:var(--color-neutral-0);transform:translateX(var(--spacing-5)) }
.c-empty-state,.loading-state { display:flex;justify-content:center;align-items:center;min-height:var(--col-width-extra-wide) }
.empty-state h3 { margin:0 }
.sg-modal__container--lg { max-width:var(--spacing-200) }
.sg-modal__content { padding:var(--spacing-5) }
input[type=color] { width:var(--spacing-50px);height:var(--spacing-1-25);border:none;border-radius:var(--radius-sm);cursor:pointer }
.c-settings-actions { border-top:var(--spacing-px) solid var(--color-border-default) }
.c-grid { display:grid }
.grid-cols-1 { grid-template-columns:repeat(1,minmax(0,1fr)) }
.grid-cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)) }
.grid-cols-3 { grid-template-columns:repeat(3,minmax(0,1fr)) }
.grid-cols-4 { grid-template-columns:repeat(4,minmax(0,1fr)) }
.gap-4 { gap:var(--spacing-4) }
.c-d-none { display:none }
.c-text-center { text-align:center }
.c-text-secondary { color:var(--color-text-secondary) }
.c-text-muted { color:var(--color-text-muted) }
.mb-2 { margin-bottom:var(--spacing-2) }
.mb-3 { margin-bottom:var(--spacing-3) }
.mb-4 { margin-bottom:var(--spacing-4) }
.mb-5 { margin-bottom:var(--spacing-5) }
.mt-5 { margin-top:var(--spacing-5) }
.pt-4 { padding-top:var(--spacing-4) }
.py-4 { padding-top:var(--spacing-4);padding-bottom:var(--spacing-4) }
.py-8 { padding-top:var(--spacing-8);padding-bottom:var(--spacing-8) }
.c-border-t { border-top:var(--spacing-px) solid var(--color-border-default) }
.mr-1 { margin-right:var(--spacing-1) }
.mr-2 { margin-right:var(--spacing-2) }
.mr-3 { margin-right:var(--spacing-3) }
.ml-1 { margin-left:var(--spacing-1) }
.c-text-lg { font-size:var(--text-lg) }
.c-text-sm { font-size:var(--text-sm) }
.c-text-xs { font-size:var(--text-xs) }
.fa-2x { font-size:2em }
.fa-3x { font-size:3em }
.c-fa-spin { animation:fa-spin 1s linear infinite }
.cleanup-stats { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:var(--spacing-8) }
.stat-card { padding:var(--spacing-6);background:var(--color-neutral-0);border-radius:var(--radius-md);box-shadow:var(--shadow-sm) }
.stat-card h3 { margin:0 0 var(--spacing-3) 0;color:var(--color-text-muted);font-size:var(--text-sm);text-transform:uppercase }
.stat-card .number { font-size:var(--text-2xl);font-weight:var(--font-bold) }
.stat-card.valid .number { color:var(--color-success) }
.stat-card.fixable .number { color:var(--color-info) }
.stat-card.suspicious .number { color:var(--color-warning) }
.stat-card.unfixable .number { color:var(--color-danger) }
.cleanup-table { overflow:hidden;background:var(--color-neutral-0);border-radius:var(--radius-md);box-shadow:var(--shadow-sm) }
.cleanup-table table { width:100%;border-collapse:collapse }
.cleanup-table th { padding:var(--spacing-4);font-weight:var(--font-semibold);text-align:left;background:var(--color-surface-elevated) }
.cleanup-table td { padding:var(--spacing-4);border-top:1px solid var(--color-border-default) }
.cleanup-table tr:hover { background:var(--color-surface-hover) }
.confidence-badge { padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-bold);border-radius:var(--radius-full) }
.confidence-badge.high { color:var(--color-success-text);background:var(--color-success-bg) }
.confidence-badge.medium { color:var(--color-warning-text);background:var(--color-warning-bg) }
.confidence-badge.low { color:var(--color-danger-text);background:var(--color-danger-bg) }
.action-buttons { display:flex;justify-content:flex-start;gap:var(--spacing-1) }
.action-buttons .btn { padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);white-space:nowrap }
.btn-apply { color:var(--color-neutral-0);background:var(--color-success);border:none;border-radius:var(--radius-sm);cursor:pointer }
.btn-apply:hover { background:var(--color-success-dark) }
.btn-review { color:var(--color-neutral-0);background:var(--color-info);border:none;border-radius:var(--radius-sm);cursor:pointer }
.btn-review:hover { background:var(--color-info-dark) }
.status-applied { margin-left:var(--spacing-3);color:var(--color-success-text);background:var(--color-success-bg) }
.status-applied,.status-tag { display:inline-block;padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-sm) }
.status-tag-success { color:var(--color-neutral-0);background:var(--color-success) }
.status-tag-valid { color:var(--color-neutral-700);background:var(--color-neutral-200) }
.filter-bar { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-4);padding:var(--spacing-4);background:var(--color-neutral-0);border-radius:var(--radius-md) }
.loading-overlay { position:fixed;inset:0;z-index:var(--z-index-modal);display:none;justify-content:center;align-items:center;background:var(--color-overlay) }
.loading-overlay.active { display:flex }
.sg-button { display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--spacing-9);padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:var(--font-medium);line-height:1.2;white-space:nowrap;border:none;border-radius:var(--radius-md);transition:var(--transition-base);cursor:pointer }
.sg-button:focus-visible { outline:var(--spacing-0-5) solid var(--color-accent-primary);outline-offset:var(--spacing-0-5);box-shadow:0 0 0 var(--spacing-1) var(--alpha-primary-20) }
.sg-button:disabled,.sg-button[disabled] { background:var(--color-neutral-400);opacity:50%;cursor:not-allowed;pointer-events:none }
.sg-button--primary { color:var(--color-neutral-0);background:var(--color-accent-primary) }
.sg-button--primary:hover { background:var(--color-accent-hover);transform:translateY(calc(var(--spacing-1px)*-1)) }
.sg-button--secondary { color:var(--color-text-primary);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary) }
.sg-button--secondary:hover { background:var(--color-surface-primary);border-color:var(--color-accent-primary) }
.sg-button--danger { color:var(--color-neutral-0);background:var(--color-danger) }
.sg-button--danger:hover { background:var(--color-danger-dark);transform:translateY(calc(var(--spacing-1px)*-1)) }
.sg-button--success { color:var(--color-neutral-0);background:var(--color-success) }
.sg-button--success:hover { background:var(--color-success-dark);transform:translateY(calc(var(--spacing-1px)*-1)) }
.sg-button--wide { min-width:13.75rem }
.sg-button--ghost { padding:var(--space-2) 0;color:var(--color-text-primary);background:transparent;border:none }
.sg-button--ghost:hover { color:var(--color-accent-primary);background:var(--color-surface-hover) }
.sg-button--ghost .fas { transition:color .2s ease }
.sg-button-group { display:flex;gap:var(--space-2) }
.sg-button-group .sg-button { flex:1 }
.sg-badge { display:inline-flex;flex-shrink:0;align-items:center;padding:var(--space-1) var(--space-3);font-size:var(--text-xs);font-weight:var(--font-medium);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;border-radius:var(--radius-full) }
.sg-badge--accent { color:var(--color-neutral-0);background:var(--color-accent-primary) }
.sg-badge--success { color:var(--color-neutral-0);background:var(--success) }
.sg-badge--warning { color:var(--color-neutral-0);background:var(--warning) }
.sg-badge--info { color:var(--color-neutral-0);background:var(--info) }
@media (max-width:767px) { .sg-date-group,.sg-range-group { flex-direction:column;gap:var(--space-3) }
.sg-filter-actions { flex-direction:column }
 }
@media (prefers-color-scheme:dark) { .sg-range { background:var(--color-surface-tertiary) }
.sg-range::-webkit-slider-thumb { background:var(--color-accent-primary);border-color:var(--color-surface) }
.sg-range::-moz-range-thumb { background:var(--color-accent-primary);border-color:var(--color-surface) }
 }
.sg-input,.sg-textarea { width:100%;padding:var(--space-2) var(--space-3);color:var(--color-text-primary);font-size:var(--text-base);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-md);transition:var(--transition-base) }
.sg-input:focus,.sg-textarea:focus { border-color:var(--color-accent-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.sg-textarea { font-family:inherit;line-height:var(--leading-relaxed);resize:vertical }
.sg-textarea::placeholder { color:var(--color-text-tertiary);opacity:100% }
.sg-textarea { caret-color:var(--color-text-primary) }
.sg-modal .sg-textarea { color:var(--color-text-primary);background-color:var(--color-surface-elevated);caret-color:var(--color-text-primary) }
.sg-modal .sg-textarea:focus { color:var(--color-text-primary);background-color:var(--color-surface-elevated) }
.sg-modal .sg-textarea::placeholder { color:var(--color-text-tertiary);opacity:var(--opacity-70) }
.sg-form-group { margin-bottom:var(--space-4) }
.sg-filter-group { display:flex;flex-direction:column;gap:var(--space-2) }
.sg-filter-group .sg-label { margin-bottom:var(--space-1);color:var(--color-text-primary);font-weight:var(--font-medium) }
.sg-range-group { display:flex;gap:var(--space-4) }
.sg-range-input { display:flex;flex:1;flex-direction:column;gap:var(--space-1) }
.sg-range { width:100%;height:var(--spacing-1-5);background:var(--color-surface-secondary);border-radius:var(--spacing-0-75);outline:none;appearance:none;cursor:pointer }
.sg-range::-webkit-slider-thumb { width:var(--spacing-4-5);height:var(--spacing-4-5);background:var(--color-accent-primary);border:var(--spacing-0-5) solid var(--color-background);border-radius:var(--radius-full);box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--alpha-black-10);appearance:none;cursor:pointer }
.sg-range::-moz-range-thumb { width:var(--spacing-4-5);height:var(--spacing-4-5);background:var(--color-accent-primary);border:var(--spacing-0-5) solid var(--color-background);border-radius:var(--radius-full);box-shadow:0 var(--spacing-0-5) var(--spacing-1) var(--alpha-black-10);cursor:pointer }
.sg-range-value { min-width:var(--spacing-50px);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);text-align:center }
.sg-date-group { display:flex;gap:var(--space-3) }
.sg-date-input { display:flex;flex:1;flex-direction:column;gap:var(--space-1) }
.sg-search-input { position:relative }
.sg-search-input .sg-input { padding-right:var(--space-10) }
.sg-search-icon { position:absolute;top:50%;right:var(--space-3);color:var(--color-text-secondary);transform:translateY(-50%);pointer-events:none }
.sg-filter-actions { display:flex;gap:var(--space-3);padding-top:var(--space-4);border-top:var(--spacing-px) solid var(--color-border) }
@media (min-width:1920px) { .sg-grid--cards .sg-card { max-width:var(--chart-height-desktop) }
.sg-grid--cards { justify-items:center }
 }
.sg-card { display:flex;overflow:hidden;flex-direction:column;min-height:0;background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);transition:var(--transition-base) }
.sg-card:hover { border-color:var(--color-accent-primary);box-shadow:var(--shadow-lg);transform:translateY(calc(var(--spacing-px)*-1)) }
.sg-card__header { display:flex;flex-shrink:0;justify-content:space-between;align-items:center;padding:var(--spacing-4,var(--space-4));border-bottom:var(--spacing-px) solid var(--color-border-primary) }
.sg-card__title { display:flex;overflow:hidden;align-items:center;gap:var(--spacing-2,var(--space-2));margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold);text-overflow:ellipsis;white-space:nowrap }
.sg-card__body { overflow:hidden;flex:1 1 auto;padding:var(--spacing-4,var(--space-4));overflow-wrap:anywhere;hyphens:auto }
.sg-card__footer { flex-shrink:0;margin-top:auto;padding:var(--spacing-4,var(--space-4));background:var(--color-surface-secondary);border-top:var(--spacing-px) solid var(--color-border-primary) }
.sg-card__body p { display:-webkit-box;overflow:hidden;margin:var(--spacing-0) 0 var(--space-3) 0;text-overflow:ellipsis;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical }
.sg-text { line-height:var(--leading-relaxed) }
.sg-card__body .sg-text { display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical }
.sg-card--filters { margin-bottom:var(--space-6) }
.sg-card--filters .sg-card__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4,var(--space-4)) var(--spacing-6,var(--space-6));border-bottom:var(--spacing-px) solid var(--color-border);cursor:pointer }
.sg-card--filters .sg-card__header:hover { background-color:var(--color-surface-hover) }
.sg-card__body--collapsible { overflow:hidden;transition:max-height var(--duration-normal,.3s) var(--easing-standard,ease),opacity var(--duration-normal,.3s) var(--easing-standard,ease),padding var(--duration-normal,.3s) var(--easing-standard,ease) }
.sg-card--filters[data-filters-collapsed=true] .sg-card__body--collapsible { max-height:0;padding-top:var(--spacing-0);padding-bottom:var(--spacing-0);opacity:0 }
.sg-card--filters[data-filters-collapsed=false] .sg-card__body--collapsible { max-height:var(--chart-height-desktop);opacity:100% }
.sg-card--draft[data-filtered-hidden=true] { display:none }
.sg-card--draft[data-filtered-hidden=false] { display:block }
.sg-card__body,.sg-card__content { padding:var(--spacing-5,var(--space-5)) }
.sg-grid--cards .sg-card { min-width:0;max-width:100%;height:100%;min-height:var(--col-width-medium) }
.sg-grid--responsive .sg-card__body { overflow:hidden;flex:1 }
.sg-grid--responsive .sg-card__footer { margin-top:auto }
.sg-grid--responsive .sg-card { display:flex;flex-direction:column;min-width:0;height:100%;min-height:var(--spacing-55) }
.sg-metric-card { padding:var(--space-6);text-align:center }
.sg-metric-card .stat-value { margin-bottom:var(--space-2);color:var(--color-accent-primary);font-size:var(--text-3xl);font-weight:var(--font-bold) }
.sg-metric-card .stat-label { color:var(--color-text-secondary);font-size:var(--text-sm);letter-spacing:var(--tracking-wide,.05em);text-transform:uppercase }
.sg-alert { margin-bottom:var(--space-4);padding:var(--space-3) var(--space-4) }
.sg-alert--success { color:var(--success);background:var(--color-success-subtle);border:var(--spacing-px) solid var(--success) }
.sg-alert--danger { color:var(--danger);background:var(--color-danger-subtle);border:var(--spacing-px) solid var(--danger) }
.sg-alert--warning { color:var(--warning);background:var(--color-warning-subtle);border:var(--spacing-px) solid var(--warning) }
.sg-alert--info { color:var(--info);border:var(--spacing-px) solid var(--info) }
.sg-modal { background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl) }
.sg-modal__header { padding:var(--space-4);border-bottom:var(--spacing-px) solid var(--color-border-primary) }
.sg-modal__body { padding:var(--space-4) }
.sg-modal__footer { padding:var(--space-4);background:var(--color-surface-secondary);border-top:var(--spacing-px) solid var(--color-border-primary) }
.sg-modal--visible { display:block;visibility:visible;opacity:100% }
.sg-modal--hidden { display:none;visibility:hidden;opacity:0 }
.modal-backdrop { z-index:var(--z-index-overlay);display:none;background:var(--alpha-black-50);transition:opacity .3s ease }
.modal-backdrop--visible { display:block }
@media (min-width:768px) { .dashboard-container,.main-content,.sg-container { padding-right:var(--space-6,var(--spacing-6));padding-left:var(--space-6,var(--spacing-6)) }
 }
@media (min-width:1024px) { .dashboard-container,.main-content,.sg-container { max-width:min(var(--spacing-400),95vw);padding-right:var(--space-8,var(--spacing-8));padding-left:var(--space-8,var(--spacing-8)) }
 }
@media (min-width:1680px) { .dashboard-container,.main-content,.sg-container { max-width:min(var(--spacing-425),92vw) }
 }
@media (min-width:1920px) { .dashboard-container,.main-content,.sg-container { max-width:min(var(--max-width-full),90vw) }
 }
@media (min-width:768px) { .sg-grid--cards { gap:var(--space-5,var(--spacing-5));grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1024px) and (max-width:1679px) { .sg-grid--cards { gap:var(--space-6,var(--spacing-6));grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1680px) { .sg-grid--cards { gap:var(--space-6,var(--spacing-6));grid-template-columns:repeat(3,1fr) }
 }
@media (min-width:1920px) { .sg-grid--cards { gap:var(--space-7,var(--spacing-7));grid-template-columns:repeat(3,minmax(var(--card-min-width-md),1fr)) }
 }
@media (min-width:768px) { .sg-grid--responsive { gap:var(--space-5);grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1024px) and (max-width:1679px) { .sg-grid--responsive { gap:var(--space-6);grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1680px) { .sg-grid--responsive { gap:var(--space-6);grid-template-columns:repeat(3,1fr) }
 }
@media (min-width:768px) { .sg-filter-grid { grid-template-columns:repeat(2,1fr) }
 }
@media (min-width:1024px) { .sg-filter-grid { grid-template-columns:repeat(2,1fr) 2fr }
 }
@media (min-width:1536px) { .sg-filter-grid { grid-template-columns:repeat(4,1fr) }
.sg-filter-group--search { grid-column:span 2 }
 }
@media (max-width:767px) { .sg-filter-grid { gap:var(--space-4) }
 }
.dashboard-container,.main-content,.sg-container { width:100%;max-width:100%;margin:var(--spacing-0) auto;padding:var(--spacing-0) var(--space-4) }
.sg-grid { display:grid;grid-gap:var(--space-4);gap:var(--space-4) }
.sg-grid--cards { align-items:stretch;grid-template-columns:1fr;width:100% }
.sg-grid--responsive { display:grid;align-items:stretch;grid-gap:var(--space-4);gap:var(--space-4);grid-template-columns:1fr;width:100% }
.sg-filter-grid { display:grid;grid-gap:var(--space-6);gap:var(--space-6);grid-template-columns:1fr;margin-bottom:var(--space-6) }
.sg-section { margin-bottom:var(--space-8) }
.sg-section__header { margin-bottom:var(--space-4) }
.sg-heading { display:flex;align-items:center;gap:var(--space-2);color:var(--color-text-primary) }
.sg-heading--2 { font-size:var(--text-2xl);font-weight:var(--font-semibold) }
.sg-heading i { color:var(--color-accent-primary) }
.sg-table { width:100%;border-collapse:collapse;background:var(--color-surface-primary) }
.sg-table thead { background:var(--color-surface-secondary);border-bottom:var(--spacing-0-5) solid var(--color-border-primary) }
.sg-table th { padding:var(--space-3);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);letter-spacing:.05em;text-align:left;text-transform:uppercase }
.sg-table td { padding:var(--space-3);color:var(--color-text-secondary);border-bottom:var(--spacing-px) solid var(--color-border-primary) }
.sg-table tbody tr:hover { background:var(--color-surface-secondary) }
.email-classifications-page { min-height:var(--size-screen-height,100vh);color:var(--color-text-primary);font-family:var(--font-family);background:var(--bg-primary) }
.classification-updated { animation:classification-flash var(--duration-slow,1s) var(--ease-out,ease-out) }
.side-drawer { position:fixed;top:var(--spacing-0);right:0;z-index:var(--z-index-modal);display:flex;flex-direction:column;width:var(--drawer-width-md);height:100vh;background:var(--bg-elevated);box-shadow:var(--shadow-drawer);transform:translateX(100%);transition:transform .25s ease;will-change:transform }
.side-drawer--open { transform:translateX(0) }
@media (prefers-reduced-motion:reduce) { .side-drawer { transition:none }
 }
.side-drawer__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4);border-bottom:var(--spacing-px) solid var(--color-border-default) }
.side-drawer__body { overflow-y:auto;padding:var(--spacing-4) }
.side-drawer__footer { position:sticky;bottom:var(--spacing-0);display:flex;justify-content:flex-end;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);background:var(--bg-elevated);border-top:var(--spacing-px) solid var(--color-border-default) }
.chip { display:inline-block;margin-right:var(--spacing-2);margin-bottom:var(--spacing-2);padding:var(--spacing-1-5) var(--spacing-2-5);background:var(--bg-secondary);border-width:var(--border-width-1);border-style:solid;border-color:var(--color-border-default);border-radius:var(--radius-full);cursor:pointer }
.chip--active { color:var(--text-contrast);background:var(--accent-muted);border-color:var(--accent) }
.suggestion-row { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-2);padding:var(--spacing-2);background:var(--bg-secondary);border-width:var(--border-width-1);border-style:solid;border-color:var(--color-border-default);border-radius:var(--spacing-2) }
.badge--success { display:inline-block;margin-left:var(--spacing-2);padding:var(--spacing-0-5) var(--spacing-2);color:var(--color-success);font-size:.75rem;font-weight:600;background-color:var(--color-success-subtle);border-width:var(--border-width-1);border-style:solid;border-color:var(--color-success);border-radius:var(--spacing-1) }
.feedack-section { display:flex;align-items:center;gap:var(--spacing-2);margin-top:var(--spacing-2);padding-top:var(--spacing-2);border-top:var(--spacing-px) solid var(--gray-100) }
.feedack-label { color:var(--gray-500);font-size:var(--spacing-3);font-weight:500 }
.feedack-buttons { display:flex;gap:var(--spacing-1-5) }
.feedack-btn { padding:var(--spacing-1) var(--spacing-3);color:var(--gray-700);font-size:var(--spacing-3);font-weight:500;background:var(--color-neutral-0);border:var(--spacing-px) solid var(--gray-200);border-radius:var(--spacing-1);transition:all .2s;cursor:pointer }
.feedack-btn:hover { background-color:var(--gray-50);border-color:var(--gray-300) }
.feedack-btn.active { color:var(--color-neutral-0);background-color:var(--blue-500);border-color:var(--blue-500) }
.feedack-btn.active.no { background-color:var(--red-500);border-color:var(--red-500) }
.feedack-btn:disabled { opacity:50%;cursor:not-allowed }
.training-progress { position:fixed;bottom:var(--spacing-6);left:var(--spacing-6);z-index:var(--z-index-sticky);display:none;padding:var(--spacing-4) var(--spacing-6);background:var(--color-neutral-0);border-radius:var(--spacing-2);box-shadow:0 var(--spacing-2-5) var(--spacing-1-25) calc(var(--spacing-0-75)*-1) var(--shadow-md),0 var(--spacing-1) var(--spacing-1-5) -var(--spacing-0-5) var(--shadow-sm) }
.training-progress.show { display:block;animation:slide-up .3s ease }
.progress-header { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-2) }
.progress-icon { width:var(--spacing-6);height:var(--spacing-6);color:var(--blue-500) }
.progress-title { color:var(--gray-900);font-size:var(--spacing-3-5);font-weight:600 }
.progress-stats { display:flex;gap:var(--spacing-4);color:var(--gray-500);font-size:var(--spacing-0-75) }
.progress-stat { display:flex;align-items:center;gap:var(--spacing-1) }
.progress-bar { width:var(--col-width-medium);height:var(--spacing-1-5);margin-top:var(--spacing-2);background:var(--gray-200);border-radius:var(--spacing-0-75) }
.progress-fill { background:var(--blue-500);transition:width .3s ease }
.confidence-badge { margin-left:var(--spacing-2);padding:var(--spacing-0-5) var(--spacing-1-5);font-size:11px;border-radius:var(--spacing-2-5) }
.confidence-high { color:var(--green-600);background-color:var(--green-100) }
.confidence-medium { color:var(--amber-600);background-color:var(--amber-100) }
.confidence-low { color:var(--red-600);background-color:var(--red-100) }
.sg-modal--improvement { --modal-accent:var(--color-info) }
.sg-modal--improvement .sg-modal__header { border-bottom:var(--spacing-px) solid var(--color-border-default) }
.sg-info-grid { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-medium),1fr));margin-bottom:var(--spacing-4);padding:var(--spacing-3);background:var(--color-surface-secondary);border-radius:var(--radius-md) }
.sg-info-item { display:flex;flex-direction:column;gap:var(--spacing-1) }
.sg-info-label { color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:.05em;text-transform:uppercase }
.sg-info-value { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.sg-chip-group { display:flex;flex-wrap:wrap;gap:var(--spacing-2) }
.sg-chip { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-full);transition:var(--transition-base);cursor:pointer }
.sg-chip:hover { color:var(--color-info);background:var(--color-surface-tertiary);border-color:var(--color-info);transform:translateY(-1px) }
.sg-chip--active { color:var(--color-info);background:var(--color-info-alpha-10);border-color:var(--color-info) }
.sg-textarea--large { min-height:var(--col-width-narrow);font-family:var(--font-family-base);line-height:1.6 }
.sg-loading-overlay { position:fixed;inset:0;z-index:var(--z-index-modal);display:flex;visibility:hidden;justify-content:center;align-items:center;background:var(--overlay-backdrop);opacity:0;transition:opacity .3s ease,visibility .3s ease;backdrop-filter:blur(var(--spacing-1)) }
.sg-loading-overlay[data-visible=true] { visibility:visible;opacity:100% }
.sg-loading-card { max-width:var(--card-min-width-lg);padding:var(--spacing-8);text-align:center;background:var(--color-surface-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl);backdrop-filter:blur(var(--spacing-1)) }
.sg-loading__animation { margin-bottom:var(--spacing-4) }
.sg-loading__title { margin:var(--spacing-0) var(--spacing-0) var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.sg-loading__text { color:var(--color-text-secondary);font-size:var(--text-sm);-webkit-user-select:none;user-select:none }
.sg-pulse { animation:pulse 2s ease-in-out infinite }
.sg-progress { overflow:hidden;width:100%;height:var(--spacing-1);background:var(--color-surface-secondary);border-radius:var(--radius-full);backdrop-filter:blur(var(--spacing-1)) }
.sg-progress__bar { height:100%;background:var(--color-info);transition:width .3s ease;backdrop-filter:blur(var(--spacing-1)) }
.sg-progress__bar--indeterminate { width:30%;animation:indeterminate 1.5s ease-in-out infinite }
.sg-button--glow { position:relative;overflow:hidden }
.sg-button--glow:before { position:absolute;top:var(--radius-full);left:var(--radius-full);width:100%;height:100%;background:radial-gradient(circle,var(--color-info-subtle) 0,transparent 70%);transform:translate(-9999px,-9999px);animation:glow 3s ease-in-out infinite;pointer-events:none;content:"" }
.confidence-badge--inline { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--color-surface-secondary);border-radius:var(--radius-md);-webkit-user-select:none;user-select:none }
.sg-form-section { margin-bottom:var(--spacing-4) }
.sg-form-section__title { margin:var(--spacing-0) var(--spacing-0) var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold);-webkit-user-select:none;user-select:none }
.sg-modal__dialog--lg { max-width:800px }
.sg-mb-4 { margin-bottom:var(--spacing-4) }
.sg-mt-4 { margin-top:var(--spacing-4) }
.sg-alert { display:flex;align-items:flex-start;gap:var(--spacing-2);padding:var(--spacing-3);font-size:var(--text-sm);border-radius:var(--radius-md);-webkit-user-select:none;user-select:none }
.sg-alert--info { color:var(--color-info);background:var(--color-info-subtle);border:var(--spacing-px) solid var(--color-info-border) }
.sg-form-help { display:block;margin-top:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-xs);-webkit-user-select:none;user-select:none }
.sg-label__required { margin-left:var(--spacing-1);color:var(--danger);-webkit-user-select:none;user-select:none }
.sg-text--info { color:var(--color-info);-webkit-user-select:none;user-select:none }
.sg-text--secondary { color:var(--color-text-secondary);-webkit-user-select:none;user-select:none }
@media (max-width:768px) { .monitoring-dashboard__content { padding:var(--spacing-2) }
.monitoring-dashboard__status-bar { flex-direction:column;gap:var(--spacing-2) }
.status-bar__left,.status-bar__right { justify-content:center;width:100% }
 }
@media (max-width:200px) { .monitoring-dashboard__status-bar { font-size:var(--spacing-3) }
.status-bar__left,.status-bar__right { flex-wrap:wrap }
 }
.monitoring-dashboard { display:flex;flex-direction:column;height:100vh;color:var(--color-text-primary);font-family:-apple-system,blinkmacsystemfont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--color-surface-elevated);transition:var(--transition-monitoring) }
.monitoring-dashboard__content { overflow-y:auto;flex:1;padding:var(--spacing-1-5);background-color:var(--color-surface-elevated) }
.monitoring-dashboard--dark { color:var(--color-text-primary);background-color:var(--color-surface-primary) }
.monitoring-dashboard--dark .monitoring-dashboard__content { background-color:var(--color-surface-primary) }
.monitoring-dashboard--loading { justify-content:center;align-items:center }
.monitoring-dashboard__loader { text-align:center }
.monitoring-dashboard__loader .spinner { width:var(--spacing-12);height:var(--spacing-12);margin:0 auto var(--spacing-6);border:var(--spacing-1) solid var(--color-border-default);border-top-color:var(--color-brand-primary);border-radius:var(--radius-full);animation:spin 1s linear infinite }
.monitoring-dashboard--error { justify-content:center;align-items:center }
.monitoring-dashboard__error { padding:var(--spacing-8);text-align:center;background:var(--color-surface-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-md) }
.monitoring-dashboard__error h2 { margin:0 0 var(--spacing-1-5);color:var(--color-danger) }
.monitoring-dashboard__status-bar { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) var(--spacing-1-5);font-size:var(--text-sm);background:var(--color-surface-primary);border-top:var(--spacing-px) solid var(--color-border-default) }
.monitoring-dashboard--dark .monitoring-dashboard__status-bar { background:var(--color-surface-overlay);border-color:var(--color-border-strong) }
.status-bar__left,.status-bar__right { display:flex;align-items:center;gap:var(--spacing-1-5) }
.monitoring-dashboard--dark .status-bar__text,.status-bar__text { color:var(--color-text-secondary) }
.grid-layout { display:grid;grid-gap:var(--spacing-1-5);gap:var(--spacing-1-5);grid-template-columns:repeat(12,1fr);padding:var(--monitoring-spacing-md) }
.spinner--small { width:var(--spacing-6);height:var(--spacing-6);border-width:var(--spacing-0-5) }
.text-muted { color:var(--color-text-secondary) }
.text-danger { color:var(--color-danger) }
.text-success { color:var(--color-success) }
.text-warning { color:var(--color-warning) }
.monitoring-dashboard__content::-webkit-scrollbar { width:var(--spacing-2);height:var(--spacing-2) }
.monitoring-dashboard__content::-webkit-scrollbar-track { background:var(--color-border-default);border-radius:var(--radius-sm) }
.monitoring-dashboard__content::-webkit-scrollbar-thumb { background:var(--color-text-secondary);border-radius:var(--radius-sm) }
.monitoring-dashboard__content::-webkit-scrollbar-thumb:hover { background:var(--color-text-primary) }
.monitoring-dashboard--dark .monitoring-dashboard__content::-webkit-scrollbar-track { background:var(--color-border-strong) }
.monitoring-dashboard--dark .monitoring-dashboard__content::-webkit-scrollbar-thumb { background:var(--color-text-secondary) }
.monitoring-dashboard__content--dark-scrollbar-hover::-webkit-scrollbar-thumb:hover { background:var(--color-text-primary) }
@media (max-width:1024px) { .metrics-grid { grid-template-columns:repeat(auto-fit,minmax(var(--spacing-48),1fr)) }
 }
@media (max-width:480px) { .metrics-grid { grid-template-columns:1fr }
 }
@media (min-width:768px) { .metrics-grid { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)) }
 }
@media (min-width:1024px) { .metrics-grid { gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(320px,1fr)) }
 }
@media (min-width:1400px) { .metrics-grid { gap:var(--spacing-8);grid-template-columns:repeat(auto-fit,minmax(340px,1fr)) }
 }
@media (min-width:1920px) { .metrics-grid { gap:var(--spacing-10);grid-template-columns:repeat(auto-fit,minmax(360px,400px)) }
 }
.metric-card { overflow:hidden;background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:var(--transition-monitoring) }
.metric-card:hover { box-shadow:var(--shadow-md) }
.metric-card__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-1-5);border-bottom:var(--spacing-px) solid var(--color-border-default) }
.metric-card__title { margin:0;color:var(--color-text-primary);font-size:var(--spacing-4);font-weight:600 }
.metric-card__loading { color:var(--color-text-secondary);font-size:var(--text-sm) }
.metric-card__content { padding:var(--spacing-1-5) }
.metric-item { margin:var(--spacing-1) 0;padding:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
.monitoring-dashboard--dark .metric-card { background:var(--monitoring-dark-card-bg);border-color:var(--color-border-strong) }
.monitoring-dashboard--dark .metric-card__header { border-color:var(--color-border-strong) }
.monitoring-dashboard--dark .metric-card__title { color:var(--color-text-primary) }
.monitoring-dashboard--dark .metric-card__loading,.monitoring-dashboard--dark .metric-item { color:var(--color-text-secondary) }
.stat-card { position:relative;display:flex;overflow:visible;flex-direction:column;gap:var(--spacing-5);min-height:100%;padding:var(--spacing-8);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-secondary) 100%);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);transition:var(--transition-card);cursor:pointer;backdrop-filter:blur(var(--spacing-2-5)) }
.stat-card:hover { border-color:var(--color-primary-subtle);box-shadow:var(--shadow-xl);transform:translateY(calc(var(--spacing-1)*-1)) }
.stat-card:focus { outline:var(--spacing-0-5) solid var(--color-primary);outline-offset:var(--spacing-0-5) }
.stat-content { display:flex;flex:1;align-items:flex-start;gap:var(--spacing-5) }
.stat-icon { position:relative;display:flex;overflow:hidden;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-16);height:var(--spacing-16);font-size:var(--text-2xl);border-radius:var(--radius-base) }
.stat-icon [class*=fa-],.stat-icon i { display:flex;align-items:center;justify-content:center;margin:0;width:100%;height:100% }
.stat-icon [class*=fa-]:before { margin-right:0 }
.stat-icon--primary { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-dark) 100%) }
.stat-icon--success { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-success) 0,var(--color-success-dark) 100%) }
.stat-icon--warning { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-warning) 0,var(--color-warning-dark) 100%) }
.stat-icon--info { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-info) 0,var(--color-info-dark) 100%) }
.stat-icon--error { color:var(--color-text-on-dark);background:linear-gradient(135deg,var(--color-danger) 0,var(--color-danger-dark) 100%) }
.stat-info { display:flex;flex:1;flex-direction:column;gap:var(--spacing-2) }
.stat-value { color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight) }
.stat-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.stat-trend { align-self:flex-start;margin-top:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3);color:var(--color-primary);font-size:var(--text-xs);font-weight:var(--font-medium);background:var(--color-primary-subtle);border-radius:var(--radius-full) }
.metrics-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:var(--spacing-8) }
.metric-card--enhanced { padding:var(--spacing-5);background:var(--color-surface-elevated);border-radius:var(--radius-lg);box-shadow:var(--shadow-base);transition:all .2s ease }
.metric-card--enhanced:hover { box-shadow:var(--shadow-lg);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.metric-header--enhanced { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3) }
.metric-title--enhanced { color:var(--color-text-secondary);font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.metric-icon--enhanced { display:flex;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);font-size:var(--text-lg);border-radius:var(--radius-base) }
.metric-icon--info { color:var(--color-info);background:var(--color-info-subtle) }
.metric-icon--success { color:var(--color-success);background:var(--color-success-subtle) }
.metric-icon--warning { color:var(--color-warning);background:var(--color-warning-subtle) }
.metric-icon--error { color:var(--color-danger);background:var(--color-danger-subtle) }
.metric-icon--purple { color:var(--color-primary);background:var(--color-primary-subtle) }
.metric-value--enhanced { margin-bottom:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold) }
.metric-trend--enhanced { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-sm) }
.metric-trend--up { color:var(--color-success) }
.metric-trend--down { color:var(--color-danger) }
.stat-card--expanded { grid-column:1/-1;max-height:none;transition:var(--transition-card) }
.expanded-details { display:none;margin-top:var(--spacing-4);padding:var(--spacing-6);background:var(--color-surface-overlay);border-left:var(--spacing-1) solid var(--color-primary);border-radius:var(--radius-base) }
.stat-card--expanded .expanded-details { display:block;animation:fade-in .3s ease-out }
.detail-item { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3) 0;border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.detail-item:last-child { border-bottom:none }
.detail-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.detail-value { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.expand-toggle { position:absolute;top:var(--spacing-3);right:var(--spacing-3);display:flex;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6);padding:var(--spacing-1);color:var(--color-primary);font-size:var(--text-sm);background:transparent;border:var(--spacing-px) solid var(--alpha-primary-30);border-radius:var(--radius-base);transition:var(--transition-card);cursor:pointer }
.expand-toggle:hover { background:var(--color-primary-subtle);border-color:var(--color-primary) }
.stat-card--expanded .expand-toggle { transform:rotate(180deg) }
@media (max-width:1024px) { .chart-grid { grid-template-columns:1fr }
 }
@media (max-width:768px) { .chart-card__header { flex-direction:column;align-items:stretch;gap:var(--spacing-4);padding:var(--spacing-4) var(--spacing-6) }
.chart-controls { justify-content:space-between;width:100% }
.chart-card__body { height:var(--spacing-64);padding:var(--spacing-6) }
.activity-item { flex-direction:column;align-items:flex-start;gap:var(--spacing-2);padding:var(--spacing-4) var(--spacing-6) }
.deployment-header { flex-direction:column;align-items:flex-start;gap:var(--spacing-2) }
.deployment-meta { flex-direction:column;gap:var(--spacing-1) }
 }
@media (max-width:480px) { .activity-time { min-width:auto;font-size:var(--text-xs) }
.activity-type { min-width:var(--spacing-16);font-size:var(--text-xs) }
 }
.chart-grid { display:grid;grid-gap:var(--spacing-8);gap:var(--spacing-8);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-80),1fr));margin-bottom:var(--spacing-8) }
.chart-card { overflow:hidden;background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-secondary) 100%);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);backdrop-filter:blur(var(--spacing-2-5)) }
.chart-card__header { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);padding:var(--spacing-6) var(--spacing-8);border-bottom:var(--spacing-px) solid var(--color-border-default) }
.chart-card__header h2 { margin:0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.chart-controls { display:flex;gap:var(--spacing-2) }
.chart-control-btn { min-width:var(--spacing-20);min-height:var(--spacing-10);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:transparent;border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-base);transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer }
.chart-control-btn--active,.chart-control-btn:hover { color:var(--color-white);background:var(--color-primary);border-color:var(--color-primary) }
.chart-card__body { position:relative;height:var(--spacing-80);padding:var(--spacing-8) }
.chart-container { display:flex;justify-content:center;align-items:center;min-height:var(--spacing-48);margin-bottom:var(--spacing-4);padding:var(--spacing-4);color:var(--color-text-secondary);background:var(--color-surface-elevated);border-radius:var(--radius-base);backdrop-filter:blur(var(--spacing-2-5)) }
.activity-log { overflow-y:auto;max-height:var(--spacing-80);padding:var(--spacing-4) 0 }
.activity-item { display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-3) var(--spacing-8);border-bottom:var(--spacing-px) solid var(--color-border-subtle);transition:all .3s cubic-bezier(.4,0,.2,1) }
.activity-item:hover { background:var(--color-surface-overlay) }
.activity-time { min-width:var(--spacing-20);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-medium) }
.activity-type { min-width:var(--spacing-20);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-align:center;text-transform:uppercase;border-radius:var(--radius-full) }
.activity-type--info { color:var(--color-info);background:var(--color-info-subtle) }
.activity-type--success { color:var(--color-success);background:var(--color-success-subtle) }
.activity-type--warning { color:var(--color-warning);background:var(--color-warning-subtle) }
.activity-type--error { color:var(--color-danger);background:var(--color-danger-subtle) }
.activity-message { flex:1;color:var(--color-text-primary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.deployment-item { margin-bottom:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-elevated);border-left:var(--spacing-1) solid var(--color-primary);border-radius:var(--radius-base);transition:all .2s ease }
.deployment-item:hover { box-shadow:var(--shadow-lg);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.deployment-item--deploying { border-left-color:var(--color-warning) }
.deployment-item--completed { border-left-color:var(--color-success) }
.deployment-item--failed { border-left-color:var(--color-danger) }
.deployment-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2) }
.deployment-id { color:var(--color-text-primary);font-weight:var(--font-semibold) }
.deployment-status { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-base) }
.deployment-status--initiated { color:var(--color-info-dark);background:var(--color-info-subtle) }
.deployment-status--deploying { color:var(--color-warning-dark);background:var(--color-warning-subtle) }
.deployment-status--completed { color:var(--color-success-dark);background:var(--color-success-subtle) }
.deployment-status--failed,.deployment-status--rolling-back { color:var(--color-danger-dark);background:var(--color-danger-subtle) }
.deployment-meta { display:flex;gap:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm) }
.loading-state { gap:var(--spacing-4);padding:var(--spacing-12) }
.monitoring-spinner { width:var(--spacing-8);height:var(--spacing-8);border:var(--spacing-1) solid var(--alpha-primary-30);border-top:var(--spacing-1) solid var(--color-primary);border-radius:var(--radius-full);animation:spin 1s linear infinite }
.live-indicator { display:inline-block;width:var(--spacing-2);height:var(--spacing-2);margin-right:var(--spacing-2);background:var(--color-success);border-radius:var(--radius-full);animation:pulse 2s infinite }
@media (max-width:768px) { .status-bar { flex-direction:column }
.connection-status,.refresh-indicator { position:relative;inset:auto;align-self:flex-start;margin:var(--spacing-4) }
 }
.system-status { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);padding:var(--spacing-6);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-secondary) 100%);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);backdrop-filter:blur(var(--spacing-2-5)) }
.status-indicator { display:flex;align-items:center;gap:var(--spacing-3);font-size:var(--text-base);font-weight:var(--font-semibold) }
.status-indicator--healthy { color:var(--color-success) }
.status-indicator--warning { color:var(--color-warning) }
.status-indicator--error { color:var(--color-danger) }
.status-indicator--connected { color:var(--monitoring-success) }
.status-indicator--disconnected { color:var(--monitoring-warning) }
.status-details { display:flex;align-items:center;gap:var(--spacing-8);color:var(--color-text-secondary);font-size:var(--text-sm) }
.status-details>div { display:flex;align-items:center;gap:var(--spacing-2) }
.status-bar { display:flex;flex-wrap:wrap;gap:var(--spacing-4);margin-top:var(--spacing-5) }
.status-item { flex:1;min-width:var(--spacing-48);padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-elevated);border-left:var(--spacing-1) solid var(--color-primary);border-radius:var(--radius-base) }
.status-item--healthy { border-left-color:var(--color-success) }
.status-item--warning { border-left-color:var(--color-warning) }
.status-item--critical { border-left-color:var(--color-danger) }
.status-label { margin-bottom:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
.status-value { color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-bold) }
.health-indicator { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-full) }
.health-indicator--healthy { color:var(--color-success-dark);background:var(--color-success-subtle) }
.health-indicator--degraded { color:var(--color-warning-dark);background:var(--color-warning-subtle) }
.health-indicator--unhealthy { color:var(--color-danger-dark);background:var(--color-danger-subtle) }
.connection-status { position:fixed;bottom:var(--spacing-5);left:var(--spacing-5);z-index:var(--z-index-notification);display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-base);transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(var(--spacing-2-5)) }
.connection-status--connected { color:var(--color-success);border-color:var(--color-success) }
.connection-status--disconnected { color:var(--color-danger);border-color:var(--color-danger) }
.refresh-indicator { position:fixed;top:var(--spacing-5);right:var(--spacing-5);z-index:var(--z-index-notification);display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);color:var(--color-primary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-primary);border-radius:var(--radius-base);backdrop-filter:blur(var(--spacing-2-5)) }
.refresh-spinner { width:var(--spacing-4);height:var(--spacing-4);border:var(--spacing-0-5) solid var(--alpha-primary-30);border-top:var(--spacing-0-5) solid var(--color-primary);border-radius:var(--radius-full);animation:spin 1s linear infinite }
.alerts-container { padding:var(--spacing-5);background:var(--color-surface-elevated);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg) }
.alert-item { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-3);padding:var(--spacing-3);border-radius:var(--radius-base) }
.alert-item--critical { background:var(--color-danger-subtle);border-left:var(--spacing-1) solid var(--color-danger) }
.alert-item--warning { background:var(--color-warning-subtle);border-left:var(--spacing-1) solid var(--color-warning) }
.alert-item--info { background:var(--color-info-subtle);border-left:var(--spacing-1) solid var(--color-info) }
.btn { padding:var(--spacing-2) var(--spacing-1-5);font-size:var(--text-sm);font-weight:var(--font-medium);border:none;border-radius:var(--radius-sm);transition:var(--transition-monitoring);cursor:pointer }
.btn--primary { color:var(--color-neutral-0);background:var(--color-brand-primary) }
.btn--primary:hover { background:var(--color-brand-primary-dark) }
.btn--secondary { color:var(--color-text-primary);background:var(--color-border-default) }
.btn--secondary:hover { background:var(--color-neutral-300) }
@media print { .monitoring-tabs__button { background:transparent;box-shadow:none }
.monitoring-tabs__panel[hidden] { display:block }
.connection-indicator,.refresh-indicator { display:none }
 }
@media (prefers-contrast:more) { .monitoring-tabs__button { border:1px solid var(--color-border-strong) }
.connection-indicator,.monitoring-metric-card { border-width:var(--border-width-strong,2px) }
 }
@media (prefers-reduced-motion:reduce) { .connection-indicator--reconnecting:before,.monitoring-tabs__panel--active,.refresh-indicator { animation:none }
.monitoring-metric-card { transition:none }
.notion-monitoring__card { animation:none;transition-duration:.01ms }
.notion-monitoring__card:hover { transform:none }
.notion-monitoring__status-indicator { animation:none }
.notion-monitoring__metric-value { transition-duration:.01ms }
 }
@media (max-width:1439px) and (min-width:1024px) { .notion-monitoring__grid { grid-template-columns:repeat(2,1fr) }
.notion-monitoring__card--performance { grid-column:1/-1 }
 }
@media (max-width:767px) { .notion-monitoring { padding:var(--spacing-4) }
.notion-monitoring__grid { grid-template-columns:1fr }
.notion-monitoring__card { padding:var(--spacing-4) }
.notion-monitoring__health-badges { grid-template-columns:1fr }
.notion-monitoring__metric-value { font-size:var(--text-xl) }
 }
@media (prefers-reduced-motion:reduce) { .notion-monitoring__card,.notion-monitoring__metric-value,.notion-monitoring__progress-fill,.notion-monitoring__status-indicator { transition:none }
 }
@media (prefers-contrast:more) { .notion-monitoring__card { border:2px solid var(--color-border-strong) }
.notion-monitoring__health-badge--healthy { border:2px solid var(--color-success-dark) }
.notion-monitoring__health-badge--degraded { border:2px solid var(--color-warning-dark) }
.notion-monitoring__health-badge--error { border:2px solid var(--color-danger-dark) }
 }
.monitoring-tabs { margin-bottom:var(--spacing-lg);background:var(--color-surface-primary);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm) }
.monitoring-tabs__list { display:flex;margin:0;padding:0;list-style:none;border-bottom:var(--spacing-px) solid var(--color-border-light) }
.monitoring-tabs__item { flex:1 }
.monitoring-tabs__button { position:relative;width:100%;padding:var(--spacing-md) var(--spacing-lg);color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);text-align:center;background:transparent;border:none;border-radius:var(--border-radius-md) var(--border-radius-md) 0 0;transition:all var(--duration-fast) var(--easing-standard);cursor:pointer }
.monitoring-tabs__button:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.monitoring-tabs__button:focus-visible { z-index:var(--z-index-focus);outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset) }
.monitoring-tabs__button--active { color:var(--color-primary-600);font-weight:var(--font-weight-semibold);background:var(--color-surface-primary) }
.monitoring-tabs__button--active:after { position:absolute;right:0;bottom:var(--token-monitoring-underline-offset,-var(--spacing-px));left:0;height:var(--token-monitoring-underline-height,2px);background:var(--color-primary-500);content:"" }
.monitoring-tabs__panels { padding:var(--spacing-lg) }
.monitoring-tabs__panel { display:block }
.monitoring-tabs__panel[hidden] { display:none }
.monitoring-tabs__panel--active { animation:fade-in var(--duration-normal) var(--easing-standard) }
.connection-indicator { display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;border-radius:var(--border-radius-full) }
.connection-indicator:before { flex-shrink:0;width:var(--spacing-xs);height:var(--spacing-xs);border-radius:var(--border-radius-full);content:"" }
.connection-indicator--connected { color:var(--color-success-700);background:var(--color-success-50);border:1px solid var(--color-success-200) }
.connection-indicator--connected:before { background:var(--color-success-500) }
.connection-indicator--disconnected { color:var(--color-error-700);background:var(--color-error-50);border:1px solid var(--color-error-200) }
.connection-indicator--disconnected:before { background:var(--color-error-500) }
.connection-indicator--reconnecting { color:var(--color-warning-700);background:var(--color-warning-50);border:1px solid var(--color-warning-200) }
.connection-indicator--reconnecting:before { background:var(--color-warning-500);animation:pulse var(--duration-slow) var(--easing-standard) infinite }
.refresh-indicator { display:inline-block;width:var(--spacing-md);height:var(--spacing-md);border-top:2px solid var(--color-border-light);border:2px solid var(--color-border-light);border-top-color:var(--color-primary-500);border-radius:var(--border-radius-full);animation:spin var(--duration-slow) linear infinite }
.ws-status-icon--connected { color:var(--color-success) }
.ws-status-icon--disconnected { color:var(--color-danger) }
.ws-status-icon--error { color:var(--color-warning) }
.unified-metrics-grid { display:grid;grid-gap:var(--spacing-lg);gap:var(--spacing-lg);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:var(--spacing-xl) }
.unified-chart-grid { display:grid;grid-gap:var(--spacing-lg);gap:var(--spacing-lg);grid-template-columns:repeat(auto-fit,minmax(320px,1fr)) }
.monitoring-metric-card { padding:var(--spacing-lg);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border:1px solid var(--glass-border);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-fast) var(--easing-standard) }
.monitoring-metric-card:hover { box-shadow:var(--shadow-md),var(--shadow-glow-sm-brand);border-color:var(--color-border-strong);background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%);transform:translateY(calc(var(--spacing-xs)*-1)) }
.monitoring-metric-card--healthy { box-shadow:var(--shadow-sm),var(--shadow-glow-sm-success) }
.monitoring-metric-card--warning { box-shadow:var(--shadow-sm),var(--shadow-glow-sm-warning) }
.monitoring-metric-card--error { box-shadow:var(--shadow-sm),var(--shadow-glow-sm-danger) }
.monitoring-metric-card__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md) }
.monitoring-metric-card__title { margin:0;color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase }
.monitoring-metric-card__value { margin:0;color:var(--color-text-primary);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight) }
.monitoring-metric-card__unit { margin-left:var(--spacing-xs);color:var(--color-text-secondary);font-size:var(--font-size-lg);font-weight:var(--font-weight-normal) }
.monitoring-metric-card__trend { display:flex;align-items:center;gap:var(--spacing-xs);margin-top:var(--spacing-sm);font-size:var(--font-size-sm) }
.monitoring-metric-card__trend--up { color:var(--color-success-600) }
.monitoring-metric-card__trend--down { color:var(--color-error-600) }
.monitoring-metric-card__trend--neutral { color:var(--color-text-tertiary) }
.monitoring-activity-log { overflow:hidden;background:var(--color-surface-primary);border:1px solid var(--color-border-light);border-radius:var(--border-radius-lg) }
.monitoring-activity-log__header { padding:var(--spacing-lg);background:var(--color-surface-secondary);border-bottom:var(--spacing-px) solid var(--color-border-light) }
.monitoring-activity-log__title { margin:0;color:var(--color-text-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold) }
.monitoring-activity-log__list { overflow-y:auto;max-height:var(--size-activity-log-max,var(--spacing-100));scrollbar-width:thin;scrollbar-color:var(--color-border-medium) var(--color-transparent,transparent) }
.monitoring-activity-log__item { display:flex;align-items:flex-start;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);border-bottom:var(--spacing-px) solid var(--color-border-light) }
.monitoring-activity-log__item:last-child { border-bottom:none }
.monitoring-activity-log__item:hover { background:var(--color-surface-hover) }
.monitoring-activity-log__icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-lg);height:var(--spacing-lg);margin-top:var(--spacing-xs);font-size:var(--font-size-sm);border-radius:var(--border-radius-full) }
.monitoring-activity-log__icon--info { color:var(--color-primary-600);background:var(--color-primary-100) }
.monitoring-activity-log__icon--warning { color:var(--color-warning-600);background:var(--color-warning-100) }
.monitoring-activity-log__icon--error { color:var(--color-error-600);background:var(--color-error-100) }
.monitoring-activity-log__content { flex:1;min-width:0 }
.monitoring-activity-log__message { margin:0 0 var(--spacing-xs) 0;color:var(--color-text-primary);font-size:var(--font-size-sm);line-height:var(--line-height-normal) }
.monitoring-activity-log__meta { display:flex;gap:var(--spacing-md);color:var(--color-text-tertiary);font-size:var(--font-size-xs) }
.monitoring-activity-log__time { font-weight:var(--font-weight-medium) }
.monitoring-activity-log__category { text-transform:capitalize }
.metric-updating { transform:scale(1.05);transition:transform var(--transition-fast) ease-out }
.notion-monitoring { margin-top:var(--spacing-8);padding:var(--spacing-6);background:var(--color-surface-primary);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-lg) }
.notion-monitoring__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-6) }
.notion-monitoring h2.notion-monitoring__title { margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-semibold) }
.notion-monitoring__refresh { padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);background:var(--glass-bg-dark);border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.notion-monitoring__refresh:hover { color:var(--color-text-primary);background:var(--glass-bg-medium);border-color:var(--color-border-strong) }
.notion-monitoring__refresh:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.notion-monitoring__grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(3,1fr) }
.notion-monitoring__card { padding:var(--spacing-6);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-medium) var(--ease-out) }
.notion-monitoring__card:hover { box-shadow:var(--shadow-md),var(--shadow-glow-sm-brand);border-color:var(--color-border-strong);background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%);transform:translateY(-2px) }
.notion-monitoring__card-header { margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-3);border-bottom:1px solid var(--glass-border) }
h3.notion-monitoring__card-title { margin:0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.notion-monitoring__card-body { display:flex;flex-direction:column;gap:var(--spacing-3) }
.notion-monitoring__status-indicator { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--glass-bg-medium);border-radius:var(--radius-md);transition:opacity var(--duration-slow) var(--ease-out) }
.notion-monitoring__status-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);font-size:var(--text-2xl);border-radius:var(--radius-full) }
.notion-monitoring__status-icon [class*=fa-],.notion-monitoring__status-icon i { display:flex;align-items:center;justify-content:center;margin:0;width:100%;height:100% }
.notion-monitoring__status-icon [class*=fa-]:before { margin-right:0 }
.notion-monitoring__status-indicator--healthy { background:linear-gradient(135deg,var(--color-success-subtle) 0,transparent 100%);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-success) }
.notion-monitoring__status-indicator--healthy .notion-monitoring__status-icon { color:var(--color-success);background:var(--glass-bg-light) }
.notion-monitoring__status-indicator--degraded { background:linear-gradient(135deg,var(--color-warning-subtle) 0,transparent 100%);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-warning) }
.notion-monitoring__status-indicator--degraded .notion-monitoring__status-icon { color:var(--color-warning);background:var(--glass-bg-light) }
.notion-monitoring__status-indicator--down { background:linear-gradient(135deg,var(--color-danger-subtle) 0,transparent 100%);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-danger) }
.notion-monitoring__status-indicator--down .notion-monitoring__status-icon { color:var(--color-danger);background:var(--glass-bg-light) }
.notion-monitoring__status-text { flex:1 }
.notion-monitoring__status-label { color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-weight-bold) }
.notion-monitoring__health-badges { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);grid-template-columns:repeat(2,1fr) }
.notion-monitoring__health-badge { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) var(--spacing-3);background:var(--glass-bg-medium);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-md);transition:all var(--duration-medium) var(--ease-out) }
.notion-monitoring__health-badge--loading { background:var(--skeleton-gradient);background-size:200% 100%;animation:monitoringShimmer var(--duration-shimmer) ease-in-out infinite }
.notion-monitoring__health-badge--healthy { background:linear-gradient(135deg,var(--color-success-subtle) 0,transparent 100%) }
.notion-monitoring__health-badge--degraded { background:linear-gradient(135deg,var(--color-warning-subtle) 0,transparent 100%) }
.notion-monitoring__health-badge--error { background:linear-gradient(135deg,var(--color-danger-subtle) 0,transparent 100%) }
.notion-monitoring__badge-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-normal) }
.notion-monitoring__badge-status { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold) }
.notion-monitoring__health-badge--healthy .notion-monitoring__badge-status { color:var(--color-success-high-contrast) }
.notion-monitoring__health-badge--degraded .notion-monitoring__badge-status { color:var(--color-warning-high-contrast) }
.notion-monitoring__health-badge--error .notion-monitoring__badge-status { color:var(--color-danger-high-contrast) }
.notion-monitoring__last-checked { margin-top:var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-xs) }
.notion-monitoring__metric-row { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3);background:var(--glass-bg-medium);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-md) }
.notion-monitoring__metric-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);color:var(--color-brand-primary);font-size:var(--text-lg);background:var(--glass-bg-dark);border-radius:var(--radius-md) }
.notion-monitoring__metric-content { display:flex;flex:1;flex-direction:column;gap:var(--spacing-1) }
.notion-monitoring__metric-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-normal) }
.notion-monitoring__metric-value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-bold);transition:transform var(--duration-medium) var(--ease-out) }
.notion-monitoring__metric-value--updating { animation:metricPulse .3s var(--ease-bounce) }
.notion-monitoring__metric-value--stub { color:var(--color-text-muted);font-size:var(--text-sm);font-weight:var(--font-weight-normal);font-style:italic }
.notion-monitoring__freshness { display:flex;flex-direction:column;gap:var(--spacing-1) }
.notion-monitoring__freshness-badge { display:inline-block;padding:var(--spacing-1) var(--spacing-2);color:var(--color-white);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;background:var(--glass-bg-dark);border-radius:var(--radius-base) }
.notion-monitoring__freshness-badge--current { background:var(--color-success) }
.notion-monitoring__freshness-badge--aging { background:var(--color-warning) }
.notion-monitoring__freshness-badge--stale { background:var(--color-danger) }
.notion-monitoring__freshness-detail { color:var(--color-text-muted);font-size:var(--text-xs) }
.notion-monitoring__provenance { margin-top:var(--spacing-2);padding-top:var(--spacing-3);border-top:1px solid var(--glass-border) }
.notion-monitoring__provenance-title { margin:0 0 var(--spacing-3) 0;color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold) }
.notion-monitoring__provenance-item { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-2) }
.notion-monitoring__provenance-item:last-child { margin-bottom:0 }
.notion-monitoring__provenance-label { flex-shrink:0;width:var(--spacing-20);color:var(--color-text-muted);font-size:var(--text-xs) }
.notion-monitoring__progress-bar { position:relative;overflow:hidden;flex:1;height:var(--spacing-2);background:var(--glass-bg-dark);border-radius:var(--radius-full) }
.notion-monitoring__progress-fill { width:0;height:100%;background:var(--color-brand-primary);border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.notion-monitoring__provenance-value { flex-shrink:0;width:var(--spacing-12);color:var(--color-text-primary);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);text-align:right }
.notion-monitoring__response-time { display:flex;align-items:center;gap:var(--spacing-2) }
.notion-monitoring__response-value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-bold) }
.notion-monitoring__response-indicator { padding:var(--spacing-1) var(--spacing-2);color:var(--color-white);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;background:var(--glass-bg-dark);border-radius:var(--radius-base) }
.notion-monitoring__response-indicator--good { background:var(--color-success) }
.notion-monitoring__response-indicator--fair { background:var(--color-warning) }
.notion-monitoring__response-indicator--poor { background:var(--color-danger) }
@container (max-width: 640px) { .unified-metrics-grid { gap:var(--spacing-md);grid-template-columns:1fr }
 }
@container (max-width: 768px) { .unified-chart-grid { gap:var(--spacing-md);grid-template-columns:1fr }
 }
@container (max-width: 480px) { .monitoring-tabs__button { padding:var(--spacing-sm);font-size:var(--font-size-xs) }
.monitoring-metric-card { padding:var(--spacing-md) }
.monitoring-metric-card__value { font-size:var(--font-size-2xl) }
.monitoring-activity-log__item { gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md) }
.monitoring-activity-log__icon { width:var(--spacing-md);height:var(--spacing-md) }
 }
.enrichment-monitoring { margin-top:var(--spacing-8);padding:var(--spacing-6);background:var(--glass-bg-dark);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-lg) }
.enrichment-monitoring__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-6) }
.enrichment-monitoring h2.enrichment-monitoring__title { margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-semibold) }
.enrichment-monitoring__refresh { padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);background:var(--glass-bg-medium);border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.enrichment-monitoring__refresh:hover { color:var(--color-text-primary);background:var(--glass-bg-light);border-color:var(--color-border-strong) }
.enrichment-monitoring__refresh:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.enrichment-monitoring__grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(3,1fr) }
.enrichment-monitoring__card { padding:var(--spacing-6);background:var(--glass-bg-dark);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-medium) var(--ease-out) }
.enrichment-monitoring__card:hover { box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.enrichment-monitoring__card-header { margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-3);border-bottom:1px solid var(--glass-border) }
h3.enrichment-monitoring__card-title { margin:0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.enrichment-monitoring__card-body { display:flex;flex-direction:column;gap:var(--spacing-3) }
.enrichment-monitoring__status-indicator { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--glass-bg-medium);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-md);opacity:1;transition:opacity var(--duration-slow) var(--ease-out) }
.enrichment-monitoring__status-indicator--fade-out { opacity:0 }
.enrichment-monitoring__status-indicator--fade-in { opacity:1 }
.enrichment-monitoring__status-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);font-size:var(--text-2xl);border-radius:var(--radius-full) }
.enrichment-monitoring__status-icon [class*=fa-],.enrichment-monitoring__status-icon i { display:flex;align-items:center;justify-content:center;margin:0;width:100%;height:100% }
.enrichment-monitoring__status-icon [class*=fa-]:before { margin-right:0 }
.enrichment-monitoring__status-indicator--running { background:linear-gradient(135deg,var(--color-success-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-success) }
.enrichment-monitoring__status-indicator--running .enrichment-monitoring__status-icon { color:var(--color-success);background:var(--glass-bg-dark) }
.enrichment-monitoring__status-indicator--idle { background:var(--glass-bg-medium) }
.enrichment-monitoring__status-indicator--idle .enrichment-monitoring__status-icon { color:var(--color-text-muted);background:var(--glass-bg-dark) }
.enrichment-monitoring__status-indicator--error { background:linear-gradient(135deg,var(--color-danger-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-danger) }
.enrichment-monitoring__status-indicator--error .enrichment-monitoring__status-icon { color:var(--color-danger);background:var(--glass-bg-dark) }
.enrichment-monitoring__status-text { flex:1 }
.enrichment-monitoring__status-label { color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-weight-bold) }
.enrichment-monitoring__health-badges { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);grid-template-columns:repeat(2,1fr) }
.enrichment-monitoring__health-badge { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) var(--spacing-3);background:var(--glass-bg-medium);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-md);transition:all var(--duration-medium) var(--ease-out) }
.enrichment-monitoring__health-badge--loading { opacity:50% }
.enrichment-monitoring__health-badge--healthy { background:linear-gradient(135deg,var(--color-success-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-success) }
.enrichment-monitoring__health-badge--warning { background:linear-gradient(135deg,var(--color-warning-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-warning) }
.enrichment-monitoring__health-badge--error { background:linear-gradient(135deg,var(--color-danger-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-danger) }
.enrichment-monitoring__badge-label { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-normal) }
.enrichment-monitoring__badge-status { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold) }
.enrichment-monitoring__health-badge--healthy .enrichment-monitoring__badge-status { color:var(--color-success-high-contrast) }
.enrichment-monitoring__health-badge--warning .enrichment-monitoring__badge-status { color:var(--color-warning-high-contrast) }
.enrichment-monitoring__health-badge--error .enrichment-monitoring__badge-status { color:var(--color-danger-light) }
.enrichment-monitoring__last-checked { margin-top:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs) }
.enrichment-monitoring__metric-row { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3);background:var(--glass-bg-medium);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-md) }
.enrichment-monitoring__metric-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);color:var(--color-brand-primary);font-size:var(--text-lg);background:var(--glass-bg-dark);border-radius:var(--radius-md) }
.enrichment-monitoring__metric-content { display:flex;flex:1;flex-direction:column;gap:var(--spacing-1) }
.enrichment-monitoring__metric-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-normal) }
.enrichment-monitoring__metric-value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-bold);transition:transform var(--duration-medium) var(--ease-out) }
.enrichment-monitoring__metric-value--positive { color:var(--color-success) }
.enrichment-monitoring__metric-value--negative { color:var(--color-danger) }
.enrichment-monitoring__coverage-item { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-2) }
.enrichment-monitoring__coverage-item:last-child { margin-bottom:0 }
.enrichment-monitoring__coverage-label { flex-shrink:0;width:var(--spacing-20);color:var(--color-text-secondary);font-size:var(--text-sm) }
.enrichment-monitoring__progress-bar { position:relative;overflow:hidden;flex:1;height:var(--spacing-2);background:var(--glass-bg-dark);border-radius:var(--radius-full) }
.enrichment-monitoring__progress-fill { width:0;height:100%;background:var(--color-brand-primary);border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.enrichment-monitoring__coverage-value { flex-shrink:0;width:var(--spacing-10);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);text-align:right }
.enrichment-monitoring__coverage-change { flex-shrink:0;width:var(--spacing-12);font-size:var(--text-xs);font-weight:var(--font-weight-medium) }
.enrichment-monitoring__coverage-change--positive { color:var(--color-success) }
.enrichment-monitoring__coverage-change--negative { color:var(--color-danger) }
.enrichment-monitoring__pending-badge--warning { display:inline-block;padding:var(--spacing-1) var(--spacing-2);color:var(--color-white);font-size:var(--text-lg);font-weight:var(--font-weight-bold);background:var(--color-warning);border-radius:var(--radius-base) }
.enrichment-monitoring__actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-4);padding-top:var(--spacing-3);border-top:1px solid var(--glass-border) }
@media (max-width:1400px) and (min-width:1024px) { .enrichment-monitoring__grid { grid-template-columns:repeat(2,1fr) }
.enrichment-monitoring__card--activity { grid-column:1/-1 }
 }
@media (max-width:768px) { .enrichment-monitoring { padding:var(--spacing-4) }
.enrichment-monitoring__grid { grid-template-columns:1fr }
.enrichment-monitoring__card { padding:var(--spacing-4) }
.enrichment-monitoring__health-badges { grid-template-columns:1fr }
.enrichment-monitoring__metric-value { font-size:var(--text-xl) }
 }
@media (prefers-reduced-motion:reduce) { .enrichment-monitoring__card,.enrichment-monitoring__metric-value,.enrichment-monitoring__progress-fill,.enrichment-monitoring__status-indicator { transition:none }
 }
@media (prefers-contrast:more) { .enrichment-monitoring__card { border:2px solid var(--color-text-primary) }
.enrichment-monitoring__health-badge--healthy { border:2px solid var(--color-success-high-contrast) }
.enrichment-monitoring__health-badge--warning { border:2px solid var(--color-warning-high-contrast) }
.enrichment-monitoring__health-badge--error { border:2px solid var(--color-danger-light) }
 }
.enrichment-monitoring { position:relative;backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium) }
.enrichment-monitoring__card { position:relative;backdrop-filter:var(--backdrop-blur-light);-webkit-backdrop-filter:var(--backdrop-blur-light);overflow:hidden }
.enrichment-monitoring__card:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-05) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;border-radius:inherit;z-index:0 }
.enrichment-monitoring__card>* { position:relative;z-index:1 }
.enrichment-monitoring__card:hover:before { opacity:1 }
.enrichment-monitoring__card:hover { background:var(--glass-bg-light);border-color:var(--color-border-strong);box-shadow:var(--shadow-lg),var(--shadow-glow-brand) }
.enrichment-monitoring__card--active { background:linear-gradient(135deg,var(--color-success-very-subtle) 0,transparent 100%);border-color:var(--color-success) }
.enrichment-monitoring__card--active:hover { box-shadow:var(--shadow-lg),var(--shadow-glow-success) }
.enrichment-monitoring__status-indicator--running { box-shadow:inset 0 0 var(--spacing-4) var(--color-success-very-subtle) }
.enrichment-monitoring__status-indicator--error { box-shadow:inset 0 0 var(--spacing-4) var(--color-danger-very-subtle) }
.enrichment-monitoring__health-badge--healthy { box-shadow:0 var(--spacing-1) var(--spacing-3) rgba(34,197,94,.2) }
.enrichment-monitoring__health-badge--warning { box-shadow:0 var(--spacing-1) var(--spacing-3) rgba(245,158,11,.2) }
.enrichment-monitoring__health-badge--error { box-shadow:0 var(--spacing-1) var(--spacing-3) rgba(239,68,68,.2) }
.enrichment-monitoring__health-badge:hover { transform:translateY(calc(var(--spacing-0-5)*-1)) }
.enrichment-monitoring__health-badge--healthy:hover { box-shadow:0 var(--spacing-2) var(--spacing-4) rgba(34,197,94,.3) }
.enrichment-monitoring__health-badge--warning:hover { box-shadow:0 var(--spacing-2) var(--spacing-4) rgba(245,158,11,.3) }
.enrichment-monitoring__health-badge--error:hover { box-shadow:0 var(--spacing-2) var(--spacing-4) rgba(239,68,68,.3) }
.enrichment-monitoring__progress-fill { background:linear-gradient(90deg,var(--color-brand-primary) 0,var(--color-accent-primary) 100%);box-shadow:0 0 var(--spacing-2) var(--color-brand-primary-30) }
.enrichment-monitoring__card { animation:enrichmentCardEnter .5s var(--ease-bounce) backwards }
.enrichment-monitoring__card:first-child { animation-delay:0s }
.enrichment-monitoring__card:nth-child(2) { animation-delay:.1s }
.enrichment-monitoring__card:nth-child(3) { animation-delay:.2s }
.enrichment-monitoring__status-indicator--running { animation:statusPulse 2s var(--ease-out) infinite }
@media (prefers-reduced-motion:reduce) { .enrichment-monitoring__card { animation:none }
.enrichment-monitoring__card:before,.enrichment-monitoring__health-badge { transition:none }
.enrichment-monitoring__health-badge:hover { transform:none }
.enrichment-monitoring__status-indicator--running { animation:none }
 }
@media (max-width:1400px) and (min-width:1024px) { .webhook-monitoring__grid { grid-template-columns:repeat(2,1fr) }
.webhook-monitoring__card--activity { grid-column:1/-1 }
 }
@media (max-width:768px) { .webhook-monitoring { padding:var(--spacing-4) }
.webhook-monitoring__grid { grid-template-columns:1fr }
.webhook-monitoring__card { padding:var(--spacing-4) }
.webhook-monitoring__health-badges { grid-template-columns:1fr }
 }
@media (prefers-reduced-motion:reduce) { .webhook-monitoring__activity-item,.webhook-monitoring__card,.webhook-monitoring__status-indicator { transition:none }
 }
@media (prefers-contrast:more) { .webhook-monitoring__card { border:var(--border-width-2) solid var(--color-text-primary) }
.webhook-monitoring__health-badge--success { border:var(--border-width-2) solid var(--color-success-high-contrast) }
.webhook-monitoring__health-badge--duplicate { border:var(--border-width-2) solid var(--color-warning-high-contrast) }
.webhook-monitoring__health-badge--error { border:var(--border-width-2) solid var(--color-danger-light) }
 }
@media (prefers-reduced-motion:reduce) { .webhook-monitoring__card { animation:none }
.webhook-monitoring__card:before,.webhook-monitoring__health-badge { transition:none }
.webhook-monitoring__health-badge:hover { transform:none }
.webhook-monitoring__status-indicator--healthy { animation:none }
 }
.webhook-monitoring { margin-top:var(--spacing-8);padding:var(--spacing-6);background:var(--glass-bg-dark);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-lg) }
.webhook-monitoring__header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-6) }
.webhook-monitoring h2.webhook-monitoring__title { margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-semibold) }
.webhook-monitoring__refresh { padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);background:var(--glass-bg-medium);border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.webhook-monitoring__refresh:hover { color:var(--color-text-primary);background:var(--glass-bg-light);border-color:var(--color-border-strong) }
.webhook-monitoring__refresh:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.webhook-monitoring__grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(3,1fr) }
.webhook-monitoring__card { padding:var(--spacing-6);background:var(--glass-bg-dark);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-medium) var(--ease-out) }
.webhook-monitoring__card:hover { box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-5)*-1)) }
.webhook-monitoring__card-header { margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-3);border-bottom:1px solid var(--glass-border) }
h3.webhook-monitoring__card-title { margin:0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.webhook-monitoring__card-body { display:flex;flex-direction:column;gap:var(--spacing-3) }
.webhook-monitoring__status-indicator { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--glass-bg-medium);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-md);opacity:100%;transition:opacity var(--duration-slow) var(--ease-out) }
.webhook-monitoring__status-indicator--fade-out { opacity:0 }
.webhook-monitoring__status-indicator--fade-in { opacity:100% }
.webhook-monitoring__status-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);font-size:var(--text-2xl);border-radius:var(--radius-full) }
.webhook-monitoring__status-icon [class*=fa-],.webhook-monitoring__status-icon i { display:flex;justify-content:center;align-items:center;width:100%;height:100%;margin:0 }
.webhook-monitoring__status-icon [class*=fa-]:before { margin-right:0 }
.webhook-monitoring__status-indicator--healthy { background:linear-gradient(135deg,var(--color-success-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-success) }
.webhook-monitoring__status-indicator--healthy .webhook-monitoring__status-icon { color:var(--color-success);background:var(--glass-bg-dark) }
.webhook-monitoring__status-indicator--warning { background:linear-gradient(135deg,var(--color-warning-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-warning) }
.webhook-monitoring__status-indicator--warning .webhook-monitoring__status-icon { color:var(--color-warning);background:var(--glass-bg-dark) }
.webhook-monitoring__status-indicator--error { background:linear-gradient(135deg,var(--color-danger-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-danger) }
.webhook-monitoring__status-indicator--error .webhook-monitoring__status-icon { color:var(--color-danger);background:var(--glass-bg-dark) }
.webhook-monitoring__status-text { flex:1 }
.webhook-monitoring__status-label { color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-weight-bold) }
.webhook-monitoring__health-badges { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);grid-template-columns:repeat(2,1fr) }
.webhook-monitoring__health-badge { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) var(--spacing-3);background:var(--glass-bg-medium);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-md);transition:all var(--duration-medium) var(--ease-out) }
.webhook-monitoring__health-badge--loading { opacity:50% }
.webhook-monitoring__health-badge--success { background:linear-gradient(135deg,var(--color-success-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-success) }
.webhook-monitoring__health-badge--duplicate { background:linear-gradient(135deg,var(--color-warning-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-warning) }
.webhook-monitoring__health-badge--error { background:linear-gradient(135deg,var(--color-danger-subtle) 0,var(--glass-bg-medium) 100%);border-color:var(--color-danger) }
.webhook-monitoring__badge-label { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-normal) }
.webhook-monitoring__badge-status { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold) }
.webhook-monitoring__health-badge--success .webhook-monitoring__badge-status { color:var(--color-success-high-contrast) }
.webhook-monitoring__health-badge--duplicate .webhook-monitoring__badge-status { color:var(--color-warning-high-contrast) }
.webhook-monitoring__health-badge--error .webhook-monitoring__badge-status { color:var(--color-danger-light) }
.webhook-monitoring__last-checked { margin-top:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs) }
.webhook-monitoring__activity-list { display:flex;flex-direction:column;gap:var(--spacing-2) }
.webhook-monitoring__activity-item { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3);background:var(--glass-bg-medium);border:1px solid var(--glass-border-subtle);border-radius:var(--radius-md);transition:all var(--duration-medium) var(--ease-out) }
.webhook-monitoring__activity-item:hover { transform:translateY(calc(var(--spacing-0-5)*-1)) }
.webhook-monitoring__activity-item--success { border-left:var(--border-width-3) solid var(--color-success) }
.webhook-monitoring__activity-item--duplicate { border-left:var(--border-width-3) solid var(--color-warning) }
.webhook-monitoring__activity-item--error { border-left:var(--border-width-3) solid var(--color-danger) }
.webhook-monitoring { position:relative;backdrop-filter:var(--backdrop-blur-medium) }
.webhook-monitoring__card { position:relative;overflow:hidden;backdrop-filter:var(--backdrop-blur-light) }
.webhook-monitoring__card:before { position:absolute;inset:0;z-index:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-05) 100%);border-radius:inherit;opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;content:"" }
.webhook-monitoring__card>* { position:relative;z-index:1 }
.webhook-monitoring__card:hover:before { opacity:100% }
.webhook-monitoring__card:hover { background:var(--glass-bg-light);border-color:var(--color-border-strong);box-shadow:var(--shadow-lg),var(--shadow-glow-brand) }
.webhook-monitoring__status-indicator--healthy { box-shadow:inset 0 0 var(--spacing-4) var(--color-success-very-subtle) }
.webhook-monitoring__status-indicator--warning { box-shadow:inset 0 0 var(--spacing-4) var(--color-warning-very-subtle) }
.webhook-monitoring__status-indicator--error { box-shadow:inset 0 0 var(--spacing-4) var(--color-danger-very-subtle) }
.webhook-monitoring__health-badge--success { box-shadow:0 var(--spacing-1) var(--spacing-3) color-mix(in srgb,var(--color-success) 20%,transparent) }
.webhook-monitoring__health-badge--duplicate { box-shadow:0 var(--spacing-1) var(--spacing-3) color-mix(in srgb,var(--color-warning) 20%,transparent) }
.webhook-monitoring__health-badge--error { box-shadow:0 var(--spacing-1) var(--spacing-3) color-mix(in srgb,var(--color-danger) 20%,transparent) }
.webhook-monitoring__health-badge:hover { transform:translateY(calc(var(--spacing-0-5)*-1)) }
.webhook-monitoring__health-badge--success:hover { box-shadow:0 var(--spacing-2) var(--spacing-4) color-mix(in srgb,var(--color-success) 30%,transparent) }
.webhook-monitoring__health-badge--duplicate:hover { box-shadow:0 var(--spacing-2) var(--spacing-4) color-mix(in srgb,var(--color-warning) 30%,transparent) }
.webhook-monitoring__health-badge--error:hover { box-shadow:0 var(--spacing-2) var(--spacing-4) color-mix(in srgb,var(--color-danger) 30%,transparent) }
.webhook-monitoring__card { animation:webhookCardEnter .5s var(--ease-bounce) backwards }
.webhook-monitoring__card:first-child { animation-delay:0s }
.webhook-monitoring__card:nth-child(2) { animation-delay:.1s }
.webhook-monitoring__card:nth-child(3) { animation-delay:.2s }
.webhook-monitoring__status-indicator--healthy { animation:webhookStatusPulse 2s var(--ease-out) infinite }
.enrichment-review-page .sg-btn { padding:var(--spacing-2) var(--spacing-4) }
.enrichment-review__summary { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(3,1fr);margin-bottom:var(--spacing-8) }
.enrichment-review__summary-card { padding:var(--spacing-6);text-align:center;background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:box-shadow var(--duration-fast) var(--ease-out) }
.enrichment-review__summary-card:hover { box-shadow:var(--shadow-sm),var(--shadow-glow-sm-brand) }
.enrichment-review__summary-value { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-4xl);font-weight:var(--font-weight-bold) }
.enrichment-review__summary-value--warning { color:var(--color-warning-text) }
.enrichment-review__summary-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-medium) }
.enrichment-review__actions { display:flex;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-4);padding:var(--spacing-4);color:var(--color-text-primary);background:var(--color-surface-secondary);border-radius:var(--radius-lg) }
.enrichment-review__select-all { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary) }
.enrichment-review__selected-count { color:var(--color-text-secondary) }
.enrichment-review__actions-buttons { display:flex;gap:var(--spacing-2);margin-left:auto }
.enrichment-review__actions-buttons .btn { padding:var(--spacing-2) var(--spacing-4) }
.enrichment-review__table-wrapper { overflow-x:auto;background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm) }
.enrichment-review__table { width:100%;border-collapse:collapse }
.enrichment-review__table td,.enrichment-review__table th { padding:var(--spacing-4);text-align:left;border-bottom:1px solid var(--glass-border) }
.enrichment-review__table th { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.05em;background:var(--glass-bg-medium) }
.enrichment-review__table tbody tr { transition:background var(--duration-fast) var(--ease-out) }
.enrichment-review__table tbody td { transition:color var(--duration-fast) var(--ease-out) }
.enrichment-review__table tbody tr:hover { background:var(--glass-bg-medium) }
.enrichment-review__table tbody tr:hover td { color:var(--color-text-primary) }
.enrichment-review__table tbody tr:last-child td { border-bottom:none }
.enrichment-review__col-checkbox { width:var(--spacing-10) }
.enrichment-review__col-actions { width:var(--spacing-32) }
.enrichment-review__club-name { color:var(--color-text-primary);font-weight:var(--font-weight-semibold) }
.enrichment-review__club-name a { color:var(--color-text-on-dark);text-decoration:none;transition:color var(--duration-fast) var(--ease-out) }
.enrichment-review__table tbody tr:hover .enrichment-review__club-name a { color:var(--color-text-primary) }
.enrichment-review__club-name a:hover { color:var(--color-brand-primary);text-decoration:underline }
.enrichment-review__field-badges { display:flex;flex-wrap:wrap;gap:var(--spacing-1) }
.enrichment-review__field-badge { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-weight-medium);background:var(--glass-bg-medium);border-radius:var(--radius-base) }
.enrichment-review__confidence { display:flex;align-items:center;gap:var(--spacing-2) }
.enrichment-review__confidence-bar { position:relative;overflow:hidden;width:var(--spacing-20);height:var(--spacing-2);background:var(--glass-border);border-radius:var(--radius-full) }
.enrichment-review__confidence-fill { height:100%;background:var(--color-brand-primary);border-radius:var(--radius-full);transition:width var(--duration-medium) var(--ease-out) }
.enrichment-review__confidence-fill--high { background:var(--color-success) }
.enrichment-review__confidence-fill--medium { background:var(--color-warning) }
.enrichment-review__confidence-fill--low { background:var(--color-danger) }
.enrichment-review__confidence-value { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold) }
.enrichment-review__row-actions { display:flex;gap:var(--spacing-2) }
.enrichment-review__action-btn { padding:var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-sm);background:transparent;border:none;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.enrichment-review__action-btn:hover { color:var(--color-text-primary);background:var(--glass-bg-medium) }
.enrichment-review__action-btn:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.enrichment-review__action-btn--approve:hover { color:var(--color-success-text);background:var(--color-success-subtle) }
.enrichment-review__action-btn--reject:hover { color:var(--color-danger-text);background:var(--color-danger-subtle) }
.enrichment-review__empty { padding:var(--spacing-12);text-align:center }
.enrichment-review__empty-icon { margin-bottom:var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-5xl) }
.enrichment-review__empty-text { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.enrichment-review__empty-subtext { color:var(--color-text-muted);font-size:var(--text-sm) }
@media (max-width:1024px) { .enrichment-review__summary { grid-template-columns:repeat(2,1fr) }
.enrichment-review__summary-card:last-child { grid-column:1/-1 }
 }
@media (max-width:768px) { .enrichment-review__summary { grid-template-columns:1fr }
.enrichment-review__actions { flex-direction:column;align-items:stretch }
.enrichment-review__actions-buttons { margin-left:0;margin-top:var(--spacing-3) }
.enrichment-review__table td,.enrichment-review__table th { padding:var(--spacing-3) }
 }
@media (prefers-reduced-motion:reduce) { .enrichment-review__action-btn,.enrichment-review__confidence-fill,.enrichment-review__table tbody tr { transition:none }
 }
.enrichment-review-page .modal { position:fixed;inset:var(--spacing-0);z-index:var(--z-modal-backdrop);display:none;visibility:hidden;flex-direction:row;justify-content:center;align-items:center;width:100%;max-width:none;height:100%;max-height:none;padding:var(--spacing-4);background:transparent;border-radius:0;box-shadow:none;opacity:0 }
.enrichment-review-page .modal.modal--active { display:flex;visibility:visible;opacity:100% }
.enrichment-review-page .modal__backdrop { position:absolute;inset:var(--spacing-0);z-index:-1;background:var(--overlay-dark);backdrop-filter:blur(var(--spacing-1)) }
.enrichment-review-page .modal__content { position:relative;z-index:var(--z-modal);display:flex;overflow:hidden;flex-direction:column;width:90%;max-width:var(--container-md);max-height:var(--modal-max-height);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border:var(--spacing-px) solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl) }
.enrichment-review-page .modal__content--large { max-width:var(--modal-width-context-inspector) }
.enrichment-review-page .modal__header { background:var(--glass-bg-dark);border-bottom:var(--spacing-px) solid var(--glass-border) }
.enrichment-review-page .modal__title { color:var(--color-text-primary) }
.enrichment-review-page .modal__close { color:var(--color-text-muted) }
.enrichment-review-page .modal__close:hover { color:var(--color-text-primary) }
.enrichment-review-page .modal__body { background:var(--glass-bg-dark);color:var(--color-text-primary) }
.enrichment-review-page .modal__footer { background:var(--glass-bg-dark);border-top:var(--spacing-px) solid var(--glass-border) }
.enrichment-review-page .detail-section { margin-bottom:var(--spacing-6) }
.enrichment-review-page .detail-section:last-child { margin-bottom:var(--spacing-0) }
.enrichment-review-page .detail-section h4 { margin:var(--spacing-0) var(--spacing-0) var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:var(--tracking-wider) }
.enrichment-review-page .detail-section p { margin:var(--spacing-0);color:var(--color-text-primary) }
.enrichment-review-page .detail-table { width:100%;border-collapse:collapse }
.enrichment-review-page .detail-table td,.enrichment-review-page .detail-table th { padding:var(--spacing-3);text-align:left;border-bottom:var(--spacing-px) solid var(--glass-border) }
.enrichment-review-page .detail-table th { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);background:var(--glass-bg-medium) }
.enrichment-review-page .detail-table tbody { background:var(--glass-bg-dark) }
.enrichment-review-page .detail-table td { color:var(--color-text-primary);font-size:var(--text-sm);background:var(--glass-bg-dark) }
.enrichment-review-page .detail-table td strong { color:var(--color-text-primary);font-weight:var(--font-weight-semibold) }
.enrichment-review-page .detail-table .u-text-muted,.enrichment-review-page .modal .u-text-muted { color:var(--color-text-muted) }
.enrichment-review-page .modal .u-text-success { color:var(--color-success) }
.enrichment-review-page .modal label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-weight:var(--font-weight-medium) }
.enrichment-review-page .modal .form-control { width:100%;padding:var(--spacing-3);color:var(--color-text-primary);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--glass-border);border-radius:var(--radius-md) }
.enrichment-review-page .modal .form-control::placeholder { color:var(--color-text-muted) }
.enrichment-review__stale-warning { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);color:var(--color-warning-text);font-size:var(--text-sm);background:var(--color-warning-subtle);border:var(--spacing-px) solid var(--color-warning-300);border-radius:var(--radius-lg) }
.enrichment-review__stale-warning i { color:var(--color-warning-text);font-size:var(--text-lg);flex-shrink:0 }
.retool-reports__status { display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-gap:var(--spacing-4);gap:var(--spacing-4);margin-bottom:var(--spacing-6) }
.retool-reports__status-card { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-base);border-radius:var(--radius-md);border:var(--border-width-1) solid var(--color-border-default);box-shadow:var(--shadow-sm);transition:all var(--duration-fast) var(--ease-in-out) }
.retool-reports__status-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px) }
.retool-reports__status-icon { display:flex;align-items:center;justify-content:center;width:var(--size-icon-md);height:var(--size-icon-md);border-radius:var(--radius-full);background-color:var(--color-surface-elevated);font-size:var(--text-xl);color:var(--color-text-secondary) }
.retool-reports__status-icon [class*=fa-],.retool-reports__status-icon i { display:flex;align-items:center;justify-content:center;margin:0;width:100%;height:100% }
.retool-reports__status-icon [class*=fa-]:before { margin-right:0 }
.retool-reports__status-icon .status--success { color:var(--color-success) }
.retool-reports__status-icon .status--error { color:var(--color-danger) }
.retool-reports__status-label { font-size:var(--font-size-sm);color:var(--color-text-on-dark-secondary);margin-bottom:var(--spacing-1) }
.retool-reports__status-value { font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-on-dark) }
.retool-reports__status-value.status--active { color:var(--color-success) }
.retool-reports__status-value.status--inactive { color:var(--color-danger) }
.retool-reports__generator,.retool-reports__history,.retool-reports__mapping { background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border-radius:var(--radius-lg);border:var(--border-width-1) solid var(--glass-border);padding:var(--spacing-5);margin-bottom:var(--spacing-6);box-shadow:var(--shadow-sm) }
.retool-reports__section-title { font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-4) 0 }
.retool-reports__section-desc { font-size:var(--text-sm);color:var(--color-text-secondary);margin:calc(var(--spacing-2)*-1) 0 var(--spacing-4) 0 }
.retool-reports__form { display:flex;flex-direction:column;gap:var(--spacing-4) }
.retool-reports__form-row { display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-gap:var(--spacing-4);gap:var(--spacing-4) }
.retool-reports__form-group { display:flex;flex-direction:column;gap:var(--spacing-2) }
.retool-reports__form-group label { font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary) }
.retool-reports__form-actions { display:flex;justify-content:flex-end;padding-top:var(--spacing-2) }
.retool-reports__progress { background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border-radius:var(--radius-lg);border:var(--border-width-1) solid var(--glass-border);padding:var(--spacing-5);margin-bottom:var(--spacing-6) }
.retool-reports__progress-container { margin-bottom:var(--spacing-4) }
.retool-reports__progress-bar { height:var(--spacing-2);background-color:var(--color-surface-elevated);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--spacing-2) }
.retool-reports__progress-fill { width:0;height:100%;background:var(--color-brand-primary);border-radius:var(--radius-full);transition:width var(--duration-medium) var(--ease-out) }
.retool-reports__progress-text { display:flex;justify-content:space-between;font-size:var(--text-sm);color:var(--color-text-secondary) }
.retool-reports__table-wrapper { overflow-x:auto }
.retool-reports__table { width:100%;border-collapse:collapse;font-size:var(--text-sm) }
.retool-reports__table td,.retool-reports__table th { padding:var(--spacing-3);text-align:left;border-bottom:var(--border-width-1) solid var(--color-border-default) }
.retool-reports__table th { font-weight:var(--font-weight-semibold);color:var(--color-brand-primary);background-color:var(--color-surface-elevated);white-space:nowrap }
.retool-reports__table td { color:var(--color-text-primary) }
.retool-reports__table tbody tr:hover { background-color:var(--color-surface-hover) }
.retool-reports__col-actions { width:80px;text-align:center }
.retool-reports__status-badge { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--font-weight-medium);text-transform:uppercase }
.retool-reports__status-badge--pending { background-color:var(--color-warning-bg);color:var(--color-warning-text) }
.retool-reports__status-badge--running { background-color:var(--color-info-bg);color:var(--color-info-text) }
.retool-reports__status-badge--completed { background-color:var(--color-success-bg);color:var(--color-success-text) }
.retool-reports__status-badge--failed { background-color:var(--color-danger-bg);color:var(--color-danger-text) }
.retool-reports__status-badge--cancelled { background-color:var(--color-surface-elevated);color:var(--color-text-secondary) }
.retool-reports__empty { display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-8);text-align:center }
.retool-reports__empty-icon { font-size:var(--text-5xl);color:var(--color-text-muted);margin-bottom:var(--spacing-4) }
.retool-reports__empty-text { font-size:var(--text-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-2) }
.retool-reports__empty-subtext { font-size:var(--text-sm);color:var(--color-text-secondary) }
.retool-reports__mapping-form { display:flex;gap:var(--spacing-3);margin-bottom:var(--spacing-4) }
.retool-reports__mapping-form input { flex:1 }
.retool-reports__mapping-list { display:flex;flex-direction:column;gap:var(--spacing-2) }
.retool-reports__mapping-item { display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-3);background-color:var(--color-surface-elevated);border-radius:var(--radius-sm);transition:background-color var(--duration-fast) var(--ease-in-out) }
.retool-reports__mapping-item:hover { background-color:var(--color-surface-hover) }
.retool-reports__mapping-name { font-weight:var(--font-weight-medium);color:var(--color-text-primary) }
.retool-reports__mapping-uuid { font-size:var(--text-xs);font-family:var(--font-mono);color:var(--color-text-secondary) }
.retool-reports__mapping-empty { padding:var(--spacing-4);text-align:center;color:var(--color-text-secondary);font-style:italic }
.retool-reports__search-results { max-height:200px;overflow-y:auto;border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-sm);margin-top:var(--spacing-2);background:var(--color-surface-base) }
.retool-reports__search-result { padding:var(--spacing-2) var(--spacing-3);cursor:pointer;color:var(--color-text-primary);transition:background-color var(--duration-fast) var(--ease-in-out) }
.retool-reports__search-result:hover { background-color:var(--color-surface-hover) }
.retool-reports__search-empty { padding:var(--spacing-3);text-align:center;color:var(--color-text-secondary);font-style:italic }
.retool-reports__success-icon { text-align:center;font-size:48px;color:var(--color-success);margin-bottom:var(--spacing-4) }
.retool-reports__success-details { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);padding:var(--spacing-4);background-color:var(--color-surface-elevated);border-radius:var(--radius-sm);font-size:var(--text-sm);color:var(--color-text-primary) }
@media (max-width:768px) { .retool-reports__form-row,.retool-reports__status { grid-template-columns:1fr }
.retool-reports__mapping-form { flex-direction:column }
.retool-reports__table { font-size:var(--text-xs) }
.retool-reports__table td,.retool-reports__table th { padding:var(--spacing-2) }
 }
.monitoring-rum { margin-top:var(--spacing-6) }
.monitoring-rum__status { margin-top:var(--spacing-1);color:var(--color-text-muted);font-size:var(--font-size-sm) }
.monitoring-rum__status--enabled { color:var(--accent) }
.monitoring-rum__status--disabled { color:var(--text-subtle) }
.monitoring-rum__message { margin-bottom:var(--spacing-4);padding:var(--spacing-3);color:var(--color-text-muted);font-size:var(--font-size-sm);background-color:var(--bg-muted);border-radius:var(--radius-sm) }
.monitoring-rum__message--success { color:var(--color-success-text);background-color:var(--color-success-subtle) }
.monitoring-rum__message--error { color:var(--color-danger-text);background-color:var(--color-danger-subtle) }
.monitoring-rum__message--warning { color:var(--color-warning-text);background-color:var(--color-warning-subtle) }
.monitoring-rum__grid { display:grid;grid-gap:var(--spacing-5);gap:var(--spacing-5);grid-template-columns:repeat(auto-fit,minmax(280px,1fr)) }
.monitoring-rum__section { display:flex;flex-direction:column;gap:var(--spacing-3) }
.monitoring-rum__section-header { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-2) }
.monitoring-rum__section-header h3 { margin:0;font-size:var(--font-size-md);font-weight:var(--font-weight-semibold) }
.monitoring-rum__badge { display:inline-flex;justify-content:center;align-items:center;min-width:var(--spacing-10);padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-muted);font-size:var(--font-size-xs);background-color:var(--bg-muted);border-radius:var(--radius-pill) }
.monitoring-rum__list { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);margin:0;padding:0;list-style:none }
.monitoring-rum__list-item { display:flex;flex-direction:column;gap:var(--spacing-2);padding:var(--spacing-4);background-color:var(--bg-surface);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-xs) }
.monitoring-rum__list-header { display:flex;justify-content:space-between;align-items:baseline;gap:var(--spacing-2) }
.monitoring-rum__list-title { margin:0;font-size:var(--font-size-base) }
.monitoring-rum__list-time { color:var(--color-text-muted);font-size:var(--font-size-xs) }
.monitoring-rum__list-message { margin:0;font-size:var(--font-size-sm) }
.monitoring-rum__list-meta { margin:0;color:var(--text-subtle);font-size:var(--font-size-xs) }
.monitoring-rum__list-stack { padding:var(--spacing-2);font-size:var(--font-size-xs);background-color:var(--bg-muted);border-radius:var(--radius-sm) }
.monitoring-rum__summary { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);margin:0 }
.monitoring-rum__summary-item { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-3) }
.monitoring-rum__summary-term { margin:0;font-weight:var(--font-weight-medium) }
.monitoring-rum__summary-value { display:flex;flex-direction:column;align-items:flex-end;gap:var(--spacing-1);margin:0 }
.monitoring-rum__summary-count { font-size:var(--font-size-sm);font-weight:var(--font-weight-medium) }
.monitoring-rum__summary-detail { color:var(--text-subtle);font-size:var(--font-size-xs) }
.monitoring-rum__histogram { margin-top:var(--spacing-4) }
.monitoring-rum__histogram-list { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);margin:0;padding:0;list-style:none }
.monitoring-rum__histogram-item { display:grid;align-items:center;grid-gap:var(--spacing-2);gap:var(--spacing-2);grid-template-columns:1fr auto }
.monitoring-rum__histogram-label { color:var(--text-subtle);font-size:var(--font-size-xs) }
.monitoring-rum__histogram-bar { grid-column:1/3;width:100%;height:var(--spacing-3) }
.monitoring-rum__histogram-count { color:var(--color-text-muted);font-size:var(--font-size-xs) }
.monitoring-rum__empty { padding:var(--spacing-3);color:var(--color-text-muted);font-size:var(--font-size-sm);background-color:var(--bg-muted);border-radius:var(--radius-sm) }
.monitoring-rum--loading .monitoring-rum__grid { opacity:50%;transition:opacity var(--duration-200) ease-in-out }
@media (max-width:768px) { .deprecation-banner__content { flex-direction:column;gap:var(--spacing-3);text-align:center }
.deprecation-banner__actions { justify-content:center;width:100% }
.monitoring-page-body { margin-top:var(--spacing-30) }
 }
.deprecation-banner { position:fixed;top:0;right:0;left:0;z-index:var(--z-notification);background:linear-gradient(135deg,var(--color-warning) 0,var(--color-warning-dark) 100%);border-bottom:var(--spacing-1) solid var(--color-warning-text);box-shadow:var(--shadow-lg);animation:slideDown .5s ease-out }
.deprecation-banner__content { display:flex;align-items:center;gap:var(--spacing-4);max-width:var(--container-xl);margin:0 auto;padding:var(--spacing-4) var(--spacing-6) }
.deprecation-banner__icon { flex-shrink:0;color:var(--color-text-on-dark);font-size:var(--text-2xl) }
.deprecation-banner__text { flex:1;color:var(--color-text-on-dark) }
.deprecation-banner__text h3 { margin:0 0 var(--spacing-1) 0;font-size:var(--text-lg);font-weight:var(--font-semibold) }
.deprecation-banner__text p { margin:0;font-size:var(--text-sm);opacity:90% }
.deprecation-banner__actions { display:flex;flex-shrink:0;gap:var(--spacing-2) }
.deprecation-banner .btn { padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm) }
.deprecation-banner .btn--primary { color:var(--color-warning-dark);background:var(--color-neutral-0);border:none }
.deprecation-banner .btn--primary:hover { background:var(--color-neutral-100);transform:translateY(var(--motion-raise-sm)) }
.deprecation-banner .btn--secondary { color:var(--color-text-on-dark);background:var(--overlay-light-20);border:var(--spacing-px) solid var(--overlay-light-30) }
.deprecation-banner .btn--secondary:hover { background:var(--overlay-light-30) }
.deprecation-banner--hidden { display:none }
.monitoring-page-body { margin-top:var(--spacing-20) }
@media (prefers-reduced-motion:reduce) { .deprecation-banner { animation:none }
 }
.unified-dashboard { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-areas:"header header" "summary summary" "patterns patterns" "trends trends" "insights insights" "benchmarks benchmarks" "activity activity";grid-template-rows:auto auto auto auto auto auto auto;grid-template-columns:1fr 320px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg-primary);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border:1px solid var(--glass-border-subtle) }
@media (min-width:1200.02px) { .unified-dashboard { grid-template-areas:"header header" "summary activity" "patterns activity" "trends activity" "insights activity" "benchmarks activity";grid-template-rows:auto auto auto auto auto auto;grid-template-columns:1fr 320px }
 }
@media (max-width:1200px) { .unified-dashboard { gap:var(--spacing-4);grid-template-areas:"header" "summary" "patterns" "trends" "insights" "benchmarks" "activity";grid-template-rows:repeat(7,auto);grid-template-columns:1fr;padding:var(--spacing-4) }
.summary-cards { grid-template-columns:1fr }
 }
.dashboard-header { display:flex;justify-content:space-between;align-items:center;grid-area:header;padding:var(--spacing-6);background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm) }
.header-left { display:flex;align-items:center;gap:var(--spacing-4) }
.header-left h1 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:1.75rem;font-weight:700 }
.status-indicator { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-secondary);font-size:.875rem }
.status-dot { width:var(--spacing-2);height:var(--spacing-2);background:var(--danger-color);border-radius:50%;transition:var(--transition) }
.status-dot.connected { background:var(--success-color);animation:pulse 2s infinite }
.header-controls { display:flex;align-items:center;gap:var(--spacing-3) }
.timeframe-select { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:.875rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.timeframe-select:hover { border-color:var(--primary-color) }
.btn-export,.btn-refresh { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:.875rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.btn-refresh:hover { color:var(--color-neutral-0);background:var(--primary-color);border-color:var(--primary-color) }
.btn-export:hover { color:var(--color-neutral-0);background:var(--success-color);border-color:var(--success-color) }
.loading-overlay { z-index:var(--z-index-overlay);visibility:hidden;background:var(--overlay-bg);opacity:0;transition:var(--transition) }
.loading-overlay.show { visibility:visible;opacity:100% }
.loading-spinner { width:var(--spacing-10);height:var(--spacing-10);margin-bottom:var(--spacing-4);border:var(--spacing-1) solid var(--border-color);border-top:var(--spacing-1) solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite }
.summary-cards { display:grid;align-items:start;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-area:summary;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(min-content,max-content);contain:layout }
.metric-card { position:relative;overflow:hidden;align-self:start;max-height:fit-content;padding:var(--spacing-6);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%);border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-brand);transition:all var(--duration-base) var(--ease-out);contain:layout style;animation:metricCardEnter .5s var(--ease-bounce) backwards }
.metric-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md),var(--shadow-glow-sm-brand);border-color:var(--color-border-strong);background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%) }
.metric-card:first-child { animation-delay:var(--delay-stagger-fine-1) }
.metric-card:nth-child(2) { animation-delay:var(--delay-stagger-fine-2) }
.metric-card:nth-child(3) { animation-delay:var(--delay-stagger-fine-3) }
.metric-card:nth-child(4) { animation-delay:var(--delay-stagger-fine-4) }
.metric-card:nth-child(5) { animation-delay:var(--delay-stagger-fine-5) }
.metric-card:nth-child(6) { animation-delay:var(--delay-stagger-fine-6) }
.metric-card:nth-child(7) { animation-delay:var(--delay-stagger-fine-7) }
.metric-card:nth-child(8) { animation-delay:var(--delay-stagger-fine-8) }
.card-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4) }
.card-header h3 { margin:var(--spacing-0);color:var(--color-text-secondary);font-size:1rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase }
.card-actions { display:flex;gap:var(--spacing-2) }
.btn-drill-down { font-size:1rem;background:none;border:none;opacity:60%;transition:var(--transition);cursor:pointer }
.btn-drill-down:hover { opacity:100%;transform:scale(1.1) }
.metric-value { margin:var(--spacing-2) 0;color:var(--color-text-primary);font-size:var(--text-5xl);font-weight:var(--font-bold);line-height:var(--leading-tight) }
.metric-detail { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-lg);font-weight:var(--font-medium) }
.metric-detail i { margin-right:var(--spacing-1);color:var(--color-brand-primary);opacity:80% }
.metric-benchmark { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:.75rem }
.metric-trend { margin:var(--spacing-2) 0;font-size:.875rem;font-weight:600 }
.metric-good { color:var(--success-color) }
.metric-warning { color:var(--warning-color) }
.metric-poor { color:var(--danger-color) }
.trend-up { color:var(--success-color) }
.trend-down { color:var(--danger-color) }
.trend-flat { color:var(--color-text-secondary) }
.metric-progress { margin-top:var(--spacing-4) }
.progress-bar { overflow:hidden;width:100%;height:var(--spacing-1);background:var(--border-color);border-radius:var(--radius-sm) }
.progress-fill { height:100%;background:var(--success-color);border-radius:var(--radius-sm);transition:width .5s ease }
.learning-breakdown,.pattern-list,.response-breakdown { margin-top:var(--spacing-3);padding:var(--spacing-2) 0 }
.learning-item,.pattern-item,.response-item { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-3);padding:var(--spacing-2) 0;color:var(--color-text-secondary);font-size:var(--text-sm);border-bottom:1px solid var(--color-border-subtle) }
.learning-item:last-child,.pattern-item:last-child,.response-item:last-child { border-bottom:none }
.learning-item>span:first-child,.pattern-item>span:first-child,.response-item>span:first-child { overflow:hidden;flex:1;min-width:0;text-overflow:ellipsis;white-space:nowrap }
.learning-count,.pattern-effectiveness-value,.response-rate-value { flex-shrink:0;color:var(--color-success);font-size:var(--text-sm);font-weight:var(--font-semibold);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.loading-placeholder { display:flex;justify-content:center;align-items:center;gap:var(--spacing-2);padding:var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-sm);font-style:italic }
.charts-container { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-area:charts;grid-template-columns:1fr 1fr }
@media (max-width:768px) { .charts-container { grid-template-columns:1fr }
 }
.chart-section { max-height:fit-content;padding:var(--spacing-6);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%);border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-brand);contain:layout style;animation:metricCardEnter .5s var(--ease-bounce) backwards }
.chart-section--patterns { grid-area:patterns }
.chart-section--trends { grid-area:trends }
.chart-section__container { position:relative;overflow:hidden;width:100%;height:var(--spacing-75);max-height:var(--spacing-75);contain:layout style size }
.chart-canvas { position:absolute;top:0;left:0;width:100%;max-width:100%;height:100%;max-height:100% }
.section-header { margin-bottom:var(--spacing-6) }
.section-header h2 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:1.25rem;font-weight:600 }
.chart-controls { display:flex;gap:var(--spacing-1);padding:var(--spacing-1);background:var(--bg-primary);border-radius:var(--border-radius) }
.btn-chart-option { display:flex;align-items:center;gap:var(--spacing-1-5);padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-medium);background:transparent;border:1px solid transparent;border-radius:var(--radius-md);opacity:60%;transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.btn-chart-option:hover { color:var(--color-text-secondary);background:var(--color-surface-hover);border-color:var(--color-border-default);opacity:80% }
.btn-chart-option:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.btn-chart-option.active { color:var(--color-brand-primary);font-weight:var(--font-semibold);background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary);box-shadow:0 0 0 var(--spacing-0-5) var(--color-brand-primary-subtle);opacity:100% }
.btn-chart-option.active:hover { background:var(--color-brand-primary-hover);border-color:var(--color-brand-primary-light);box-shadow:0 0 0 var(--spacing-1) var(--color-brand-primary-hover) }
.btn-chart-option i { font-size:var(--text-base);opacity:70% }
.btn-chart-option.active i { opacity:100% }
.chart-container canvas { max-height:100% }
.correlation-matrix { margin-top:var(--spacing-4);padding:var(--spacing-4);background:var(--bg-primary);border-radius:var(--border-radius) }
.correlation-matrix h4 { margin:var(--spacing-0) 0 var(--spacing-3) var(--spacing-0);color:var(--color-text-primary);font-size:.875rem;font-weight:600 }
.correlation-list { margin:var(--spacing-0);padding:var(--spacing-0);list-style:none }
.correlation-item { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2) 0;font-size:.875rem;border-bottom:var(--spacing-px) solid var(--border-color) }
.correlation-item:last-child { border-bottom:none }
.pattern-combo { color:var(--color-text-primary);font-weight:500 }
.correlation-value { color:var(--success-color);font-weight:600 }
.correlation-loading,.insights-loading { padding:var(--spacing-8);color:var(--color-text-secondary);font-style:italic;text-align:center }
.insights-section { padding:var(--spacing-6);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%);border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-brand);animation:metricCardEnter .5s var(--ease-bounce) backwards }
.insights-section--ai { grid-area:insights }
.insights-refresh { display:flex;align-items:center }
.btn-secondary { padding:var(--spacing-1-5) var(--spacing-3);color:var(--color-text-primary);font-size:.75rem;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.btn-secondary:hover { background:var(--border-color) }
.insights-tabs { display:flex;overflow-x:auto;gap:var(--spacing-2);margin-bottom:var(--spacing-6);border-bottom:var(--spacing-0-5) solid var(--border-color) }
.tab-btn { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:.875rem;white-space:nowrap;background:none;border:none;border-bottom:var(--spacing-0-5) solid transparent;transition:var(--transition);cursor:pointer }
.tab-btn:hover { color:var(--color-text-primary) }
.tab-btn.active { color:var(--primary-color);border-bottom-color:var(--primary-color) }
.count { display:inline-flex;justify-content:center;align-items:center;min-width:var(--spacing-5);height:var(--spacing-5);padding:var(--spacing-0) var(--spacing-1);color:var(--color-neutral-0);font-size:.625rem;font-weight:600;background:var(--primary-color);border-radius:50% }
.insights-content { min-height:var(--spacing-50) }
.anomalies-list,.experiments-list,.improvements-list,.recommendations-list { display:flex;flex-direction:column;gap:var(--spacing-4) }
.anomaly-card,.experiment-card,.improvement-card,.recommendation-card { padding:var(--spacing-4);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%);border:1px solid var(--border-color);border-radius:var(--border-radius);transition:all var(--duration-base) var(--ease-out);animation:metricCardEnter .5s var(--ease-bounce) backwards }
.experiment-card:hover,.recommendation-card:hover { transform:translateY(-2px);border-color:var(--primary-color);box-shadow:var(--shadow-md),var(--shadow-glow-sm-brand);background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%) }
.anomaly-card { background:rgb(245 158 11/5%);border-color:var(--warning-color) }
.improvement-card { background:rgb(16 185 129/5%);border-color:var(--success-color) }
.card-title { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-weight:600 }
.card-description { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:.875rem }
.card-meta { display:flex;gap:var(--spacing-4);margin-bottom:var(--spacing-4);color:var(--color-text-secondary);font-size:.75rem }
.card-actions,.experiment-actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-4) }
.btn-apply-recommendation,.btn-start-experiment { padding:var(--spacing-2) var(--spacing-4);color:var(--color-neutral-0);font-size:.875rem;background:var(--success-color);border:none;border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.btn-apply-recommendation:hover,.btn-start-experiment:hover { background:var(--color-success-dark) }
.btn-dismiss { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:.875rem;background:transparent;border:1px solid var(--border-color);border-radius:var(--border-radius);transition:var(--transition);cursor:pointer }
.btn-dismiss:hover { background:var(--border-color) }
.benchmarks-section { grid-area:benchmarks;padding:var(--spacing-6);background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%);border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-brand);animation:metricCardEnter .5s var(--ease-bounce) backwards }
.benchmarks-period { color:var(--color-text-secondary);font-size:.875rem }
.benchmarks-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-top:var(--spacing-4) }
.benchmark-card { padding:var(--spacing-4);text-align:center;background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%);border-radius:var(--border-radius);transition:all var(--duration-base) var(--ease-out);animation:metricCardEnter .5s var(--ease-bounce) backwards }
.benchmark-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md),var(--shadow-glow-sm-brand);border-color:var(--color-border-strong);background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%) }
.benchmark-icon { margin-bottom:var(--spacing-2);font-size:2rem }
.benchmark-title { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase }
.benchmark-value { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:1.5rem;font-weight:700 }
.benchmark-date,.benchmark-effectiveness { color:var(--color-text-secondary);font-size:.75rem }
.activity-feed { display:flex;flex-direction:column;align-self:start;grid-area:activity;background:linear-gradient(135deg,var(--color-surface-primary) 0,var(--color-surface-elevated) 100%);border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-brand);contain:layout style;animation:metricCardEnter .5s var(--ease-bounce) backwards }
@media (min-width:1200.02px) { .activity-feed { position:sticky;top:var(--spacing-6);overflow:hidden auto;max-height:calc(100vh - var(--spacing-12)) }
 }
@media (max-width:1200px) { .activity-feed { overflow:hidden auto;max-height:var(--size-filters-max) }
 }
.feed-header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4);border-bottom:var(--spacing-px) solid var(--border-color) }
.feed-header h3 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:1rem;font-weight:600 }
.btn-clear { color:var(--color-text-secondary);font-size:.75rem;background:none;border:none;transition:var(--transition);cursor:pointer }
.btn-clear:hover { color:var(--color-text-primary) }
.activity-list { overflow-y:auto;flex:1;padding:var(--spacing-2) }
.activity-item { align-items:flex-start;margin-bottom:var(--spacing-2);font-size:.875rem;border-radius:var(--border-radius);transition:var(--transition);animation:fade-in .3s ease-in }
.activity-item:hover { background:var(--bg-primary) }
.activity-item.welcome { background:var(--color-info-subtle);border:1px solid rgba(59,130,246,.2) }
.activity-time { min-width:var(--spacing-12);color:var(--color-text-secondary);white-space:nowrap }
.activity-type { min-width:var(--spacing-16);color:var(--primary-color);font-weight:600 }
.activity-desc { flex:1;color:var(--color-text-primary) }
.unified-metrics-page .modal { position:fixed;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);z-index:var(--z-index-overlay);display:flex;visibility:hidden;justify-content:center;align-items:center;background:var(--overlay-bg);opacity:0;transition:var(--transition) }
.unified-metrics-page .modal.show { visibility:visible;opacity:100% }
.unified-metrics-page .modal-content { overflow:hidden;width:90%;max-width:var(--spacing-150);max-height:80vh;background:var(--bg-secondary);border-radius:var(--border-radius);box-shadow:var(--shadow-lg) }
.unified-metrics-page .modal-header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4) var(--spacing-6);border-bottom:var(--spacing-px) solid var(--border-color) }
.unified-metrics-page .modal-header h3 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:1.125rem;font-weight:600 }
.unified-metrics-page .modal-close { padding:var(--spacing-0);color:var(--color-text-secondary);font-size:1.5rem;background:none;border:none;transition:var(--transition);cursor:pointer }
.unified-metrics-page .modal-close:hover { color:var(--color-text-primary) }
.unified-metrics-page .modal-body { overflow-y:auto;max-height:calc(80vh - 120px);padding:var(--spacing-6) }
.loading .metric-value { color:transparent;background:linear-gradient(90deg,var(--border-color) 25%,rgba(229,231,235,.5) 50%,var(--border-color) 75%);background-size:200% 100%;border-radius:var(--radius-base);animation:loading 1.5s infinite }
.metric-card--loading { background:var(--skeleton-gradient);background-size:200% 100%;animation:metricsShimmer var(--duration-shimmer) ease-in-out infinite }
@media (max-width:768px) { .unified-dashboard { gap:var(--spacing-3);padding:var(--spacing-3) }
.dashboard-header { flex-direction:column;gap:var(--spacing-4);padding:var(--spacing-4) }
.header-controls { justify-content:space-between;width:100% }
.metric-card { padding:var(--spacing-4) }
.metric-value { font-size:2rem }
.insights-tabs { flex-wrap:wrap }
.tab-btn { padding:var(--spacing-2) var(--spacing-3);font-size:.75rem }
.benchmarks-grid { grid-template-columns:repeat(2,1fr) }
 }
@media (max-width:480px) { .benchmarks-grid { grid-template-columns:1fr }
.chart-container { height:var(--size-chart-sm) }
.activity-feed { max-height:var(--spacing-100) }
 }
.chart-error { display:flex;flex-direction:column;justify-content:center;align-items:center;height:var(--spacing-75);padding:var(--spacing-8);color:var(--color-text-secondary);text-align:center;background-color:var(--bg-secondary);border:2px dashed var(--border-color);border-radius:var(--border-radius) }
.chart-error p { margin:var(--spacing-2) 0 }
.chart-error p:first-child { margin-bottom:var(--spacing-4);color:var(--danger-color);font-weight:600 }
.notifications-container { position:fixed;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-index-popover);display:flex;flex-direction:column;gap:var(--spacing-2) }
.notification { position:relative;max-width:var(--spacing-100);padding:var(--spacing-3) var(--spacing-4);font-size:.875rem;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-lg);animation:slide-in-right .3s ease }
.notification.success { color:var(--color-success-text);background-color:var(--color-success-bg);border-color:var(--success-color) }
.notification.error { color:var(--color-danger-text);background-color:var(--color-danger-bg);border-color:var(--danger-color) }
.notification.info { color:var(--color-info-text);background-color:var(--color-info-bg);border-color:var(--info-color) }
.chart-container [title],.metric-card [title],.progress-bar[title] { position:relative;cursor:help }
.empty-state { display:flex;flex-direction:column;justify-content:center;align-items:center;padding:var(--spacing-8);color:var(--color-text-tertiary);text-align:center }
.empty-state__icon { margin-bottom:var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-4xl);opacity:50% }
.empty-state__title { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.empty-state__description { max-width:var(--width-description-max);color:var(--color-text-tertiary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.empty-state--animated { animation:fade-in .3s ease-in }
.dashboard-header__title,h1 { color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight) }
.chart-section__header h2,.insights-section__title,h2 { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-semibold);line-height:var(--leading-snug) }
.card-title,.metric-card-v2__title,h3 { color:var(--color-text-secondary);font-size:var(--text-base);font-weight:var(--font-semibold);line-height:var(--leading-snug);letter-spacing:var(--tracking-wide) }
.activity-feed,.benchmarks-section,.chart-section,.dashboard-header,.insights-modal-content,.insights-section,.metric-card-v2 { background:var(--color-surface-base);border-color:var(--color-border-default) }
.correlation-matrix h4,h4 { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);line-height:var(--leading-normal) }
.metric-card-v2__value,.metric-value { color:var(--color-text-primary);font-size:var(--text-4xl);font-weight:var(--font-bold);line-height:var(--leading-none);letter-spacing:var(--tracking-tight) }
.card-description,.metric-comparison,.metric-detail { color:var(--color-text-tertiary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.activity-time,.benchmark-title,.metric-card-v2__progress-label { color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase }
@media (max-width:900px) { .summary-cards { grid-template-columns:repeat(2,1fr) }
 }
@media (prefers-reduced-motion:reduce) { .activity-feed,.anomaly-card,.benchmark-card,.benchmarks-section,.chart-section,.experiment-card,.improvement-card,.insights-section,.metric-card,.recommendation-card,.unified-dashboard { animation:none;transition-duration:.01ms }
.benchmark-card:hover,.experiment-card:hover,.metric-card:hover,.recommendation-card:hover { transform:none }
.metric-card--loading { animation:none }
 }
.unified-dashboard { display:block;grid-template-areas:none;grid-template-columns:none;width:100%;max-width:none;margin:0 auto;padding:var(--spacing-6);padding-bottom:var(--spacing-20) }
.o-dashboard-content { display:flex;flex-direction:column;gap:var(--spacing-8) }
.detailed-analytics { display:flex;flex-direction:column;gap:var(--spacing-4);margin-top:var(--spacing-8) }
.analytics-section { overflow:hidden;margin-bottom:var(--spacing-4);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);transition:border-color var(--duration-fast) var(--ease-out) }
.analytics-section:hover { border-color:var(--color-border-strong) }
.analytics-section__header { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4) var(--spacing-6);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold);list-style:none;transition:background var(--duration-fast) var(--ease-out);cursor:pointer }
.analytics-section__header:hover { background:var(--color-surface-hover) }
.analytics-section__header::-webkit-details-marker { display:none }
.analytics-section__header i:first-child { display:flex;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6);color:var(--color-brand-primary-light) }
.analytics-section__chevron { margin-left:auto;color:var(--color-text-tertiary);transition:transform var(--duration-medium) var(--ease-out) }
.analytics-section[open] .analytics-section__chevron { transform:rotate(180deg) }
.analytics-section__content { padding:var(--spacing-6);border-top:1px solid var(--color-border-subtle);animation:accordionOpen var(--duration-medium) var(--ease-out) }
.activity-drawer { position:fixed;right:0;bottom:0;left:var(--sidebar-width);z-index:var(--z-index-sticky);background:var(--color-surface-elevated);border-top:1px solid var(--color-border-default);box-shadow:var(--shadow-lg);transition:all var(--duration-medium) var(--ease-out);backdrop-filter:var(--backdrop-blur-medium) }
.activity-drawer__toggle { display:flex;align-items:center;gap:var(--spacing-3);width:100%;padding:var(--spacing-4) var(--spacing-6);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-medium);background:transparent;border:none;transition:background var(--duration-fast) var(--ease-out);cursor:pointer }
.activity-drawer__toggle:hover { background:var(--color-surface-hover) }
.activity-drawer__toggle:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:-2px }
.activity-drawer__toggle i:first-child { color:var(--color-warning) }
.activity-drawer__count { min-width:var(--spacing-5);padding:var(--spacing-1) var(--spacing-2);color:var(--color-white);font-size:var(--text-xs);font-weight:var(--font-semibold);text-align:center;background:var(--gradient-primary-enhanced);border-radius:var(--radius-full);animation:pulse var(--duration-pulse) infinite }
.activity-drawer__chevron { margin-left:auto;color:var(--color-text-tertiary);transition:transform var(--duration-medium) var(--ease-out) }
.activity-drawer--expanded .activity-drawer__chevron { transform:rotate(180deg) }
.activity-drawer__content { overflow:hidden;max-height:0;transition:max-height var(--duration-medium) var(--ease-out) }
.activity-drawer--expanded .activity-drawer__content { overflow-y:auto;max-height:calc(var(--spacing-20)*5) }
.activity-drawer__list { display:flex;flex-direction:column;gap:var(--spacing-3);padding:var(--spacing-4) var(--spacing-6) }
.activity-item { display:flex;align-items:center;gap:var(--spacing-3);background:var(--color-surface-primary);border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.activity-item:hover { border-color:var(--color-border-default);transform:var(--transform-hover-lift-micro) }
.sg-stripe-metric__footer { display:flex;flex-direction:column;gap:var(--spacing-3);margin-top:auto;padding-top:var(--spacing-4);border-top:1px solid var(--color-border-subtle) }
.sg-stripe-metric__progress { display:flex;flex-direction:column;gap:var(--spacing-2) }
.sg-stripe-metric__progress-label { display:flex;justify-content:space-between;color:var(--color-text-secondary);font-size:var(--text-xs) }
.sg-stripe-metric__progress-bar { overflow:hidden;height:var(--spacing-2);background:var(--color-surface-hover);border-radius:var(--radius-full) }
.sg-stripe-metric__progress-fill { width:var(--progress,0);height:100%;background:var(--gradient-primary-enhanced);border-radius:var(--radius-full);transition:width var(--duration-medium) var(--ease-out) }
.sg-stripe-metric--success .sg-stripe-metric__progress-fill { background:var(--gradient-success-enhanced) }
.sg-stripe-metric__detail { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-stripe-metric__detail i { width:var(--spacing-4);color:var(--color-text-tertiary) }
.sg-stripe-metric__comparison { color:var(--color-text-tertiary);font-size:var(--text-xs) }
.sg-stripe-metric__benchmark { display:flex;align-items:center;gap:var(--spacing-2);width:fit-content;padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs);background:var(--color-surface-hover);border-radius:var(--radius-md) }
.sg-stripe-metric__benchmark i { color:var(--color-warning) }
.sg-stripe-metric__list { display:flex;overflow-y:auto;flex-direction:column;gap:var(--spacing-2);max-height:calc(var(--spacing-20)*1.5) }
.sg-stripe-metric__list-item { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2);font-size:var(--text-xs);background:var(--color-surface-hover);border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-out) }
.sg-stripe-metric__list-item:hover { background:var(--color-surface-overlay) }
.sg-stripe-metric__actions { display:flex;gap:var(--spacing-2);margin-left:auto }
.sg-stripe-metric__action-btn { display:flex;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);color:var(--color-text-secondary);background:var(--color-surface-hover);border:none;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-stripe-metric__action-btn:hover { color:var(--color-text-primary);background:var(--color-surface-overlay) }
.sg-stripe-metric__action-btn:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.activity-drawer__action-btn { display:flex;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);color:var(--color-text-secondary);background:var(--color-surface-hover);border:none;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.activity-drawer__action-btn:hover { color:var(--color-text-primary);background:var(--color-surface-overlay) }
.activity-drawer__action-btn:focus-visible { outline:2px solid var(--color-brand-primary);outline-offset:2px }
.activity-item__icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);border-radius:var(--radius-full) }
.activity-item__icon--info { color:var(--color-info-text);background:var(--color-info-bg) }
.activity-item__icon--success { color:var(--color-success-text);background:var(--color-success-bg) }
.activity-item__icon--warning { color:var(--color-warning-text);background:var(--color-warning-bg) }
.activity-item__icon--error { color:var(--color-danger-text);background:var(--color-danger-bg) }
.activity-item__content { display:flex;flex-direction:column;gap:var(--spacing-1);min-width:0 }
.activity-item__meta { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs) }
.activity-item__time { font-weight:var(--font-medium) }
.activity-item__type { padding:var(--spacing-px) var(--spacing-1);background:var(--color-surface-hover);border-radius:var(--radius-sm) }
.activity-item__description { overflow:hidden;color:var(--color-text-secondary);font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap }
.activity-drawer__header { display:flex;justify-content:flex-end;padding:var(--spacing-2) var(--spacing-6);border-bottom:1px solid var(--color-border-subtle) }
.activity-drawer__controls { display:flex;gap:var(--spacing-2) }
@media (max-width:1024px) { .unified-dashboard { padding:var(--spacing-4);padding-bottom:var(--spacing-20) }
 }
@media (max-width:768px) { .activity-drawer { left:0 }
.unified-dashboard { padding:var(--spacing-3);padding-bottom:var(--spacing-20) }
.analytics-section__header { padding:var(--spacing-3) var(--spacing-4);font-size:var(--text-base) }
.analytics-section__content { padding:var(--spacing-4) }
 }
@media (prefers-reduced-motion:reduce) { .activity-drawer,.activity-drawer__chevron,.activity-drawer__content,.activity-drawer__count,.activity-item,.analytics-section__chevron,.analytics-section__content { transition:none;animation:none }
 }
.dashboard-main { padding:var(--spacing-8);color:var(--color-neutral-800);background-color:var(--color-neutral-50) }
.actions-section,.club-performance-section,.insights-section,.overview-section,.pattern-analysis-section,.usage-trends-section { margin-bottom:var(--spacing-8);padding:var(--spacing-6);color:var(--color-neutral-800);background-color:var(--color-neutral-0);border-radius:var(--radius-lg);box-shadow:0 1px 3px var(--alpha-var(--color-neutral-900)-10) }
.club-performance-section h2,.insights-section h2,.overview-section h2,.pattern-analysis-section h2,.usage-trends-section h2 { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4);color:var(--color-neutral-800);font-size:1.5rem }
.stats-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr)) }
.stat-card { display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-6);background-color:var(--color-neutral-50);border:1px solid var(--color-neutral-200);border-radius:var(--radius-md);transition:transform .2s }
.stat-card:hover { box-shadow:var(--shadow-md);transform:translateY(-2px) }
.stat-icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-12);height:var(--spacing-12);color:var(--color-info);font-size:1.5rem;background-color:var(--color-info-bg);border-radius:50% }
.stat-content { flex:1 }
.stat-value { color:var(--color-neutral-800);font-size:2rem;font-weight:700;line-height:1 }
.stat-label { margin-top:var(--spacing-1);color:var(--color-neutral-500);font-size:.875rem }
.chart-container { position:relative;height:var(--spacing-75);margin-bottom:var(--spacing-4);padding:var(--spacing-4);background-color:var(--color-neutral-0);border-radius:var(--radius-base) }
.trend-summary { display:flex;justify-content:space-around;gap:var(--spacing-4);padding:var(--spacing-4);background-color:var(--color-neutral-50);border-radius:var(--radius-base) }
.trend-item { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-neutral-600) }
.text-success { color:var(--color-success) }
.analysis-grid { display:grid;grid-gap:var(--spacing-8);gap:var(--spacing-8);grid-template-columns:1fr 1fr;margin-top:var(--spacing-6) }
.analysis-card { padding:var(--spacing-6);background-color:var(--color-neutral-50);border:1px solid var(--color-neutral-200);border-radius:var(--radius-md) }
.analysis-card h3 { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4);color:var(--color-neutral-700);font-size:1.125rem }
.table-responsive { overflow-x:auto }
.data-table { width:100%;border-collapse:collapse }
.data-table th { padding:var(--spacing-3);color:var(--color-neutral-700);font-weight:600;text-align:left;background-color:var(--color-neutral-50);border-bottom:var(--spacing-0-5) solid #e2e8f0 }
.data-table td { padding:var(--spacing-3);color:var(--color-neutral-600);border-bottom:var(--spacing-px) solid #e2e8f0 }
.data-table tbody tr:hover { background-color:var(--color-neutral-50) }
.performance-grid { display:grid;grid-gap:var(--spacing-8);gap:var(--spacing-8);grid-template-columns:1fr 1fr }
.performance-card { padding:var(--spacing-6);background-color:var(--color-neutral-50);border:1px solid var(--color-neutral-200);border-radius:var(--radius-md) }
.performance-card h3 { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4);color:var(--color-neutral-700);font-size:1.125rem }
.club-list { display:flex;flex-direction:column;gap:var(--spacing-3) }
.club-item { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4);background-color:var(--color-neutral-0);border:1px solid var(--color-neutral-200);border-radius:var(--radius-base) }
.club-name { color:var(--color-neutral-700);font-weight:500 }
.club-metric { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-neutral-500);font-size:.875rem }
.activity-list { display:flex;flex-direction:column;gap:var(--spacing-2) }
.activity-item { padding:var(--spacing-3);color:var(--color-neutral-600);background-color:var(--color-neutral-0);border-left:var(--spacing-1) solid #4299e1;border-radius:var(--radius-base) }
.activity-time { color:var(--color-neutral-400);font-size:.75rem }
.insights-grid { display:grid;grid-gap:var(--spacing-8);gap:var(--spacing-8);grid-template-columns:1fr 1fr }
.insights-card { padding:var(--spacing-6);background-color:var(--color-neutral-50);border:1px solid var(--color-neutral-200);border-radius:var(--radius-md) }
.insights-card h3 { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4);color:var(--color-neutral-700);font-size:1.125rem }
.insights-list,.recommendations-list { display:flex;flex-direction:column;gap:var(--spacing-3) }
.insight-item,.recommendation-item { padding:var(--spacing-4);background-color:var(--color-neutral-0);border:1px solid var(--color-neutral-200);border-radius:var(--radius-base) }
.insight-item.positive { border-left:var(--spacing-1) solid #48bb78 }
.insight-item.negative { border-left:var(--spacing-1) solid #f56565 }
.recommendation-item { border-left:var(--spacing-1) solid #ed8936 }
.insight-message,.recommendation-action { margin-bottom:var(--spacing-1);color:var(--color-neutral-700) }
.insight-impact,.recommendation-reason { color:var(--color-neutral-500);font-size:.875rem }
.section-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4) }
.filter-controls { display:flex;gap:var(--spacing-4) }
.filter-select { padding:var(--spacing-2) var(--spacing-4);color:var(--color-neutral-700);font-size:.875rem;background-color:var(--color-neutral-0);border:1px solid var(--color-neutral-200);border-radius:var(--radius-base) }
.actions-section { display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing-4) }
.action-btn { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-6);font-weight:500;border:none;border-radius:var(--radius-md);transition:all .2s;cursor:pointer }
.action-btn.primary { color:var(--color-neutral-0);background-color:var(--color-info) }
.action-btn.primary:hover { background-color:var(--color-info-dark) }
.action-btn.secondary { color:var(--color-neutral-700);background-color:var(--color-neutral-200) }
.action-btn.secondary:hover { background-color:var(--color-neutral-300) }
.action-btn.accent { color:var(--color-neutral-0);background-color:var(--color-primary) }
.action-btn.accent:hover { background-color:var(--color-primary-dark) }
.loading-overlay { position:fixed;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);z-index:var(--z-index-modal);display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:var(--overlay-bg) }
.loading-overlay p { margin-top:var(--spacing-4);color:var(--color-neutral-0);font-size:1.125rem }
.spinner { width:var(--size-spinner-lg);height:var(--size-spinner-lg);border:var(--spacing-1) solid var(--color-neutral-0);border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite }
.error-message { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4);padding:var(--spacing-4);color:var(--color-danger-text);background-color:var(--color-danger-bg);border-radius:var(--radius-md) }
@media (max-width:768px) { .stats-grid { grid-template-columns:1fr 1fr }
.analysis-grid,.insights-grid,.performance-grid { grid-template-columns:1fr }
.section-header { flex-direction:column;gap:var(--spacing-4) }
.actions-section { flex-direction:column }
.action-btn { justify-content:center;width:100% }
 }
.pattern-dashboard>div:not([class*=__]),.pattern-dashboard>h1,.pattern-dashboard>h2,.pattern-dashboard>h3,.pattern-dashboard>h4,.pattern-dashboard>h5,.pattern-dashboard>h6,.pattern-dashboard>p { color:var(--color-text-primary) }
.pattern-dashboard__white-text { color:var(--color-white) }
.chart-section__header h2,.club-performance-section h2,.insights-section h2,.overview-section h2,.pattern-analysis-section h2,.usage-trends-section h2 { color:var(--color-text-primary) }
.modal-backdrop { position:fixed;top:var(--spacing-0);left:var(--spacing-0);z-index:var(--z-modal);display:flex;visibility:hidden;justify-content:center;align-items:center;width:100%;height:100%;background:var(--overlay-bg);opacity:0;transition:opacity var(--transition-base) visibility var(--transition-base) }
.modal-backdrop--visible { visibility:visible;opacity:100% }
.pattern-editor-modal { display:flex;overflow:hidden;flex-direction:column;width:90%;max-width:800px;max-height:90vh;background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl) }
.modal-header { display:flex;flex-shrink:0;justify-content:space-between;align-items:center;padding:var(--space-4);border-bottom:var(--spacing-px) solid var(--color-border-primary) }
.modal-title { display:flex;align-items:center;gap:var(--space-2);margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.modal-close { padding:var(--space-2);color:var(--color-text-secondary);background:none;border:none;border-radius:var(--radius-md);transition:var(--transition-base);cursor:pointer }
.modal-close:hover { color:var(--color-text-primary);background:var(--color-surface-secondary) }
.modal-body { overflow-y:auto;flex:1;padding:var(--space-4) }
.modal-footer { display:flex;flex-shrink:0;justify-content:flex-end;gap:var(--space-2);padding:var(--space-4);background:var(--color-surface-secondary);border-top:var(--spacing-px) solid var(--color-border-primary) }
.loading-state { display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:var(--col-width-medium);color:var(--color-text-secondary) }
.loading-state--hidden { display:none }
.spinner { width:var(--spacing-10);height:var(--spacing-10);margin-bottom:var(--space-4);border:var(--spacing-0-75) solid var(--color-surface-secondary);border-radius:var(--radius-full);animation:spin 1s linear infinite;border-top-color:var(--color-accent-primary) }
.alert { margin-bottom:var(--space-4);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md) }
.alert--error { color:var(--danger);background:var(--color-danger-subtle);border:var(--spacing-px) solid var(--danger) }
.alert--warning { color:var(--warning);background:var(--color-warning-subtle);border:var(--spacing-px) solid var(--warning) }
.alert--hidden { display:none }
.form-group { margin-bottom:var(--space-4) }
.form-label { display:block;margin-bottom:var(--space-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.form-input,.form-select,.form-textarea { width:100%;padding:var(--space-2) var(--space-3);color:var(--color-text-primary);font-size:var(--text-base);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-md);transition:var(--transition-base) }
.form-textarea { min-height:var(--col-width-date);resize:vertical }
.form-input:focus,.form-select:focus,.form-textarea:focus { border-color:var(--color-accent-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.form-input--error { border-color:var(--danger);animation:shake .3s ease-in-out }
.form-help { margin-top:var(--space-1);color:var(--color-text-secondary);font-size:var(--text-xs) }
.context-section { margin-bottom:var(--space-4);padding:var(--space-3);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-md) }
.context-state { display:none }
.context-state--visible { display:block }
.context-state--flex { display:flex }
.context-data { display:none }
.context-data--visible { display:block }
.quality-indicator { margin-top:var(--space-3) }
.quality-bar-container { overflow:hidden;height:var(--spacing-2);margin-top:var(--space-2);background:var(--color-surface-primary);border-radius:var(--radius-full) }
.quality-bar { width:0;height:100%;border-radius:var(--radius-full);transition:width .3s ease,background-color .3s ease }
.quality-bar[data-width="0"] { width:0 }
.quality-bar[data-width="10"] { width:10% }
.quality-bar[data-width="20"] { width:20% }
.quality-bar[data-width="30"] { width:30% }
.quality-bar[data-width="40"] { width:40% }
.quality-bar[data-width="50"] { width:var(--radius-full) }
.quality-bar[data-width="60"] { width:60% }
.quality-bar[data-width="70"] { width:70% }
.quality-bar[data-width="80"] { width:80% }
.quality-bar[data-width="85"] { width:85% }
.quality-bar[data-width="90"] { width:90% }
.quality-bar[data-width="95"] { width:95% }
.quality-bar[data-width="100"] { width:100% }
.quality-bar--high { background:var(--success) }
.quality-bar--medium { background:var(--warning) }
.quality-bar--low { background:var(--danger) }
.help-tooltip { position:fixed;top:var(--tooltip-top,0);left:var(--tooltip-left,0);z-index:var(--z-tooltip);visibility:hidden;max-width:var(--col-width-extra-wide);padding:var(--space-3);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-accent-primary);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);opacity:0;transition:opacity var(--transition-base),visibility var(--transition-base) }
.help-tooltip--visible { visibility:visible;opacity:100% }
.help-icon { margin-left:var(--space-2);color:var(--color-accent-primary);cursor:help }
.lifecycle-reason { display:none;margin-top:var(--space-3) }
.lifecycle-reason--visible { display:block }
.btn-primary { padding:var(--space-2) var(--space-4);color:var(--color-neutral-0);font-weight:var(--font-medium);background:var(--color-accent-primary);border:none;border-radius:var(--radius-md);transition:var(--transition-base);cursor:pointer }
.btn-primary:disabled { opacity:50%;cursor:not-allowed }
.btn-primary:hover:not(:disabled) { background:var(--color-accent-hover);transform:translateY(-1px) }
.btn-secondary { padding:var(--space-2) var(--space-4);color:var(--color-text-primary);font-weight:var(--font-medium);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-md);transition:var(--transition-base);cursor:pointer }
.btn-secondary:hover { background:var(--color-surface-primary);border-color:var(--color-accent-primary) }
.form-row { display:grid;grid-gap:var(--space-4);gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-medium),1fr)) }
.context-recommendations,.context-warnings { display:none;margin-top:var(--space-3);padding:var(--space-3);background:var(--color-surface-primary);border-radius:var(--radius-md) }
.context-recommendations--visible,.context-warnings--visible { display:block }
.hidden { display:none }
.visible { display:block }
.flex { display:flex }
.gradient-text { background:linear-gradient(135deg,var(--color-accent-primary) 0,var(--color-accent-hover) 100%);-webkit-text-fill-color:transparent;background-clip:text }
.mr-2 { margin-right:var(--space-2) }
.mt-3 { margin-top:var(--space-3) }
.mb-3 { margin-bottom:var(--space-3) }
@media (max-width:768px) { .draft-cards-list { padding:var(--spacing-3) }
.draft-cards-list--grid { grid-template-columns:1fr }
.draft-cards-list--table .sg-card { flex-direction:column;align-items:stretch }
.draft-cards-list--table .sg-card__content,.draft-cards-list--table .sg-card__footer,.draft-cards-list--table .sg-card__header { flex:none;padding:var(--spacing-2) 0 }
 }
@media (max-width:200px) { .draft-cards-list { gap:var(--spacing-2);padding:var(--spacing-2) }
.sg-card { border-radius:var(--radius-md) }
.sg-card__header { flex-wrap:wrap }
.sg-card__title { flex:1 1 100%;order:2;margin-top:var(--spacing-2) }
.sg-card__checkbox { order:1 }
.sg-card__badge { order:3 }
.sg-card__footer { flex-direction:column;align-items:stretch;gap:var(--spacing-2) }
.sg-card__actions { justify-content:stretch }
.sg-card__actions .sg-btn { flex:1 }
 }
.sg-card { display:block;margin-bottom:var(--spacing-3);transition:all .2s ease }
.sg-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-md) }
.sg-card__header { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-3) }
.sg-card__checkbox { flex-shrink:0 }
.sg-card__title { flex:1;min-width:0 }
.sg-card__title h3 { overflow:hidden;margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:600;text-overflow:ellipsis;white-space:nowrap }
.sg-card__title p { margin:var(--spacing-0);margin-top:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-card__badge { flex-shrink:0 }
.sg-card__content { margin-bottom:var(--spacing-3) }
.sg-card__content h4 { margin:var(--spacing-0);margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-base);font-weight:500 }
.sg-card__content p { margin:var(--spacing-0);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:1.75 }
.sg-card__footer { display:flex;justify-content:space-between;align-items:center;padding-top:var(--spacing-3);border-top:var(--spacing-px) solid var(--color-border-subtle) }
.sg-card__meta { display:flex;gap:var(--spacing-3);color:var(--color-text-muted);font-size:var(--text-xs) }
.sg-card__actions { display:flex;gap:var(--spacing-2) }
.sg-badge { display:inline-block;font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;border-radius:var(--radius-sm) }
.sg-badge--success { border:var(--spacing-px) solid var(--color-success) }
.sg-badge--warning { border:var(--spacing-px) solid var(--color-warning) }
.sg-badge--info { color:var(--color-info);background:var(--color-info-subtle);border:var(--spacing-px) solid var(--color-info) }
.sg-btn { min-width:var(--touch-target-min);min-height:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);transition:all .2s ease }
.sg-btn--sm { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-xs) }
.sg-btn--primary { color:var(--color-white);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.sg-btn--primary:hover { background:var(--color-brand-primary-light);border-color:var(--color-brand-primary-light) }
.sg-btn--ghost { color:var(--color-text-secondary);background:transparent;border-color:var(--color-border-default) }
.sg-btn--ghost:hover { color:var(--color-text-primary);background:var(--color-surface-elevated) }
.draft-cards-list { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);padding:var(--spacing-4) }
.draft-cards-list--list { grid-template-columns:1fr }
.draft-cards-list--grid { grid-template-columns:repeat(auto-fill,minmax(var(--col-width-extra-wide),1fr)) }
.draft-cards-list--table .sg-card { display:flex;align-items:center;margin-bottom:var(--spacing-0);padding:var(--spacing-2) var(--spacing-4);border-bottom:var(--spacing-px) solid var(--color-border-subtle);border-radius:0 }
[data-density=compact] .sg-card { padding:var(--spacing-2) }
.draft-cards-list--table .sg-card:first-child { border-radius:var(--radius-lg) var(--radius-lg) 0 0 }
.draft-cards-list--table .sg-card:last-child { border-bottom:var(--spacing-px) solid var(--color-border-default);border-radius:0 0 var(--radius-lg) var(--radius-lg) }
.draft-cards-list--table .sg-card__content,.draft-cards-list--table .sg-card__footer,.draft-cards-list--table .sg-card__header { margin:var(--spacing-0);padding:var(--spacing-0);border:0 }
.draft-cards-list--table .sg-card__header { flex:0 0 30% }
.draft-cards-list--table .sg-card__content { flex:1;padding:var(--spacing-0) var(--spacing-4) }
.draft-cards-list--table .sg-card__footer { flex:0 0 var(--col-width-medium) }
[data-density=compact] .sg-card__content,[data-density=compact] .sg-card__footer,[data-density=compact] .sg-card__header { margin-bottom:var(--spacing-2) }
[data-density=compact] .sg-card__title h3 { font-size:var(--text-base) }
[data-density=compact] .sg-card__content h4 { font-size:var(--text-sm) }
[data-density=compact] .sg-btn { min-height:var(--touch-target-min);padding:var(--spacing-1) var(--spacing-2) }
.sg-card--loading { position:relative;opacity:60%;pointer-events:none }
.sg-card--loading:after { content:"";position:absolute;top:var(--radius-full);left:var(--radius-full);width:var(--spacing-5);height:var(--spacing-5);margin:calc(var(--spacing-2-5)*-1) 0 0 calc(var(--spacing-2-5)*-1);border:var(--spacing-0-5) solid var(--color-border-default);border-top-color:var(--color-brand-primary);border-radius:var(--radius-full);animation:sg-spin .8s linear infinite }
.sg-card__actions--lazy { min-height:var(--touch-target-min);background:var(--color-surface-elevated);border-radius:var(--radius-sm);animation:sg-pulse 1.5s ease-in-out infinite }
.sg-btn { display:inline-flex;justify-content:center;align-items:center;padding:var(--spacing-2) var(--spacing-4);font-weight:500;border:var(--spacing-px) solid transparent;border-radius:var(--radius-md);transition:all .2s;cursor:pointer }
.sg-btn-primary { color:var(--color-white);background:var(--color-brand-primary) }
.sg-btn-primary:hover { background:var(--color-brand-primary-light) }
.sg-btn-secondary { color:var(--color-text-primary);background:var(--color-surface-elevated);border-color:var(--color-border-default) }
.sg-btn-secondary:hover { background:var(--color-surface-overlay) }
.sg-btn-danger { color:var(--color-white);background:var(--color-danger);border-color:var(--color-danger) }
.sg-btn-danger:hover { background:var(--color-danger-high-contrast);border-color:var(--color-danger-high-contrast) }
.sg-btn i,.sg-btn svg { color:inherit }
.sg-btn-sm { padding:var(--spacing-1) var(--spacing-2);font-size:var(--text-sm) }
.sg-card { padding:var(--spacing-4);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm) }
.sg-input,.sg-select,.sg-textarea { width:100%;padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-primary);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);transition:border-color .2s }
.sg-input:focus,.sg-select:focus,.sg-textarea:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-subtle) }
.sg-badge { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:500;background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.sg-badge--success { color:var(--color-success);background:var(--color-success-subtle) }
.sg-badge--warning { color:var(--color-warning);background:var(--color-warning-subtle) }
.sg-badge--error { color:var(--color-danger);background:var(--color-danger-subtle) }
.sg-dropdown { position:relative;display:inline-block }
.sg-dropdown-menu { position:absolute;top:100%;left:var(--spacing-0);z-index:var(--z-index-overlay);display:none;min-width:100%;margin-top:var(--spacing-1);padding:var(--spacing-2);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-lg) }
.sg-dropdown-menu--open { display:block }
.sg-dropdown-item { display:block;width:100%;padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-primary);text-align:left;background:none;border:none;border-radius:var(--radius-sm);transition:background .2s;cursor:pointer }
.sg-dropdown-item:hover { background:var(--color-surface-elevated) }
.sg-toast-container { position:fixed;top:var(--spacing-4);right:var(--spacing-4);z-index:var(--z-index-modal);pointer-events:none }
.sg-toast { display:flex;align-items:center;min-width:var(--col-width-extra-wide);margin-bottom:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-base);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);box-shadow:var(--shadow-xl);animation:sg-slide-in .3s ease;pointer-events:auto }
.sg-toast--hiding { animation:sg-slide-out .3s ease }
.sg-spinner { display:inline-block;width:1em;height:1em;border:var(--spacing-0-5) solid var(--color-border-default);border-radius:var(--radius-full);border-top-color:var(--color-brand-primary);animation:sg-spin .8s linear infinite }
.sg-progress { overflow:hidden;width:100%;height:var(--spacing-2);background:var(--color-surface-elevated);border-radius:var(--radius-full) }
.sg-progress-bar { height:100%;background:var(--color-brand-primary);border-radius:var(--radius-full);transition:width .3s }
.sg-switch { position:relative;display:inline-block;width:var(--touch-target-min);height:var(--spacing-6) }
.sg-switch input { width:0;height:0;opacity:0 }
.sg-switch-slider { position:absolute;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);background:var(--color-surface-overlay);border-radius:var(--radius-full);transition:background .2s;cursor:pointer }
.sg-switch-slider:before { position:absolute;bottom:var(--spacing-1);left:var(--spacing-1);width:var(--spacing-4-5);height:var(--spacing-4-5);background:var(--color-neutral-0);border-radius:var(--radius-full);transition:transform .2s;content:"" }
.sg-switch-slider--checked { background:var(--color-brand-primary) }
.sg-switch-slider--checked:before { transform:translateX(var(--spacing-5)) }
@media screen and (max-width:768px) { .c-sg-logging-header { flex-direction:column;align-items:flex-start;gap:var(--spacing-4) }
.sg-logging-header__status { align-items:flex-start;width:100% }
.c-sg-logging-controls { flex-direction:column;align-items:stretch;gap:var(--spacing-4) }
.sg-logging-controls__primary { flex-direction:column;align-items:stretch }
.sg-logging-controls__secondary { flex-wrap:wrap }
.c-sg-logging-metrics { grid-template-columns:1fr }
.c-sg-logging-entry { flex-wrap:wrap;gap:var(--spacing-2) }
.sg-logging-entry__timestamp .sg-logging-entry__level .sg-logging-entry__context { min-width:auto }
.sg-logging-entry__metadata { width:100%;margin-left:var(--spacing-4) }
 }
.c-sg-logging-header { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-6);padding:var(--spacing-6) 0 var(--spacing-4) 0;border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.sg-logging-header__content { flex:1 }
.sg-logging-header__title { display:flex;align-items:center;gap:var(--spacing-3);margin:var(--spacing-0) 0 var(--spacing-2) 0;color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold) }
.sg-logging-header__title i { color:var(--color-brand-primary-light) }
.sg-logging-header__subtitle { max-width:60ch;margin:var(--spacing-0);color:var(--color-text-secondary);font-size:var(--text-base) }
.sg-logging-header__status { display:flex;flex-direction:column;align-items:flex-end;gap:var(--spacing-2) }
.c-sg-logging-status { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);font-weight:var(--font-medium);border-radius:var(--radius-lg);transition:all var(--duration-base) var(--ease-out) }
.sg-logging-status--connecting { color:var(--color-warning);background:var(--color-warning-subtle) }
.sg-logging-status--connecting i { animation:pulse 2s infinite }
.sg-logging-status--connected { color:var(--color-success);background:var(--color-success-subtle) }
.sg-logging-status--disconnected { color:var(--color-danger);background:var(--color-danger-subtle) }
.c-sg-logging-stats { display:flex;gap:var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-xs) }
.sg-logging-stats__item { white-space:nowrap }
.c-sg-logging-alerts { display:flex;flex-direction:column;gap:var(--spacing-3);margin-bottom:var(--spacing-6) }
.c-sg-logging-alert { display:flex;align-items:flex-start;gap:var(--spacing-4);padding:var(--spacing-4);border-left:var(--spacing-1) solid;border-radius:var(--radius-lg);animation:slide-in-down var(--duration-moderate) var(--ease-out) }
.sg-logging-alert--critical { color:var(--color-danger);background:var(--color-danger-subtle);border-left-color:var(--color-danger) }
.sg-logging-alert--warning { color:var(--color-warning);background:var(--color-warning-subtle);border-left-color:var(--color-warning) }
.sg-logging-alert--info { color:var(--color-info);background:var(--color-info-subtle);border-left-color:var(--color-info) }
.sg-logging-alert__icon { margin-top:var(--spacing-0-5);font-size:var(--text-lg) }
.sg-logging-alert__content { flex:1 }
.sg-logging-alert__title { margin:var(--spacing-0) 0 var(--spacing-1) 0;font-weight:var(--font-semibold) }
.sg-logging-alert__message { margin:var(--spacing-0) 0 var(--spacing-2) 0;font-size:var(--text-sm);opacity:90% }
.sg-logging-alert__details { font-family:var(--font-mono);font-size:var(--text-xs);opacity:70% }
.sg-logging-alert__actions { display:flex;gap:var(--spacing-2) }
.sg-logging-alert__acknowledge { padding:var(--spacing-1) var(--spacing-2);color:inherit;font-size:var(--text-xs);background:transparent;border:var(--spacing-px) solid;border-radius:var(--radius-base);transition:background var(--duration-base) var(--ease-out);cursor:pointer }
.sg-logging-alert__acknowledge:hover { color:var(--color-surface-primary);background:currentcolor }
.c-sg-logging-controls { display:flex;justify-content:space-between;align-items:flex-end;gap:var(--spacing-6);margin-bottom:var(--spacing-6);padding:var(--spacing-4);background:var(--color-surface-elevated);border-radius:var(--radius-xl) }
.sg-logging-controls__primary { display:flex;flex:1;flex-wrap:wrap;align-items:flex-end;gap:var(--spacing-4) }
.sg-logging-controls__secondary { display:flex;flex-shrink:0;gap:var(--spacing-2) }
.c-sg-logging-filter-group { display:flex;flex-direction:column;gap:var(--spacing-1);min-width:var(--spacing-32) }
.c-sg-logging-filter-label { color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-medium) }
.c-sg-logging-input,.sg-logging-select { padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--color-surface-primary);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-md);transition:border-color var(--duration-base) var(--ease-out) }
.sg-logging-input:focus,.sg-logging-select:focus { border-color:var(--color-brand-primary);outline:none }
.c-sg-logging-metrics { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-wide),1fr));margin-bottom:var(--spacing-6) }
.c-sg-logging-metric-card { overflow:hidden;background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl);transition:all var(--duration-base) var(--ease-out) }
.sg-logging-metric-card:hover { border-color:var(--color-brand-primary-subtle);box-shadow:var(--shadow-md) }
.sg-logging-metric-card__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4) var(--spacing-5) var(--spacing-3) var(--spacing-5);border-bottom:var(--spacing-px) solid var(--color-border-subtle) }
.sg-logging-metric-card__header h3 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.sg-logging-metric-card__body { display:flex;flex-direction:column;gap:var(--spacing-3);padding:var(--spacing-4) var(--spacing-5) }
.c-sg-logging-metric-item { display:flex;justify-content:space-between;align-items:center }
.sg-logging-metric-item__label { color:var(--color-text-secondary);font-size:var(--text-sm) }
.sg-logging-metric-item__value { color:var(--color-text-primary);font-family:var(--font-mono);font-size:var(--text-lg);font-weight:var(--font-bold) }
.c-sg-logging-health-score { min-width:var(--nav-height);padding:var(--spacing-2) var(--spacing-3);font-family:var(--font-mono);font-size:var(--text-2xl);font-weight:var(--font-black);text-align:center;border-radius:var(--radius-lg);transition:all var(--duration-base) var(--ease-out) }
.sg-logging-health-score--excellent { color:var(--color-success);background:var(--color-success-subtle) }
.sg-logging-health-score--good { color:var(--color-info);background:var(--color-info-subtle) }
.sg-logging-health-score--warning { color:var(--color-warning);background:var(--color-warning-subtle) }
.sg-logging-health-score--critical { color:var(--color-danger);background:var(--color-danger-subtle) }
.c-sg-logging-indicator { width:var(--spacing-3);height:var(--spacing-3);border-radius:var(--radius-full);transition:background var(--duration-base) var(--ease-out) }
.sg-logging-indicator--good { background:var(--color-success);box-shadow:0 0 0 var(--spacing-0-5) var(--color-success-subtle) }
.sg-logging-indicator--warning { background:var(--color-warning);box-shadow:0 0 0 var(--spacing-0-5) var(--color-warning-subtle) }
.sg-logging-indicator--critical { background:var(--color-danger);box-shadow:0 0 0 var(--spacing-0-5) var(--color-danger-subtle);animation:pulse 2s infinite }
.c-sg-logging-main { flex:1;min-height:var(--container-xl) }
.c-sg-logging-container { display:flex;overflow:hidden;flex-direction:column;height:100%;background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-xl) }
.sg-logging-container__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4) var(--spacing-5);background:var(--color-surface-primary);border-bottom:var(--spacing-px) solid var(--color-border-default) }
.sg-logging-container__header h2 { margin:var(--spacing-0);color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.sg-logging-container__controls { display:flex;align-items:center;gap:var(--spacing-3) }
.c-sg-logging-count { color:var(--color-text-secondary);font-family:var(--font-mono);font-size:var(--text-sm) }
.c-sg-logging-stream { overflow-y:auto;flex:1;font-family:var(--font-mono);font-size:var(--text-sm);line-height:var(--leading-relaxed);background:var(--color-surface-base) }
.sg-logging-stream__empty { display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--spacing-4);height:100%;color:var(--color-text-tertiary) }
.sg-logging-stream__empty i { font-size:var(--text-5xl);opacity:50% }
.sg-logging-stream__empty p { margin:var(--spacing-0);font-size:var(--text-lg) }
.sg-logging-stream__empty small { font-size:var(--text-sm);opacity:70% }
.c-sg-logging-entry { display:flex;align-items:flex-start;gap:var(--spacing-3);padding:var(--spacing-2) var(--spacing-4);border-bottom:var(--spacing-px) solid var(--color-border-subtle);transition:background var(--duration-fast) var(--ease-out);animation:slide-in-right var(--duration-moderate) var(--ease-out) }
.sg-logging-entry:hover { background:var(--color-surface-hover) }
.sg-logging-entry--error,.sg-logging-entry--fatal { background:var(--color-danger-subtle);border-left:var(--spacing-1) solid var(--color-danger) }
.sg-logging-entry--warn { background:var(--color-warning-subtle);border-left:var(--spacing-1) solid var(--color-warning) }
.sg-logging-entry--debug { font-size:var(--text-xs);opacity:70% }
.sg-logging-entry__timestamp { min-width:var(--col-width-date);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-medium);white-space:nowrap }
.sg-logging-entry__level { min-width:var(--nav-height);padding:var(--spacing-0-5) var(--spacing-1-5);font-size:var(--text-xs);font-weight:var(--font-bold);text-align:center;text-transform:uppercase;white-space:nowrap;border-radius:var(--radius-base) }
.sg-logging-entry__level--error,.sg-logging-entry__level--fatal { color:var(--color-neutral-0);background:var(--color-danger) }
.sg-logging-entry__level--warn { color:var(--color-neutral-900);background:var(--color-warning) }
.sg-logging-entry__level--info { color:var(--color-neutral-0);background:var(--color-info) }
.sg-logging-entry__level--debug { color:var(--color-neutral-100);background:var(--color-neutral-600) }
.sg-logging-entry__context { min-width:var(--spacing-16);color:var(--color-brand-primary-light);font-size:var(--text-xs);white-space:nowrap }
.sg-logging-entry__message { flex:1;color:var(--color-text-primary);word-break:break-all }
.sg-logging-entry__metadata { display:flex;flex-wrap:wrap;gap:var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs) }
.sg-logging-entry__metadata-item { padding:var(--spacing-0-5) var(--spacing-1);white-space:nowrap;background:var(--color-surface-elevated);border-radius:var(--radius-sm) }
.c-sg-logging-export-form { display:flex;flex-direction:column;gap:var(--spacing-4) }
.c-sg-logging-export-group { display:flex;flex-direction:column;gap:var(--spacing-2) }
.sg-logging-export-group label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.c-sg-logging-export-range { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:1fr 1fr }
.c-sg-logging-export-checkboxes { display:flex;flex-wrap:wrap;gap:var(--spacing-4) }
.sg-logging-export-checkboxes label { display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-sm);cursor:pointer }
.sg-logging-export-checkboxes input[type=checkbox] { accent-color:var(--color-brand-primary) }
.c-sg-logging-hidden { display:none }
.c-sg-logging-fade-in { animation:fade-in var(--duration-moderate) var(--ease-out) }
.c-sg-logging-slide-up { animation:slide-up var(--duration-moderate) var(--ease-out) }
@media (max-width:1024px) { .sg-sidebar { transform:translateX(-100%) }
.sg-sidebar--open { transform:translateX(0) }
.sg-sidebar__toggle { display:block }
.sg-sidebar__backdrop { display:block;pointer-events:none }
.sg-sidebar__backdrop--visible { opacity:100%;pointer-events:auto }
 }
@media (min-width:1025px) { .sg-sidebar { margin:0;padding:0 }
.sg-sidebar__backdrop,.sg-sidebar__toggle { display:none }
 }
@media (prefers-reduced-motion:reduce) { .sg-sidebar,.sg-sidebar__backdrop,.sg-sidebar__link-icon,.sg-sidebar__link,.sg-sidebar__toggle { transition:none }
.sg-sidebar__link:hover .sg-sidebar__link-icon,.sg-sidebar__toggle:active,.sg-sidebar__toggle:hover { transform:none }
 }
@media (prefers-contrast:high) { .sg-sidebar { border-right-width:var(--border-width-2) }
.sg-sidebar__link--active,.sg-sidebar__link[aria-current=page] { border:var(--border-width-2) solid var(--color-brand-primary) }
 }
@media (prefers-contrast:more) { .sg-sidebar { border-right-width:var(--border-width-2) }
.sg-sidebar__link--active,.sg-sidebar__link[aria-current=page] { border:var(--border-width-2) solid var(--color-brand-primary) }
 }
.sg-sidebar { position:fixed;top:0;left:0;z-index:var(--z-index-sticky);display:flex;overflow:hidden auto;flex-direction:column;width:var(--sidebar-width);height:100vh;margin:0;padding:0;background:var(--color-bg-primary);border-right:1px solid var(--color-border-subtle);box-shadow:var(--sidebar-shadow);transition:transform var(--duration-medium) var(--ease-out);backdrop-filter:var(--backdrop-blur-extra-heavy) }
.sg-sidebar__header { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-6) var(--spacing-5);border-bottom:1px solid var(--color-border-subtle) }
.sg-sidebar__brand { display:flex;align-items:center;gap:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold);text-decoration:none;transition:color var(--duration-fast) var(--ease-out) }
.sg-sidebar__brand:hover { color:var(--color-brand-primary-light) }
.sg-sidebar__brand-icon { display:flex;justify-content:center;align-items:center;width:var(--size-icon-md);height:var(--size-icon-md);color:var(--color-white);font-size:var(--text-xl);background:var(--gradient-primary-enhanced);border-radius:var(--radius-lg) }
.sg-sidebar__brand-text { font-weight:var(--font-semibold);letter-spacing:var(--tracking-tight) }
.sg-sidebar__nav { overflow-y:auto;flex:1;padding:var(--spacing-4) var(--spacing-3) }
.sg-sidebar__section { margin-bottom:var(--spacing-6) }
.sg-sidebar__section:last-child { margin-bottom:0 }
.sg-sidebar__section-label { display:block;margin-bottom:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out) }
.sg-sidebar__section--active .sg-sidebar__section-label { color:var(--color-brand-primary-light);background:var(--alpha-white-5);border-radius:var(--radius-md) }
.sg-sidebar__list { display:flex;flex-direction:column;gap:var(--spacing-1);margin:0;padding:0;list-style:none }
.sg-sidebar__item { position:relative }
.sg-sidebar__link { position:relative;display:flex;align-items:center;gap:var(--spacing-3);min-height:var(--touch-target-min);padding:var(--spacing-3) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);text-decoration:none;background:transparent;border:none;border-radius:var(--radius-lg);transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer;will-change:transform }
.sg-sidebar__link-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--size-icon-sm);font-size:var(--text-base);color:var(--color-brand-primary);transition:transform var(--duration-fast) var(--ease-out) }
.sg-sidebar__link-text { overflow:hidden;flex:1;text-overflow:ellipsis;white-space:nowrap }
.sg-sidebar__link-badge { display:inline-flex;justify-content:center;align-items:center;min-width:var(--spacing-5);height:var(--spacing-5);padding:0 var(--spacing-1-5);color:var(--color-white);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-brand-primary);border-radius:var(--radius-full) }
.sg-sidebar__link:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.sg-sidebar__link:hover .sg-sidebar__link-icon { transform:scale(1.1) }
.sg-sidebar__link--active,.sg-sidebar__link[aria-current=page] { color:var(--color-brand-primary-light);font-weight:var(--font-semibold);background:var(--alpha-white-5) }
.sg-sidebar__link--active:before,.sg-sidebar__link[aria-current=page]:before { position:absolute;top:var(--spacing-1);bottom:var(--spacing-1);left:0;width:var(--spacing-1);background:var(--gradient-primary-enhanced);border-radius:0 var(--radius-full) var(--radius-full) 0;content:"" }
.sg-sidebar__link:focus-visible,.sg-sidebar__link:focus { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.sg-sidebar__footer { padding:var(--spacing-4) var(--spacing-3);border-top:1px solid var(--color-border-subtle) }
.sg-sidebar__toggle { position:fixed;top:var(--spacing-4);left:var(--spacing-4);z-index:calc(var(--z-index-sticky) + 1);display:none;padding:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-xl);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);transition:background-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.sg-sidebar__toggle:hover { background:var(--color-surface-hover);transform:scale(1.05) }
.sg-sidebar__toggle:active { transform:scale(.95) }
.sg-sidebar__backdrop { position:fixed;inset:0;z-index:calc(var(--z-index-sticky) - 1);display:none;background:var(--alpha-black-50);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);backdrop-filter:var(--backdrop-blur-medium) }
body.is-scroll-locked { overflow:hidden }
.sg-sidebar__nav::-webkit-scrollbar { width:var(--spacing-2) }
.sg-sidebar__nav::-webkit-scrollbar-track { background:transparent }
.sg-sidebar__nav::-webkit-scrollbar-thumb { background:var(--alpha-white-10);border-radius:var(--radius-full) }
.sg-sidebar__nav::-webkit-scrollbar-thumb:hover { background:var(--alpha-white-20) }
.sg-sidebar__divider { height:1px;margin:var(--spacing-4) var(--spacing-3);background:var(--color-border-subtle) }
@media (min-width:1025px) { .sg-mobile-nav { display:none }
 }
.sg-mobile-nav__toggle { position:fixed;right:var(--spacing-4);bottom:var(--spacing-6);z-index:var(--z-index-modal);display:flex;justify-content:center;align-items:center;width:var(--spacing-14);height:var(--spacing-14);padding:0;color:var(--color-text-primary);background:var(--glass-bg-dark);border:1px solid var(--glass-border);border-radius:var(--radius-full);box-shadow:var(--shadow-lg),0 0 20px var(--color-brand-primary-20);transition:transform var(--duration-fast) var(--ease-spring),box-shadow var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);will-change:transform;cursor:pointer;backdrop-filter:var(--backdrop-blur-heavy) }
.sg-mobile-nav__toggle:hover { background:var(--color-surface-hover);box-shadow:var(--shadow-xl),0 0 30px var(--color-brand-primary-30);transform:scale(1.05) }
.sg-mobile-nav__toggle:active { transform:scale(.95) }
.sg-mobile-nav__toggle:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.sg-mobile-nav__toggle-icon { position:relative;display:flex;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6) }
.sg-mobile-nav__toggle-line { position:absolute;left:50%;width:var(--spacing-5);height:var(--spacing-0-5);background:currentcolor;border-radius:var(--radius-full);transition:transform var(--duration-fast) var(--ease-spring),opacity var(--duration-fast) var(--ease-out);transform:translateX(-50%) }
.sg-mobile-nav__toggle-line:first-child { top:var(--spacing-1-5) }
.sg-mobile-nav__toggle-line:nth-child(2) { top:50%;transform:translate(-50%,-50%) }
.sg-mobile-nav__toggle-line:nth-child(3) { bottom:var(--spacing-1-5) }
.sg-mobile-nav--open .sg-mobile-nav__toggle-line:first-child { top:50%;transform:translate(-50%,-50%) rotate(45deg) }
.sg-mobile-nav--open .sg-mobile-nav__toggle-line:nth-child(2) { opacity:0;transform:translate(-50%,-50%) scaleX(0) }
.sg-mobile-nav--open .sg-mobile-nav__toggle-line:nth-child(3) { bottom:50%;transform:translate(-50%,50%) rotate(-45deg) }
.sg-mobile-nav--open .sg-mobile-nav__toggle { background:var(--color-brand-primary);box-shadow:var(--shadow-xl),0 0 40px var(--color-brand-primary-40) }
.sg-mobile-nav__backdrop { position:fixed;inset:0;z-index:calc(var(--z-index-modal) - 2);background:var(--alpha-black-60);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;backdrop-filter:var(--backdrop-blur-light) }
.sg-mobile-nav--open .sg-mobile-nav__backdrop { opacity:100%;pointer-events:auto }
.sg-mobile-nav__drawer { position:fixed;top:0;left:0;z-index:calc(var(--z-index-modal) - 1);display:flex;overflow:hidden;flex-direction:column;width:min(var(--size-dropdown-recent),85vw);height:100vh;height:100dvh;background:var(--glass-bg-darker);border-right:1px solid var(--glass-border);box-shadow:var(--shadow-2xl);visibility:hidden;transform:translateX(-100%);transition:transform var(--duration-medium) var(--ease-out),visibility 0s linear var(--duration-medium);will-change:transform;backdrop-filter:var(--backdrop-blur-extra-heavy) }
.sg-mobile-nav--open .sg-mobile-nav__drawer { visibility:visible;transform:translateX(0);transition:transform var(--duration-medium) var(--ease-out),visibility 0s linear 0s }
.sg-mobile-nav__header { display:flex;flex-shrink:0;align-items:center;gap:var(--spacing-3);padding:var(--spacing-5);border-bottom:1px solid var(--color-border-subtle) }
.sg-mobile-nav__brand { display:flex;align-items:center;gap:var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold);text-decoration:none }
.sg-mobile-nav__brand-icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);color:var(--color-white);font-size:var(--text-lg);background:var(--gradient-primary-enhanced);border-radius:var(--radius-lg) }
.sg-mobile-nav__brand-text { font-weight:var(--font-semibold);letter-spacing:var(--tracking-tight) }
.sg-mobile-nav__content { overflow-x:hidden;overflow-y:auto;flex:1;padding:var(--spacing-4) var(--spacing-3);-webkit-overflow-scrolling:touch;overscroll-behavior:contain }
.sg-mobile-nav__content::-webkit-scrollbar { width:var(--spacing-1) }
.sg-mobile-nav__content::-webkit-scrollbar-track { background:transparent }
.sg-mobile-nav__content::-webkit-scrollbar-thumb { background:var(--alpha-white-10);border-radius:var(--radius-full) }
.sg-mobile-nav__section { margin-bottom:var(--spacing-5) }
.sg-mobile-nav__section:last-child { margin-bottom:0 }
.sg-mobile-nav__section-label { display:block;margin-bottom:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-tertiary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.sg-mobile-nav__list { display:flex;flex-direction:column;gap:var(--spacing-1);margin:0;padding:0;list-style:none }
.sg-mobile-nav__item { opacity:0;transform:translateX(-20px);animation:sg-mobile-nav-slide-in var(--duration-fast) var(--ease-out) forwards }
.sg-mobile-nav--open .sg-mobile-nav__item:first-child { animation-delay:50ms }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(2) { animation-delay:75ms }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(3) { animation-delay:.1s }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(4) { animation-delay:125ms }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(5) { animation-delay:.15s }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(6) { animation-delay:175ms }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(7) { animation-delay:.2s }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(8) { animation-delay:225ms }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(9) { animation-delay:.25s }
.sg-mobile-nav--open .sg-mobile-nav__item:nth-child(10) { animation-delay:275ms }
.sg-mobile-nav__link { position:relative;display:flex;align-items:center;gap:var(--spacing-3);min-height:var(--size-touch-comfortable);padding:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);text-decoration:none;background:transparent;border-radius:var(--radius-lg);transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);-webkit-tap-highlight-color:transparent;touch-action:manipulation }
.sg-mobile-nav__link:focus,.sg-mobile-nav__link:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.sg-mobile-nav__link:active { transform:scale(.98) }
.sg-mobile-nav__link:focus-visible { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:calc(var(--focus-ring-offset)*-1) }
.sg-mobile-nav__link-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--size-icon-sm);font-size:var(--text-base);color:var(--color-brand-primary);transition:transform var(--duration-fast) var(--ease-out) }
.sg-mobile-nav__link:hover .sg-mobile-nav__link-icon { transform:scale(1.1) }
.sg-mobile-nav__link-text { overflow:hidden;flex:1;text-overflow:ellipsis;white-space:nowrap }
.sg-mobile-nav__link-badge { display:inline-flex;justify-content:center;align-items:center;min-width:var(--spacing-5);height:var(--spacing-5);padding:0 var(--spacing-1-5);color:var(--color-white);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-brand-primary);border-radius:var(--radius-full) }
.sg-mobile-nav__link--active,.sg-mobile-nav__link[aria-current=page] { color:var(--color-brand-primary-light);font-weight:var(--font-semibold);background:var(--alpha-white-5) }
.sg-mobile-nav__link--active:before,.sg-mobile-nav__link[aria-current=page]:before { position:absolute;top:var(--spacing-1);bottom:var(--spacing-1);left:0;width:var(--spacing-1);background:var(--gradient-primary-enhanced);border-radius:0 var(--radius-full) var(--radius-full) 0;content:"" }
.sg-mobile-nav__footer { flex-shrink:0;padding:var(--spacing-4) var(--spacing-3);border-top:1px solid var(--color-border-subtle) }
.sg-mobile-nav__divider { height:1px;margin:var(--spacing-4) var(--spacing-3);background:var(--color-border-subtle) }
@media (prefers-reduced-motion:reduce) { .sg-mobile-nav__backdrop,.sg-mobile-nav__drawer,.sg-mobile-nav__link-icon,.sg-mobile-nav__link,.sg-mobile-nav__toggle-line,.sg-mobile-nav__toggle { transition:none }
.sg-mobile-nav__item { animation:none;opacity:100%;transform:none }
.sg-mobile-nav__link:active,.sg-mobile-nav__link:hover .sg-mobile-nav__link-icon,.sg-mobile-nav__toggle:active,.sg-mobile-nav__toggle:hover { transform:none }
 }
@media (prefers-contrast:more) { .sg-mobile-nav__toggle { border-width:var(--border-width-2) }
.sg-mobile-nav__drawer { border-right-width:var(--border-width-2) }
.sg-mobile-nav__link--active,.sg-mobile-nav__link[aria-current=page] { border:var(--border-width-2) solid var(--color-brand-primary) }
.sg-mobile-nav__link:focus-visible { outline-width:var(--border-width-3) }
 }
@supports (padding-bottom:env(safe-area-inset-bottom)) { .sg-mobile-nav__toggle { right:calc(var(--spacing-4) + env(safe-area-inset-right));bottom:calc(var(--spacing-6) + env(safe-area-inset-bottom)) }
.sg-mobile-nav__drawer { padding-left:env(safe-area-inset-left) }
.sg-mobile-nav__footer { padding-bottom:calc(var(--spacing-4) + env(safe-area-inset-bottom)) }
 }
.templates-page .page-header p,.templates-page .text-muted,.templates-page .text-secondary { color:var(--color-text-secondary) }
.templates-page .c-templates-toolbar .input,.templates-page .c-templates-toolbar input,.templates-page .c-templates-toolbar select { color:var(--color-text-primary);background:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-primary) }
.templates-page .template-card { padding:var(--spacing-3);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary);border-radius:var(--radius-lg) }
.templates-page .template-card h3 { color:var(--color-text-primary) }
.templates-page .template-description { color:var(--color-text-secondary) }
.templates-page .template-stats { color:var(--color-text-tertiary) }
.templates-page .badge { color:var(--color-brand-primary-light);background:var(--color-brand-primary-subtle);border:var(--spacing-px) solid var(--color-brand-primary-subtle) }
.templates-page .btn,.templates-page .btn * { color:var(--color-text-primary) }
.templates-page .modal .input,.templates-page .modal input,.templates-page .modal textarea { color:var(--color-text-primary);background:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-primary) }
.templates-page .btn:disabled { opacity:70% }
.templates-page .modal .c-tpl-body-field,.templates-page .modal .c-tpl-subject-field,.templates-page .modal .mb-2,.templates-page .modal .mt-2 { width:100% }
.templates-page .modal .email-preview { border:var(--spacing-px) solid var(--color-border-primary) }
.templates-modal__form { display:flex;flex-direction:column;gap:var(--spacing-6) }
.templates-modal__field-group { display:flex;flex-direction:column;gap:var(--spacing-2) }
.templates-modal__label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-medium) }
.templates-modal__label--required:after { content:" *";color:var(--color-danger) }
.templates-modal__input,.templates-modal__select,.templates-modal__textarea { width:100%;padding:var(--input-padding-y) var(--input-padding-x);color:var(--color-text-primary);font-size:var(--text-base);background-color:var(--input-bg);border:1px solid var(--input-border);border-radius:var(--input-radius);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out) }
.templates-modal__input:focus,.templates-modal__select:focus,.templates-modal__textarea:focus { border-color:var(--input-border-focus);outline:none;box-shadow:0 0 0 3px var(--color-brand-primary-subtle) }
.templates-modal__textarea { min-height:var(--card-min-height-category-empty);font-family:var(--font-mono);resize:vertical }
.templates-modal__select { padding-right:var(--spacing-10);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23fff' d='M10.293 3.293 6 7.586 1.707 3.293A1 1 0 0 0 .293 4.707l5 5a1 1 0 0 0 1.414 0l5-5a1 1 0 1 0-1.414-1.414'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacing-3) center;appearance:none }
.templates-modal__field-group--invalid .templates-modal__input,.templates-modal__field-group--invalid .templates-modal__select,.templates-modal__field-group--invalid .templates-modal__textarea { border-color:var(--color-danger) }
.templates-modal__field-group--invalid .templates-modal__input:focus,.templates-modal__field-group--invalid .templates-modal__select:focus,.templates-modal__field-group--invalid .templates-modal__textarea:focus { box-shadow:0 0 0 3px var(--color-danger-subtle) }
.templates-modal__field-group--valid .templates-modal__input,.templates-modal__field-group--valid .templates-modal__select,.templates-modal__field-group--valid .templates-modal__textarea { border-color:var(--color-success) }
.templates-modal__error-message { margin-top:var(--spacing-1);color:var(--color-danger);font-size:var(--text-sm) }
.templates-modal__hint { margin-top:var(--spacing-1);color:var(--color-text-tertiary);font-size:var(--text-sm) }
.sg-modal .validation-message { display:none;margin-top:var(--spacing-1);font-size:var(--text-sm) }
.sg-modal .validation-message--error { display:block;color:var(--color-danger) }
.sg-modal .validation-message--warning { display:block;color:var(--color-warning) }
.sg-modal .field-error,.sg-modal input.field-error,.sg-modal select.field-error,.sg-modal textarea.field-error { border-color:var(--color-danger);animation:templates-modal-shake .3s }
.sg-modal .field-error:focus { box-shadow:0 0 0 3px var(--color-danger-subtle) }
.sg-modal .field-valid,.sg-modal input.field-valid,.sg-modal select.field-valid,.sg-modal textarea.field-valid { border-color:var(--color-success) }
.sg-modal .field-valid:focus { box-shadow:0 0 0 3px var(--color-success-subtle) }
.templates-modal__tokens { margin-top:var(--spacing-2);padding:var(--spacing-4);background-color:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md) }
.templates-modal__tokens-title { margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold) }
.templates-modal__tokens-grid { display:grid;grid-gap:var(--spacing-2);gap:var(--spacing-2);grid-template-columns:repeat(auto-fill,minmax(var(--col-width-narrow),1fr)) }
.templates-modal__token { padding:var(--spacing-1-5) var(--spacing-2);color:var(--color-text-tertiary);font-family:var(--font-mono);font-size:var(--text-xs);background-color:var(--color-surface-overlay);border:1px solid var(--color-border-default);border-radius:var(--radius-sm);transition:all var(--duration-fast) var(--ease-out);cursor:help }
.templates-modal__token:hover { color:var(--color-text-secondary);background-color:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(-1px) }
.token-item { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-tertiary);font-family:var(--font-mono);font-size:var(--text-xs);background-color:var(--color-surface-overlay);border:1px solid var(--color-border-default);border-radius:var(--radius-sm);transition:all var(--duration-fast) var(--ease-out);cursor:help }
.token-item:hover { color:var(--color-text-secondary);background-color:var(--color-surface-hover);border-color:var(--color-border-strong) }
.token-item--required { color:var(--color-brand-primary);border-color:var(--color-brand-primary-subtle) }
.token-item--required:hover { border-color:var(--color-brand-primary) }
.templates-modal__tabs { display:flex;gap:var(--spacing-2);margin-bottom:var(--spacing-6);border-bottom:1px solid var(--color-border-default) }
.templates-modal__tab { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-weight-medium);background-color:transparent;border:none;border-bottom:2px solid transparent;transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.templates-modal__tab:hover { color:var(--color-text-secondary) }
.templates-modal__tab--active { border-bottom-color:var(--color-brand-primary);color:var(--color-brand-primary) }
.templates-modal__tab-panel { display:none }
.templates-modal__tab-panel--active { display:block }
.templates-modal__dropzone { padding:var(--spacing-12);text-align:center;background-color:var(--color-surface-elevated);border:2px dashed var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.templates-modal__dropzone--dragover,.templates-modal__dropzone:hover { background-color:var(--color-surface-overlay);border-color:var(--color-brand-primary) }
.templates-modal__dropzone-icon { margin-bottom:var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-4xl) }
.templates-modal__dropzone--dragover .templates-modal__dropzone-icon { color:var(--color-brand-primary) }
.templates-modal__dropzone-text { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-base);font-weight:var(--font-weight-medium) }
.templates-modal__dropzone-hint { color:var(--color-text-tertiary);font-size:var(--text-sm) }
.templates-modal__preview { margin-top:var(--spacing-6) }
.templates-modal__preview-title { margin-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.templates-modal__preview-table { overflow:hidden;width:100%;background-color:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-md);border-collapse:collapse }
.templates-modal__preview-table th { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);text-align:left;background-color:var(--color-surface-elevated);border-bottom:1px solid var(--color-border-default) }
.templates-modal__preview-table td { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);border-bottom:1px solid var(--color-border-subtle) }
.templates-modal__preview-table tr:last-child td { border-bottom:none }
.templates-modal__preview-table tr:hover td { background-color:var(--color-surface-hover) }
.templates-modal__status { display:inline-flex;align-items:center;gap:var(--spacing-2);font-size:var(--text-sm);font-weight:var(--font-weight-medium) }
.templates-modal__status-icon { font-size:var(--text-base) }
.templates-modal__status--valid { color:var(--color-success) }
.templates-modal__status--invalid { color:var(--color-danger) }
.templates-modal__status--duplicate { color:var(--color-warning) }
.templates-modal__validation-list { margin-top:var(--spacing-4);padding:var(--spacing-4);list-style:none;background-color:var(--color-surface-elevated);border-left:3px solid var(--color-danger);border-radius:var(--radius-sm) }
.templates-modal__validation-item { margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.templates-modal__validation-item:last-child { margin-bottom:0 }
.templates-modal__validation-item strong { color:var(--color-text-primary);font-weight:var(--font-weight-semibold) }
.templates-modal__summary { margin-top:var(--spacing-6);padding:var(--spacing-6);background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-surface-overlay) 100%);border:1px solid var(--color-border-default);border-radius:var(--radius-lg) }
.templates-modal__summary-title { margin-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-weight-semibold) }
.templates-modal__summary-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--col-width-narrow),1fr)) }
.templates-modal__summary-item { text-align:center }
.templates-modal__summary-value { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-weight-bold) }
.templates-modal__summary-value--success { color:var(--color-success) }
.templates-modal__summary-value--warning { color:var(--color-warning) }
.templates-modal__summary-value--danger { color:var(--color-danger) }
.templates-modal__summary-label { color:var(--color-text-tertiary);font-size:var(--text-sm);font-weight:var(--font-weight-medium) }
.templates-modal__loading { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-4);padding:var(--spacing-12);color:var(--color-text-secondary);text-align:center }
.templates-modal__loading-spinner { width:var(--size-touch-comfortable);height:var(--size-touch-comfortable);border-radius:var(--radius-full);animation:templates-modal-spin 1s linear infinite;border:3px solid var(--color-border-default);border-top-color:var(--color-brand-primary) }
.templates-modal__loading-text { font-size:var(--text-base);font-weight:var(--font-weight-medium) }
@media (max-width:768px) { .templates-modal__summary-grid,.templates-modal__tokens-grid { grid-template-columns:1fr }
.templates-modal__preview-table { font-size:var(--text-xs) }
.templates-modal__preview-table td,.templates-modal__preview-table th { padding:var(--spacing-2) var(--spacing-3) }
 }
.form-field { position:relative;display:block;width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-on-dark);font-family:inherit;font-size:var(--text-base);line-height:var(--leading-normal);background-color:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-base);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out) }
.form-field:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-15),var(--shadow-sm) }
.form-field:disabled { background-color:var(--color-surface-secondary);opacity:60%;cursor:not-allowed }
.form-field::placeholder { color:var(--color-text-on-dark-muted);opacity:70% }
.form-field--error,.form-field.has-error { background-color:var(--color-danger-subtle);border-color:var(--color-danger);animation:shake var(--duration-medium) var(--ease-out) }
.form-field--error:focus,.form-field.has-error:focus { border-color:var(--color-danger);box-shadow:0 0 0 var(--spacing-0-75) var(--color-error-15),var(--shadow-sm) }
.form-field--success,.form-field.has-success { background-color:var(--color-success-subtle);border-color:var(--color-success);animation:highlight-success var(--duration-medium) var(--ease-out) }
.form-field--success:focus,.form-field.has-success:focus { border-color:var(--color-success);box-shadow:0 0 0 var(--spacing-0-75) var(--color-success-15),var(--shadow-sm) }
.form-field--warning { background-color:var(--color-warning-subtle);border-color:var(--color-warning) }
.form-field--warning:focus { border-color:var(--color-warning);box-shadow:0 0 0 var(--spacing-0-75) var(--alpha-warning-20),var(--shadow-sm) }
.form-message { margin-top:var(--spacing-1);font-size:var(--text-sm);line-height:var(--leading-normal);transition:opacity var(--duration-fast) var(--ease-out) }
.form-message--error { color:var(--color-danger-high-contrast) }
.form-message--success { color:var(--color-success-high-contrast) }
.form-message--warning { color:var(--color-warning-high-contrast) }
.form-message--help { color:var(--color-text-on-dark-secondary) }
.validation-message { min-height:var(--spacing-5);margin-top:var(--spacing-1);color:var(--color-danger-high-contrast);font-size:var(--text-sm);line-height:var(--leading-normal);transition:opacity var(--duration-fast) var(--ease-out) }
.validation-message:empty { display:none }
.field-error,.form-input.field-error,.form-select.field-error,.form-textarea.field-error { background-color:var(--color-danger-subtle);border-color:var(--color-danger);animation:shake var(--duration-medium) var(--ease-out) }
.field-error:focus,.form-input.field-error:focus,.form-select.field-error:focus,.form-textarea.field-error:focus { border-color:var(--color-danger);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-error-15),var(--shadow-sm) }
.field-valid,.form-input.field-valid,.form-select.field-valid,.form-textarea.field-valid { border-color:var(--color-success);animation:highlight-success var(--duration-medium) var(--ease-out) }
.field-valid:focus,.form-input.field-valid:focus,.form-select.field-valid:focus,.form-textarea.field-valid:focus { border-color:var(--color-success);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-success-15),var(--shadow-sm) }
.form-group:last-child { margin-bottom:0 }
.form-label { color:var(--color-text-on-dark);font-weight:var(--font-medium);transition:color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out) }
.form-label--required:after { margin-left:var(--spacing-1);color:var(--color-danger-high-contrast);content:"*" }
.form-input { position:relative;display:block;width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-on-dark);font-family:inherit;font-size:var(--text-base);line-height:var(--leading-normal);background-color:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-base);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out) }
.form-input:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-15),var(--shadow-sm) }
.form-input::placeholder { color:var(--color-text-on-dark-muted);opacity:70% }
.form-textarea { position:relative;display:block;width:100%;min-height:var(--spacing-24);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-on-dark);font-family:inherit;font-size:var(--text-base);line-height:var(--leading-normal);background-color:var(--color-surface-elevated);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-base);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out) }
.form-textarea:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-15),var(--shadow-sm) }
.form-textarea::placeholder { color:var(--color-text-on-dark-muted);opacity:70% }
.form-select { position:relative;display:block;width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-on-dark);font-family:inherit;font-size:var(--text-base);line-height:var(--leading-normal);background-color:var(--color-surface-elevated);background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%2394a3b8' d='M4 6l4 4 4-4z'/%3E%3C/svg%3E");background-size:var(--spacing-4) var(--spacing-4);border:var(--spacing-px) solid var(--color-border-default);border-radius:var(--radius-base);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out) }
.form-select:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-15),var(--shadow-sm);background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%2320808d' d='M4 10l4-4 4 4z'/%3E%3C/svg%3E") }
.form-check { position:relative;display:flex;align-items:flex-start;margin-bottom:var(--spacing-2);padding-left:var(--spacing-6) }
.form-check:last-child { margin-bottom:0 }
.form-check__input { position:absolute;top:var(--spacing-0-5);left:0;width:var(--spacing-4);height:var(--spacing-4);margin:0;background-color:var(--color-surface-elevated);border:var(--border-width-2) solid var(--color-border-default);transition:background-color var(--duration-fast) var(--ease-bounce),border-color var(--duration-fast) var(--ease-bounce),transform var(--duration-fast) var(--ease-bounce);cursor:pointer }
.form-check__input[type=checkbox] { border-radius:var(--radius-sm) }
.form-check__input[type=radio] { border-radius:var(--radius-full) }
.form-check__input:hover { border-color:var(--color-brand-primary) }
.form-check__input:focus { outline:none;border-color:var(--color-brand-primary);box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-15) }
.form-check__input:checked { background-color:var(--color-brand-primary);border-color:var(--color-brand-primary);animation:checkbox-bounce var(--duration-medium) var(--ease-bounce) }
.form-check__label { margin-bottom:0;color:var(--color-text-on-dark);font-size:var(--text-base);font-weight:var(--font-normal);cursor:pointer;-webkit-user-select:none;user-select:none }
.form-input-group { position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100% }
.form-input-group>.form-field { position:relative;flex:1 1 auto;width:1%;min-width:0;margin-bottom:0 }
.form-input-group-append,.form-input-group-prepend { display:flex }
.form-input-group-append .form-input-group-text,.form-input-group-prepend .form-input-group-text { display:flex;align-items:center;margin-bottom:0;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-base);font-weight:var(--font-normal);line-height:var(--leading-normal);text-align:center;white-space:nowrap;background-color:var(--color-surface-secondary);border:var(--spacing-px) solid var(--color-border-default) }
.form-input-group-prepend .form-input-group-text { border-right:0;border-top-right-radius:0;border-bottom-right-radius:0 }
.form-input-group-append .form-input-group-text { border-left:0;border-top-left-radius:0;border-bottom-left-radius:0 }
.form-input-group>.form-input-group-prepend>.btn,.form-input-group>.form-input-group-prepend>.form-input-group-text { border-top-right-radius:0;border-bottom-right-radius:0 }
.form-input-group>.form-field:not(:first-child),.form-input-group>.form-input-group-append>.btn,.form-input-group>.form-input-group-append>.form-input-group-text { border-top-left-radius:0;border-bottom-left-radius:0 }
.form-input-group>.form-field:not(:last-child) { border-top-right-radius:0;border-bottom-right-radius:0 }
.form-actions { justify-content:flex-end;padding-top:var(--spacing-6) }
.form-actions--left { justify-content:flex-start }
.form-actions--center { justify-content:center }
.form-actions--space-between { justify-content:space-between }
.form-field--sm { padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm) }
.form-field--lg { padding:var(--spacing-4) var(--spacing-5);font-size:var(--text-lg) }
.form-label--sm { font-size:var(--text-xs) }
.form-label--lg { font-size:var(--text-base) }
.form-inline { display:flex;flex-flow:row wrap;align-items:center;gap:var(--spacing-3) }
.form-inline .form-group { display:flex;flex:0 0 auto;flex-flow:row wrap;align-items:center;gap:var(--spacing-2);margin-bottom:0 }
.form-inline .form-field { display:inline-block;width:auto;vertical-align:middle }
.form-floating { position:relative }
.form-floating>.form-field { height:var(--spacing-14);padding:var(--spacing-4) var(--spacing-4) var(--spacing-2);line-height:1.25 }
.form-floating>label { position:absolute;top:0;left:0;height:100%;padding:var(--spacing-4) var(--spacing-4) 0;color:var(--color-text-on-dark-secondary);border:var(--spacing-px) solid transparent;transform-origin:0 0;transition:transform var(--duration-fast) var(--ease-bounce),color var(--duration-fast) var(--ease-out),opacity var(--duration-fast) var(--ease-out);pointer-events:none }
.form-floating .form-field:focus~label { color:var(--color-brand-primary);opacity:100%;transform:scale(.85) translateY(-.5rem) translateX(.15rem) }
.form-floating .form-field:not(:placeholder-shown)~label { color:var(--color-text-on-dark);opacity:80%;transform:scale(.85) translateY(-.5rem) translateX(.15rem) }
.form-field--with-icon { padding-right:var(--spacing-10) }
.form-field__icon { position:absolute;top:50%;right:var(--spacing-3);color:var(--color-text-secondary);transform:translateY(-50%);pointer-events:none }
.form-field--error .form-field__icon { color:var(--color-danger) }
.form-field--success .form-field__icon { color:var(--color-success) }
.form-field--warning .form-field__icon { color:var(--color-warning) }
.form-file { position:relative;display:inline-block;width:100%;min-height:var(--spacing-24) }
.form-file__input { position:relative;z-index:2;width:100%;height:100%;margin:0;opacity:0;cursor:pointer }
.form-file__label { position:absolute;top:0;right:0;left:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:var(--spacing-24);padding:var(--spacing-6) var(--spacing-4);overflow:hidden;color:var(--color-text-on-dark-secondary);font-weight:var(--font-normal);line-height:var(--leading-normal);text-align:center;background-color:var(--color-surface-elevated);border:var(--border-width-2) dashed var(--color-border-default);border-radius:var(--radius-lg);transition:border-color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.form-file__label:before { margin-bottom:var(--spacing-2);color:var(--color-brand-primary);font-size:var(--text-2xl);content:"\1F4C1" }
.form-file__label:after { margin-top:var(--spacing-1);color:var(--color-text-on-dark-muted);font-size:var(--text-xs);content:"or drag and drop" }
.form-file__input:focus~.form-file__label { border-color:var(--color-brand-primary);box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-15),var(--shadow-sm) }
.form-file.is-dragover .form-file__label,.form-file__label:hover { background-color:var(--color-brand-primary-10);border-color:var(--color-brand-primary);transform:scale(1.02);box-shadow:var(--shadow-glow-sm-brand) }
.form-file.is-dragover .form-file__label:before { animation:file-bounce var(--duration-medium) var(--ease-bounce) }
.form-range { width:100%;height:var(--spacing-6);padding:0;background-color:transparent;appearance:none }
.form-range:focus { outline:none }
.form-range::-webkit-slider-track { width:100%;height:var(--spacing-1);color:transparent;background:linear-gradient(to right,var(--color-brand-primary) 0,var(--color-brand-primary) 50%,var(--color-border-default) 50%,var(--color-border-default) 100%);border-color:transparent;border-radius:var(--radius-full);transition:background var(--duration-fast) var(--ease-out);cursor:pointer }
.form-range::-moz-range-track { width:100%;height:var(--spacing-1);background-color:var(--color-border-default);border-color:transparent;border-radius:var(--radius-full);cursor:pointer }
.form-range::-moz-range-progress { height:var(--spacing-1);background-color:var(--color-brand-primary);border-radius:var(--radius-full) }
.form-range::-webkit-slider-thumb { width:var(--spacing-5);height:var(--spacing-5);margin-top:calc((var(--spacing-1) - var(--spacing-5))/2);background-color:var(--color-brand-primary);border:0;border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer;appearance:none }
.form-range::-moz-range-thumb { width:var(--spacing-5);height:var(--spacing-5);background-color:var(--color-brand-primary);border:0;border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:pointer }
.form-range:hover::-webkit-slider-thumb { background-color:var(--color-brand-primary-light);transform:scale(1.1);box-shadow:var(--shadow-glow-sm-brand) }
.form-range:hover::-moz-range-thumb { background-color:var(--color-brand-primary-light);transform:scale(1.1);box-shadow:var(--shadow-glow-sm-brand) }
.form-range:focus::-webkit-slider-thumb { box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-15),var(--shadow-glow-sm-brand) }
.form-range:focus::-moz-range-thumb { box-shadow:0 0 0 var(--spacing-0-75) var(--color-brand-primary-15),var(--shadow-glow-sm-brand) }
@media (max-width:768px) { .form-actions { flex-direction:column;gap:var(--spacing-2) }
.form-inline { flex-direction:column;align-items:stretch }
.form-inline .form-field,.form-inline .form-group { width:100% }
 }
@media (prefers-color-scheme:dark) { .form-field { color:var(--color-text-on-dark);background-color:var(--color-surface-secondary) }
.form-field:disabled { background-color:var(--color-surface-overlay) }
.form-input-group-text { color:var(--color-text-on-dark-secondary);background-color:var(--color-surface-overlay) }
.form-file__label { background-color:var(--color-surface-secondary) }
 }
@media (prefers-reduced-motion:reduce) { .form-check__input,.form-field,.form-file__label,.form-floating>label,.form-input,.form-label,.form-range::-moz-range-thumb,.form-range::-webkit-slider-thumb,.form-select,.form-textarea { animation:none;transition-duration:.01ms }
.field-error,.field-valid,.form-field--error,.form-field--success,.form-field.has-error,.form-field.has-success { animation:none }
.form-field:focus,.form-input:focus,.form-select:focus,.form-textarea:focus { transition:none }
.form-check__input:checked,.form-file.is-dragover .form-file__label:before { animation:none }
.form-range:hover::-moz-range-thumb,.form-range:hover::-webkit-slider-thumb { transform:none }
 }
.form-group { margin-bottom:var(--spacing-4) }
.form-row { display:flex;gap:var(--spacing-4);margin-bottom:var(--spacing-4) }
.form-column { flex:1 }
.form-label { display:block;margin-bottom:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-weight-medium) }
.form-label--required:after { content:" *";color:var(--color-danger) }
.form-input,.form-select,.form-textarea { width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-family:inherit;font-size:var(--text-base);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) }
.form-textarea { min-height:var(--spacing-32);resize:vertical }
.form-select { padding-right:var(--spacing-10);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%236b7280' d='M4.5 5.5 8 9l3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacing-3) center;cursor:pointer;appearance:none }
.form-input:focus,.form-select:focus,.form-textarea:focus { background:var(--color-surface-secondary);border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px var(--color-primary-subtle) }
.form-input::placeholder,.form-textarea::placeholder { color:var(--color-text-tertiary) }
.form-input:disabled,.form-select:disabled,.form-textarea:disabled { color:var(--color-text-disabled);background:var(--color-surface-disabled);cursor:not-allowed }
.form-input--valid,.form-select--valid,.form-textarea--valid { border-color:var(--color-success) }
.form-input--invalid,.form-select--invalid,.form-textarea--invalid { border-color:var(--color-danger) }
.form-input--invalid:focus,.form-select--invalid:focus,.form-textarea--invalid:focus { box-shadow:0 0 0 3px var(--color-danger-subtle) }
.form-feedback { margin-top:var(--spacing-1);font-size:var(--text-sm) }
.form-feedback--valid { color:var(--color-success) }
.form-feedback--invalid { color:var(--color-danger) }
.form-feedback--help { color:var(--color-text-tertiary) }
.form-checkbox,.form-radio { width:var(--spacing-4);height:var(--spacing-4);margin:0;margin-right:var(--spacing-2);vertical-align:middle;background:var(--color-surface-primary);border:1px solid var(--color-border-default);transition:all var(--duration-fast);appearance:none }
.form-checkbox { border-radius:var(--radius-sm) }
.form-radio { border-radius:var(--radius-full) }
.form-checkbox:checked,.form-radio:checked { background:var(--color-primary);border-color:var(--color-primary) }
.form-checkbox:checked:after { display:block;color:var(--color-on-primary);font-size:var(--text-sm);line-height:var(--spacing-4);text-align:center;content:"✓" }
.form-radio:checked:after { content:"";display:block;width:var(--spacing-2);height:var(--spacing-2);margin:var(--spacing-1);background:var(--color-on-primary);border-radius:var(--radius-full) }
.form-input--sm,.form-select--sm { padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm) }
.form-input--lg,.form-select--lg { padding:var(--spacing-4) var(--spacing-5);font-size:var(--text-lg) }
.input-group { display:flex;align-items:stretch }
.input-group .form-input { border-right:0;border-radius:0 }
.input-group .form-input:first-child { border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md) }
.input-group .form-input:last-child { border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md);border-right:var(--spacing-px) solid var(--color-border-default) }
.input-group-text { display:flex;align-items:center;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-base);background:var(--color-surface-secondary);border:1px solid var(--color-border-default) }
.input-group-text:first-child { border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md);border-right:0 }
.input-group-text:last-child { border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md);border-left:0 }
.form-actions { display:flex;gap:var(--spacing-3);margin-top:var(--spacing-6);padding-top:var(--spacing-4);border-top:var(--spacing-px) solid var(--color-border-subtle) }
.form-actions--end { justify-content:flex-end }
.form-actions--between { justify-content:space-between }
fieldset { margin-bottom:var(--spacing-4);padding:var(--spacing-5);border:1px solid var(--color-border-default);border-radius:var(--radius-lg) }
legend { padding:0 var(--spacing-2);color:var(--color-text-primary);font-weight:var(--font-weight-semibold) }
@container (max-width: 768px) { .form-row { flex-direction:column;gap:var(--spacing-2) }
.form-actions { flex-direction:column }
.form-input,.form-select,.form-textarea { font-size:var(--text-base) }
 }
.form-input.invalid,.form-select.invalid,.form-textarea.invalid { background:var(--color-danger-bg,var(--color-surface-error));border-color:var(--color-danger) }
.form-input.valid,.form-select.valid,.form-textarea.valid { background:var(--color-success-bg,var(--color-surface-success));border-color:var(--color-success) }
.form-input.invalid:focus,.form-select.invalid:focus,.form-textarea.invalid:focus { border-color:var(--color-danger);box-shadow:0 0 0 3px var(--color-danger-shadow) }
.form-input.valid:focus,.form-select.valid:focus,.form-textarea.valid:focus { border-color:var(--color-success);box-shadow:0 0 0 3px var(--color-success-shadow) }
.form-error { display:none;margin-top:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);color:var(--color-danger);font-size:var(--text-sm);background:var(--color-danger-bg,var(--color-surface-error));border:1px solid var(--color-danger);border-radius:var(--radius-sm);animation:slide-down .2s ease-out }
.form-error[role=alert] { display:block }
.form-success { display:none;margin-top:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);color:var(--color-success);font-size:var(--text-sm);background:var(--color-success-bg,var(--color-surface-success));border:1px solid var(--color-success);border-radius:var(--radius-sm);animation:slide-down .2s ease-out }
form.invalid { position:relative }
form.invalid:before { display:block;margin-bottom:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);color:var(--color-danger);background:var(--color-danger-bg,var(--color-surface-error));border:1px solid var(--color-danger);border-radius:var(--radius-md);content:"Please correct the errors below" }
form.valid:before { display:block;margin-bottom:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);color:var(--color-success);background:var(--color-success-bg,var(--color-surface-success));border:1px solid var(--color-success);border-radius:var(--radius-md);content:"All fields are valid" }
@media (prefers-color-scheme:dark) { .form-select { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%239ca3af' d='M4.5 5.5 8 9l3.5-3.5'/%3E%3C/svg%3E") }
 }
.meeting-search-form { position:relative;margin-bottom:var(--spacing-6);padding:var(--spacing-6);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);transition:all var(--duration-medium) var(--ease-out) }
.meeting-search-form:before { position:absolute;inset:0;z-index:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-subtle) 100%);border-radius:var(--radius-2xl);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;content:"" }
.meeting-search-form:focus-within:before { opacity:var(--opacity-03) }
.meeting-search-form__main { position:relative;z-index:1;display:flex;align-items:center;gap:var(--spacing-3) }
.meeting-search-form__input-group { position:relative;display:flex;flex:1;align-items:center }
.meeting-search-form__icon { position:absolute;left:var(--spacing-4);z-index:2;color:var(--color-text-tertiary);font-size:var(--text-lg);transition:color var(--duration-fast) var(--ease-out);pointer-events:none }
.meeting-search-form__input { width:100%;padding:var(--spacing-4) var(--spacing-12) var(--spacing-4) var(--spacing-12);color:var(--color-text-primary);font-family:var(--font-sans);font-size:var(--text-base);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.meeting-search-form__input:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:var(--shadow-focus),var(--shadow-glow-sm-brand) }
.meeting-search-form__input:focus+.meeting-search-form__recent-btn { opacity:100% }
.meeting-search-form__input::placeholder { color:var(--color-text-tertiary) }
.meeting-search-form__recent-btn { position:absolute;right:var(--spacing-3);z-index:2;padding:var(--spacing-2);color:var(--color-text-secondary);background:transparent;border:none;border-radius:var(--radius-md);opacity:var(--opacity-60);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.meeting-search-form__recent-btn:hover { color:var(--color-brand-primary);background:var(--color-surface-hover);opacity:100% }
.meeting-search-form__recent-btn[aria-expanded=true] { color:var(--color-brand-primary);background:var(--color-brand-primary-subtle);opacity:100% }
.meeting-search-form__recent-dropdown { position:absolute;top:calc(100% + var(--spacing-2));right:0;z-index:100;overflow:hidden;width:var(--size-dropdown-recent);max-width:100%;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);opacity:0;transform:var(--transform-dropdown-enter);transition:all var(--duration-fast) cubic-bezier(.68,-.55,.265,1.55);pointer-events:none }
.meeting-search-form__recent-dropdown[data-state=expanded] { opacity:100%;transform:translateY(0);pointer-events:auto }
.meeting-search-form__recent-header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);border-bottom:1px solid var(--color-border-default) }
.meeting-search-form__recent-clear { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-tertiary);font-size:var(--text-xs);background:transparent;border:none;border-radius:var(--radius-sm);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.meeting-search-form__recent-clear:hover { color:var(--color-danger);background:var(--color-surface-hover) }
.meeting-search-form__recent-list { overflow-y:auto;max-height:var(--size-dropdown-list-max) }
.meeting-search-form__recent-item { display:flex;align-items:center;gap:var(--spacing-3);width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);text-align:left;background:transparent;border:none;transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.meeting-search-form__recent-item:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.meeting-search-form__recent-item i { color:var(--color-text-tertiary);font-size:var(--text-xs) }
.meeting-search-form__recent-empty { padding:var(--spacing-6) var(--spacing-4);color:var(--color-text-tertiary);font-size:var(--text-sm);text-align:center }
.meeting-search-form__filter-count { display:inline-flex;justify-content:center;align-items:center;min-width:var(--size-badge);height:var(--size-badge);margin-left:var(--spacing-2);padding:0 var(--spacing-2);color:var(--color-text-on-brand);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-brand-primary);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out) }
.meeting-search-form__filter-count[data-count="0"] { display:none }
.meeting-search-form__filters { position:relative;z-index:1;overflow:hidden;max-height:0;margin-top:var(--spacing-4);padding-top:var(--spacing-4);border-top:1px solid var(--color-border-default);opacity:0;transition:all var(--duration-medium) var(--ease-out) }
.meeting-search-form__filters[data-state=expanded] { max-height:var(--size-filters-max);opacity:100% }
.meeting-search-form__filters-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--size-grid-column-min),1fr));margin-bottom:var(--spacing-4) }
.meeting-search-form__radio-group { display:flex;flex-wrap:wrap;gap:var(--spacing-2) }
.meeting-search-form__radio { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer;-webkit-user-select:none;user-select:none }
.meeting-search-form__radio:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(-1px);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-brand) }
.meeting-search-form__radio input[type=radio] { margin:0;cursor:pointer }
.meeting-search-form__radio input[type=radio]:checked+span { color:var(--color-brand-primary);font-weight:var(--font-semibold) }
.meeting-search-form__radio:has(input:checked) { background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary) }
.meeting-search-form__filters-actions { display:flex;justify-content:flex-end;gap:var(--spacing-3) }
.meeting-search-form__export-dropdown { position:absolute;top:calc(100% + var(--spacing-2));right:0;z-index:100;overflow:hidden;width:var(--size-dropdown-export);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);opacity:0;transform:var(--transform-dropdown-enter);transition:all var(--duration-fast) cubic-bezier(.68,-.55,.265,1.55);pointer-events:none }
.meeting-search-form__export-dropdown[data-state=expanded] { opacity:100%;transform:translateY(0);pointer-events:auto }
.meeting-search-form__export-option { display:flex;align-items:flex-start;gap:var(--spacing-3);width:100%;padding:var(--spacing-4);text-align:left;background:transparent;border:none;transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.meeting-search-form__export-option:not(:last-child) { border-bottom:1px solid var(--color-border-default) }
.meeting-search-form__export-option:hover { background:var(--color-surface-hover) }
.meeting-search-form__export-option i { margin-top:var(--spacing-1);color:var(--color-text-secondary);font-size:var(--text-xl) }
.meeting-search-form__export-title { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.meeting-search-form__export-desc { color:var(--color-text-secondary);font-size:var(--text-xs) }
.meeting-search-results { min-height:var(--size-results-min) }
.meeting-search-results__empty { display:flex;flex-direction:column;justify-content:center;align-items:center;padding:var(--spacing-12) var(--spacing-4);text-align:center }
.meeting-search-results__empty-icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-20);height:var(--spacing-20);margin-bottom:var(--spacing-6);color:var(--color-brand-primary);font-size:var(--text-3xl);background:linear-gradient(135deg,var(--color-brand-primary-subtle) 0,var(--color-brand-primary) 100%);border-radius:var(--radius-full);box-shadow:var(--shadow-lg) }
.meeting-search-results__empty-title { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-semibold) }
.meeting-search-results__empty-description { max-width:var(--width-description-max);color:var(--color-text-secondary);font-size:var(--text-base) }
.meeting-search-results__loading { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4) }
.meeting-search-result-skeleton { padding:var(--spacing-5);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg) }
.skeleton { background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);background-size:200% 100%;border-radius:var(--radius-md);animation:skeleton-shimmer 1.5s ease-in-out infinite }
.meeting-search-results__error { display:flex;flex-direction:column;justify-content:center;align-items:center;padding:var(--spacing-12) var(--spacing-4);text-align:center }
.meeting-search-results__error-icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-20);height:var(--spacing-20);margin-bottom:var(--spacing-6);color:var(--color-danger);font-size:var(--text-3xl);background:var(--color-danger-subtle);border-radius:var(--radius-full) }
.meeting-search-results__error-title { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-semibold) }
.meeting-search-results__error-description { max-width:var(--width-description-max);margin-bottom:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-base) }
.meeting-search-results__grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4) }
.meeting-search-result { position:relative;overflow:hidden;padding:var(--spacing-5);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-medium) var(--ease-out);animation:resultSlideIn .25s var(--ease-bounce) backwards }
.meeting-search-result:first-child { animation-delay:var(--delay-stagger-fine-1) }
.meeting-search-result:nth-child(2) { animation-delay:var(--delay-stagger-fine-2) }
.meeting-search-result:nth-child(3) { animation-delay:var(--delay-stagger-fine-3) }
.meeting-search-result:nth-child(4) { animation-delay:var(--delay-stagger-fine-4) }
.meeting-search-result:nth-child(5) { animation-delay:var(--delay-stagger-fine-5) }
.meeting-search-result:nth-child(n+6) { animation-delay:var(--delay-stagger-fine-6) }
.meeting-search-result:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-subtle) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none }
.meeting-search-result:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px);background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%) }
.meeting-search-result:hover:before { opacity:var(--opacity-05) }
.meeting-search-result__header { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-4) }
.meeting-search-result__club { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.meeting-search-result__meta { display:flex;align-items:center;gap:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm) }
.meeting-search-result__date { display:flex;align-items:center;gap:var(--spacing-2) }
.meeting-search-result__date i { font-size:var(--text-xs) }
.meeting-search-result__sentiment { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-full) }
.meeting-search-result__sentiment--positive { color:var(--color-success);background:var(--color-success-subtle) }
.meeting-search-result__sentiment--neutral { color:var(--color-warning);background:var(--color-warning-subtle) }
.meeting-search-result__sentiment--negative { color:var(--color-danger);background:var(--color-danger-subtle) }
.meeting-search-result__score { color:var(--color-text-tertiary);font-size:var(--text-sm);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.meeting-search-result__snippet { margin-bottom:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-base);line-height:var(--leading-relaxed) }
.meeting-search-result__snippet mark { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-primary);font-weight:var(--font-medium);background:var(--color-warning-subtle);border-radius:var(--radius-sm) }
.meeting-search-result__action { display:inline-flex;align-items:center;gap:var(--spacing-2);color:var(--color-brand-primary);font-size:var(--text-sm);font-weight:var(--font-medium);text-decoration:none;transition:all var(--duration-fast) var(--ease-out) }
.meeting-search-result__action:hover { gap:var(--spacing-3);color:var(--color-brand-primary-dark) }
.meeting-search-result__action i { font-size:var(--text-xs) }
.meeting-search-pagination { display:flex;justify-content:center;align-items:center;gap:var(--spacing-3);margin-top:var(--spacing-6);padding:var(--spacing-6) 0 }
.meeting-search-pagination[data-state=hidden] { display:none }
.meeting-search-pagination__info { margin:0 var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm) }
.meeting-search-pagination__button { display:inline-flex;justify-content:center;align-items:center;min-width:var(--size-button-pagination);height:var(--size-button-pagination);padding:0 var(--spacing-3);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.meeting-search-pagination__button:hover:not(:disabled) { background:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:var(--shadow-sm);transform:var(--transform-hover-lift-micro) }
.meeting-search-pagination__button:disabled { opacity:var(--opacity-40);cursor:not-allowed }
.meeting-search-pagination__button--active { color:var(--color-text-on-brand);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.meeting-search-pagination__button--active:hover { background:var(--color-brand-primary-dark);border-color:var(--color-brand-primary-dark) }
@media (max-width:768px) { .meeting-search-form__main { flex-wrap:wrap }
.meeting-search-form__input-group { flex:1 1 100% }
.meeting-search-form__filters-grid { grid-template-columns:1fr }
.meeting-search-pagination { flex-wrap:wrap }
.meeting-search-pagination__info { flex:1 1 100%;margin:var(--spacing-2) 0;text-align:center }
 }
.meeting-modal { position:fixed;inset:0;z-index:var(--z-index-modal);display:flex;justify-content:center;align-items:center;padding:var(--spacing-4) }
.meeting-modal__overlay { position:absolute;inset:0;background:var(--overlay-dark);backdrop-filter:var(--backdrop-blur-light) }
.meeting-modal__content { position:relative;display:flex;overflow:hidden;flex-direction:column;width:100%;max-width:var(--modal-max-width-md);max-height:var(--modal-max-height);background:var(--glass-bg-darker);backdrop-filter:var(--backdrop-blur-extra-heavy);border:1px solid var(--glass-border);border-radius:var(--radius-2xl);box-shadow:var(--shadow-2xl);animation:modalSlideIn var(--duration-medium) var(--ease-out) }
.meeting-modal__header { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-6);background:var(--color-surface-primary);border-bottom:1px solid var(--color-border-default) }
.meeting-modal__title { margin:0;color:var(--color-text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold) }
.meeting-modal__close { padding:var(--spacing-2);color:var(--color-text-secondary);background:transparent;border:none;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.meeting-modal__close:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.meeting-modal__close:focus { outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
.meeting-modal__body { overflow-y:auto;padding:var(--spacing-6) }
.meeting-modal__meta { display:flex;gap:var(--spacing-6);margin-bottom:var(--spacing-6);padding-bottom:var(--spacing-4);border-bottom:1px solid var(--color-border-subtle) }
.meeting-modal__meta-item { color:var(--color-text-secondary);font-size:var(--text-sm) }
.meeting-modal__meta-item strong { display:block;margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-weight:var(--font-semibold) }
.meeting-modal__section { margin-bottom:var(--spacing-6) }
.meeting-modal__section:last-child { margin-bottom:0 }
.meeting-modal__section-title { margin:0 0 var(--spacing-3) 0;color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.meeting-modal__section-content { color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed);white-space:pre-wrap }
.meeting-search-notification { position:fixed;right:var(--spacing-6);bottom:var(--spacing-6);z-index:var(--z-index-notification);display:flex;align-items:center;gap:var(--spacing-3);min-width:var(--size-notification-min-width);max-width:var(--size-notification-max-width);padding:var(--spacing-4) var(--spacing-5);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);opacity:0;transform:var(--transform-dropdown-enter);transition:all var(--duration-medium) var(--ease-out);pointer-events:none }
.meeting-search-notification--visible { opacity:100%;transform:translateY(0);pointer-events:auto }
.meeting-search-notification--success { color:var(--color-success-text);background:var(--color-success-bg);border-color:var(--color-success) }
.meeting-search-notification--success i { color:var(--color-success) }
.meeting-search-notification--warning { color:var(--color-warning-text);background:var(--color-warning-bg);border-color:var(--color-warning) }
.meeting-search-notification--warning i { color:var(--color-warning) }
.meeting-search-notification--error { color:var(--color-danger-text);background:var(--color-danger-bg);border-color:var(--color-danger) }
.meeting-search-notification--error i { color:var(--color-danger) }
.meeting-search-notification--info { color:var(--color-info-text);background:var(--color-info-bg);border-color:var(--color-info) }
.meeting-search-notification--info i { color:var(--color-info) }
.meeting-search-notification i { font-size:var(--text-lg) }
@media (prefers-reduced-motion:reduce) { .meeting-modal__content,.meeting-search-form,.meeting-search-form:before,.meeting-search-form__radio,.meeting-search-notification,.meeting-search-pagination__button,.meeting-search-result,.meeting-search-result:before,.skeleton { transition:none;animation:none }
.meeting-search-form__radio:hover,.meeting-search-result:hover { transform:none }
 }
.settings-section { margin-bottom:var(--spacing-6) }
.settings-section__description { margin-top:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm) }
.settings-group { margin-bottom:var(--spacing-6) }
.radio-group { display:flex;flex-direction:column;gap:var(--spacing-4);margin-bottom:var(--spacing-6);padding:0;border:none }
.radio-option { display:flex;align-items:flex-start;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--color-surface-secondary);border:2px solid var(--color-border-default);border-radius:var(--radius-md);transition:all var(--duration-fast);cursor:pointer }
.radio-option:has(input:focus-visible) { border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-subtle) }
.radio-option:hover { background:var(--color-surface-hover);border-color:var(--color-border-focus) }
.radio-option:has(input:checked) { background:var(--color-success-subtle);border-color:var(--color-success) }
.radio-option.radio-option--disabled,.radio-option:has(input:disabled) { background:var(--color-surface-disabled);border-color:var(--color-border-disabled);opacity:var(--opacity-disabled);cursor:not-allowed }
:is(.radio-option.radio-option--disabled,.radio-option:has(input:disabled)):hover { background:var(--color-surface-disabled);border-color:var(--color-border-disabled) }
.radio-option input[type=radio] { flex-shrink:0;width:var(--spacing-5);height:var(--spacing-5);margin-top:var(--spacing-0-5);cursor:pointer;accent-color:var(--color-success) }
:is(.radio-option input[type=radio]):disabled { cursor:not-allowed }
.radio-option__label { display:flex;flex-direction:column;gap:var(--spacing-1) }
.radio-option__title { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-weight-medium) }
.radio-option__description { display:block;color:var(--color-text-secondary);font-size:var(--text-sm);line-height:1.5 }
.sg-badge { display:inline-block;padding:var(--spacing-1) var(--spacing-2);color:var(--color-info);font-size:var(--text-badge);font-weight:var(--font-weight-bold);text-transform:uppercase;background:var(--color-info-subtle);border-radius:var(--radius-base) }
.sg-badge--info { color:var(--color-info);background:var(--color-info-subtle) }
.sg-badge--warning { color:var(--color-warning);background:var(--color-warning-subtle) }
.settings-current-mode { margin-top:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);background:var(--color-info-subtle);border-left:3px solid var(--color-info);border-radius:var(--radius-base) }
.settings-actions { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3);margin-top:var(--spacing-6) }
.settings-status { display:flex;flex:1;align-items:center;min-width:var(--size-grid-column-min);min-height:var(--spacing-9);padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-sm);border-radius:var(--radius-base) }
.settings-status.settings-status--success { color:var(--color-success);background:var(--color-success-subtle);border-left:3px solid var(--color-success) }
.settings-status.settings-status--error { color:var(--color-danger);background:var(--color-danger-subtle);border-left:3px solid var(--color-danger) }
.settings-status.settings-status--warning { color:var(--color-warning);background:var(--color-warning-subtle);border-left:3px solid var(--color-warning) }
.settings-status.settings-status--info { color:var(--color-info);background:var(--color-info-subtle);border-left:3px solid var(--color-info) }
.settings-status.settings-status--empty { min-height:auto;padding:0;background:transparent;border:none }
@media (max-width:768px) { .radio-option { padding:var(--spacing-3) }
.radio-option__title { font-size:var(--text-sm) }
.settings-actions { flex-direction:column;width:100% }
.settings-actions .settings-actions__button,.settings-actions .settings-status,.settings-actions button { width:100% }
 }
.settings-page { background:var(--color-surface-primary) }
.page-header { margin-bottom:var(--spacing-8) }
.page-header__title { margin-bottom:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-weight-bold) }
.page-header__subtitle { color:var(--color-text-secondary);font-size:var(--text-base) }
.auto-apply-settings__status-card { position:relative;display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);padding:var(--spacing-4) var(--spacing-5);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);transition:all var(--duration-medium) var(--ease-out) }
.auto-apply-settings__status-card:before { position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-subtle) 100%);border-radius:var(--radius-xl);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none;content:"" }
.auto-apply-settings__status-card:hover:before { opacity:100% }
.auto-apply-settings__status-card--enabled { background:linear-gradient(135deg,var(--color-surface-elevated) 0,var(--color-success-subtle) 100%);border-color:var(--color-success-border) }
.auto-apply-settings__status-card--disabled { border-color:var(--color-border-default) }
.auto-apply-settings__status-indicator { display:flex;align-items:center;gap:var(--spacing-3) }
.auto-apply-settings__status-dot { position:relative;flex-shrink:0;width:var(--spacing-3);height:var(--spacing-3);background:var(--color-text-muted);border-radius:var(--radius-full) }
.auto-apply-settings__status-dot--enabled { background:var(--gradient-success-enhanced);box-shadow:0 0 var(--spacing-3) var(--color-success);animation:pulse-glow 2s ease-in-out infinite }
.auto-apply-settings__status-dot--disabled { background:var(--color-text-muted) }
.auto-apply-settings__status-dot--loading { background:var(--color-info);animation:pulse-glow 1s ease-in-out infinite }
.auto-apply-settings__status-text { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.auto-apply-settings__status-text--enabled { color:var(--color-success) }
.auto-apply-settings__toggle-wrapper { display:flex;align-items:center;gap:var(--spacing-3) }
.auto-apply-settings__toggle { position:relative;display:inline-block;flex-shrink:0;width:var(--spacing-14);height:var(--spacing-7) }
.auto-apply-settings__toggle--small { width:var(--spacing-12);height:var(--spacing-6) }
.auto-apply-settings__toggle-input { position:absolute;z-index:var(--z-10);width:100%;height:100%;opacity:0;cursor:pointer }
.auto-apply-settings__toggle-track { position:absolute;inset:0;background:var(--color-surface-hover);border-radius:var(--radius-full);transition:all var(--duration-medium) var(--ease-bounce) }
.auto-apply-settings__toggle-input:checked+.auto-apply-settings__toggle-track { background:var(--gradient-success-enhanced);box-shadow:var(--shadow-badge-glow-success) }
.auto-apply-settings__toggle-input:focus-visible+.auto-apply-settings__toggle-track { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.auto-apply-settings__toggle-thumb { position:absolute;top:var(--spacing-1);left:var(--spacing-1);width:var(--spacing-5);height:var(--spacing-5);background:var(--color-white);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:transform var(--duration-medium) var(--ease-bounce) }
.auto-apply-settings__toggle--small .auto-apply-settings__toggle-thumb { width:var(--spacing-4);height:var(--spacing-4) }
.auto-apply-settings__toggle-input:checked~.auto-apply-settings__toggle-thumb { transform:translateX(calc(var(--spacing-14) - var(--spacing-7))) }
.auto-apply-settings__toggle--small .auto-apply-settings__toggle-input:checked~.auto-apply-settings__toggle-thumb { transform:translateX(calc(var(--spacing-12) - var(--spacing-6))) }
.auto-apply-settings__toggle-label { color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.auto-apply-settings__group { display:flex;flex-direction:column;gap:var(--spacing-2);margin-top:var(--spacing-5) }
.auto-apply-settings__label { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.auto-apply-settings__hint { margin-bottom:var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-xs) }
.auto-apply-settings__slider-container { position:relative;display:flex;align-items:center;gap:var(--spacing-3) }
.auto-apply-settings__slider { flex:1;height:var(--spacing-2);appearance:none;background:var(--color-surface-hover);border-radius:var(--radius-full);cursor:pointer }
.auto-apply-settings__slider::-webkit-slider-thumb { width:var(--spacing-5);height:var(--spacing-5);background:var(--color-white);border-radius:var(--radius-full);box-shadow:var(--shadow-md),0 0 0 var(--spacing-1) var(--color-brand-primary-subtle);transition:all var(--duration-fast) var(--ease-out);cursor:grab;appearance:none }
.auto-apply-settings__slider::-webkit-slider-thumb:hover { box-shadow:var(--shadow-lg),0 0 0 var(--spacing-2) var(--color-brand-primary-subtle);transform:scale(1.1) }
.auto-apply-settings__slider::-webkit-slider-thumb:active { transform:scale(.95);cursor:grabbing }
.auto-apply-settings__slider:focus-visible::-webkit-slider-thumb { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.auto-apply-settings__slider::-moz-range-thumb { width:var(--spacing-5);height:var(--spacing-5);background:var(--color-white);border:none;border-radius:var(--radius-full);box-shadow:var(--shadow-md);cursor:grab }
.auto-apply-settings__slider--small { height:var(--spacing-1) }
.auto-apply-settings__slider--small::-webkit-slider-thumb { width:var(--spacing-4);height:var(--spacing-4) }
.auto-apply-settings__slider-value { min-width:var(--spacing-12);color:var(--color-brand-primary-light);font-size:var(--text-lg);font-weight:var(--font-bold);text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.auto-apply-settings__slider-marks { display:flex;justify-content:space-between;margin-top:var(--spacing-1);padding:0 var(--spacing-1) }
.auto-apply-settings__slider-marks span { color:var(--color-text-muted);font-size:var(--text-xs) }
.auto-apply-settings__categories { display:flex;flex-wrap:wrap;gap:var(--spacing-2) }
.auto-apply-settings__pill { position:relative;display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out);cursor:pointer;-webkit-user-select:none;user-select:none }
.auto-apply-settings__pill:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:var(--transform-hover-lift-micro) }
.auto-apply-settings__pill:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.auto-apply-settings__pill i { color:var(--color-text-on-dark);font-size:var(--text-xs);opacity:0;transform:scale(0);transition:all var(--duration-fast) var(--ease-bounce) }
.auto-apply-settings__pill--selected { color:var(--color-text-primary);background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary) }
.auto-apply-settings__pill--selected i { color:var(--color-brand-primary);opacity:100%;transform:scale(1) }
.auto-apply-settings__collapsible { overflow:hidden;margin-top:var(--spacing-5);border:1px solid var(--color-border-default);border-radius:var(--radius-xl) }
.auto-apply-settings__collapsible-trigger { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4) var(--spacing-5);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold);list-style:none;background:var(--color-surface-elevated);transition:background var(--duration-fast) var(--ease-out);cursor:pointer }
.auto-apply-settings__collapsible-trigger::-webkit-details-marker { display:none }
.auto-apply-settings__collapsible-trigger:hover { background:var(--color-surface-hover) }
.auto-apply-settings__badge-advanced { margin-left:auto;padding:var(--spacing-1) var(--spacing-2);color:var(--color-info);font-size:var(--text-xs);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase;background:var(--color-info-subtle);border:1px solid var(--color-info-border);border-radius:var(--radius-base) }
.auto-apply-settings__collapsible-icon { margin-left:var(--spacing-2);color:var(--color-text-muted);transition:transform var(--duration-medium) var(--ease-bounce) }
.auto-apply-settings__collapsible[open] .auto-apply-settings__collapsible-icon { transform:rotate(180deg) }
.auto-apply-settings__collapsible-content { display:flex;flex-direction:column;gap:var(--spacing-5);padding:var(--spacing-5);background:var(--color-surface-primary);border-top:1px solid var(--color-border-subtle);animation:slideDown var(--duration-medium) var(--ease-out) }
.auto-apply-settings__canary-toggle { display:flex;align-items:flex-start;gap:var(--spacing-4) }
.auto-apply-settings__canary-info { display:flex;flex-direction:column;gap:var(--spacing-1) }
.auto-apply-settings__canary-label { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.auto-apply-settings__canary-description { color:var(--color-text-muted);font-size:var(--text-xs);line-height:var(--leading-relaxed) }
.auto-apply-settings__canary-rate,.auto-apply-settings__undo-window { display:flex;flex-direction:column;gap:var(--spacing-2) }
.auto-apply-settings__select { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.auto-apply-settings__select:hover { border-color:var(--color-border-strong) }
.auto-apply-settings__select:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
.auto-apply-settings__stats { margin-top:var(--spacing-6) }
.auto-apply-settings__stats-title { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.auto-apply-settings__stats-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--grid-min-column),1fr)) }
.auto-apply-settings__stats-grid--canary { grid-template-columns:repeat(3,1fr) }
.auto-apply-settings__stat-card { position:relative;overflow:hidden;padding:var(--spacing-4);text-align:center;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);transition:all var(--duration-medium) var(--ease-out) }
.auto-apply-settings__stat-card:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--color-brand-primary-subtle) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none }
.auto-apply-settings__stat-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-md);transform:var(--transform-hover-lift) }
.auto-apply-settings__stat-card:hover:before { opacity:100% }
.auto-apply-settings__stat-value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:var(--leading-none);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.auto-apply-settings__stat-value--animated { transition:all var(--duration-slow) var(--ease-out) }
.auto-apply-settings__stat-label { margin-top:var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.auto-apply-settings__stat-card--success .auto-apply-settings__stat-value { color:var(--color-success) }
.auto-apply-settings__stat-card--warning .auto-apply-settings__stat-value { color:var(--color-warning) }
.auto-apply-settings__stat-card--danger .auto-apply-settings__stat-value { color:var(--color-danger) }
.auto-apply-settings__stat-card--info .auto-apply-settings__stat-value { color:var(--color-info) }
.auto-apply-settings__stat-card--primary .auto-apply-settings__stat-value { color:var(--color-brand-primary) }
.auto-apply-settings__stat-card--loading .auto-apply-settings__stat-label,.auto-apply-settings__stat-card--loading .auto-apply-settings__stat-value { color:transparent;background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);background-size:200% 100%;border-radius:var(--radius-md);animation:skeleton-shimmer var(--duration-shimmer) ease-in-out infinite }
.auto-apply-settings__canary-metrics { margin-top:var(--spacing-6);padding:var(--spacing-5);background:linear-gradient(135deg,var(--color-info-subtle) 0,var(--color-surface-elevated) 100%);border:1px solid var(--color-info-border);border-radius:var(--radius-xl) }
.auto-apply-settings__stat-card--canary { background:var(--color-surface-elevated);border-color:var(--color-info-border) }
.auto-apply-settings__stat-card--canary .auto-apply-settings__stat-value { color:var(--color-info) }
.auto-apply-settings__stat-card--accuracy { background:linear-gradient(135deg,var(--color-success-subtle) 0,var(--color-surface-elevated) 100%);border-color:var(--color-success-border) }
.auto-apply-settings__stat-card--accuracy .auto-apply-settings__stat-value { color:var(--color-success);font-size:var(--text-2xl) }
.auto-apply-settings__stat-card--pending { background:var(--color-surface-elevated);border-color:var(--color-warning-border) }
.auto-apply-settings__stat-card--pending .auto-apply-settings__stat-value { color:var(--color-warning) }
.auto-apply-settings__canary-note { display:flex;align-items:center;gap:var(--spacing-2);margin-top:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-sm);background:var(--color-surface-default);border-radius:var(--radius-lg) }
.auto-apply-settings__canary-note i { color:var(--color-info) }
.auto-apply-settings__badge { margin-left:var(--spacing-2) }
.auto-apply-settings__health-dashboard { margin-top:var(--spacing-6);padding:var(--spacing-5);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-xl) }
.auto-apply-settings__health-badge { margin-left:auto;padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;border-radius:var(--radius-full) }
.auto-apply-settings__health-badge[data-status=healthy] { color:var(--color-success);background:var(--color-success-subtle);border:1px solid var(--color-success-border) }
.auto-apply-settings__health-badge[data-status=warning] { color:var(--color-warning);background:var(--color-warning-subtle);border:1px solid var(--color-warning-border) }
.auto-apply-settings__health-badge[data-status=critical] { color:var(--color-danger);background:var(--color-danger-subtle);border:1px solid var(--color-danger-border) }
.auto-apply-settings__health-badge[data-status=error],.auto-apply-settings__health-badge[data-status=loading] { color:var(--color-text-muted);background:var(--color-surface-hover);border:1px solid var(--color-border-default) }
.auto-apply-settings__health-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(4,1fr);margin-top:var(--spacing-4) }
.auto-apply-settings__health-card { padding:var(--spacing-4);background:var(--color-surface-default);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.auto-apply-settings__health-card:hover { border-color:var(--color-border-strong);box-shadow:var(--shadow-sm) }
.auto-apply-settings__health-header { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-3);color:var(--color-text-muted);font-size:var(--text-sm) }
.auto-apply-settings__health-header i { font-size:var(--text-base) }
.auto-apply-settings__health-value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:var(--leading-none);font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.auto-apply-settings__health-trend { display:flex;align-items:center;gap:var(--spacing-1);margin-top:var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-sm) }
.auto-apply-settings__health-trend[data-direction=up] { color:var(--color-success) }
.auto-apply-settings__health-trend[data-direction=down] { color:var(--color-danger) }
.auto-apply-settings__health-trend[data-direction=stable] { color:var(--color-text-muted) }
.auto-apply-settings__health-trend-icon { font-size:var(--text-base);font-weight:var(--font-bold) }
.auto-apply-settings__health-status { display:flex;align-items:center;gap:var(--spacing-2);margin-top:var(--spacing-2);font-size:var(--text-sm) }
.auto-apply-settings__health-status-dot { width:var(--spacing-2);height:var(--spacing-2);background:var(--color-text-muted);border-radius:var(--radius-full) }
.auto-apply-settings__health-status[data-status=healthy] .auto-apply-settings__health-status-dot { background:var(--color-success) }
.auto-apply-settings__health-status[data-status=warning] .auto-apply-settings__health-status-dot { background:var(--color-warning) }
.auto-apply-settings__health-status[data-status=critical] .auto-apply-settings__health-status-dot { background:var(--color-danger) }
.auto-apply-settings__health-status[data-status=healthy] .auto-apply-settings__health-status-text { color:var(--color-success) }
.auto-apply-settings__health-status[data-status=warning] .auto-apply-settings__health-status-text { color:var(--color-warning) }
.auto-apply-settings__health-status[data-status=critical] .auto-apply-settings__health-status-text { color:var(--color-danger) }
.auto-apply-settings__health-meta { margin-top:var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-xs) }
.auto-apply-settings__health-note { display:flex;align-items:center;gap:var(--spacing-2);margin-top:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-sm);background:var(--color-surface-default);border-radius:var(--radius-lg) }
.auto-apply-settings__health-note i { color:var(--color-info) }
@media (max-width:768px) { .auto-apply-settings__status-card { flex-direction:column;align-items:flex-start }
.auto-apply-settings__toggle-wrapper { align-self:flex-end;margin-top:var(--spacing-3) }
.auto-apply-settings__health-grid,.auto-apply-settings__stats-grid--canary,.auto-apply-settings__stats-grid { grid-template-columns:repeat(2,1fr) }
.auto-apply-settings__categories { gap:var(--spacing-2) }
.auto-apply-settings__pill { padding:var(--spacing-2) var(--spacing-3);font-size:var(--text-xs) }
.auto-apply-settings__canary-metrics { padding:var(--spacing-4) }
.auto-apply-settings__canary-note,.auto-apply-settings__health-note { flex-direction:column;text-align:center }
.auto-apply-settings__collapsible-trigger { flex-wrap:wrap }
.auto-apply-settings__badge-advanced { margin-top:var(--spacing-2);margin-left:0 }
 }
@media (max-width:480px) { .auto-apply-settings__health-grid,.auto-apply-settings__stats-grid--canary,.auto-apply-settings__stats-grid { grid-template-columns:1fr }
 }
@media (prefers-reduced-motion:reduce) { .auto-apply-settings__stat-card--loading .auto-apply-settings__stat-label,.auto-apply-settings__stat-card--loading .auto-apply-settings__stat-value,.auto-apply-settings__status-dot--enabled,.auto-apply-settings__status-dot--loading { animation:none }
.auto-apply-settings__collapsible-content,.auto-apply-settings__collapsible-icon,.auto-apply-settings__pill i,.auto-apply-settings__stat-card,.auto-apply-settings__toggle-thumb { transition:none }
 }
.kill-switches__global-alert { display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-5);padding:var(--spacing-4);background:linear-gradient(135deg,var(--color-danger-subtle) 0,var(--color-surface-elevated) 100%);border:1px solid var(--color-danger-border);border-radius:var(--radius-xl);animation:alertPulse 2s ease-in-out infinite }
.kill-switches__global-alert i { flex-shrink:0;color:var(--color-danger);font-size:var(--text-lg) }
.kill-switches__alert-text { color:var(--color-text-primary);font-size:var(--text-sm) }
.kill-switches__alert-text strong { color:var(--color-danger) }
.kill-switches__global-section { margin-bottom:var(--spacing-4) }
.kill-switches__toggle-row { display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-4) }
.kill-switches__toggle-info { flex:1 }
.kill-switches__label { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-base);font-weight:var(--font-semibold) }
.kill-switches__label i { color:var(--color-danger) }
.kill-switches__description { margin-top:var(--spacing-1);color:var(--color-text-muted);font-size:var(--text-sm) }
.kill-switches__toggle-control { flex-shrink:0 }
.toggle-switch { position:relative;width:var(--spacing-14);height:var(--spacing-7);padding:0;background:var(--color-surface-hover);border:none;border-radius:var(--radius-full);transition:all var(--duration-medium) var(--ease-bounce);cursor:pointer }
.toggle-switch:hover { background:var(--color-surface-overlay) }
.toggle-switch:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.toggle-switch[aria-checked=true] { background:var(--color-danger);box-shadow:0 0 var(--spacing-3) var(--color-danger-subtle) }
.toggle-switch__slider { position:absolute;top:var(--spacing-1);left:var(--spacing-1);width:var(--spacing-5);height:var(--spacing-5);background:var(--color-white);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);transition:transform var(--duration-medium) var(--ease-bounce);pointer-events:none }
.toggle-switch[aria-checked=true] .toggle-switch__slider { transform:translateX(calc(var(--spacing-14) - var(--spacing-7))) }
.kill-switches__reason-input { margin-top:var(--spacing-4);padding:var(--spacing-4);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-xl);animation:slideDown var(--duration-medium) var(--ease-out) }
.kill-switches__input { width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.kill-switches__input::placeholder { color:var(--color-text-muted) }
.kill-switches__input:hover { border-color:var(--color-border-strong) }
.kill-switches__input:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
.kill-switches__reason-actions { display:flex;gap:var(--spacing-2);margin-top:var(--spacing-3) }
.kill-switches__divider { margin:var(--spacing-5) 0;border:none;border-top:1px solid var(--color-border-subtle) }
.kill-switches__add-section { margin-bottom:var(--spacing-4) }
.kill-switches__section-title { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.kill-switches__section-title i { color:var(--color-brand-primary) }
.kill-switches__section-title .sg-badge { margin-left:var(--spacing-2) }
.kill-switches__form { display:flex;flex-direction:column;gap:var(--spacing-4) }
.kill-switches__form-row { display:flex;align-items:flex-end;gap:var(--spacing-3) }
.kill-switches__form-group { display:flex;flex-direction:column;gap:var(--spacing-2) }
.kill-switches__form-group--grow { flex:1 }
.kill-switches__form-label { color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.kill-switches__select { min-width:var(--size-kill-switch-select-min);padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.kill-switches__select:hover { border-color:var(--color-border-strong) }
.kill-switches__select:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
.kill-switches__add-btn { flex-shrink:0;height:var(--size-kill-switch-button-height) }
.kill-switches__status { min-height:var(--spacing-6);padding:var(--spacing-2) 0;font-size:var(--text-sm);transition:all var(--duration-fast) var(--ease-out) }
.kill-switches__status:empty { display:none }
.kill-switches__status--success { color:var(--color-success) }
.kill-switches__status--error { color:var(--color-danger) }
.kill-switches__status--warning { color:var(--color-warning) }
.kill-switches__status--info { color:var(--color-info) }
.kill-switches__active-section { margin-top:var(--spacing-4) }
.kill-switches__table-container { position:relative;overflow-x:auto;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-xl) }
.kill-switches__table { width:100%;border-collapse:collapse;font-size:var(--text-sm) }
.kill-switches__table thead { background:var(--color-surface-primary);border-bottom:1px solid var(--color-border-default) }
.kill-switches__table th { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-align:left;text-transform:uppercase }
.kill-switches__table td { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);border-bottom:1px solid var(--color-border-subtle) }
.kill-switches__table tbody tr:last-child td { border-bottom:none }
.kill-switches__row { transition:background var(--duration-fast) var(--ease-out) }
.kill-switches__row:hover { background:var(--color-surface-hover) }
.kill-switches__target { color:var(--color-brand-primary-light);font-family:var(--font-mono) }
.kill-switches__reason { overflow:hidden;max-width:var(--size-kill-switch-reason-max);color:var(--color-text-secondary);text-overflow:ellipsis;white-space:nowrap }
.kill-switches__date { color:var(--color-text-muted);white-space:nowrap }
.kill-switches__delete-btn { opacity:70%;transition:opacity var(--duration-fast) var(--ease-out) }
.kill-switches__row:hover .kill-switches__delete-btn { opacity:100% }
.kill-switches__empty { display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--spacing-3);padding:var(--spacing-8) var(--spacing-4);color:var(--color-text-muted);text-align:center }
.kill-switches__empty i { color:var(--color-success);font-size:var(--text-3xl) }
.kill-switches__empty p { margin:0;font-size:var(--text-sm) }
.kill-switches__loading { display:flex;justify-content:center;align-items:center;gap:var(--spacing-3);padding:var(--spacing-8) var(--spacing-4);color:var(--color-text-muted) }
.kill-switches__loading i { color:var(--color-brand-primary);font-size:var(--text-lg) }
@media (max-width:768px) { .kill-switches__toggle-row { flex-direction:column;gap:var(--spacing-3) }
.kill-switches__toggle-control { align-self:flex-start }
.kill-switches__form-row { flex-direction:column;align-items:stretch }
.kill-switches__add-btn { width:100% }
.kill-switches__select { min-width:100% }
.kill-switches__table-container { margin:0 calc(var(--spacing-4)*-1);border-right:none;border-left:none;border-radius:0 }
.kill-switches__reason { max-width:var(--size-kill-switch-reason-max-sm) }
 }
@media (max-width:480px) { .kill-switches__global-alert { flex-direction:column;text-align:center }
.kill-switches__table td:nth-child(3),.kill-switches__table td:nth-child(4),.kill-switches__table th:nth-child(3),.kill-switches__table th:nth-child(4) { display:none }
 }
.kill-switch-banner { margin-bottom:var(--spacing-5);padding:var(--spacing-4);background:linear-gradient(135deg,var(--color-warning-subtle) 0,var(--color-surface-elevated) 100%);border:1px solid var(--color-warning-border);border-radius:var(--radius-xl);animation:bannerSlideIn var(--duration-medium) var(--ease-out) }
.kill-switch-banner__content { display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-3) }
.kill-switch-banner__content>i { flex-shrink:0;color:var(--color-warning);font-size:var(--text-lg) }
.kill-switch-banner__text { flex:1;color:var(--color-text-primary);font-size:var(--text-sm) }
.kill-switch-banner__text strong { color:var(--color-warning) }
.kill-switch-banner__text span { margin-left:var(--spacing-2);color:var(--color-text-secondary) }
.kill-switch-banner__link { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);text-decoration:none;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out) }
.kill-switch-banner__link:hover { background:var(--color-surface-hover);border-color:var(--color-border-strong);transform:var(--transform-hover-lift-micro) }
.kill-switch-banner__link:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
@media (prefers-reduced-motion:reduce) { .kill-switch-banner,.kill-switches__global-alert,.kill-switches__reason-input { animation:none }
.kill-switch-banner__link,.kill-switches__delete-btn,.kill-switches__input,.kill-switches__row,.kill-switches__select,.toggle-switch,.toggle-switch__slider { transition:none }
 }
.audit-trail { position:relative }
.audit-trail__header { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-5) }
.audit-trail__title-group { display:flex;align-items:center;gap:var(--spacing-3) }
.audit-trail__live-indicator { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-muted);font-size:var(--text-xs);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-full);transition:all var(--duration-medium) var(--ease-out) }
.audit-trail__live-indicator--connected { color:var(--color-success);background:var(--color-success-subtle);border-color:var(--color-success-subtle) }
.audit-trail__live-dot { width:var(--spacing-2);height:var(--spacing-2);background:currentcolor;border-radius:var(--radius-full);opacity:50%;transition:opacity var(--duration-fast) var(--ease-out) }
.audit-trail__live-indicator--connected .audit-trail__live-dot { opacity:100%;animation:livePulse 2s var(--ease-in-out) infinite }
.audit-trail__stats-grid { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(var(--size-card-min,200px),1fr));margin-bottom:var(--spacing-6) }
.audit-trail__stat-card { position:relative;overflow:hidden;padding:var(--spacing-5);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border:1px solid var(--glass-border);border-radius:var(--radius-xl);transition:all var(--duration-medium) var(--ease-out) }
.audit-trail__stat-card:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,hsla(0,0%,100%,.03),transparent 50%,transparent);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none }
.audit-trail__stat-card:hover { border-color:var(--color-border-strong);background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%);box-shadow:var(--shadow-md),var(--shadow-glow-sm-brand);transform:translateY(-2px) }
.audit-trail__stat-card:hover:before { opacity:100% }
.audit-trail__stat-card--auto-apply { border-left:3px solid var(--color-success) }
.audit-trail__stat-card--auto-apply .audit-trail__stat-icon { color:var(--color-success);background:var(--color-success-subtle) }
.audit-trail__stat-card--undo { border-left:3px solid var(--color-warning) }
.audit-trail__stat-card--undo .audit-trail__stat-icon { color:var(--color-warning);background:var(--color-warning-subtle) }
.audit-trail__stat-card--manual { border-left:3px solid var(--color-info) }
.audit-trail__stat-card--manual .audit-trail__stat-icon { color:var(--color-info);background:var(--color-info-subtle) }
.audit-trail__stat-card--blocked { border-left:3px solid var(--color-danger) }
.audit-trail__stat-card--blocked .audit-trail__stat-icon { color:var(--color-danger);background:var(--color-danger-subtle) }
.audit-trail__stat-header { display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-3);margin-bottom:var(--spacing-3) }
.audit-trail__stat-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-10);height:var(--spacing-10);font-size:var(--text-lg);border-radius:var(--radius-lg) }
.audit-trail__stat-trend { display:flex;align-items:center;gap:var(--spacing-1);font-size:var(--text-xs);font-weight:var(--font-medium) }
.audit-trail__stat-trend--up { color:var(--color-success) }
.audit-trail__stat-trend--down { color:var(--color-danger) }
.audit-trail__stat-trend--neutral { color:var(--color-text-muted) }
.audit-trail__stat-value { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold);line-height:1;font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.audit-trail__stat-label { margin-bottom:var(--spacing-3);color:var(--color-text-muted);font-size:var(--text-sm) }
.audit-trail__stat-progress { position:relative;overflow:hidden;height:var(--spacing-1);background:var(--color-surface-hover);border-radius:var(--radius-full) }
.audit-trail__stat-progress-fill { position:absolute;top:0;left:0;height:100%;border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.audit-trail__stat-card--auto-apply .audit-trail__stat-progress-fill { background:var(--color-success) }
.audit-trail__stat-card--undo .audit-trail__stat-progress-fill { background:var(--color-warning) }
.audit-trail__stat-card--manual .audit-trail__stat-progress-fill { background:var(--color-info) }
.audit-trail__stat-card--blocked .audit-trail__stat-progress-fill { background:var(--color-danger) }
.audit-trail__stat-bar { position:relative;overflow:hidden;height:var(--spacing-1);margin-top:var(--spacing-3);background:var(--color-surface-hover);border-radius:var(--radius-full) }
.audit-trail__stat-bar-fill { position:absolute;top:0;left:0;width:0;height:100%;border-radius:var(--radius-full);transition:width var(--duration-slow) var(--ease-out) }
.audit-trail__stat-card--primary .audit-trail__stat-bar-fill { background:var(--color-brand-primary) }
.audit-trail__stat-card--success .audit-trail__stat-bar-fill { background:var(--color-success) }
.audit-trail__stat-card--warning .audit-trail__stat-bar-fill { background:var(--color-warning) }
.audit-trail__stat-card--danger .audit-trail__stat-bar-fill { background:var(--color-danger) }
.audit-trail__badge { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;white-space:nowrap;border-radius:var(--radius-full) }
.audit-trail__badge--auto-apply,.audit-trail__badge--auto_apply { color:var(--color-success);background:var(--color-success-subtle);border:1px solid var(--color-success-subtle) }
.audit-trail__badge--undo { color:var(--color-warning);background:var(--color-warning-subtle);border:1px solid var(--color-warning-subtle) }
.audit-trail__badge--manual-override,.audit-trail__badge--manual_override { color:var(--color-info);background:var(--color-info-subtle);border:1px solid var(--color-info-subtle) }
.audit-trail__badge--kill-switch-blocked,.audit-trail__badge--kill_switch_blocked { color:var(--color-danger);background:var(--color-danger-subtle);border:1px solid var(--color-danger-subtle) }
.audit-trail__badge i { font-size:.7em }
.audit-trail__activity-section { margin-bottom:var(--spacing-6) }
.audit-trail__activity-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4) }
.audit-trail__section-title { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.audit-trail__section-title i { color:var(--color-brand-primary) }
.audit-trail__activity-feed { display:flex;overflow-y:auto;flex-direction:column;gap:var(--spacing-2);max-height:320px;padding:var(--spacing-3);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-xl) }
.audit-trail__activity-feed::-webkit-scrollbar { width:var(--spacing-2) }
.audit-trail__activity-feed::-webkit-scrollbar-track { background:transparent }
.audit-trail__activity-feed::-webkit-scrollbar-thumb { background:var(--color-border-default);border-radius:var(--radius-full) }
.audit-trail__activity-item { display:flex;align-items:flex-start;gap:var(--spacing-3);padding:var(--spacing-3);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);animation:activitySlideIn .4s var(--ease-bounce) backwards }
.audit-trail__activity-item:hover { background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%);border-color:var(--color-border-strong);box-shadow:var(--shadow-sm),var(--shadow-glow-sm-brand);transform:translateX(2px) }
.audit-trail__activity-icon { display:flex;flex-shrink:0;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);font-size:var(--text-sm);border-radius:var(--radius-lg) }
.audit-trail__activity-item--auto-apply .audit-trail__activity-icon,.audit-trail__activity-item--auto_apply .audit-trail__activity-icon { color:var(--color-success);background:var(--color-success-subtle) }
.audit-trail__activity-item--undo .audit-trail__activity-icon { color:var(--color-warning);background:var(--color-warning-subtle) }
.audit-trail__activity-item--manual-override .audit-trail__activity-icon,.audit-trail__activity-item--manual_override .audit-trail__activity-icon { color:var(--color-info);background:var(--color-info-subtle) }
.audit-trail__activity-item--kill-switch-blocked .audit-trail__activity-icon,.audit-trail__activity-item--kill_switch_blocked .audit-trail__activity-icon { color:var(--color-danger);background:var(--color-danger-subtle) }
.audit-trail__activity-content { flex:1;min-width:0 }
.audit-trail__activity-title { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-1) }
.audit-trail__activity-email { overflow:hidden;color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);text-overflow:ellipsis;white-space:nowrap }
.audit-trail__activity-meta { display:flex;align-items:center;gap:var(--spacing-3);color:var(--color-text-muted);font-size:var(--text-xs) }
.audit-trail__activity-time { white-space:nowrap }
.audit-trail__filters { margin-bottom:var(--spacing-5) }
.audit-trail__quick-filters { display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin-bottom:var(--spacing-4) }
.audit-trail__quick-filter { padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.audit-trail__quick-filter:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.audit-trail__quick-filter:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.audit-trail__quick-filter--active { color:var(--color-brand-primary-light);background:var(--color-brand-primary-subtle);border-color:var(--color-brand-primary) }
.audit-trail__quick-filter--all.audit-trail__quick-filter--active { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-text-muted) }
.audit-trail__advanced-filters { background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-xl) }
.audit-trail__filters-summary { display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);list-style:none;transition:color var(--duration-fast) var(--ease-out);cursor:pointer }
.audit-trail__filters-summary::-webkit-details-marker { display:none }
.audit-trail__filters-summary:hover { color:var(--color-text-primary) }
.audit-trail__filters-summary:after { font-family:Font Awesome\ 6 Free;font-size:var(--text-xs);font-weight:900;transition:transform var(--duration-fast) var(--ease-out);content:"\f078" }
.audit-trail__advanced-filters[open] .audit-trail__filters-summary:after { transform:rotate(180deg) }
.audit-trail__filters-content { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));padding:0 var(--spacing-4) var(--spacing-4);animation:filterSlideDown var(--duration-fast) var(--ease-out) }
.audit-trail__filter-group { display:flex;flex-direction:column;gap:var(--spacing-2) }
.audit-trail__filter-label { color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.audit-trail__filter-input,.audit-trail__filter-select { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-sm);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out) }
.audit-trail__filter-input:hover,.audit-trail__filter-select:hover { border-color:var(--color-border-strong) }
.audit-trail__filter-input:focus,.audit-trail__filter-select:focus { border-color:var(--color-brand-primary);outline:none;box-shadow:0 0 0 var(--focus-ring-width) var(--color-brand-primary-subtle) }
.audit-trail__filter-actions { display:flex;align-items:flex-end;gap:var(--spacing-2) }
.audit-trail__view-toggle { display:inline-flex;gap:var(--spacing-1);padding:var(--spacing-1);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg) }
.audit-trail__view-btn { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-sm);font-weight:var(--font-medium);background:transparent;border:none;border-radius:var(--radius-base);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.audit-trail__view-btn:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.audit-trail__view-btn:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:calc(var(--focus-ring-offset)*-1) }
.audit-trail__view-btn[aria-selected=true] { color:var(--color-text-primary);background:var(--color-surface-primary);box-shadow:var(--shadow-sm) }
.audit-trail__table-container { position:relative;overflow-x:auto;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-xl) }
.audit-trail__table { width:100%;border-collapse:collapse;font-size:var(--text-sm) }
.audit-trail__table thead { position:sticky;top:0;z-index:1;background:var(--color-surface-primary);border-bottom:1px solid var(--color-border-default) }
.audit-trail__table th { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-align:left;text-transform:uppercase;white-space:nowrap }
.audit-trail__table td { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-primary);vertical-align:middle;border-bottom:1px solid var(--color-border-subtle) }
.audit-trail__table tbody tr:last-child td { border-bottom:none }
.audit-trail__table-row { transition:background var(--duration-fast) var(--ease-out) }
.audit-trail__table-row:hover { background:var(--color-surface-hover) }
.audit-trail__email-cell { max-width:200px }
.audit-trail__email-subject { overflow:hidden;color:var(--color-text-primary);font-weight:var(--font-medium);text-overflow:ellipsis;white-space:nowrap }
.audit-trail__email-from { overflow:hidden;color:var(--color-text-muted);font-size:var(--text-xs);text-overflow:ellipsis;white-space:nowrap }
.audit-trail__category { padding:var(--spacing-1) var(--spacing-2);color:var(--color-brand-primary-light);font-family:var(--font-mono);font-size:var(--text-xs);background:var(--color-brand-primary-subtle);border-radius:var(--radius-base) }
.audit-trail__confidence { display:flex;align-items:center;gap:var(--spacing-2);min-width:100px }
.audit-trail__confidence-bar { overflow:hidden;flex:1;height:var(--spacing-1);background:var(--color-surface-hover);border-radius:var(--radius-full) }
.audit-trail__confidence-fill { height:100%;border-radius:var(--radius-full);transition:width var(--duration-medium) var(--ease-out) }
.audit-trail__confidence-fill--high { background:var(--color-success) }
.audit-trail__confidence-fill--medium { background:var(--color-warning) }
.audit-trail__confidence-fill--low { background:var(--color-danger) }
.audit-trail__confidence-value { min-width:36px;color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-medium);text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.audit-trail__reason { overflow:hidden;max-width:200px;color:var(--color-text-secondary);text-overflow:ellipsis;white-space:nowrap }
.audit-trail__date { color:var(--color-text-muted);white-space:nowrap;font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.audit-trail__timeline-view { padding:var(--spacing-4);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-xl) }
.audit-trail__timeline { position:relative;padding-left:var(--spacing-8) }
.audit-trail__timeline:before { position:absolute;top:0;bottom:0;left:var(--spacing-4);width:2px;background:linear-gradient(to bottom,var(--color-border-default) 0,var(--color-border-subtle) 100%);content:"" }
.audit-trail__timeline-item { position:relative;margin-bottom:var(--spacing-4);padding:var(--spacing-4);padding-left:var(--spacing-6);background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);animation:timelineSlideIn .4s var(--ease-bounce) backwards }
.audit-trail__timeline-item:last-child { margin-bottom:0 }
.audit-trail__timeline-item:hover { background:linear-gradient(135deg,var(--glass-bg-medium) 0,var(--glass-bg-dark) 100%);border-color:var(--color-border-strong);box-shadow:var(--shadow-md),var(--shadow-glow-sm-brand);transform:translateX(4px) }
.audit-trail__timeline-icon { position:absolute;top:var(--spacing-4);left:calc(var(--spacing-6)*-1 - var(--spacing-4));z-index:1;display:flex;justify-content:center;align-items:center;width:var(--spacing-8);height:var(--spacing-8);font-size:var(--text-sm);border:3px solid var(--color-surface-elevated);border-radius:var(--radius-full) }
.audit-trail__timeline-item--auto-apply .audit-trail__timeline-icon,.audit-trail__timeline-item--auto_apply .audit-trail__timeline-icon { color:var(--color-text-on-dark);background:var(--color-success) }
.audit-trail__timeline-item--undo .audit-trail__timeline-icon { color:var(--color-text-on-dark);background:var(--color-warning) }
.audit-trail__timeline-item--manual-override .audit-trail__timeline-icon,.audit-trail__timeline-item--manual_override .audit-trail__timeline-icon { color:var(--color-text-on-dark);background:var(--color-info) }
.audit-trail__timeline-item--kill-switch-blocked .audit-trail__timeline-icon,.audit-trail__timeline-item--kill_switch_blocked .audit-trail__timeline-icon { color:var(--color-text-on-dark);background:var(--color-danger) }
.audit-trail__timeline-header { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-2) }
.audit-trail__timeline-time { color:var(--color-text-muted);font-size:var(--text-xs);white-space:nowrap }
.audit-trail__timeline-body { margin-bottom:var(--spacing-3) }
.audit-trail__timeline-email { margin-bottom:var(--spacing-1);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.audit-trail__timeline-reason { color:var(--color-text-secondary);font-size:var(--text-sm);line-height:var(--leading-relaxed) }
.audit-trail__timeline-meta { display:flex;flex-wrap:wrap;gap:var(--spacing-3);color:var(--color-text-muted);font-size:var(--text-xs) }
.audit-trail__timeline-meta span { display:flex;align-items:center;gap:var(--spacing-1) }
.audit-trail__pagination { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);margin-top:var(--spacing-4);padding-top:var(--spacing-4);border-top:1px solid var(--color-border-subtle) }
.audit-trail__pagination-info { color:var(--color-text-muted);font-size:var(--text-sm) }
.audit-trail__pagination-controls { display:flex;align-items:center;gap:var(--spacing-2) }
.audit-trail__pagination-btn { display:flex;justify-content:center;align-items:center;min-width:var(--spacing-10);height:var(--spacing-10);padding:var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.audit-trail__pagination-btn:hover:not(:disabled) { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.audit-trail__pagination-btn:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.audit-trail__pagination-btn:disabled { opacity:50%;cursor:not-allowed }
.audit-trail__pagination-btn--active { color:var(--color-text-on-dark);background:var(--color-brand-primary);border-color:var(--color-brand-primary) }
.audit-trail__export { display:flex;align-items:center;gap:var(--spacing-3);margin-top:var(--spacing-4) }
.audit-trail__export-btn { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.audit-trail__export-btn:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.audit-trail__export-btn:focus-visible { outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:var(--focus-ring-offset) }
.audit-trail__export-btn i { color:var(--color-brand-primary) }
.audit-trail__empty { display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--spacing-4);padding:var(--spacing-12) var(--spacing-4);text-align:center }
.audit-trail__empty-icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-16);height:var(--spacing-16);color:var(--color-text-muted);font-size:var(--text-3xl);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-full) }
.audit-trail__empty-title { color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold) }
.audit-trail__empty-text { max-width:300px;color:var(--color-text-muted);font-size:var(--text-sm) }
.audit-trail__loading { display:flex;justify-content:center;align-items:center;gap:var(--spacing-3);padding:var(--spacing-12) var(--spacing-4);color:var(--color-text-muted) }
.audit-trail__loading i { color:var(--color-brand-primary);font-size:var(--text-xl);animation:spin 1s linear infinite }
.audit-trail__activity-item--loading,.audit-trail__stat-card--loading,.audit-trail__timeline-item--loading { background:var(--skeleton-gradient);background-size:200% 100%;animation:auditTrailShimmer var(--duration-shimmer) ease-in-out infinite;pointer-events:none }
.audit-trail__activity-item--loading *,.audit-trail__stat-card--loading *,.audit-trail__timeline-item--loading * { visibility:hidden }
.audit-trail__date-dropdown { position:relative }
.audit-trail__date-btn { display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-full);transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.audit-trail__date-btn:hover { color:var(--color-text-primary);background:var(--color-surface-hover);border-color:var(--color-border-strong) }
.audit-trail__date-menu { position:absolute;top:calc(100% + var(--spacing-2));right:0;z-index:100;visibility:hidden;min-width:180px;background:var(--color-surface-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);opacity:0;transform:translateY(-8px);transition:all var(--duration-fast) var(--ease-out) }
.audit-trail__date-dropdown[open] .audit-trail__date-menu { visibility:visible;opacity:100%;transform:translateY(0) }
.audit-trail__date-option { display:block;width:100%;padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-secondary);font-size:var(--text-sm);text-align:left;background:none;border:none;transition:all var(--duration-fast) var(--ease-out);cursor:pointer }
.audit-trail__date-option:first-child { border-radius:var(--radius-lg) var(--radius-lg) 0 0 }
.audit-trail__date-option:last-child { border-radius:0 0 var(--radius-lg) var(--radius-lg) }
.audit-trail__date-option:hover { color:var(--color-text-primary);background:var(--color-surface-hover) }
.audit-trail__date-option--active { color:var(--color-brand-primary-light);background:var(--color-brand-primary-subtle) }
@media (max-width:768px) { .audit-trail__header { flex-direction:column;align-items:flex-start }
.audit-trail__stats-grid { grid-template-columns:1fr 1fr }
.audit-trail__quick-filters { overflow-x:auto;flex-wrap:nowrap;margin-bottom:var(--spacing-3);padding-bottom:var(--spacing-2);-webkit-overflow-scrolling:touch }
.audit-trail__quick-filter { flex-shrink:0 }
.audit-trail__filters-content { grid-template-columns:1fr }
.audit-trail__table-container { margin:0 calc(var(--spacing-4)*-1);border-right:none;border-left:none;border-radius:0 }
.audit-trail__pagination { flex-direction:column;gap:var(--spacing-3) }
.audit-trail__timeline { padding-left:var(--spacing-6) }
.audit-trail__timeline:before { left:var(--spacing-3) }
.audit-trail__timeline-icon { left:calc(var(--spacing-4)*-1 - var(--spacing-3));width:var(--spacing-6);height:var(--spacing-6);font-size:var(--text-xs) }
 }
@media (max-width:480px) { .audit-trail__stats-grid { grid-template-columns:1fr }
.audit-trail__stat-card { padding:var(--spacing-4) }
.audit-trail__stat-value { font-size:var(--text-2xl) }
.audit-trail__table td:nth-child(4),.audit-trail__table td:nth-child(5),.audit-trail__table th:nth-child(4),.audit-trail__table th:nth-child(5) { display:none }
.audit-trail__export { flex-direction:column;align-items:stretch }
.audit-trail__export-btn { justify-content:center }
 }
@media (prefers-reduced-motion:reduce) { .audit-trail__activity-item--loading,.audit-trail__activity-item,.audit-trail__live-dot,.audit-trail__loading i,.audit-trail__stat-card--loading,.audit-trail__stat-card,.audit-trail__timeline-item--loading,.audit-trail__timeline-item { animation:none }
.audit-trail__activity-item:hover,.audit-trail__activity-item,.audit-trail__confidence-fill,.audit-trail__export-btn,.audit-trail__pagination-btn,.audit-trail__quick-filter,.audit-trail__stat-card:hover,.audit-trail__stat-progress-fill,.audit-trail__table-row,.audit-trail__timeline-item:hover,.audit-trail__view-btn { transition:none }
 }
.c-drift-indicator { display:inline-flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-2) var(--spacing-4);font-size:var(--text-sm);background:var(--color-surface-elevated);border:var(--border-width-1) solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--duration-medium) var(--ease-out);cursor:default }
.c-drift-indicator:hover { box-shadow:var(--shadow-md);transform:translateY(-1px) }
.c-drift-indicator__dot { flex-shrink:0;width:var(--spacing-2);height:var(--spacing-2);border-radius:var(--radius-full);transition:background var(--duration-medium) var(--ease-out) }
.c-drift-indicator__label { color:var(--color-text-primary);font-weight:var(--font-weight-medium) }
.c-drift-indicator__accuracy { margin-left:var(--spacing-1);padding-left:var(--spacing-2);color:var(--color-text-secondary);font-weight:var(--font-weight-semibold);border-left:var(--border-width-1) solid var(--color-border-subtle) }
.c-drift-indicator[data-drift-status=healthy] { background:var(--color-success-subtle);border-color:var(--color-success-border) }
.c-drift-indicator[data-drift-status=healthy] .c-drift-indicator__dot { background:var(--color-success);box-shadow:0 0 var(--spacing-2) var(--color-success);animation:drift-pulse-success var(--duration-pulse) ease-in-out infinite }
.c-drift-indicator[data-drift-status=healthy] .c-drift-indicator__label { color:var(--color-success-text) }
.c-drift-indicator[data-drift-status=minor] { background:var(--color-warning-subtle);border-color:var(--color-warning-border) }
.c-drift-indicator[data-drift-status=minor] .c-drift-indicator__dot { background:var(--color-warning);box-shadow:0 0 var(--spacing-2) var(--color-warning);animation:drift-pulse-warning var(--duration-pulse) ease-in-out infinite }
.c-drift-indicator[data-drift-status=minor] .c-drift-indicator__label { color:var(--color-warning-text) }
.c-drift-indicator[data-drift-status=moderate] { background:var(--color-warning-moderate-subtle);border-color:var(--color-warning-moderate-border) }
.c-drift-indicator[data-drift-status=moderate] .c-drift-indicator__dot { background:var(--color-warning-moderate);box-shadow:0 0 var(--spacing-2) var(--color-warning-moderate-glow);animation:drift-pulse-moderate var(--duration-pulse) ease-in-out infinite }
.c-drift-indicator[data-drift-status=moderate] .c-drift-indicator__label { color:var(--color-warning-moderate-text) }
.c-drift-indicator[data-drift-status=severe] { background:var(--color-danger-subtle);border-color:var(--color-danger-border) }
.c-drift-indicator[data-drift-status=severe] .c-drift-indicator__dot { background:var(--color-danger);box-shadow:0 0 var(--spacing-3) var(--color-danger);animation:drift-pulse-severe var(--duration-shimmer) ease-in-out infinite }
.c-drift-indicator[data-drift-status=severe] .c-drift-indicator__label { color:var(--color-danger-text);font-weight:var(--font-weight-semibold) }
.c-drift-indicator--loading { background:var(--color-surface-hover) }
.c-drift-indicator--loading .c-drift-indicator__dot { background:var(--color-text-muted);animation:drift-shimmer var(--duration-shimmer) linear infinite }
@media (prefers-reduced-motion:reduce) { .c-drift-indicator__dot { animation:none }
.c-drift-indicator:hover { transform:none }
 }
@media (max-width:480px) { .c-drift-indicator { justify-content:center;width:100% }
.c-drift-indicator__accuracy { display:none }
 }
@media (max-width:1024px) { .c-learning-analytics-grid { grid-template-columns:1fr }
 }
@media (max-width:600px) { .c-ab-summary__cards { grid-template-columns:1fr }
 }
@media (prefers-reduced-motion:reduce) { .c-ab-summary__indicator-dot,.c-learning-section,.c-learning-section:before,.c-pattern-performance__bar { transition:none;animation:none }
.c-learning-section:hover { transform:none }
.c-learning-section .shimmer { animation:none }
 }
@media (prefers-contrast:more) { .c-learning-section { border-width:var(--border-width-2) }
.c-drift-overview__alert-item { border-left-width:var(--spacing-1) }
 }
@media (max-width:768px) { .c-learning-section { gap:var(--spacing-3);padding:var(--spacing-4) }
.c-learning-section__header { padding-bottom:var(--spacing-3);font-size:var(--text-base) }
.c-pattern-performance__bar-container { width:var(--spacing-16) }
.c-learning-metrics__value { font-size:var(--text-xl) }
.c-learning-metrics__sparkline { width:var(--spacing-16) }
.c-learning-metrics__gauge { width:var(--spacing-12);height:var(--spacing-12) }
.c-ml-performance__summary { grid-template-columns:repeat(2,1fr) }
.c-ml-performance__confidence-row { gap:var(--spacing-2);grid-template-columns:var(--spacing-16) 1fr var(--spacing-6) }
 }
.c-learning-analytics-grid { display:grid;grid-gap:var(--spacing-6);gap:var(--spacing-6);grid-template-columns:repeat(2,1fr);width:100% }
.c-learning-section { position:relative;display:flex;overflow:hidden;flex-direction:column;gap:var(--spacing-4);padding:var(--spacing-6);background:var(--alpha-white-10);border:var(--border-width-1) solid var(--alpha-white-20);border-radius:var(--radius-2xl);box-shadow:var(--metric-card-shadow);transition:transform var(--duration-medium) var(--ease-out),box-shadow var(--duration-medium) var(--ease-out),border-color var(--duration-medium) var(--ease-out);animation:learningSectionEnter var(--duration-slow) var(--ease-bounce);backdrop-filter:var(--backdrop-blur-extra-heavy) }
.c-learning-section:first-child { animation-delay:var(--delay-stagger-1) }
.c-learning-section:nth-child(2) { animation-delay:var(--delay-stagger-2) }
.c-learning-section:nth-child(3) { animation-delay:var(--delay-stagger-3) }
.c-learning-section:nth-child(4) { animation-delay:var(--delay-stagger-4) }
.c-learning-section:hover { border-color:var(--color-border-strong);box-shadow:var(--metric-card-shadow-hover);transform:translateY(calc(var(--spacing-1)*-1)) }
.c-learning-section:before { content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,var(--alpha-white-5) 100%);opacity:0;transition:opacity var(--duration-medium) var(--ease-out);pointer-events:none }
.c-learning-section:hover:before { opacity:100% }
.c-learning-section__header { display:flex;align-items:center;gap:var(--spacing-3);margin:0;padding-bottom:var(--spacing-4);color:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-semibold);border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.c-learning-section__header i { color:var(--color-brand-primary-light);font-size:var(--text-xl) }
.c-learning-section__content { display:flex;flex:1;flex-direction:column;gap:var(--spacing-4) }
.c-pattern-performance__list { display:flex;flex-direction:column;gap:var(--spacing-2) }
.c-pattern-performance__item { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3);background:var(--color-surface-alt);border-radius:var(--radius-lg);transition:background var(--duration-fast) var(--ease-out) }
.c-pattern-performance__item:hover { background:var(--color-surface-hover) }
.c-pattern-performance__item-info { display:flex;flex:1;flex-direction:column;gap:var(--spacing-1);min-width:0 }
.c-pattern-performance__item-name { overflow:hidden;color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);text-overflow:ellipsis;white-space:nowrap }
.c-pattern-performance__item-category { color:var(--color-text-tertiary);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.c-pattern-performance__bar-container { overflow:hidden;flex-shrink:0;width:var(--spacing-24);height:var(--spacing-2);background:var(--color-border-subtle);border-radius:var(--radius-full) }
.c-pattern-performance__bar { height:100%;background:var(--gradient-success-enhanced);border-radius:var(--radius-full);transition:width var(--duration-medium) var(--ease-out) }
.c-pattern-performance__score { min-width:var(--spacing-10);color:var(--color-success);font-size:var(--text-sm);font-weight:var(--font-semibold);text-align:right }
.c-pattern-performance__chart { height:var(--spacing-32);margin-top:var(--spacing-4) }
.c-pattern-performance__categories { display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin-top:var(--spacing-3) }
.c-pattern-performance__category { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-xs);background:var(--color-surface-alt);border-radius:var(--radius-full) }
.c-pattern-performance__category-count { color:var(--color-brand-primary-light);font-weight:var(--font-semibold) }
.c-ab-summary__cards { display:grid;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:repeat(3,1fr) }
.c-ab-summary__card { min-height:auto;padding:var(--spacing-4) }
.c-ab-summary__card .sg-stripe-metric__value { font-size:var(--text-2xl) }
.c-ab-summary__indicator { display:inline-flex;align-items:center;gap:var(--spacing-2) }
.c-ab-summary__indicator-dot { width:var(--spacing-2);height:var(--spacing-2);background:var(--color-info);border-radius:var(--radius-full);animation:abIndicatorPulse var(--duration-pulse) ease-in-out infinite }
.c-ab-summary__winner-badge { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2);color:var(--color-success);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-success-subtle);border:var(--border-width-1) solid var(--color-success-border);border-radius:var(--radius-full) }
.c-learning-metrics__row { display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-4);padding:var(--spacing-3) 0;border-bottom:var(--border-width-1) solid var(--color-border-subtle) }
.c-learning-metrics__row:last-child { border-bottom:none }
.c-learning-metrics__info { display:flex;flex-direction:column;gap:var(--spacing-1) }
.c-learning-metrics__label { color:var(--color-text-tertiary);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.c-learning-metrics__value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold);line-height:var(--leading-tight) }
.c-learning-metrics__sparkline { flex-shrink:0;width:var(--spacing-24);height:var(--spacing-8) }
.c-learning-metrics__gauge { position:relative;flex-shrink:0;width:var(--spacing-16);height:var(--spacing-16) }
.c-learning-metrics__gauge-circle { display:flex;justify-content:center;align-items:center;width:100%;height:100%;background:conic-gradient(var(--color-success) 0deg,var(--color-success) calc(var(--gauge-value, 0)*3.6deg),var(--color-surface-hover) calc(var(--gauge-value, 0)*3.6deg),var(--color-surface-hover) 1turn);border-radius:var(--radius-full) }
.c-learning-metrics__gauge-inner { display:flex;justify-content:center;align-items:center;width:80%;height:80%;color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-bold);background:var(--color-surface-primary);border-radius:var(--radius-full) }
.c-learning-metrics__gauge-shimmer { width:var(--spacing-20);height:var(--spacing-20);border-radius:var(--radius-full) }
.c-learning-metrics__gauge-wrapper { display:flex;justify-content:center;align-items:center;width:var(--spacing-20);height:var(--spacing-20) }
.accuracy-gauge { width:100%;height:100% }
.accuracy-gauge__background { fill:none;stroke:var(--color-surface-hover);stroke-width:8 }
.accuracy-gauge__progress { fill:none;stroke-width:8;stroke-linecap:round;transition:stroke-dasharray .3s ease }
.accuracy-gauge__text { fill:var(--color-text-primary);font-size:var(--text-lg);font-weight:var(--font-bold) }
.c-drift-overview__status { display:flex;justify-content:center;padding:var(--spacing-4) 0 }
.c-drift-overview__status .c-drift-indicator { padding:var(--spacing-3) var(--spacing-6);font-size:var(--text-base) }
.c-drift-overview__subheading { margin:var(--spacing-3) 0 var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.c-drift-overview__alerts-list { display:flex;overflow-y:auto;flex-direction:column;gap:var(--spacing-2);max-height:var(--spacing-40) }
.c-drift-overview__alert-item { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3);background:var(--color-surface-alt);border-left:var(--border-width-3) solid var(--color-border-subtle);border-radius:var(--radius-lg) }
.c-drift-overview__alert-item--minor { border-left-color:var(--color-warning);background:var(--color-warning-subtle) }
.c-drift-overview__alert-item--moderate { border-left-color:var(--color-warning-moderate);background:var(--color-warning-moderate-subtle) }
.c-drift-overview__alert-item--severe { border-left-color:var(--color-danger);background:var(--color-danger-subtle) }
.c-drift-overview__alert-info { display:flex;flex:1;flex-direction:column;gap:var(--spacing-1);min-width:0 }
.c-drift-overview__alert-metric { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.c-drift-overview__alert-time { color:var(--color-text-muted);font-size:var(--text-xs) }
.c-drift-overview__alert-score { padding:var(--spacing-1) var(--spacing-2);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-semibold);background:var(--color-surface-hover);border-radius:var(--radius-md) }
.c-drift-overview__history-list { display:flex;flex-direction:column;gap:var(--spacing-2) }
.c-drift-overview__history-item { display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-2) var(--spacing-3);background:var(--color-surface-alt);border-radius:var(--radius-md) }
.c-drift-overview__history-icon { display:flex;justify-content:center;align-items:center;width:var(--spacing-6);height:var(--spacing-6);color:var(--color-info);font-size:var(--text-sm);background:var(--color-info-subtle);border-radius:var(--radius-md) }
.c-drift-overview__history-info { flex:1;min-width:0 }
.c-drift-overview__history-action { color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium) }
.c-drift-overview__history-time { color:var(--color-text-muted);font-size:var(--text-xs) }
.c-learning-section--loading { pointer-events:none }
.c-learning-section .shimmer { background:linear-gradient(90deg,var(--color-surface-hover) 0,var(--color-surface-elevated) 50%,var(--color-surface-hover) 100%);background-size:200% 100%;border-radius:var(--radius-lg);animation:shimmer var(--duration-shimmer) var(--ease-in-out) infinite }
.c-learning-section__empty { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-3);padding:var(--spacing-8);text-align:center }
.c-learning-section__empty-icon { color:var(--color-text-muted);font-size:var(--text-4xl);opacity:50% }
.c-learning-section__empty-text { color:var(--color-text-tertiary);font-size:var(--text-sm) }
.c-learning-section:focus-within { outline:var(--focus-ring-width) solid var(--color-brand-primary);outline-offset:var(--focus-ring-offset) }
.c-ml-performance__mode-badge { display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wider);text-transform:uppercase;background:var(--color-surface-secondary);border-radius:var(--radius-full) }
.c-ml-performance__mode-badge[data-mode=shadow] { color:var(--color-neutral-200);background:var(--color-neutral-700) }
.c-ml-performance__mode-badge[data-mode=suggest] { color:var(--color-neutral-50);background:var(--color-info-500) }
.c-ml-performance__mode-badge[data-mode=auto] { color:var(--color-neutral-50);background:var(--color-success-500) }
.c-ml-performance__summary { display:grid;grid-gap:var(--spacing-4);gap:var(--spacing-4);grid-template-columns:repeat(4,1fr);margin-bottom:var(--spacing-4);padding:var(--spacing-4);background:var(--color-surface-secondary);border-radius:var(--radius-lg) }
.c-ml-performance__stat { display:flex;flex-direction:column;align-items:center;gap:var(--spacing-1);text-align:center }
.c-ml-performance__stat-value { color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:var(--font-bold) }
.c-ml-performance__stat-label { color:var(--color-text-muted);font-size:var(--text-xs);letter-spacing:var(--tracking-wider);text-transform:uppercase }
.c-ml-performance__subheading { display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--font-semibold) }
.c-ml-performance__subheading i { color:var(--color-text-muted) }
.c-ml-performance__comparison { margin-bottom:var(--spacing-4) }
.c-ml-performance__bar { display:flex;overflow:hidden;height:var(--spacing-6);background:var(--color-surface-secondary);border-radius:var(--radius-lg) }
.c-ml-performance__bar-segment { display:flex;justify-content:center;align-items:center;width:var(--bar-width,0);min-width:0;font-size:var(--text-xs);font-weight:var(--font-semibold);transition:width var(--duration-normal) var(--ease-out) }
.c-ml-performance__bar-segment--ml { color:var(--color-neutral-50);background:var(--color-info-500) }
.c-ml-performance__bar-segment--rules { --bar-width:100%;color:var(--color-neutral-200);background:var(--color-neutral-600) }
.c-ml-performance__bar-legend { display:flex;justify-content:center;gap:var(--spacing-6);margin-top:var(--spacing-2) }
.c-ml-performance__legend-item { display:flex;align-items:center;gap:var(--spacing-2);color:var(--color-text-muted);font-size:var(--text-xs) }
.c-ml-performance__legend-dot { width:var(--spacing-2);height:var(--spacing-2);border-radius:var(--radius-full) }
.c-ml-performance__legend-item--ml .c-ml-performance__legend-dot { background:var(--color-info-500) }
.c-ml-performance__legend-item--rules .c-ml-performance__legend-dot { background:var(--color-neutral-600) }
.c-ml-performance__confidence { margin-bottom:var(--spacing-4) }
.c-ml-performance__confidence-bars { display:flex;flex-direction:column;gap:var(--spacing-2) }
.c-ml-performance__confidence-row { display:grid;align-items:center;grid-gap:var(--spacing-3);gap:var(--spacing-3);grid-template-columns:var(--spacing-20) 1fr var(--spacing-8) }
.c-ml-performance__confidence-label { color:var(--color-text-muted);font-size:var(--text-xs);text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.c-ml-performance__confidence-bar { overflow:hidden;height:var(--spacing-3);background:var(--color-surface-secondary);border-radius:var(--radius-sm) }
.c-ml-performance__confidence-fill { width:var(--fill-width,0);height:100%;background:var(--color-info-500);border-radius:var(--radius-sm);transition:width var(--duration-normal) var(--ease-out) }
.c-ml-performance__confidence-count { color:var(--color-text-tertiary);font-size:var(--text-xs);text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums }
.c-ml-performance__trend { margin-top:var(--spacing-4) }
.c-ml-performance__trend canvas { max-height:var(--size-chart-mini) }
.u-block { display:block }
.u-inline-block { display:inline-block }
.u-inline { display:inline }
.u-flex { display:flex }
.u-inline-flex { display:inline-flex }
.u-grid { display:grid }
.u-inline-grid { display:inline-grid }
.u-flow-root { display:flow-root }
.u-hidden { display:none }
.u-invisible { visibility:hidden }
.u-visible { visibility:visible }
@media (min-width:640px) { .u-hidden\@sm { display:none }
.u-block\@sm { display:block }
.u-flex\@sm { display:flex }
.u-grid\@sm { display:grid }
 }
@media (min-width:768px) { .u-hidden\@md { display:none }
.u-block\@md { display:block }
.u-flex\@md { display:flex }
.u-grid\@md { display:grid }
 }
@media (min-width:1024px) { .u-hidden\@lg { display:none }
.u-block\@lg { display:block }
.u-flex\@lg { display:flex }
.u-grid\@lg { display:grid }
 }
@media (min-width:1280px) { .u-hidden\@xl { display:none }
.u-block\@xl { display:block }
.u-flex\@xl { display:flex }
.u-grid\@xl { display:grid }
 }
@media print { .u-hidden\@print { display:none }
.u-visible\@print { display:block }
 }
.u-sr-only { position:absolute;overflow:hidden;clip-path:inset(0);width:var(--spacing-px);height:var(--spacing-px);margin:-1px;padding:var(--spacing-0);white-space:nowrap;border-width:0 }
.u-not-sr-only { position:static;overflow:visible;clip-path:none;width:auto;height:auto;margin:var(--spacing-0);padding:var(--spacing-0);white-space:normal }
.u-overflow-auto { overflow:auto }
.u-overflow-hidden { overflow:hidden }
.u-overflow-visible { overflow:visible }
.u-overflow-scroll { overflow:scroll }
.u-overflow-x-auto { overflow-x:auto }
.u-overflow-x-hidden { overflow-x:hidden }
.u-overflow-x-visible { overflow-x:visible }
.u-overflow-x-scroll { overflow-x:scroll }
.u-overflow-y-auto { overflow-y:auto }
.u-overflow-y-hidden { overflow-y:hidden }
.u-overflow-y-visible { overflow-y:visible }
.u-overflow-y-scroll { overflow-y:scroll }
.u-static { position:static }
.u-fixed { position:fixed }
.u-absolute { position:absolute }
.u-relative { position:relative }
.u-sticky { position:sticky }
.u-inset-0 { inset:var(--spacing-0) }
.u-inset-auto { inset:auto }
.u-top-0 { top:var(--spacing-0) }
.u-right-0 { right:var(--spacing-0) }
.u-bottom-0 { bottom:var(--spacing-0) }
.u-left-0 { left:var(--spacing-0) }
.u-top-auto { top:auto }
.u-right-auto { right:auto }
.u-bottom-auto { bottom:auto }
.u-left-auto { left:auto }
.u-z-0 { z-index:var(--z-0) }
.u-z-10 { z-index:var(--z-10) }
.u-z-20 { z-index:var(--z-20) }
.u-z-30 { z-index:var(--z-30) }
.u-z-40 { z-index:var(--z-40) }
.u-z-50 { z-index:var(--z-50) }
.u-z-modal { z-index:var(--z-modal) }
.u-z-popover { z-index:var(--z-popover) }
.u-z-tooltip { z-index:var(--z-tooltip) }
.u-z-notification { z-index:var(--z-notification) }
.u-z-auto { z-index:auto }
.u-opacity-0 { opacity:0 }
.u-opacity-10 { opacity:10% }
.u-opacity-20 { opacity:20% }
.u-opacity-30 { opacity:30% }
.u-opacity-40 { opacity:40% }
.u-opacity-50 { opacity:50% }
.u-opacity-60 { opacity:60% }
.u-opacity-70 { opacity:70% }
.u-opacity-80 { opacity:80% }
.u-opacity-90 { opacity:90% }
.u-opacity-100 { opacity:100% }
.u-cursor-auto { cursor:auto }
.u-cursor-default { cursor:default }
.u-cursor-pointer { cursor:pointer }
.u-cursor-wait { cursor:wait }
.u-cursor-text { cursor:text }
.u-cursor-move { cursor:move }
.u-cursor-not-allowed { cursor:not-allowed }
.u-cursor-none { cursor:none }
.u-cursor-help { cursor:help }
.u-cursor-progress { cursor:progress }
.u-cursor-crosshair { cursor:crosshair }
.u-cursor-grab { cursor:grab }
.u-cursor-grabbing { cursor:grabbing }
.is-hidden { display:none }
.u-progress-bar { position:relative;overflow:hidden;width:var(--progress,0);height:var(--spacing-1);background:var(--color-primary);border-radius:var(--radius-base);transition:width .3s ease }
.u-progress-bar:after { position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--overlay-light-30),transparent);transform:translateX(-100%);animation:shimmer 2s infinite;content:"" }
.is-loading { position:relative;opacity:70%;pointer-events:none }
.is-loading:after { content:"";position:absolute;top:50%;left:50%;width:var(--spacing-4);height:var(--spacing-4);margin:calc(var(--spacing-2)*-1) 0 0 calc(var(--spacing-2)*-1);border:var(--spacing-0-5) solid var(--color-neutral-200);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite }
.is-disabled { opacity:60%;cursor:not-allowed;pointer-events:none }
.is-syncing { position:relative }
.is-syncing:after { content:"";position:absolute;top:0;right:0;width:var(--spacing-2);height:var(--spacing-2);background:var(--color-primary);border-radius:50%;animation:pulse 2s ease-in-out infinite }
.is-success { color:var(--color-success-dark);background-color:var(--color-success-subtle);border-color:var(--color-success) }
.is-warning { color:var(--color-warning-dark);background-color:var(--color-warning-subtle);border-color:var(--color-warning) }
.is-error { color:var(--color-danger-dark);background-color:var(--color-danger-subtle);border-color:var(--color-danger) }
.is-info { color:var(--color-info-dark);background-color:var(--color-info-subtle);border-color:var(--color-info) }
[aria-hidden=true] { display:none }
[aria-disabled=true] { opacity:60%;cursor:not-allowed;pointer-events:none }
[aria-invalid=true] { border-color:var(--color-danger) }
.u-opacity { opacity:var(--opacity,100%) }
.u-p-0 { padding:var(--spacing-0) }
.u-p-px { padding:var(--spacing-px) }
.u-p-0\.5 { padding:var(--spacing-0-5) }
.u-p-1 { padding:var(--spacing-1) }
.u-p-2 { padding:var(--spacing-2) }
.u-p-3 { padding:var(--spacing-3) }
.u-p-4 { padding:var(--spacing-4) }
.u-p-5 { padding:var(--spacing-5) }
.u-p-6 { padding:var(--spacing-6) }
.u-p-8 { padding:var(--spacing-8) }
.u-p-10 { padding:var(--spacing-10) }
.u-p-12 { padding:var(--spacing-12) }
.u-p-16 { padding:var(--spacing-16) }
.u-p-20 { padding:var(--spacing-20) }
.u-p-24 { padding:var(--spacing-24) }
.u-px-0 { padding-inline:var(--spacing-0) }
.u-px-px { padding-inline:var(--spacing-px) }
.u-px-0\.5 { padding-inline:var(--spacing-0-5) }
.u-px-1 { padding-inline:var(--spacing-1) }
.u-px-2 { padding-inline:var(--spacing-2) }
.u-px-3 { padding-inline:var(--spacing-3) }
.u-px-4 { padding-inline:var(--spacing-4) }
.u-px-5 { padding-inline:var(--spacing-5) }
.u-px-6 { padding-inline:var(--spacing-6) }
.u-px-8 { padding-inline:var(--spacing-8) }
.u-px-10 { padding-inline:var(--spacing-10) }
.u-px-12 { padding-inline:var(--spacing-12) }
.u-px-16 { padding-inline:var(--spacing-16) }
.u-py-0 { padding-block:var(--spacing-0) }
.u-py-px { padding-block:var(--spacing-px) }
.u-py-0\.5 { padding-block:var(--spacing-0-5) }
.u-py-1 { padding-block:var(--spacing-1) }
.u-py-2 { padding-block:var(--spacing-2) }
.u-py-3 { padding-block:var(--spacing-3) }
.u-py-4 { padding-block:var(--spacing-4) }
.u-py-5 { padding-block:var(--spacing-5) }
.u-py-6 { padding-block:var(--spacing-6) }
.u-py-8 { padding-block:var(--spacing-8) }
.u-py-10 { padding-block:var(--spacing-10) }
.u-py-12 { padding-block:var(--spacing-12) }
.u-py-16 { padding-block:var(--spacing-16) }
.u-pt-0 { padding-block-start:var(--spacing-0) }
.u-pt-1 { padding-block-start:var(--spacing-1) }
.u-pt-2 { padding-block-start:var(--spacing-2) }
.u-pt-3 { padding-block-start:var(--spacing-3) }
.u-pt-4 { padding-block-start:var(--spacing-4) }
.u-pt-5 { padding-block-start:var(--spacing-5) }
.u-pt-6 { padding-block-start:var(--spacing-6) }
.u-pt-8 { padding-block-start:var(--spacing-8) }
.u-pr-0 { padding-inline-end:var(--spacing-0) }
.u-pr-1 { padding-inline-end:var(--spacing-1) }
.u-pr-2 { padding-inline-end:var(--spacing-2) }
.u-pr-3 { padding-inline-end:var(--spacing-3) }
.u-pr-4 { padding-inline-end:var(--spacing-4) }
.u-pr-5 { padding-inline-end:var(--spacing-5) }
.u-pr-6 { padding-inline-end:var(--spacing-6) }
.u-pr-8 { padding-inline-end:var(--spacing-8) }
.u-pb-0 { padding-block-end:var(--spacing-0) }
.u-pb-1 { padding-block-end:var(--spacing-1) }
.u-pb-2 { padding-block-end:var(--spacing-2) }
.u-pb-3 { padding-block-end:var(--spacing-3) }
.u-pb-4 { padding-block-end:var(--spacing-4) }
.u-pb-5 { padding-block-end:var(--spacing-5) }
.u-pb-6 { padding-block-end:var(--spacing-6) }
.u-pb-8 { padding-block-end:var(--spacing-8) }
.u-pl-0 { padding-inline-start:var(--spacing-0) }
.u-pl-1 { padding-inline-start:var(--spacing-1) }
.u-pl-2 { padding-inline-start:var(--spacing-2) }
.u-pl-3 { padding-inline-start:var(--spacing-3) }
.u-pl-4 { padding-inline-start:var(--spacing-4) }
.u-pl-5 { padding-inline-start:var(--spacing-5) }
.u-pl-6 { padding-inline-start:var(--spacing-6) }
.u-pl-8 { padding-inline-start:var(--spacing-8) }
.u-m-0 { margin:var(--spacing-0) }
.u-m-px { margin:var(--spacing-px) }
.u-m-0\.5 { margin:var(--spacing-0-5) }
.u-m-1 { margin:var(--spacing-1) }
.u-m-2 { margin:var(--spacing-2) }
.u-m-3 { margin:var(--spacing-3) }
.u-m-4 { margin:var(--spacing-4) }
.u-m-5 { margin:var(--spacing-5) }
.u-m-6 { margin:var(--spacing-6) }
.u-m-8 { margin:var(--spacing-8) }
.u-m-10 { margin:var(--spacing-10) }
.u-m-12 { margin:var(--spacing-12) }
.u-m-auto { margin:auto }
.u-mx-0 { margin-inline:var(--spacing-0) }
.u-mx-px { margin-inline:var(--spacing-px) }
.u-mx-0\.5 { margin-inline:var(--spacing-0-5) }
.u-mx-1 { margin-inline:var(--spacing-1) }
.u-mx-2 { margin-inline:var(--spacing-2) }
.u-mx-3 { margin-inline:var(--spacing-3) }
.u-mx-4 { margin-inline:var(--spacing-4) }
.u-mx-5 { margin-inline:var(--spacing-5) }
.u-mx-6 { margin-inline:var(--spacing-6) }
.u-mx-8 { margin-inline:var(--spacing-8) }
.u-mx-10 { margin-inline:var(--spacing-10) }
.u-mx-12 { margin-inline:var(--spacing-12) }
.u-mx-auto { margin-inline:auto }
.u-my-0 { margin-block:var(--spacing-0) }
.u-my-px { margin-block:var(--spacing-px) }
.u-my-0\.5 { margin-block:var(--spacing-0-5) }
.u-my-1 { margin-block:var(--spacing-1) }
.u-my-2 { margin-block:var(--spacing-2) }
.u-my-3 { margin-block:var(--spacing-3) }
.u-my-4 { margin-block:var(--spacing-4) }
.u-my-5 { margin-block:var(--spacing-5) }
.u-my-6 { margin-block:var(--spacing-6) }
.u-my-8 { margin-block:var(--spacing-8) }
.u-my-10 { margin-block:var(--spacing-10) }
.u-my-12 { margin-block:var(--spacing-12) }
.u-my-auto { margin-block:auto }
.u-mt-0 { margin-block-start:var(--spacing-0) }
.u-mt-1 { margin-block-start:var(--spacing-1) }
.u-mt-2 { margin-block-start:var(--spacing-2) }
.u-mt-3 { margin-block-start:var(--spacing-3) }
.u-mt-4 { margin-block-start:var(--spacing-4) }
.u-mt-5 { margin-block-start:var(--spacing-5) }
.u-mt-6 { margin-block-start:var(--spacing-6) }
.u-mt-8 { margin-block-start:var(--spacing-8) }
.u-mt-auto { margin-block-start:auto }
.u-mr-0 { margin-inline-end:var(--spacing-0) }
.u-mr-1 { margin-inline-end:var(--spacing-1) }
.u-mr-2 { margin-inline-end:var(--spacing-2) }
.u-mr-3 { margin-inline-end:var(--spacing-3) }
.u-mr-4 { margin-inline-end:var(--spacing-4) }
.u-mr-5 { margin-inline-end:var(--spacing-5) }
.u-mr-6 { margin-inline-end:var(--spacing-6) }
.u-mr-8 { margin-inline-end:var(--spacing-8) }
.u-mr-auto { margin-inline-end:auto }
.u-mb-0 { margin-block-end:var(--spacing-0) }
.u-mb-1 { margin-block-end:var(--spacing-1) }
.u-mb-2 { margin-block-end:var(--spacing-2) }
.u-mb-3 { margin-block-end:var(--spacing-3) }
.u-mb-4 { margin-block-end:var(--spacing-4) }
.u-mb-5 { margin-block-end:var(--spacing-5) }
.u-mb-6 { margin-block-end:var(--spacing-6) }
.u-mb-8 { margin-block-end:var(--spacing-8) }
.u-mb-auto { margin-block-end:auto }
.u-ml-0 { margin-inline-start:var(--spacing-0) }
.u-ml-1 { margin-inline-start:var(--spacing-1) }
.u-ml-2 { margin-inline-start:var(--spacing-2) }
.u-ml-3 { margin-inline-start:var(--spacing-3) }
.u-ml-4 { margin-inline-start:var(--spacing-4) }
.u-ml-5 { margin-inline-start:var(--spacing-5) }
.u-ml-6 { margin-inline-start:var(--spacing-6) }
.u-ml-8 { margin-inline-start:var(--spacing-8) }
.u-ml-auto { margin-inline-start:auto }
.u--mt-1 { margin-block-start:calc(var(--spacing-1)*-1) }
.u--mt-2 { margin-block-start:calc(var(--spacing-2)*-1) }
.u--mt-3 { margin-block-start:calc(var(--spacing-3)*-1) }
.u--mt-4 { margin-block-start:calc(var(--spacing-4)*-1) }
.u--mr-1 { margin-inline-end:calc(var(--spacing-1)*-1) }
.u--mr-2 { margin-inline-end:calc(var(--spacing-2)*-1) }
.u--mr-3 { margin-inline-end:calc(var(--spacing-3)*-1) }
.u--mr-4 { margin-inline-end:calc(var(--spacing-4)*-1) }
.u--mb-1 { margin-block-end:calc(var(--spacing-1)*-1) }
.u--mb-2 { margin-block-end:calc(var(--spacing-2)*-1) }
.u--mb-3 { margin-block-end:calc(var(--spacing-3)*-1) }
.u--mb-4 { margin-block-end:calc(var(--spacing-4)*-1) }
.u--ml-1 { margin-inline-start:calc(var(--spacing-1)*-1) }
.u--ml-2 { margin-inline-start:calc(var(--spacing-2)*-1) }
.u--ml-3 { margin-inline-start:calc(var(--spacing-3)*-1) }
.u--ml-4 { margin-inline-start:calc(var(--spacing-4)*-1) }
.u-gap-0 { gap:var(--spacing-0) }
.u-gap-px { gap:var(--spacing-px) }
.u-gap-0\.5 { gap:var(--spacing-0-5) }
.u-gap-1 { gap:var(--spacing-1) }
.u-gap-2 { gap:var(--spacing-2) }
.u-gap-3 { gap:var(--spacing-3) }
.u-gap-4 { gap:var(--spacing-4) }
.u-gap-5 { gap:var(--spacing-5) }
.u-gap-6 { gap:var(--spacing-6) }
.u-gap-8 { gap:var(--spacing-8) }
.u-gap-10 { gap:var(--spacing-10) }
.u-gap-12 { gap:var(--spacing-12) }
.u-space-x-0>*+* { margin-inline-start:var(--spacing-0) }
.u-space-x-1>*+* { margin-inline-start:var(--spacing-1) }
.u-space-x-2>*+* { margin-inline-start:var(--spacing-2) }
.u-space-x-3>*+* { margin-inline-start:var(--spacing-3) }
.u-space-x-4>*+* { margin-inline-start:var(--spacing-4) }
.u-space-x-5>*+* { margin-inline-start:var(--spacing-5) }
.u-space-x-6>*+* { margin-inline-start:var(--spacing-6) }
.u-space-y-0>*+* { margin-block-start:var(--spacing-0) }
.u-space-y-1>*+* { margin-block-start:var(--spacing-1) }
.u-space-y-2>*+* { margin-block-start:var(--spacing-2) }
.u-space-y-3>*+* { margin-block-start:var(--spacing-3) }
.u-space-y-4>*+* { margin-block-start:var(--spacing-4) }
.u-space-y-5>*+* { margin-block-start:var(--spacing-5) }
.u-space-y-6>*+* { margin-block-start:var(--spacing-6) }
.u-w-0 { width:var(--spacing-0) }
.u-w-px { width:var(--spacing-px) }
.u-w-0\.5 { width:var(--spacing-0-5) }
.u-w-1 { width:var(--spacing-1) }
.u-w-2 { width:var(--spacing-2) }
.u-w-3 { width:var(--spacing-3) }
.u-w-4 { width:var(--spacing-4) }
.u-w-5 { width:var(--spacing-5) }
.u-w-6 { width:var(--spacing-6) }
.u-w-8 { width:var(--spacing-8) }
.u-w-10 { width:var(--spacing-10) }
.u-w-12 { width:var(--spacing-12) }
.u-w-16 { width:var(--spacing-16) }
.u-w-20 { width:var(--spacing-20) }
.u-w-24 { width:var(--spacing-24) }
.u-w-32 { width:var(--spacing-32) }
.u-w-1\/2 { width:var(--radius-full) }
.u-w-1\/3 { width:33.3333% }
.u-w-2\/3 { width:66.6667% }
.u-w-1\/4 { width:25% }
.u-w-2\/4 { width:var(--radius-full) }
.u-w-3\/4 { width:75% }
.u-w-1\/5 { width:20% }
.u-w-2\/5 { width:40% }
.u-w-3\/5 { width:60% }
.u-w-4\/5 { width:80% }
.u-w-1\/6 { width:16.6667% }
.u-w-2\/6 { width:33.3333% }
.u-w-3\/6 { width:var(--radius-full) }
.u-w-4\/6 { width:66.6667% }
.u-w-5\/6 { width:83.3333% }
.u-w-auto { width:auto }
.u-w-full { width:100% }
.u-w-screen { width:100vw }
.u-w-min { width:min-content }
.u-w-max { width:max-content }
.u-w-fit { width:fit-content }
.u-min-w-0 { min-width:var(--spacing-0) }
.u-min-w-full { min-width:100% }
.u-min-w-min { min-width:min-content }
.u-min-w-max { min-width:max-content }
.u-min-w-fit { min-width:fit-content }
.u-max-w-0 { max-width:var(--spacing-0) }
.u-max-w-none { max-width:none }
.u-max-w-xs { max-width:20rem }
.u-max-w-sm { max-width:24rem }
.u-max-w-md { max-width:28rem }
.u-max-w-lg { max-width:32rem }
.u-max-w-xl { max-width:36rem }
.u-max-w-2xl { max-width:42rem }
.u-max-w-3xl { max-width:48rem }
.u-max-w-4xl { max-width:56rem }
.u-max-w-5xl { max-width:64rem }
.u-max-w-6xl { max-width:72rem }
.u-max-w-7xl { max-width:80rem }
.u-max-w-full { max-width:100% }
.u-max-w-min { max-width:min-content }
.u-max-w-max { max-width:max-content }
.u-max-w-fit { max-width:fit-content }
.u-max-w-prose { max-width:65ch }
.u-max-w-screen-sm { max-width:var(--container-sm) }
.u-max-w-screen-md { max-width:var(--container-md) }
.u-max-w-screen-lg { max-width:var(--container-lg) }
.u-max-w-screen-xl { max-width:var(--container-xl) }
.u-max-w-screen-2xl { max-width:var(--container-2xl) }
.u-h-0 { height:var(--spacing-0) }
.u-h-px { height:var(--spacing-px) }
.u-h-0\.5 { height:var(--spacing-0-5) }
.u-h-1 { height:var(--spacing-1) }
.u-h-2 { height:var(--spacing-2) }
.u-h-3 { height:var(--spacing-3) }
.u-h-4 { height:var(--spacing-4) }
.u-h-5 { height:var(--spacing-5) }
.u-h-6 { height:var(--spacing-6) }
.u-h-8 { height:var(--spacing-8) }
.u-h-10 { height:var(--spacing-10) }
.u-h-12 { height:var(--spacing-12) }
.u-h-16 { height:var(--spacing-16) }
.u-h-20 { height:var(--spacing-20) }
.u-h-24 { height:var(--spacing-24) }
.u-h-32 { height:var(--spacing-32) }
.u-h-1\/2 { height:var(--radius-full) }
.u-h-1\/3 { height:33.3333% }
.u-h-2\/3 { height:66.6667% }
.u-h-1\/4 { height:25% }
.u-h-2\/4 { height:var(--radius-full) }
.u-h-3\/4 { height:75% }
.u-h-1\/5 { height:20% }
.u-h-2\/5 { height:40% }
.u-h-3\/5 { height:60% }
.u-h-4\/5 { height:80% }
.u-h-1\/6 { height:16.6667% }
.u-h-5\/6 { height:83.3333% }
.u-h-auto { height:auto }
.u-h-full { height:100% }
.u-h-screen { height:100vh }
.u-h-min { height:min-content }
.u-h-max { height:max-content }
.u-h-fit { height:fit-content }
.u-min-h-0 { min-height:var(--spacing-0) }
.u-min-h-full { min-height:100% }
.u-min-h-screen { min-height:100vh }
.u-min-h-min { min-height:min-content }
.u-min-h-max { min-height:max-content }
.u-min-h-fit { min-height:fit-content }
.u-max-h-0 { max-height:var(--spacing-0) }
.u-max-h-none { max-height:none }
.u-max-h-full { max-height:100% }
.u-max-h-screen { max-height:100vh }
.u-max-h-min { max-height:min-content }
.u-max-h-max { max-height:max-content }
.u-max-h-fit { max-height:fit-content }
.u-size-0 { width:var(--spacing-0);height:var(--spacing-0) }
.u-size-px { width:var(--spacing-px);height:var(--spacing-px) }
.u-size-0\.5 { width:var(--spacing-0-5);height:var(--spacing-0-5) }
.u-size-1 { width:var(--spacing-1);height:var(--spacing-1) }
.u-size-2 { width:var(--spacing-2);height:var(--spacing-2) }
.u-size-3 { width:var(--spacing-3);height:var(--spacing-3) }
.u-size-4 { width:var(--spacing-4);height:var(--spacing-4) }
.u-size-5 { width:var(--spacing-5);height:var(--spacing-5) }
.u-size-6 { width:var(--spacing-6);height:var(--spacing-6) }
.u-size-8 { width:var(--spacing-8);height:var(--spacing-8) }
.u-size-10 { width:var(--spacing-10);height:var(--spacing-10) }
.u-size-12 { width:var(--spacing-12);height:var(--spacing-12) }
.u-size-16 { width:var(--spacing-16);height:var(--spacing-16) }
.u-size-20 { width:var(--spacing-20);height:var(--spacing-20) }
.u-size-24 { width:var(--spacing-24);height:var(--spacing-24) }
.u-size-32 { width:var(--spacing-32);height:var(--spacing-32) }
.u-size-full { width:100%;height:100% }
.u-size-auto { width:auto;height:auto }
.u-size-min { width:min-content;height:min-content }
.u-size-max { width:max-content;height:max-content }
.u-size-fit { width:fit-content;height:fit-content }
.u-border-0 { border-width:0 }
.u-border { border-width:var(--spacing-px) }
.u-border-2 { border-width:var(--spacing-0-5) }
.u-border-4 { border-width:var(--spacing-1) }
.u-border-8 { border-width:var(--spacing-2) }
.u-border-t-0 { border-top-width:0 }
.u-border-t { border-top-width:var(--spacing-px) }
.u-border-t-2 { border-top-width:var(--spacing-0-5) }
.u-border-t-4 { border-top-width:var(--spacing-1) }
.u-border-t-8 { border-top-width:var(--spacing-2) }
.u-border-r-0 { border-right-width:0 }
.u-border-r { border-right-width:var(--spacing-px) }
.u-border-r-2 { border-right-width:var(--spacing-0-5) }
.u-border-r-4 { border-right-width:var(--spacing-1) }
.u-border-r-8 { border-right-width:var(--spacing-2) }
.u-border-b-0 { border-bottom-width:0 }
.u-border-b { border-bottom-width:var(--spacing-px) }
.u-border-b-2 { border-bottom-width:var(--spacing-0-5) }
.u-border-b-4 { border-bottom-width:var(--spacing-1) }
.u-border-b-8 { border-bottom-width:var(--spacing-2) }
.u-border-l-0 { border-left-width:0 }
.u-border-l { border-left-width:var(--spacing-px) }
.u-border-l-2 { border-left-width:var(--spacing-0-5) }
.u-border-l-4 { border-left-width:var(--spacing-1) }
.u-border-l-8 { border-left-width:var(--spacing-2) }
.u-border-x-0 { border-left-width:0;border-right-width:0 }
.u-border-x { border-left-width:var(--spacing-px);border-right-width:var(--spacing-px) }
.u-border-x-2 { border-left-width:var(--spacing-0-5);border-right-width:var(--spacing-0-5) }
.u-border-x-4 { border-left-width:var(--spacing-1);border-right-width:var(--spacing-1) }
.u-border-y-0 { border-top-width:0;border-bottom-width:0 }
.u-border-y { border-top-width:var(--spacing-px);border-bottom-width:var(--spacing-px) }
.u-border-y-2 { border-top-width:var(--spacing-0-5);border-bottom-width:var(--spacing-0-5) }
.u-border-y-4 { border-top-width:var(--spacing-1);border-bottom-width:var(--spacing-1) }
.u-border-solid { border-style:solid }
.u-border-dashed { border-style:dashed }
.u-border-dotted { border-style:dotted }
.u-border-double { border-style:double }
.u-border-hidden { border-style:hidden }
.u-border-none { border-style:none }
.u-rounded-none { border-radius:var(--radius-none) }
.u-rounded-sm { border-radius:var(--radius-sm) }
.u-rounded { border-radius:var(--radius-base) }
.u-rounded-md { border-radius:var(--radius-md) }
.u-rounded-lg { border-radius:var(--radius-lg) }
.u-rounded-xl { border-radius:var(--radius-xl) }
.u-rounded-2xl { border-radius:var(--radius-2xl) }
.u-rounded-3xl { border-radius:var(--radius-3xl) }
.u-rounded-full { border-radius:var(--radius-full) }
.u-rounded-t-none { border-top-left-radius:var(--radius-none);border-top-right-radius:var(--radius-none) }
.u-rounded-t-sm { border-top-left-radius:var(--radius-sm);border-top-right-radius:var(--radius-sm) }
.u-rounded-t { border-top-left-radius:var(--radius-base);border-top-right-radius:var(--radius-base) }
.u-rounded-t-md { border-top-left-radius:var(--radius-md);border-top-right-radius:var(--radius-md) }
.u-rounded-t-lg { border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg) }
.u-rounded-t-xl { border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl) }
.u-rounded-t-2xl { border-top-left-radius:var(--radius-2xl);border-top-right-radius:var(--radius-2xl) }
.u-rounded-t-3xl { border-top-left-radius:var(--radius-3xl);border-top-right-radius:var(--radius-3xl) }
.u-rounded-t-full { border-top-left-radius:var(--radius-full);border-top-right-radius:var(--radius-full) }
.u-rounded-r-none { border-top-right-radius:var(--radius-none);border-bottom-right-radius:var(--radius-none) }
.u-rounded-r-sm { border-top-right-radius:var(--radius-sm);border-bottom-right-radius:var(--radius-sm) }
.u-rounded-r { border-top-right-radius:var(--radius-base);border-bottom-right-radius:var(--radius-base) }
.u-rounded-r-md { border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md) }
.u-rounded-r-lg { border-top-right-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg) }
.u-rounded-r-xl { border-top-right-radius:var(--radius-xl);border-bottom-right-radius:var(--radius-xl) }
.u-rounded-r-2xl { border-top-right-radius:var(--radius-2xl);border-bottom-right-radius:var(--radius-2xl) }
.u-rounded-r-3xl { border-top-right-radius:var(--radius-3xl);border-bottom-right-radius:var(--radius-3xl) }
.u-rounded-r-full { border-top-right-radius:var(--radius-full);border-bottom-right-radius:var(--radius-full) }
.u-rounded-b-none { border-bottom-left-radius:var(--radius-none);border-bottom-right-radius:var(--radius-none) }
.u-rounded-b-sm { border-bottom-left-radius:var(--radius-sm);border-bottom-right-radius:var(--radius-sm) }
.u-rounded-b { border-bottom-left-radius:var(--radius-base);border-bottom-right-radius:var(--radius-base) }
.u-rounded-b-md { border-bottom-left-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md) }
.u-rounded-b-lg { border-bottom-left-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg) }
.u-rounded-b-xl { border-bottom-left-radius:var(--radius-xl);border-bottom-right-radius:var(--radius-xl) }
.u-rounded-b-2xl { border-bottom-left-radius:var(--radius-2xl);border-bottom-right-radius:var(--radius-2xl) }
.u-rounded-b-3xl { border-bottom-left-radius:var(--radius-3xl);border-bottom-right-radius:var(--radius-3xl) }
.u-rounded-b-full { border-bottom-left-radius:var(--radius-full);border-bottom-right-radius:var(--radius-full) }
.u-rounded-l-none { border-top-left-radius:var(--radius-none);border-bottom-left-radius:var(--radius-none) }
.u-rounded-l-sm { border-top-left-radius:var(--radius-sm);border-bottom-left-radius:var(--radius-sm) }
.u-rounded-l { border-top-left-radius:var(--radius-base);border-bottom-left-radius:var(--radius-base) }
.u-rounded-l-md { border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md) }
.u-rounded-l-lg { border-top-left-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg) }
.u-rounded-l-xl { border-top-left-radius:var(--radius-xl);border-bottom-left-radius:var(--radius-xl) }
.u-rounded-l-2xl { border-top-left-radius:var(--radius-2xl);border-bottom-left-radius:var(--radius-2xl) }
.u-rounded-l-3xl { border-top-left-radius:var(--radius-3xl);border-bottom-left-radius:var(--radius-3xl) }
.u-rounded-l-full { border-top-left-radius:var(--radius-full);border-bottom-left-radius:var(--radius-full) }
.u-rounded-tl-none { border-top-left-radius:var(--radius-none) }
.u-rounded-tl-sm { border-top-left-radius:var(--radius-sm) }
.u-rounded-tl { border-top-left-radius:var(--radius-base) }
.u-rounded-tl-md { border-top-left-radius:var(--radius-md) }
.u-rounded-tl-lg { border-top-left-radius:var(--radius-lg) }
.u-rounded-tl-xl { border-top-left-radius:var(--radius-xl) }
.u-rounded-tl-2xl { border-top-left-radius:var(--radius-2xl) }
.u-rounded-tl-3xl { border-top-left-radius:var(--radius-3xl) }
.u-rounded-tl-full { border-top-left-radius:var(--radius-full) }
.u-rounded-tr-none { border-top-right-radius:var(--radius-none) }
.u-rounded-tr-sm { border-top-right-radius:var(--radius-sm) }
.u-rounded-tr { border-top-right-radius:var(--radius-base) }
.u-rounded-tr-md { border-top-right-radius:var(--radius-md) }
.u-rounded-tr-lg { border-top-right-radius:var(--radius-lg) }
.u-rounded-tr-xl { border-top-right-radius:var(--radius-xl) }
.u-rounded-tr-2xl { border-top-right-radius:var(--radius-2xl) }
.u-rounded-tr-3xl { border-top-right-radius:var(--radius-3xl) }
.u-rounded-tr-full { border-top-right-radius:var(--radius-full) }
.u-rounded-br-none { border-bottom-right-radius:var(--radius-none) }
.u-rounded-br-sm { border-bottom-right-radius:var(--radius-sm) }
.u-rounded-br { border-bottom-right-radius:var(--radius-base) }
.u-rounded-br-md { border-bottom-right-radius:var(--radius-md) }
.u-rounded-br-lg { border-bottom-right-radius:var(--radius-lg) }
.u-rounded-br-xl { border-bottom-right-radius:var(--radius-xl) }
.u-rounded-br-2xl { border-bottom-right-radius:var(--radius-2xl) }
.u-rounded-br-3xl { border-bottom-right-radius:var(--radius-3xl) }
.u-rounded-br-full { border-bottom-right-radius:var(--radius-full) }
.u-rounded-bl-none { border-bottom-left-radius:var(--radius-none) }
.u-rounded-bl-sm { border-bottom-left-radius:var(--radius-sm) }
.u-rounded-bl { border-bottom-left-radius:var(--radius-base) }
.u-rounded-bl-md { border-bottom-left-radius:var(--radius-md) }
.u-rounded-bl-lg { border-bottom-left-radius:var(--radius-lg) }
.u-rounded-bl-xl { border-bottom-left-radius:var(--radius-xl) }
.u-rounded-bl-2xl { border-bottom-left-radius:var(--radius-2xl) }
.u-rounded-bl-3xl { border-bottom-left-radius:var(--radius-3xl) }
.u-rounded-bl-full { border-bottom-left-radius:var(--radius-full) }
.u-divide-x>*+* { border-left-width:var(--spacing-px) }
.u-divide-x-2>*+* { border-left-width:var(--spacing-0-5) }
.u-divide-x-4>*+* { border-left-width:var(--spacing-1) }
.u-divide-x-8>*+* { border-left-width:var(--spacing-2) }
.u-divide-x-0>*+* { border-left-width:0 }
.u-divide-y>*+* { border-top-width:var(--spacing-px) }
.u-divide-y-2>*+* { border-top-width:var(--spacing-0-5) }
.u-divide-y-4>*+* { border-top-width:var(--spacing-1) }
.u-divide-y-8>*+* { border-top-width:var(--spacing-2) }
.u-divide-y-0>*+* { border-top-width:0 }
.u-border-collapse { border-collapse:collapse }
.u-border-separate { border-collapse:separate }
.u-border-spacing-0 { border-spacing:var(--spacing-0) }
.u-border-spacing-px { border-spacing:var(--spacing-px) }
.u-border-spacing-0\.5 { border-spacing:var(--spacing-0-5) }
.u-border-spacing-1 { border-spacing:var(--spacing-1) }
.u-border-spacing-2 { border-spacing:var(--spacing-2) }
.u-border-spacing-3 { border-spacing:var(--spacing-3) }
.u-border-spacing-4 { border-spacing:var(--spacing-4) }
.u-shadow-xs { box-shadow:var(--shadow-xs) }
.u-shadow-sm { box-shadow:var(--shadow-sm) }
.u-shadow { box-shadow:var(--shadow-base) }
.u-shadow-md { box-shadow:var(--shadow-md) }
.u-shadow-lg { box-shadow:var(--shadow-lg) }
.u-shadow-xl { box-shadow:var(--shadow-xl) }
.u-shadow-2xl { box-shadow:var(--shadow-2xl) }
.u-shadow-inner { box-shadow:var(--shadow-inner) }
.u-shadow-none { box-shadow:var(--shadow-none) }
.u-mix-blend-normal { mix-blend-mode:normal }
.u-mix-blend-multiply { mix-blend-mode:multiply }
.u-mix-blend-screen { mix-blend-mode:screen }
.u-mix-blend-overlay { mix-blend-mode:overlay }
.u-mix-blend-darken { mix-blend-mode:darken }
.u-mix-blend-lighten { mix-blend-mode:lighten }
.u-mix-blend-color-dodge { mix-blend-mode:color-dodge }
.u-mix-blend-color-burn { mix-blend-mode:color-burn }
.u-mix-blend-hard-light { mix-blend-mode:hard-light }
.u-mix-blend-soft-light { mix-blend-mode:soft-light }
.u-mix-blend-difference { mix-blend-mode:difference }
.u-mix-blend-exclusion { mix-blend-mode:exclusion }
.u-mix-blend-hue { mix-blend-mode:hue }
.u-mix-blend-saturation { mix-blend-mode:saturation }
.u-mix-blend-color { mix-blend-mode:color }
.u-mix-blend-luminosity { mix-blend-mode:luminosity }
.u-bg-blend-normal { background-blend-mode:normal }
.u-bg-blend-multiply { background-blend-mode:multiply }
.u-bg-blend-screen { background-blend-mode:screen }
.u-bg-blend-overlay { background-blend-mode:overlay }
.u-bg-blend-darken { background-blend-mode:darken }
.u-bg-blend-lighten { background-blend-mode:lighten }
.u-bg-blend-color-dodge { background-blend-mode:color-dodge }
.u-bg-blend-color-burn { background-blend-mode:color-burn }
.u-bg-blend-hard-light { background-blend-mode:hard-light }
.u-bg-blend-soft-light { background-blend-mode:soft-light }
.u-bg-blend-difference { background-blend-mode:difference }
.u-bg-blend-exclusion { background-blend-mode:exclusion }
.u-bg-blend-hue { background-blend-mode:hue }
.u-bg-blend-saturation { background-blend-mode:saturation }
.u-bg-blend-color { background-blend-mode:color }
.u-bg-blend-luminosity { background-blend-mode:luminosity }
.u-blur-none { filter:blur(0) }
.u-blur-sm { filter:blur(var(--spacing-1)) }
.u-blur { filter:blur(var(--spacing-2)) }
.u-blur-md { filter:blur(var(--spacing-3)) }
.u-blur-lg { filter:blur(var(--spacing-1-5)) }
.u-blur-xl { filter:blur(var(--spacing-6)) }
.u-blur-2xl { filter:blur(var(--spacing-10)) }
.u-blur-3xl { filter:blur(var(--spacing-16)) }
.u-brightness-0 { filter:brightness(0) }
.u-brightness-50 { filter:brightness(.5) }
.u-brightness-75 { filter:brightness(.75) }
.u-brightness-90 { filter:brightness(.9) }
.u-brightness-95 { filter:brightness(.95) }
.u-brightness-100 { filter:brightness(1) }
.u-brightness-105 { filter:brightness(1.05) }
.u-brightness-110 { filter:brightness(1.1) }
.u-brightness-125 { filter:brightness(1.25) }
.u-brightness-150 { filter:brightness(1.5) }
.u-brightness-200 { filter:brightness(2) }
.u-contrast-0 { filter:contrast(0) }
.u-contrast-50 { filter:contrast(.5) }
.u-contrast-75 { filter:contrast(.75) }
.u-contrast-100 { filter:contrast(1) }
.u-contrast-125 { filter:contrast(1.25) }
.u-contrast-150 { filter:contrast(1.5) }
.u-contrast-200 { filter:contrast(2) }
.u-grayscale-0 { filter:grayscale(0) }
.u-grayscale { filter:grayscale(100%) }
.u-hue-rotate-0 { filter:hue-rotate(0deg) }
.u-hue-rotate-15 { filter:hue-rotate(15deg) }
.u-hue-rotate-30 { filter:hue-rotate(30deg) }
.u-hue-rotate-60 { filter:hue-rotate(60deg) }
.u-hue-rotate-90 { filter:hue-rotate(90deg) }
.u-hue-rotate-180 { filter:hue-rotate(180deg) }
.u-invert-0 { filter:invert(0) }
.u-invert { filter:invert(100%) }
.u-saturate-0 { filter:saturate(0) }
.u-saturate-50 { filter:saturate(.5) }
.u-saturate-100 { filter:saturate(1) }
.u-saturate-150 { filter:saturate(1.5) }
.u-saturate-200 { filter:saturate(2) }
.u-sepia-0 { filter:sepia(0) }
.u-sepia { filter:sepia(100%) }
.u-backdrop-blur-none { backdrop-filter:blur(0) }
.u-backdrop-blur-sm { backdrop-filter:blur(var(--spacing-1)) }
.u-backdrop-blur { backdrop-filter:blur(var(--spacing-2)) }
.u-backdrop-blur-md { backdrop-filter:blur(var(--spacing-3)) }
.u-backdrop-blur-lg { backdrop-filter:blur(var(--spacing-1-5)) }
.u-backdrop-blur-xl { backdrop-filter:blur(var(--spacing-6)) }
.u-backdrop-blur-2xl { backdrop-filter:blur(var(--spacing-10)) }
.u-backdrop-blur-3xl { backdrop-filter:blur(var(--spacing-16)) }
.u-backdrop-brightness-0 { backdrop-filter:brightness(0) }
.u-backdrop-brightness-50 { backdrop-filter:brightness(.5) }
.u-backdrop-brightness-75 { backdrop-filter:brightness(.75) }
.u-backdrop-brightness-90 { backdrop-filter:brightness(.9) }
.u-backdrop-brightness-95 { backdrop-filter:brightness(.95) }
.u-backdrop-brightness-100 { backdrop-filter:brightness(1) }
.u-backdrop-brightness-105 { backdrop-filter:brightness(1.05) }
.u-backdrop-brightness-110 { backdrop-filter:brightness(1.1) }
.u-backdrop-brightness-125 { backdrop-filter:brightness(1.25) }
.u-backdrop-brightness-150 { backdrop-filter:brightness(1.5) }
.u-backdrop-brightness-200 { backdrop-filter:brightness(2) }
.u-transform { transform:translateX(0) }
.u-transform-none { transform:none }
.u-scale-0 { transform:scale(0) }
.u-scale-50 { transform:scale(.5) }
.u-scale-75 { transform:scale(.75) }
.u-scale-90 { transform:scale(.9) }
.u-scale-95 { transform:scale(.95) }
.u-scale-100 { transform:scale(1) }
.u-scale-105 { transform:scale(1.05) }
.u-scale-110 { transform:scale(1.1) }
.u-scale-125 { transform:scale(1.25) }
.u-scale-150 { transform:scale(1.5) }
.u-scale-x-0 { transform:scaleX(0) }
.u-scale-x-50 { transform:scaleX(.5) }
.u-scale-x-75 { transform:scaleX(.75) }
.u-scale-x-90 { transform:scaleX(.9) }
.u-scale-x-95 { transform:scaleX(.95) }
.u-scale-x-100 { transform:scaleX(1) }
.u-scale-x-105 { transform:scaleX(1.05) }
.u-scale-x-110 { transform:scaleX(1.1) }
.u-scale-x-125 { transform:scaleX(1.25) }
.u-scale-x-150 { transform:scaleX(1.5) }
.u-scale-y-0 { transform:scaleY(0) }
.u-scale-y-50 { transform:scaleY(.5) }
.u-scale-y-75 { transform:scaleY(.75) }
.u-scale-y-90 { transform:scaleY(.9) }
.u-scale-y-95 { transform:scaleY(.95) }
.u-scale-y-100 { transform:scaleY(1) }
.u-scale-y-105 { transform:scaleY(1.05) }
.u-scale-y-110 { transform:scaleY(1.1) }
.u-scale-y-125 { transform:scaleY(1.25) }
.u-scale-y-150 { transform:scaleY(1.5) }
.u-rotate-0 { transform:rotate(0deg) }
.u-rotate-1 { transform:rotate(1deg) }
.u-rotate-2 { transform:rotate(2deg) }
.u-rotate-3 { transform:rotate(3deg) }
.u-rotate-6 { transform:rotate(6deg) }
.u-rotate-12 { transform:rotate(12deg) }
.u-rotate-45 { transform:rotate(45deg) }
.u-rotate-90 { transform:rotate(90deg) }
.u-rotate-180 { transform:rotate(180deg) }
.u--rotate-1 { transform:rotate(-1deg) }
.u--rotate-2 { transform:rotate(-2deg) }
.u--rotate-3 { transform:rotate(-3deg) }
.u--rotate-6 { transform:rotate(-6deg) }
.u--rotate-12 { transform:rotate(-12deg) }
.u--rotate-45 { transform:rotate(-45deg) }
.u--rotate-90 { transform:rotate(-90deg) }
.u--rotate-180 { transform:rotate(-180deg) }
.u-translate-x-0 { transform:translateX(0) }
.u-translate-x-px { transform:translateX(var(--spacing-px)) }
.u-translate-x-0\.5 { transform:translateX(.125rem) }
.u-translate-x-1 { transform:translateX(var(--spacing-1)) }
.u-translate-x-2 { transform:translateX(var(--spacing-2)) }
.u-translate-x-3 { transform:translateX(var(--spacing-3)) }
.u-translate-x-4 { transform:translateX(var(--spacing-4)) }
.u-translate-x-5 { transform:translateX(var(--spacing-5)) }
.u-translate-x-6 { transform:translateX(var(--spacing-6)) }
.u-translate-x-8 { transform:translateX(var(--spacing-8)) }
.u-translate-x-10 { transform:translateX(var(--spacing-10)) }
.u-translate-x-12 { transform:translateX(var(--spacing-12)) }
.u-translate-x-16 { transform:translateX(4rem) }
.u-translate-x-20 { transform:translateX(5rem) }
.u-translate-x-24 { transform:translateX(6rem) }
.u-translate-x-32 { transform:translateX(8rem) }
.u-translate-x-1\/2 { transform:translateX(var(--radius-full)) }
.u-translate-x-full { transform:translateX(100%) }
.u--translate-x-px { transform:translateX(calc(var(--spacing-px)*-1)) }
.u--translate-x-0\.5 { transform:translateX(-.125rem) }
.u--translate-x-1 { transform:translateX(calc(var(--spacing-1)*-1)) }
.u--translate-x-2 { transform:translateX(calc(var(--spacing-2)*-1)) }
.u--translate-x-3 { transform:translateX(calc(var(--spacing-3)*-1)) }
.u--translate-x-4 { transform:translateX(calc(var(--spacing-4)*-1)) }
.u--translate-x-5 { transform:translateX(calc(var(--spacing-5)*-1)) }
.u--translate-x-6 { transform:translateX(calc(var(--spacing-6)*-1)) }
.u--translate-x-8 { transform:translateX(calc(var(--spacing-8)*-1)) }
.u--translate-x-10 { transform:translateX(calc(var(--spacing-10)*-1)) }
.u--translate-x-12 { transform:translateX(calc(var(--spacing-12)*-1)) }
.u--translate-x-16 { transform:translateX(-4rem) }
.u--translate-x-20 { transform:translateX(-5rem) }
.u--translate-x-24 { transform:translateX(-6rem) }
.u--translate-x-32 { transform:translateX(-8rem) }
.u--translate-x-1\/2 { transform:translateX(-9999px) }
.u--translate-x-full { transform:translateX(-100%) }
.u-translate-y-0 { transform:translateY(0) }
.u-translate-y-px { transform:translateY(var(--spacing-px)) }
.u-translate-y-0\.5 { transform:translateY(.125rem) }
.u-translate-y-1 { transform:translateY(var(--spacing-1)) }
.u-translate-y-2 { transform:translateY(var(--spacing-2)) }
.u-translate-y-3 { transform:translateY(var(--spacing-3)) }
.u-translate-y-4 { transform:translateY(var(--spacing-4)) }
.u-translate-y-5 { transform:translateY(20px) }
.u-translate-y-6 { transform:translateY(var(--spacing-6)) }
.u-translate-y-8 { transform:translateY(var(--spacing-8)) }
.u-translate-y-10 { transform:translateY(var(--spacing-10)) }
.u-translate-y-12 { transform:translateY(var(--spacing-12)) }
.u-translate-y-16 { transform:translateY(4rem) }
.u-translate-y-20 { transform:translateY(5rem) }
.u-translate-y-24 { transform:translateY(6rem) }
.u-translate-y-32 { transform:translateY(8rem) }
.u-translate-y-1\/2 { transform:translateY(var(--radius-full)) }
.u-translate-y-full { transform:translateY(100%) }
.u--translate-y-px { transform:translateY(-1px) }
.u--translate-y-0\.5 { transform:translateY(-.125rem) }
.u--translate-y-1 { transform:translateY(calc(var(--spacing-1)*-1)) }
.u--translate-y-2 { transform:translateY(calc(var(--spacing-2)*-1)) }
.u--translate-y-3 { transform:translateY(calc(var(--spacing-3)*-1)) }
.u--translate-y-4 { transform:translateY(calc(var(--spacing-4)*-1)) }
.u--translate-y-5 { transform:translateY(calc(var(--spacing-5)*-1)) }
.u--translate-y-6 { transform:translateY(calc(var(--spacing-6)*-1)) }
.u--translate-y-8 { transform:translateY(calc(var(--spacing-8)*-1)) }
.u--translate-y-10 { transform:translateY(calc(var(--spacing-10)*-1)) }
.u--translate-y-12 { transform:translateY(calc(var(--spacing-12)*-1)) }
.u--translate-y-16 { transform:translateY(-4rem) }
.u--translate-y-20 { transform:translateY(-5rem) }
.u--translate-y-24 { transform:translateY(-6rem) }
.u--translate-y-32 { transform:translateY(-8rem) }
.u--translate-y-1\/2 { transform:translateY(-9999px) }
.u--translate-y-full { transform:translateY(-100%) }
.u-skew-x-0 { transform:skewX(0deg) }
.u-skew-x-1 { transform:skewX(1deg) }
.u-skew-x-2 { transform:skewX(2deg) }
.u-skew-x-3 { transform:skewX(3deg) }
.u-skew-x-6 { transform:skewX(6deg) }
.u-skew-x-12 { transform:skewX(12deg) }
.u--skew-x-1 { transform:skewX(-1deg) }
.u--skew-x-2 { transform:skewX(-2deg) }
.u--skew-x-3 { transform:skewX(-3deg) }
.u--skew-x-6 { transform:skewX(-6deg) }
.u--skew-x-12 { transform:skewX(-12deg) }
.u-skew-y-0 { transform:skewY(0deg) }
.u-skew-y-1 { transform:skewY(1deg) }
.u-skew-y-2 { transform:skewY(2deg) }
.u-skew-y-3 { transform:skewY(3deg) }
.u-skew-y-6 { transform:skewY(6deg) }
.u-skew-y-12 { transform:skewY(12deg) }
.u--skew-y-1 { transform:skewY(-1deg) }
.u--skew-y-2 { transform:skewY(-2deg) }
.u--skew-y-3 { transform:skewY(-3deg) }
.u--skew-y-6 { transform:skewY(-6deg) }
.u--skew-y-12 { transform:skewY(-12deg) }
.u-origin-center { transform-origin:center }
.u-origin-top { transform-origin:top }
.u-origin-top-right { transform-origin:top right }
.u-origin-right { transform-origin:right }
.u-origin-bottom-right { transform-origin:bottom right }
.u-origin-bottom { transform-origin:bottom }
.u-origin-bottom-left { transform-origin:bottom left }
.u-origin-left { transform-origin:left }
.u-origin-top-left { transform-origin:top left }
.u-transition-none { transition:none }
.u-transition-all { transition:all var(--duration-base) var(--ease-in-out) }
.u-transition { transition:background-color var(--duration-base) var(--ease-in-out),border-color var(--duration-base) var(--ease-in-out),color var(--duration-base) var(--ease-in-out),fill var(--duration-base) var(--ease-in-out),stroke var(--duration-base) var(--ease-in-out),opacity var(--duration-base) var(--ease-in-out),box-shadow var(--duration-base) var(--ease-in-out),transform var(--duration-base) var(--ease-in-out) }
.u-transition-colors { transition:background-color var(--duration-base) var(--ease-in-out),border-color var(--duration-base) var(--ease-in-out),color var(--duration-base) var(--ease-in-out),fill var(--duration-base) var(--ease-in-out),stroke var(--duration-base) var(--ease-in-out) }
.u-transition-opacity { transition:opacity var(--duration-base) var(--ease-in-out) }
.u-transition-shadow { transition:box-shadow var(--duration-base) var(--ease-in-out) }
.u-transition-transform { transition:transform var(--duration-base) var(--ease-in-out) }
.u-duration-instant { transition-duration:var(--duration-instant) }
.u-duration-fast { transition-duration:var(--duration-fast) }
.u-duration-base { transition-duration:var(--duration-base) }
.u-duration-moderate { transition-duration:var(--duration-moderate) }
.u-duration-slow { transition-duration:var(--duration-slow) }
.u-duration-slower { transition-duration:var(--duration-slower) }
.u-duration-slowest { transition-duration:var(--duration-slowest) }
.u-ease-linear { transition-timing-function:var(--ease-linear) }
.u-ease-in { transition-timing-function:var(--ease-in) }
.u-ease-out { transition-timing-function:var(--ease-out) }
.u-ease-in-out { transition-timing-function:var(--ease-in-out) }
.u-ease-bounce { transition-timing-function:var(--ease-bounce) }
.u-will-change-auto { will-change:auto }
.u-will-change-scroll { will-change:scroll-position }
.u-will-change-contents { will-change:contents }
.u-will-change-transform { will-change:transform }
.u-gpu-accelerated { transform:translateZ(0);backface-visibility:hidden;perspective:1000px }
.u-force-gpu { will-change:transform,opacity;transform:translateZ(0) }
.u-animate-optimized { will-change:transform,opacity,box-shadow;backface-visibility:hidden }
.u-animate-safe { transition:all var(--duration-medium) var(--ease-out) }
@media (prefers-reduced-motion:reduce) { .u-animate-safe { transition:none }
 }
.u-hover-lift { transition:transform var(--duration-fast) var(--ease-out) }
.u-hover-lift:hover { transform:translateY(-2px) translateZ(0) }
@media (prefers-reduced-motion:reduce) { .u-hover-lift:hover { transform:none }
 }
.u-glass { background:var(--glass-bg-dark);backdrop-filter:var(--backdrop-blur-medium);-webkit-backdrop-filter:var(--backdrop-blur-medium);border:1px solid var(--glass-border-subtle) }
.u-glass--light { background:var(--glass-bg-light) }
.u-glass--medium { background:var(--glass-bg-medium) }
.u-glow-brand { box-shadow:var(--shadow-glow-brand) }
.u-glow-success { box-shadow:var(--shadow-glow-success) }
.u-glow-warning { box-shadow:var(--shadow-glow-warning) }
.u-glow-danger { box-shadow:var(--shadow-glow-danger) }
.u-state-loading { animation:shimmer 2s infinite }
.u-loading { position:relative;opacity:70%;pointer-events:none }
.u-loading:after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--color-surface-elevated),transparent);animation:loading-sweep 1.5s infinite }
.u-shimmer { color:transparent;background:linear-gradient(90deg,var(--color-surface-elevated) 25%,var(--color-surface-hover) var(--radius-full),var(--color-surface-elevated) 75%);background-size:200% 100%;border-radius:var(--radius-sm);animation:shimmer 2s infinite }
.u-empty { color:var(--color-text-muted);font-style:italic;opacity:50% }
.u-hidden { display:none }
.u-visually-hidden { position:absolute;overflow:hidden;clip-path:inset(0);width:var(--spacing-px);margin:-1px;padding:0;white-space:nowrap;border:0 }
.u-disabled { opacity:40%;cursor:not-allowed;pointer-events:none }
.u-updated { position:relative;animation:flash-update var(--duration-medium) var(--ease-out) }
.u-highlight { background:var(--color-brand-primary-subtle);border-left:var(--spacing-0-75) solid var(--color-brand-primary);animation:highlight-fade 2s var(--ease-out) }
.u-success { color:var(--color-success-text);background:var(--color-success-subtle) }
.u-warning { color:var(--color-warning-text);background:var(--color-warning-subtle) }
.u-error { color:var(--color-danger-text);background:var(--color-danger-subtle) }
.u-fade-in { animation:fade-in var(--duration-medium) var(--ease-out) }
.u-slide-in-left { animation:slide-in-left var(--duration-medium) var(--ease-out) }
.u-pulse { animation:pulse 2s infinite }
.u-status--connected { color:var(--color-success) }
.u-status--disconnected { color:var(--color-warning) }
.u-status--error { color:var(--color-danger) }
.u-metric--empty { color:var(--color-text-muted);font-style:normal;opacity:50% }
.u-metric--positive { color:var(--color-success) }
.u-metric--negative { color:var(--color-danger) }
.u-metric--neutral { color:var(--color-text-secondary) }
.u-scrollbar { scrollbar-width:var(--scrollbar-width,thin);scrollbar-color:var(--scrollbar-thumb-color,var(--color-border-subtle)) var(--scrollbar-track-color,transparent);-ms-overflow-style:var(--scrollbar-ms-style,-ms-autohiding-scrollbar) }
.u-scrollbar::-webkit-scrollbar { width:var(--scrollbar-size,var(--spacing-2));height:var(--scrollbar-size,var(--spacing-2)) }
.u-scrollbar::-webkit-scrollbar-track { background:var(--scrollbar-track-color,transparent) }
.u-scrollbar::-webkit-scrollbar-thumb { background-color:var(--scrollbar-thumb-color,var(--color-border-subtle));background-clip:padding-box;border:var(--scrollbar-thumb-border-width,var(--spacing-0-5)) solid var(--scrollbar-thumb-border-color,transparent);border-radius:var(--scrollbar-thumb-radius,var(--radius-full)) }
.u-scrollbar::-webkit-scrollbar-thumb:hover { background-color:var(--scrollbar-thumb-hover-color,var(--color-border-default)) }
.u-scrollbar-thin { --scrollbar-width:thin;--scrollbar-size:var(--spacing-2) }
.u-scrollbar-none { --scrollbar-width:none;--scrollbar-ms-style:none }
.u-scrollbar-none::-webkit-scrollbar { display:none }
.u-line-clamp { display:-webkit-box;-webkit-line-clamp:var(--line-clamp,1);line-clamp:var(--line-clamp,1);-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis }
.u-line-clamp-1 { --line-clamp:1 }
.u-line-clamp-2 { --line-clamp:2 }
.u-line-clamp-3 { --line-clamp:3 }
.u-line-clamp-4 { --line-clamp:4 }
.u-line-clamp-none { display:block;-webkit-line-clamp:initial;line-clamp:none;-webkit-box-orient:initial;overflow:visible;text-overflow:clip }
.u-hyphens-auto { hyphens:auto }
.u-hyphens-manual { hyphens:manual }
.u-hyphens-none { hyphens:none }
.u-min-width-fit { min-width:fit-content }
.u-max-width-max { max-width:max-content }
.u-width-fit { width:fit-content }
.u-width-max { width:max-content }
.u-width-min { width:min-content }
.u-min-height-0,.u-min-height-auto { min-height:0 }
html[data-density=compact] { --spacing-base:var(--spacing-3);--spacing-card:var(--spacing-4);--text-size-base:var(--text-sm);--spacing-xs:var(--spacing-1);--spacing-sm:var(--spacing-2);--spacing-md:var(--spacing-3);--spacing-lg:var(--spacing-4);--spacing-xl:var(--spacing-5) }
html[data-density=compact] .sg-card { margin-bottom:var(--spacing-sm);padding:var(--spacing-card) }
html[data-density=compact] .sg-card__header { margin-bottom:var(--spacing-xs);padding-bottom:var(--spacing-xs) }
html[data-density=compact] .sg-card__body { padding:var(--spacing-xs) 0 }
html[data-density=compact] .sg-card__footer { margin-top:var(--spacing-xs);padding-top:var(--spacing-xs) }
html[data-density=compact] [role=button],html[data-density=compact] a.sg-btn,html[data-density=compact] button,html[data-density=compact] input[type=checkbox],html[data-density=compact] input[type=radio] { min-width:var(--touch-target-min);min-height:var(--touch-target-min) }
html[data-density=compact] input[type=checkbox],html[data-density=compact] input[type=radio] { position:relative;margin:-12px;padding:var(--spacing-3) }
html[data-density=compact] .sg-input,html[data-density=compact] .sg-select,html[data-density=compact] .sg-textarea { min-height:var(--touch-target-min);padding:var(--spacing-xs) var(--spacing-sm) }
html[data-density=compact] .sg-table td,html[data-density=compact] .sg-table th { padding:var(--spacing-xs) var(--spacing-sm) }
html[data-density=compact] .sg-modal__content { padding:var(--spacing-md) }
html[data-density=comfortable] { --spacing-base:var(--spacing-4);--spacing-card:var(--spacing-6);--text-size-base:var(--spacing-4);--spacing-xs:var(--spacing-2);--spacing-sm:var(--spacing-3);--spacing-md:var(--spacing-4);--spacing-lg:var(--spacing-6);--spacing-xl:var(--spacing-8) }
html[data-density] * { transition:padding .2s ease,margin .2s ease }
.sg-hidden { display:none }
.sg-block { display:block }
.sg-inline-block { display:inline-block }
.sg-inline { display:inline }
.sg-flex { display:flex }
.sg-inline-flex { display:inline-flex }
.sg-grid { display:grid }
.sg-flex-row { flex-direction:row }
.sg-flex-col { flex-direction:column }
.sg-flex-wrap { flex-wrap:wrap }
.sg-flex-nowrap { flex-wrap:nowrap }
.sg-items-start { align-items:flex-start }
.sg-items-center { align-items:center }
.sg-items-end { align-items:flex-end }
.sg-justify-start { justify-content:flex-start }
.sg-justify-center { justify-content:center }
.sg-justify-end { justify-content:flex-end }
.sg-justify-between { justify-content:space-between }
.sg-justify-around { justify-content:space-around }
.sg-flex-1 { flex:1 }
.sg-flex-auto { flex:auto }
.sg-flex-none { flex:none }
.sg-gap-xs { gap:var(--spacing-1) }
.sg-gap-sm { gap:var(--spacing-2) }
.sg-gap-md { gap:var(--spacing-4) }
.sg-gap-lg { gap:var(--spacing-6) }
.sg-gap-xl { gap:var(--spacing-8) }
.sg-m-0 { margin:var(--spacing-0) }
.sg-m-xs { margin:var(--spacing-1) }
.sg-m-sm { margin:var(--spacing-2) }
.sg-m-md { margin:var(--spacing-4) }
.sg-m-lg { margin:var(--spacing-6) }
.sg-m-xl { margin:var(--spacing-8) }
.sg-m-auto { margin:auto }
.sg-mt-0 { margin-top:var(--spacing-0) }
.sg-mt-xs { margin-top:var(--spacing-1) }
.sg-mt-sm { margin-top:var(--spacing-2) }
.sg-mt-md { margin-top:var(--spacing-4) }
.sg-mt-lg { margin-top:var(--spacing-6) }
.sg-mt-xl { margin-top:var(--spacing-8) }
.sg-mt-auto { margin-top:auto }
.sg-mr-0 { margin-right:var(--spacing-0) }
.sg-mr-xs { margin-right:var(--spacing-1) }
.sg-mr-sm { margin-right:var(--spacing-2) }
.sg-mr-md { margin-right:var(--spacing-4) }
.sg-mr-lg { margin-right:var(--spacing-6) }
.sg-mr-xl { margin-right:var(--spacing-8) }
.sg-mr-auto { margin-right:auto }
.sg-mb-0 { margin-bottom:var(--spacing-0) }
.sg-mb-xs { margin-bottom:var(--spacing-1) }
.sg-mb-sm { margin-bottom:var(--spacing-2) }
.sg-mb-md { margin-bottom:var(--spacing-4) }
.sg-mb-lg { margin-bottom:var(--spacing-6) }
.sg-mb-xl { margin-bottom:var(--spacing-8) }
.sg-mb-auto { margin-bottom:auto }
.sg-ml-0 { margin-left:var(--spacing-0) }
.sg-ml-xs { margin-left:var(--spacing-1) }
.sg-ml-sm { margin-left:var(--spacing-2) }
.sg-ml-md { margin-left:var(--spacing-4) }
.sg-ml-lg { margin-left:var(--spacing-6) }
.sg-ml-xl { margin-left:var(--spacing-8) }
.sg-ml-auto { margin-left:auto }
.sg-mx-0 { margin-right:var(--spacing-0);margin-left:var(--spacing-0) }
.sg-mx-xs { margin-right:var(--spacing-1);margin-left:var(--spacing-1) }
.sg-mx-sm { margin-right:var(--spacing-2);margin-left:var(--spacing-2) }
.sg-mx-md { margin-right:var(--spacing-4);margin-left:var(--spacing-4) }
.sg-mx-lg { margin-right:var(--spacing-6);margin-left:var(--spacing-6) }
.sg-mx-xl { margin-right:var(--spacing-8);margin-left:var(--spacing-8) }
.sg-mx-auto { margin-right:auto;margin-left:auto }
.sg-my-0 { margin-top:var(--spacing-0);margin-bottom:var(--spacing-0) }
.sg-my-xs { margin-top:var(--spacing-1);margin-bottom:var(--spacing-1) }
.sg-my-sm { margin-top:var(--spacing-2);margin-bottom:var(--spacing-2) }
.sg-my-md { margin-top:var(--spacing-4);margin-bottom:var(--spacing-4) }
.sg-my-lg { margin-top:var(--spacing-6);margin-bottom:var(--spacing-6) }
.sg-my-xl { margin-top:var(--spacing-8);margin-bottom:var(--spacing-8) }
.sg-my-auto { margin-top:auto;margin-bottom:auto }
.sg-p-0 { padding:var(--spacing-0) }
.sg-p-xs { padding:var(--spacing-1) }
.sg-p-sm { padding:var(--spacing-2) }
.sg-p-md { padding:var(--spacing-4) }
.sg-p-lg { padding:var(--spacing-6) }
.sg-p-xl { padding:var(--spacing-8) }
.sg-pt-0 { padding-top:var(--spacing-0) }
.sg-pt-xs { padding-top:var(--spacing-1) }
.sg-pt-sm { padding-top:var(--spacing-2) }
.sg-pt-md { padding-top:var(--spacing-4) }
.sg-pt-lg { padding-top:var(--spacing-6) }
.sg-pt-xl { padding-top:var(--spacing-8) }
.sg-pr-0 { padding-right:var(--spacing-0) }
.sg-pr-xs { padding-right:var(--spacing-1) }
.sg-pr-sm { padding-right:var(--spacing-2) }
.sg-pr-md { padding-right:var(--spacing-4) }
.sg-pr-lg { padding-right:var(--spacing-6) }
.sg-pr-xl { padding-right:var(--spacing-8) }
.sg-pb-0 { padding-bottom:var(--spacing-0) }
.sg-pb-xs { padding-bottom:var(--spacing-1) }
.sg-pb-sm { padding-bottom:var(--spacing-2) }
.sg-pb-md { padding-bottom:var(--spacing-4) }
.sg-pb-lg { padding-bottom:var(--spacing-6) }
.sg-pb-xl { padding-bottom:var(--spacing-8) }
.sg-pl-0 { padding-left:var(--spacing-0) }
.sg-pl-xs { padding-left:var(--spacing-1) }
.sg-pl-sm { padding-left:var(--spacing-2) }
.sg-pl-md { padding-left:var(--spacing-4) }
.sg-pl-lg { padding-left:var(--spacing-6) }
.sg-pl-xl { padding-left:var(--spacing-8) }
.sg-px-0 { padding-right:var(--spacing-0);padding-left:var(--spacing-0) }
.sg-px-xs { padding-right:var(--spacing-1);padding-left:var(--spacing-1) }
.sg-px-sm { padding-right:var(--spacing-2);padding-left:var(--spacing-2) }
.sg-px-md { padding-right:var(--spacing-4);padding-left:var(--spacing-4) }
.sg-px-lg { padding-right:var(--spacing-6);padding-left:var(--spacing-6) }
.sg-px-xl { padding-right:var(--spacing-8);padding-left:var(--spacing-8) }
.sg-py-0 { padding-top:var(--spacing-0);padding-bottom:var(--spacing-0) }
.sg-py-xs { padding-top:var(--spacing-1);padding-bottom:var(--spacing-1) }
.sg-py-sm { padding-top:var(--spacing-2);padding-bottom:var(--spacing-2) }
.sg-py-md { padding-top:var(--spacing-4);padding-bottom:var(--spacing-4) }
.sg-py-lg { padding-top:var(--spacing-6);padding-bottom:var(--spacing-6) }
.sg-py-xl { padding-top:var(--spacing-8);padding-bottom:var(--spacing-8) }
.sg-text-left { text-align:left }
.sg-text-center { text-align:center }
.sg-text-right { text-align:right }
.sg-text-justify { text-align:justify }
.sg-text-xs { font-size:var(--text-xs) }
.sg-text-sm { font-size:var(--text-sm) }
.sg-text-base { font-size:var(--text-base) }
.sg-text-lg { font-size:var(--text-lg) }
.sg-text-xl { font-size:var(--text-xl) }
.sg-text-2xl { font-size:var(--text-2xl) }
.sg-text-3xl { font-size:var(--text-3xl) }
.sg-font-normal { font-weight:400 }
.sg-font-medium { font-weight:500 }
.sg-font-semibold { font-weight:600 }
.sg-font-bold { font-weight:700 }
.sg-text-primary { color:var(--color-text-primary) }
.sg-text-secondary { color:var(--color-text-secondary) }
.sg-text-muted { color:var(--color-text-muted) }
.sg-text-accent { color:var(--color-brand-primary) }
.sg-text-success { color:var(--color-success) }
.sg-text-warning { color:var(--color-warning) }
.sg-text-error { color:var(--color-danger) }
.sg-text-info { color:var(--color-info) }
.sg-bg-background,.sg-bg-surface { background:var(--color-surface-base) }
.sg-bg-surface-elevated { background:var(--color-surface-elevated) }
.sg-bg-accent { background:var(--color-brand-primary) }
.sg-bg-accent-muted { background:var(--color-brand-primary-subtle) }
.sg-border { border:var(--spacing-px) solid var(--color-border-default) }
.sg-border-t { border-top:var(--spacing-px) solid var(--color-border-default) }
.sg-border-r { border-right:var(--spacing-px) solid var(--color-border-default) }
.sg-border-b { border-bottom:var(--spacing-px) solid var(--color-border-default) }
.sg-border-l { border-left:var(--spacing-px) solid var(--color-border-default) }
.sg-border-0 { border:0 }
.sg-rounded-none { border-radius:0 }
.sg-rounded-sm { border-radius:var(--radius-sm) }
.sg-rounded-md { border-radius:var(--radius-md) }
.sg-rounded-lg { border-radius:var(--radius-lg) }
.sg-rounded-xl { border-radius:var(--radius-xl) }
.sg-rounded-full { border-radius:var(--radius-full) }
.sg-w-full { width:100% }
.sg-w-auto { width:auto }
.sg-w-screen { width:100vw }
.sg-max-w-full { max-width:100% }
.sg-max-w-screen { max-width:100vw }
.sg-min-w-0 { min-width:0 }
.sg-h-full { height:100% }
.sg-h-auto { height:auto }
.sg-h-screen { height:100vh }
.sg-max-h-full { max-height:100% }
.sg-max-h-screen { max-height:100vh }
.sg-min-h-0 { min-height:0 }
.sg-relative { position:relative }
.sg-absolute { position:absolute }
.sg-fixed { position:fixed }
.sg-sticky { position:sticky }
.sg-static { position:static }
.sg-z-dropdown { z-index:var(--z-dropdown) }
.sg-z-modal { z-index:var(--z-modal) }
.sg-z-toast { z-index:var(--z-toast) }
.sg-z-tooltip { z-index:var(--z-tooltip) }
.sg-overflow-auto { overflow:auto }
.sg-overflow-hidden { overflow:hidden }
.sg-overflow-visible { overflow:visible }
.sg-overflow-scroll { overflow:scroll }
.sg-overflow-x-auto { overflow-x:auto }
.sg-overflow-y-auto { overflow-y:auto }
.sg-shadow-sm { box-shadow:var(--shadow-sm) }
.sg-shadow-md { box-shadow:var(--shadow-md) }
.sg-shadow-lg { box-shadow:var(--shadow-lg) }
.sg-shadow-xl { box-shadow:var(--shadow-xl) }
.sg-shadow-none { box-shadow:none }
.sg-opacity-0 { opacity:0 }
.sg-opacity-25 { opacity:25% }
.sg-opacity-50 { opacity:50% }
.sg-opacity-75 { opacity:75% }
.sg-opacity-100 { opacity:100% }
.sg-cursor-auto { cursor:auto }
.sg-cursor-pointer { cursor:pointer }
.sg-cursor-not-allowed { cursor:not-allowed }
.sg-cursor-wait { cursor:wait }
.sg-transition-fast { transition:all var(--duration-fast) var(--ease-ease) }
.sg-transition-normal { transition:all var(--duration-base) var(--ease-ease) }
.sg-transition-slow { transition:all var(--duration-medium) var(--ease-ease) }
.sg-transition-none { transition:none }
.sg-sr-only { position:absolute;overflow:hidden;clip-path:inset(0);width:var(--spacing-px);height:var(--spacing-px);margin:-1px;padding:var(--spacing-0);white-space:nowrap;border-width:0 }
@media (prefers-reduced-motion:reduce) {  { transition-duration:.01ms;animation-duration:.01ms;animation-iteration-count:1 }
 }
:root { --duration-instant:100ms;--duration-fast:200ms;--duration-normal:300ms;--duration-slow:500ms;--duration-deliberate:800ms;--ease-out:cubic-bezier(0,0,0.2,1);--ease-in:cubic-bezier(0.4,0,1,1);--ease-in-out:cubic-bezier(0.4,0,0.2,1);--ease-spring:cubic-bezier(0.175,0.885,0.32,1.275);--ease-standard:cubic-bezier(0.4,0,0.2,1);--shadow-sm:0 var(--spacing-px) var(--spacing-0-5) 0 var(--alpha-black-5);--shadow-md:0 var(--spacing-1) var(--spacing-1-5) -var(--spacing-px) var(--alpha-black-10),0 var(--spacing-0-5) var(--spacing-1) -var(--spacing-px) var(--alpha-black-5);--shadow-lg:0 var(--spacing-2-5) var(--spacing-1-25) calc(var(--spacing-0-75)*-1) var(--alpha-black-10),0 var(--spacing-1) var(--spacing-1-5) -var(--spacing-0-5) var(--alpha-black-5);--shadow-xl:0 var(--spacing-5) var(--spacing-1-25) calc(var(--spacing-1-25)*-1) var(--alpha-black-10),0 var(--spacing-2-5) var(--spacing-2-5) calc(var(--spacing-1-25)*-1) var(--alpha-black-5);--animation-duration-multiplier:1 }
.btn { position:relative;transition:all var(--duration-fast) var(--ease-out);transform-style:preserve-3d;backface-visibility:hidden }
.btn:hover { box-shadow:var(--shadow-lg);transform:translateY(-2px) }
.btn:active { box-shadow:var(--shadow-sm);transform:translateY(0);transition-duration:var(--duration-instant) }
.btn.ripple { overflow:hidden }
.btn.ripple:before { position:absolute;top:var(--radius-full);left:var(--radius-full);width:0;height:0;background:var(--overlay-medium);border-radius:var(--radius-full);transform:translate(-9999px,-9999px);transition:width var(--duration-slow) var(--ease-out) height var(--duration-slow) var(--ease-out);content:"" }
.btn--ripple-active:before { width:var(--col-width-extra-wide);height:var(--col-width-extra-wide) }
.btn.glow { position:relative;z-index:var(--z-index-base) }
.btn.glow:after { position:absolute;inset:calc(var(--spacing-0-5)*-1);z-index:-1;background:linear-gradient(45deg,var(--color-success),var(--color-info),var(--color-brand-primary),var(--color-danger));background-size:400% 400%;border-radius:inherit;opacity:0;transition:opacity var(--duration-normal) var(--ease-out);animation:glow-animation 3s var(--ease-in-out) infinite;content:"" }
.btn--glow-hover:after { opacity:60% }
.card { transform-origin:center;transition:all var(--duration-normal) var(--ease-out);transform-style:preserve-3d }
.card.tilt { will-change:transform }
.card.tilt:hover { transform:perspective(1000px) rotateX(var(--rotate-x,0)) rotateY(var(--rotate-y,0)) }
.card:hover { box-shadow:var(--shadow-xl);transform:translateY(-4px) }
.card .card-overlay { position:absolute;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);background:linear-gradient(to bottom,transparent 0,var(--overlay-dark) 100%);opacity:0;transition:opacity var(--duration-normal) var(--ease-out) }
.card:hover .card-overlay { opacity:100% }
.card .card-content { opacity:0;transform:translateY(20px);transition:all var(--duration-normal) var(--ease-out) }
.card:hover .card-content { opacity:100%;transform:translateY(0) }
.form-input { position:relative;background-clip:padding-box;border:var(--spacing-0-5) solid transparent;transition:all var(--duration-fast) var(--ease-out) }
.form-input:focus { border-color:var(--blue-500);outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-info-subtle) }
.form-group { position:relative }
.form-label { position:absolute;top:var(--radius-full);left:var(--spacing-3);color:var(--gray-500);transform:translateY(-9999px);transition:all var(--duration-fast) var(--ease-out);pointer-events:none }
.form-input:focus~.form-label,.form-input:not(:placeholder-shown)~.form-label { top:calc(var(--spacing-2)*-1);left:var(--spacing-2);padding:var(--spacing-0) var(--spacing-1);color:var(--blue-500);font-size:var(--spacing-3);background:var(--color-neutral-0) }
.checkbox,.radio { position:relative;display:inline-block;width:var(--spacing-5);height:var(--spacing-5) }
.checkbox input,.radio input { position:absolute;opacity:0 }
.checkbox .checkmark,.radio .checkmark { position:absolute;top:var(--spacing-0);left:var(--spacing-0);width:var(--spacing-5);height:var(--spacing-5);border:var(--spacing-0-5) solid var(--gray-300);transition:all var(--duration-fast) var(--ease-out) }
.radio .checkmark { border-radius:var(--radius-full) }
.checkmark--checked { background:var(--blue-500);border-color:var(--blue-500);animation:check-bounce var(--duration-normal) var(--ease-spring) }
.checkbox .checkmark:after { position:absolute;top:var(--spacing-0-5);left:var(--spacing-1-5);width:var(--spacing-1-25);height:var(--spacing-2-5);border:solid var(--color-neutral-0);border-width:0 var(--spacing-0-5) var(--spacing-0-5) 0;transform:rotate(45deg) scale(0);transition:transform var(--duration-fast) var(--ease-spring);content:"" }
.radio .checkmark:after { position:absolute;top:var(--radius-full);left:var(--radius-full);width:var(--spacing-2);height:var(--spacing-2);background:var(--color-neutral-0);border-radius:var(--radius-full);transform:translate(-9999px,-9999px) scale(0);transition:transform var(--duration-fast) var(--ease-spring);content:"" }
.checkmark--checkbox-checked:after { transform:rotate(45deg) scale(1) }
.checkmark--radio-checked:after { transform:translate(-9999px,-9999px) scale(1) }
.skeleton { position:relative;overflow:hidden;background:var(--gray-200) }
.skeleton:after { position:absolute;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);background:linear-gradient(90deg,transparent 0,var(--alpha-white-30) var(--radius-full),transparent 100%);animation:shimmer 1.5s infinite;content:"" }
.spinner { width:var(--spacing-10);height:var(--spacing-10);border:var(--spacing-0-75) solid var(--gray-200);border-top-color:var(--blue-500);border-radius:var(--radius-full);animation:spin .8s linear infinite }
.dots-loader { display:inline-flex;gap:var(--spacing-1) }
.dots-loader span { width:var(--spacing-2);height:var(--spacing-2);background:var(--blue-500);border-radius:var(--radius-full);animation:dot-pulse 1.4s ease-in-out infinite both }
.dots-loader span:first-child { animation-delay:-.32s }
.dots-loader span:nth-child(2) { animation-delay:-.16s }
.error-icon,.success-icon { position:relative;display:inline-block;width:var(--nav-height);height:var(--nav-height) }
.success-icon:after { position:absolute;top:var(--spacing-2-5);left:var(--spacing-4-5);width:var(--spacing-1-25);height:var(--spacing-7-5);border:solid var(--green-500);border-width:0 var(--spacing-1) var(--spacing-1) 0;transform:rotate(45deg) scale(0);animation:success-check var(--duration-normal) var(--ease-spring) forwards;content:"" }
.error-icon:after,.error-icon:before { position:absolute;top:var(--spacing-2-5);left:var(--spacing-7);width:var(--spacing-1);height:var(--spacing-10);background:var(--red-500);transform:scale(0);content:"" }
.error-icon:before { transform:rotate(45deg) scale(0);animation:error-line1 var(--duration-fast) var(--ease-out) forwards }
.error-icon:after { transform:rotate(-45deg) scale(0);animation:error-line2 var(--duration-fast) var(--ease-out) .1s forwards }
.focus-ring:focus { outline:none;box-shadow:0 0 0 var(--spacing-0-75) var(--color-info-subtle);animation:focus-pulse 2s infinite }
.scale-hover { transition:transform var(--duration-fast) var(--ease-out) }
.scale-hover:hover { transform:scale(1.05) }
.rotate-hover { transition:transform var(--duration-normal) var(--ease-spring) }
.rotate-hover:hover { transform:rotate(5deg) }
.depress:active { transform:scale(.95);transition-duration:var(--duration-instant) }
.glass { background:var(--alpha-var(--color-neutral-0)-10);backdrop-filter:blur(var(--spacing-2-5));border:var(--spacing-px) solid var(--alpha-var(--color-neutral-0)-20);transition:all var(--duration-normal) var(--ease-out) }
.glass:hover { background:var(--alpha-var(--color-neutral-0)-10);border-color:var(--alpha-var(--color-neutral-0)-30);box-shadow:0 var(--spacing-2) var(--spacing-8) 0 var(--alpha-var(--color-neutral-900)-30) }
.gradient-shift { background:linear-gradient(-45deg,var(--color-danger),var(--color-brand-primary),var(--color-info),var(--color-success));background-size:400% 400%;animation:gradient-shift 15s ease infinite }
[data-animate] { opacity:0 }
[data-animate].animated { opacity:100% }
[data-stagger-item] { opacity:0;transform:translateY(20px) }
[data-stagger-item].animated { opacity:100%;transform:translateY(0) }
@media screen and (max-width:768px) { .u-mobile-metric-card { margin-bottom:var(--spacing-2);padding:clamp(var(--spacing-4),4vw,var(--spacing-5));text-align:center }
.u-mobile-metric-card__icon { margin-bottom:var(--spacing-2);font-size:clamp(var(--spacing-6),6vw,var(--spacing-8)) }
.u-mobile-action-button { display:flex;justify-content:center;align-items:center;gap:var(--spacing-2);width:100%;min-height:var(--touch-target-min);padding:clamp(var(--spacing-3),3vw,var(--spacing-4));border-radius:clamp(var(--spacing-2),2vw,var(--spacing-3)) }
.u-mobile-email-item { padding:var(--spacing-3);touch-action:manipulation }
.u-mobile-email-item__from { flex-direction:column;align-items:flex-start }
.u-mobile-email-item__tags { flex-wrap:wrap;gap:var(--spacing-1-5) }
.u-mobile-stat-card { padding:var(--spacing-3) }
.u-mobile-classification-modal,.u-mobile-modal__overlay { padding:var(--spacing-4) }
.u-mobile-classification-modal__content,.u-mobile-modal__content { width:95%;max-height:90vh;padding:var(--spacing-6) var(--spacing-5) }
.u-mobile-form__range,.u-mobile-form__select { padding:var(--spacing-3) }
.u-mobile-toast { right:var(--spacing-4);bottom:var(--spacing-4);left:var(--spacing-4);max-width:calc(100% - var(--spacing-8)) }
.u-mobile-table { display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch }
.u-mobile-activity-section,.u-mobile-quick-actions { padding:var(--spacing-5) var(--spacing-1-5) }
.u-mobile-analysis-card { padding:var(--spacing-3) }
.u-mobile-empty-state { padding:var(--spacing-8) var(--spacing-1-5) }
.u-mobile-empty-state svg { width:var(--size-touch-comfortable);height:var(--size-touch-comfortable) }
.u-mobile-loading { height:var(--col-width-narrow) }
.u-mobile-spinner { width:var(--text-2xl);height:var(--text-2xl) }
.u-mobile-card { margin-bottom:var(--spacing-3);padding:var(--spacing-3) }
 }
@media screen and (max-width:640px) { .u-mobile-email-item { padding:clamp(var(--spacing-2),2vw,var(--spacing-3)) }
.u-mobile-email-item__preview { display:none }
.u-mobile-email-item { display:flex;align-items:center;min-height:var(--touch-target-min) }
.u-mobile-classification-modal__content,.u-mobile-modal__content { padding:var(--spacing-5) var(--spacing-1-5) }
.u-mobile-email-item__tag { padding:var(--spacing-0-5) var(--spacing-1-5) }
.u-mobile-setup-option { padding:var(--spacing-4) }
.u-mobile-action-button { min-height:var(--touch-target-min);padding:clamp(var(--spacing-2-5),2.5vw,var(--spacing-3-5)) }
 }
@media (hover:none) and (pointer:coarse) { .u-mobile-action-button,.u-mobile-btn,.u-mobile-email-item,.u-mobile-guide-btn,.u-mobile-metric-card { min-height:var(--touch-target-min);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation }
.u-mobile-action-button,.u-mobile-guide-btn,.u-mobile-metric-card { -webkit-user-select:none;user-select:none }
.u-mobile-action-button:hover,.u-mobile-email-item:hover,.u-mobile-metric-card:hover { box-shadow:var(--shadow-sm);transform:none }
.u-mobile-scale-hover:hover { transform:none }
.u-mobile-action-button:active,.u-mobile-btn:active,.u-mobile-metric-card:active { opacity:80%;transform:scale(.95);transition:var(--duration-instant) ease }
.u-mobile-dashboard-main,.u-mobile-widget-container { -webkit-overflow-scrolling:touch }
 }
@media screen and (min-resolution:192dpi) { .u-mobile-email-item { border-bottom:var(--spacing-px) solid var(--color-neutral-200) }
.u-mobile-email-detail,.u-mobile-modal__content { box-shadow:var(--shadow-xl) }
 }
@media screen and (max-width:768px) and (prefers-color-scheme:dark) { .u-mobile-dashboard-header { border-bottom:var(--spacing-px) solid var(--alpha-white-10) }
 }
@media screen and (max-width:768px) and (prefers-contrast:more) { .u-mobile-action-button,.u-mobile-metric-card { border:var(--spacing-0-5) solid }
 }
@media (max-width:767px) { .u-mobile-btn { min-width:var(--touch-target-min);min-height:var(--touch-target-min) }
 }
@media screen and (max-width:768px) { .u-mobile-action-button:focus-visible,.u-mobile-btn:focus-visible { outline:var(--spacing-0-5) solid var(--color-brand-primary);outline-offset:var(--spacing-0-5) }
 }
.u-mobile-hamburger-menu { position:relative;display:none;width:var(--text-2xl);height:var(--text-2xl);padding:var(--spacing-0);background:none;border:none;cursor:pointer }
.u-mobile-hamburger-menu__line { position:absolute;display:block;width:100%;height:var(--spacing-px);background-color:var(--color-neutral-700);transition:all .3s ease }
.u-mobile-hamburger-menu__line:first-child { top:var(--spacing-1-5) }
.u-mobile-hamburger-menu__line:nth-child(2) { top:var(--spacing-2-5) }
.u-mobile-hamburger-menu__line:nth-child(3) { top:var(--spacing-4) }
.u-mobile-hamburger-menu--active .u-mobile-hamburger-menu__line:first-child { top:var(--spacing-2-5);transform:rotate(45deg) }
.u-mobile-hamburger-menu--active .u-mobile-hamburger-menu__line:nth-child(2) { opacity:0 }
.u-mobile-hamburger-menu--active .u-mobile-hamburger-menu__line:last-child { top:var(--spacing-2-5);transform:rotate(-45deg) }
.u-tooltip-container { position:fixed;top:var(--spacing-0);left:var(--spacing-0);z-index:var(--z-index-modal);pointer-events:none }
.u-tooltip { position:absolute;max-width:var(--card-min-width-sm);padding:var(--spacing-0);color:var(--white);background:var(--color-neutral-800);border-radius:var(--spacing-2);box-shadow:0 var(--spacing-1) var(--spacing-3) var(--alpha-black-15),0 0 0 var(--spacing-px) var(--alpha-white-10);opacity:0;transform:translateY(var(--spacing-1));transition:all .2s cubic-bezier(.4,0,.2,1);pointer-events:auto }
.u-tooltip.u-visible { opacity:100%;transform:translateY(0) }
.u-tooltip-arrow { position:absolute;width:var(--spacing-2-5);height:var(--spacing-2-5);background:var(--color-neutral-800);border:var(--spacing-px) solid var(--alpha-white-10);transform:rotate(45deg) }
.u-tooltip.u-top .u-tooltip-arrow { bottom:calc(var(--spacing-1-5)*-1);border-top:none;border-left:none }
.u-tooltip.u-bottom .u-tooltip-arrow { top:calc(var(--spacing-1-5)*-1);border-right:none;border-bottom:none }
.u-tooltip-content { position:relative;z-index:var(--z-index-base);padding:var(--spacing-3) var(--spacing-1-5);background:var(--color-neutral-800);border-radius:var(--spacing-2) }
.u-tooltip-title { display:flex;align-items:center;gap:var(--spacing-1-5);margin-bottom:var(--spacing-1);color:var(--color-border-default);font-size:var(--spacing-3-5);font-weight:600 }
.u-tooltip-text { margin-bottom:var(--spacing-1);color:var(--color-neutral-300);font-size:var(--spacing-0-75);line-height:1.5 }
.u-tooltip-extra { margin-top:var(--spacing-2);padding-top:var(--spacing-2);font-size:var(--spacing-3);border-top:var(--spacing-px) solid var(--alpha-white-10) }
.u-tooltip-rule { display:flex;align-items:center;gap:var(--spacing-1-5);color:var(--amber-400) }
.u-tooltip-rule i { font-size:var(--spacing-3) }
.u-tooltip-shortcut { color:var(--green-500);font-style:italic }
.u-tooltip[data-type=warning] .u-tooltip-content { border-left:var(--spacing-1) solid var(--amber-500) }
.u-tooltip[data-type=error] .u-tooltip-content { border-left:var(--spacing-1) solid var(--red-500) }
.u-tooltip[data-type=success] .u-tooltip-content { border-left:var(--spacing-1) solid var(--green-500) }
@media screen and (max-width:768px) { .u-tooltip { max-width:var(--col-width-medium) }
.u-tooltip-content { padding:var(--spacing-2-5) var(--spacing-3-5) }
.u-tooltip-title { font-size:var(--spacing-0-75) }
.u-tooltip-text { font-size:var(--spacing-3) }
 }
@media (prefers-color-scheme:dark) { .u-tooltip-arrow,.u-tooltip { background:var(--color-neutral-900) }
 }
.u-tooltip.u-highlight { animation:tooltip-pulse 2s ease-in-out }
.u-text-aaa-primary { color:var(--text-aaa-primary) }
.u-text-aaa-secondary { color:var(--text-aaa-secondary) }
.u-text-aaa-tertiary { color:var(--text-aaa-tertiary) }
.u-focus-visible:focus-visible { outline:var(--focus-thickness) solid var(--focus-aaa-outline);outline-offset:var(--focus-offset);box-shadow:0 0 0 var(--spacing-1) var(--focus-aaa-shadow) }
:focus-visible { outline:var(--focus-thickness) solid var(--focus-aaa-outline);outline-offset:var(--focus-offset);box-shadow:0 0 0 var(--spacing-1) var(--focus-aaa-shadow) }
.u-touch-target { position:relative;min-width:var(--touch-target-min);min-height:var(--touch-target-min) }
.u-touch-target-comfortable { min-width:var(--touch-target-comfortable);min-height:var(--touch-target-comfortable) }
.u-sr-only,.u-visually-hidden { position:absolute;overflow:hidden;clip-path:inset(50%);width:1px;height:1px;margin:-1px;padding:0;white-space:nowrap;border:0 }
.u-sr-only-focusable:focus { position:static;overflow:visible;clip-path:none;width:auto;height:auto;margin:inherit;padding:inherit;white-space:normal }
.u-skip-link { position:absolute;top:-40px;left:0;z-index:100;padding:var(--spacing-2) var(--spacing-4);color:var(--color-neutral-0);text-decoration:none;background:var(--color-neutral-950) }
.u-skip-link:focus { top:0 }
@media (prefers-contrast:more) {  { border-width:var(--spacing-0-5)!important }
.action-button,[role=button],button { border:var(--spacing-0-5) solid!important }
a { text-decoration:underline!important;text-decoration-thickness:var(--spacing-0-5)!important }
 }
@media (prefers-reduced-motion:reduce) { ,:after,:before { transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important }
 }
@media (min-width:0) { html { font-size:clamp(14px,2.5vw,18px) }
 }
.u-aria-live { position:absolute;left:-10000px;overflow:hidden;width:1px;height:1px }
.u-focus-trap { position:relative }
.u-focus-trap:focus-within { z-index:var(--z-index-modal) }
.u-keyboard-only:not(:focus-visible) { outline:none }
.u-keyboard-only:focus-visible { outline:var(--focus-thickness) solid var(--focus-aaa-outline);outline-offset:var(--focus-offset) }
.u-error-message,[role=alert] { color:var(--color-danger);font-weight:var(--font-weight-semibold) }
[aria-busy=true] { opacity:70%;cursor:wait;pointer-events:none }
.u-disabled,[aria-disabled=true],[disabled] { opacity:50%;cursor:not-allowed;pointer-events:none }
.u-readable { line-height:1.6;letter-spacing:.02em;word-spacing:.1em }
.u-colorblind-safe { position:relative }
.u-colorblind-safe:after { position:absolute;top:50%;left:50%;font-size:var(--text-xs);font-weight:var(--font-weight-bold);transform:translate(-50%,-50%);content:attr(data-label);pointer-events:none }
.u-progress-bar { overflow:hidden;width:100%;height:var(--spacing-2);background:var(--color-surface-secondary);border-radius:var(--radius-full) }
.u-progress-fill { height:100%;background:var(--color-brand-primary);transition:width var(--transition-base) }
.u-connection-status { display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-1) var(--spacing-3);font-size:var(--text-sm);background:var(--color-surface-secondary);border-radius:var(--radius-full) }
.u-connection-status:before { content:"";width:var(--spacing-2);height:var(--spacing-2);background:var(--color-success);border-radius:var(--radius-full);animation:pulse 2s infinite }
.u-connection-status--disconnected:before { background:var(--color-danger);animation:none }
.u-stat-card { padding:var(--spacing-4);background:var(--color-surface-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);transition:var(--transition-base) }
.u-stat-card:hover { box-shadow:var(--shadow-md);transform:translateY(-2px) }
.u-stat-label { color:var(--color-text-muted);font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase }
.u-stat-value { margin-top:var(--spacing-2);color:var(--color-text-primary);font-size:var(--text-3xl);font-weight:var(--font-bold) }
.u-badge { display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);color:var(--color-neutral-700);font-size:var(--text-xs);font-weight:var(--font-medium);background:var(--color-neutral-200);border-radius:var(--radius-base) }
.u-badge--success { color:var(--color-success-dark);background:var(--color-success-subtle) }
.u-badge--warning { color:var(--color-warning-dark);background:var(--color-warning-subtle) }
.u-badge--danger { color:var(--color-danger-dark);background:var(--color-danger-subtle) }
.u-badge--info { color:var(--color-info-dark);background:var(--color-info-subtle) }
.u-alert { padding:var(--spacing-3) var(--spacing-4);background:var(--color-surface-secondary);border-color:var(--color-border-default);border-left:var(--spacing-1) solid;border-radius:var(--radius-md) }
.u-alert--info { background:var(--color-info-subtle);border-color:var(--color-info) }
.u-alert--success { background:var(--color-success-subtle);border-color:var(--color-success) }
.u-alert--warning { background:var(--color-warning-subtle);border-color:var(--color-warning) }
.u-alert--danger { background:var(--color-danger-subtle);border-color:var(--color-danger) }
.u-toast { position:fixed;right:var(--spacing-4);bottom:var(--spacing-4);z-index:var(--z-index-notification);padding:var(--spacing-3) var(--spacing-4);color:var(--color-neutral-0);background:var(--color-neutral-900-95);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);animation:slide-up .3s ease-out }
.sr-only,.visually-hidden { position:absolute;overflow:hidden;clip-path:inset(100%);width:var(--spacing-px);height:var(--spacing-px);margin:calc(var(--spacing-px)*-1);padding:0;white-space:nowrap;border:0 }
.sr-only-focusable:focus,.visually-hidden-focusable:focus { position:static;overflow:visible;clip-path:none;width:auto;height:auto;margin:inherit;padding:inherit;white-space:normal }
.aria-live-polite,.u-aria-live-assertive,.u-aria-live-polite { position:absolute;left:-10000px;overflow:hidden;width:var(--spacing-px);height:var(--spacing-px) }
.sr-announcements,.u-sr-announcements { position:fixed;top:calc(var(--spacing-24, 96px)*-1);left:calc(var(--spacing-24, 96px)*-1);z-index:-1;overflow:hidden;width:var(--spacing-px);height:var(--spacing-px) }
.loading-announcement,.progress-announcement,.validation-announcement { position:absolute;left:-10000px;overflow:hidden;width:var(--spacing-px);height:var(--spacing-px) }
.sr-description { position:absolute;left:-10000px;overflow:hidden;width:var(--spacing-px);height:var(--spacing-px) }
.invisible { visibility:hidden }
.hidden { display:none }
caption.sr-only { position:absolute;overflow:hidden;clip-path:inset(100%);width:var(--spacing-px);height:var(--spacing-px);margin:calc(var(--spacing-px)*-1);padding:0;white-space:nowrap;border:0 }
.c-progress-fill { height:100%;background:var(--color-brand-primary);border-radius:inherit;transition:width var(--duration-medium) var(--ease-out) }
.c-progress-fill--0 { width:0 }
.c-progress-fill--25 { width:25% }
.c-progress-fill--50 { width:50% }
.c-progress-fill--75 { width:75% }
.c-progress-fill--100 { width:100% }
.c-form-input--narrow { width:var(--col-width-narrow) }
.c-form-input--medium { width:var(--col-width-medium) }
.c-form-input--wide { width:var(--col-width-wide) }
.c-text--success { color:var(--color-success) }
.c-text--danger { color:var(--color-danger) }
.c-text--warning { color:var(--color-warning) }
.c-text--info { color:var(--color-info) }
.c-text--muted { color:var(--color-text-muted) }
.c-text--primary { color:var(--color-text-primary) }
.c-text--secondary { color:var(--color-text-secondary) }
.c-text--center { text-align:center }
.c-text--left { text-align:left }
.c-text--right { text-align:right }
.c-margin--0 { margin:var(--spacing-0) }
.c-margin--sm { margin:var(--spacing-2) }
.c-margin--md { margin:var(--spacing-4) }
.c-margin--lg { margin:var(--spacing-6) }
.c-margin-block--sm { margin-block:var(--spacing-2) }
.c-margin-block--md { margin-block:var(--spacing-4) }
.c-margin-block--lg { margin-block:var(--spacing-6) }
.c-display--none { display:none }
.c-display--block { display:block }
.c-display--flex { display:flex }
.c-display--inline-block { display:inline-block }
.c-error-container { color:var(--color-danger);text-align:center }
.c-error-message { margin:var(--spacing-4) var(--spacing-0) }
.c-btn--reload { padding:var(--spacing-3) var(--spacing-4);color:var(--color-text-inverse);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--color-brand-primary);border:none;border-radius:var(--radius-lg);transition:var(--duration-fast) var(--ease-out);cursor:pointer }
.c-btn--reload:hover { background:var(--color-brand-primary-dark);transform:translateY(-1px) }
.c-loading-overlay--hidden { display:none }
.c-loading-overlay--visible { display:flex }
.c-theme-loading { position:fixed;inset:var(--spacing-0) var(--spacing-0) var(--spacing-0) var(--spacing-0);z-index:var(--z-index-overlay);display:flex;justify-content:center;align-items:center;background:var(--overlay-bg) }
.c-theme-loading--hidden { display:none }
.c-link--success { color:var(--color-success);text-decoration:none }
.c-link--success:hover { text-decoration:underline }
.c-link--muted { color:var(--color-text-muted);text-decoration:none }
.c-link--muted:hover { text-decoration:underline }
.c-width--full { width:100% }
.c-width--auto { width:auto }
.c-width--fit { width:fit-content }
.c-height--full { height:100% }
.c-height--auto { height:auto }
.c-height--screen { height:100vh }
.c-flex { display:flex }
.c-flex--column { flex-direction:column }
.c-flex--center { justify-content:center;align-items:center }
.c-flex--between { justify-content:space-between }
.c-flex--end { justify-content:flex-end }
.c-border--none { border:none }
.c-border--default { border:var(--spacing-px) solid var(--color-border-default) }
.c-border--strong { border:var(--spacing-px) solid var(--color-border-strong) }
.c-radius--sm { border-radius:var(--radius-sm) }
.c-radius--md { border-radius:var(--radius-md) }
.c-radius--lg { border-radius:var(--radius-lg) }
.c-radius--xl { border-radius:var(--radius-xl) }
.c-radius--full { border-radius:var(--radius-full) }
.c-bg--surface { background-color:var(--color-surface-primary) }
.c-bg--elevated { background-color:var(--color-surface-elevated) }
.c-bg--overlay { background-color:var(--overlay-bg) }
.c-bg--transparent { background-color:transparent }
.c-position--relative { position:relative }
.c-position--absolute { position:absolute }
.c-position--fixed { position:fixed }
.c-position--sticky { position:sticky }
.c-z--overlay { z-index:var(--z-index-overlay) }
.c-z--modal { z-index:var(--z-index-modal) }
.c-z--dropdown { z-index:var(--z-index-dropdown) }
.c-z--tooltip { z-index:var(--z-index-tooltip) }
.c-overflow--hidden { overflow:hidden }
.c-overflow--auto { overflow:auto }
.c-overflow--scroll { overflow:scroll }
.c-overflow-x--hidden { overflow-x:hidden }
.c-overflow-y--auto { overflow-y:auto }
.c-cursor--pointer { cursor:pointer }
.c-cursor--default { cursor:default }
.c-cursor--not-allowed { cursor:not-allowed }
.c-shadow--sm { box-shadow:var(--shadow-sm) }
.c-shadow--md { box-shadow:var(--shadow-md) }
.c-shadow--lg { box-shadow:var(--shadow-lg) }
.c-shadow--xl { box-shadow:var(--shadow-xl) }
.c-shadow--none { box-shadow:none }
.c-error-banner { position:fixed;top:var(--spacing-0);right:var(--spacing-0);left:var(--spacing-0);z-index:var(--z-index-notification);padding:var(--spacing-4);color:var(--color-text-inverse);font-weight:var(--font-medium);text-align:center;background:var(--color-danger) }
.c-margin-top--sm { margin-top:var(--spacing-2) }
.c-margin-top--md { margin-top:var(--spacing-4) }
.c-margin-top--lg { margin-top:var(--spacing-6) }
.c-margin-top--xl { margin-top:var(--spacing-8) }
.c-margin-bottom--sm { margin-bottom:var(--spacing-2) }
.c-margin-bottom--md { margin-bottom:var(--spacing-4) }
.c-margin-bottom--lg { margin-bottom:var(--spacing-6) }
.c-margin-left--sm { margin-left:var(--spacing-2) }
.c-margin-left--md { margin-left:var(--spacing-4) }
.c-margin-left--lg { margin-left:var(--spacing-6) }
.c-text--xs { font-size:var(--text-xs) }
.c-text--sm { font-size:var(--text-sm) }
.c-text--base { font-size:var(--text-base) }
.c-text--lg { font-size:var(--text-lg) }
.c-text--xl { font-size:var(--text-xl) }
.c-text--2xl { font-size:var(--text-2xl) }
.c-text--3xl { font-size:var(--text-3xl) }
.c-batch-overview { margin-bottom:var(--spacing-4);padding:var(--spacing-3);color:var(--color-text-primary);background:var(--color-surface-elevated);border-radius:var(--radius-md) }
.c-batch-overview__title { margin-bottom:var(--spacing-2);color:var(--color-text-primary) }
.c-batch-overview__item { margin:var(--spacing-1) var(--spacing-0);color:var(--color-text-secondary) }
.c-status-success { margin-top:var(--spacing-4);color:var(--color-success);font-size:var(--text-lg);text-align:center }
.c-status-error { margin-top:var(--spacing-4);color:var(--color-danger);font-size:var(--text-lg);text-align:center }
.c-status-details { color:var(--color-text-secondary) }
.c-section-header { margin:var(--spacing-3) var(--spacing-0) var(--spacing-2) var(--spacing-0);color:var(--color-text-primary) }
.c-float-right { float:right }
.c-confidence-score { color:var(--color-text-tertiary) }
.c-content-spacing { margin-top:var(--spacing-2) }
.c-gap--sm { gap:var(--spacing-2) }
.c-gap--md { gap:var(--spacing-3) }
.c-gap--lg { gap:var(--spacing-4) }
.c-padding--sm { padding:var(--spacing-2) }
.c-padding--md { padding:var(--spacing-4) }
.c-padding--lg { padding:var(--spacing-6) }
.c-padding--xl { padding:var(--spacing-8) }
.c-showcase-title { margin-bottom:var(--spacing-4);font-size:var(--text-5xl);text-align:center }
.c-showcase-subtitle { font-size:var(--text-lg);text-align:center;opacity:90% }
.c-demo-description { margin-top:var(--spacing-4);font-size:var(--text-sm) }
.c-form-group--left { text-align:left }
.c-form-input--demo { width:100%;padding:var(--spacing-3);color:var(--color-text-primary);background:var(--alpha-white-10);border:var(--spacing-0-5) solid transparent;border-radius:var(--radius-md) }
.c-checkbox-container { margin:var(--spacing-4) var(--spacing-0) }
.c-checkbox-label { margin-left:var(--spacing-8) }
.c-opacity--90 { opacity:90% }
.c-opacity--80 { opacity:80% }
.c-opacity--70 { opacity:70% }