:root{--bg-dark: #1a1a2e;--bg-card: #16213e;--bg-card-hover: #1e2d4a;--text-primary: #ffffff;--text-secondary: #a0a0a0;--accent-blue: #0f4c75;--accent-light: #3282b8;--status-available: #22c55e;--status-mission: #eab308;--status-unavailable: #ef4444;--alarm-red: #dc2626;--alarm-orange: #ea580c;--alarm-bg: #450a0a;--feedback-coming: #22c55e;--feedback-not-coming: #ef4444;--feedback-unknown: #6b7280;--border-dark: #2d3748;--border-light: #4a5568;--font-header: 72px;--font-subheader: 48px;--font-large: 36px;--font-medium: 24px;--font-normal: 18px;--font-small: 14px;--spacing-xs: 8px;--spacing-sm: 16px;--spacing-md: 24px;--spacing-lg: 32px;--spacing-xl: 48px;--spacing-xxl: 64px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{height:100%;overflow:hidden}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:18px;line-height:1.5;color:var(--text-primary);background-color:var(--bg-dark);transition:background-color .2s ease-in-out}h1{font-size:var(--font-header);font-weight:700;line-height:1.1}h2{font-size:var(--font-subheader);font-weight:600;line-height:1.2}h3{font-size:var(--font-large);font-weight:600;line-height:1.3}h4{font-size:var(--font-medium);font-weight:500;line-height:1.4}p{margin-bottom:var(--spacing-sm)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}::selection{background-color:var(--accent-blue);color:var(--text-primary)}@keyframes pulse-alarm{0%,to{opacity:1}50%{opacity:.7}}@keyframes blink-alarm{0%,50%{background-color:var(--alarm-red)}51%,to{background-color:var(--alarm-orange)}}@keyframes slide-in{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.monitor-container{width:100vw;height:100vh;display:flex;flex-direction:column;overflow:hidden}.status-indicator{width:16px;height:16px;border-radius:var(--radius-full);display:inline-block}.status-indicator--available{background-color:var(--status-available);box-shadow:0 0 10px var(--status-available)}.status-indicator--mission{background-color:var(--status-mission);box-shadow:0 0 10px var(--status-mission)}.status-indicator--unavailable{background-color:var(--status-unavailable);box-shadow:0 0 10px var(--status-unavailable)}.feedback-icon{width:24px;height:24px;border-radius:var(--radius-full);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--font-small)}.feedback-icon--coming{background-color:var(--feedback-coming);color:#fff}.feedback-icon--coming:before{content:"+"}.feedback-icon--not-coming{background-color:var(--feedback-not-coming);color:#fff}.feedback-icon--not-coming:before{content:"-"}.feedback-icon--unknown{background-color:var(--feedback-unknown);color:#fff}.feedback-icon--unknown:before{content:"?"}.card{background-color:var(--bg-card);border-radius:var(--radius-md);padding:var(--spacing-sm);border:1px solid var(--border-dark);transition:all .2s ease-in-out}.card:hover{background-color:var(--bg-card-hover)}.section-title{font-size:var(--font-normal);font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;margin-bottom:var(--spacing-sm)}.connection-status{position:fixed;bottom:var(--spacing-sm);right:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md);font-size:var(--font-small);display:flex;align-items:center;gap:var(--spacing-xs);z-index:1000}.connection-status--connected{background-color:#22c55e33;color:var(--status-available)}.connection-status--disconnected{background-color:#ef444433;color:var(--status-unavailable)}.connection-status--reconnecting{background-color:#eab30833;color:var(--status-mission)}.connection-status__dot{width:8px;height:8px;border-radius:var(--radius-full);background-color:currentColor}
