/* ══════════════════════════════════════════════════════════════ SCAN TERMINAL — 3-Column Layout ══════════════════════════════════════════════════════════════ */ .root :global(.scan-terminal) { display: flex; width: 100%; height: calc(100vh - var(--header-height, 72px)); margin-top: var(--header-height, 72px); position: relative; z-index: 2; } /* ── Left: Filter Panel ── */ .root :global(.scan-filter-panel) { width: 220px; min-width: 220px; height: 100%; background: var(--bg-secondary); border-right: 1px solid var(--border-glass); display: flex; flex-direction: column; padding: 20px 16px; gap: 20px; overflow-y: auto; } .root :global(.scan-filter-section) { display: flex; flex-direction: column; gap: 12px; } .root :global(.scan-filter-label) { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); } /* Mode Tabs */ .root :global(.scan-mode-tabs) { display: flex; flex-direction: column; gap: 4px; } .root :global(.scan-mode-tab) { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: none; border-radius: 8px; background: transparent; color: var(--text-secondary); font-size: 13px; font-weight: 500; cursor: pointer; transition: all 0.2s; text-align: left; position: relative; } .root :global(.scan-mode-tab:hover) { background: rgba(255, 255, 255, 0.04); color: var(--text-primary); } .root :global(.scan-mode-tab.active) { background: rgba(0, 224, 164, 0.08); color: #4DA3FF; font-weight: 600; } .root :global(.scan-mode-tab.active)::before { content: ""; position: absolute; left: 0; top: 25%; height: 50%; width: 3px; background: #4DA3FF; border-radius: 0 2px 2px 0; } .root :global(.scan-mode-tab-indicator) { display: none; } /* Filter Rows */ .root :global(.scan-filter-row) { display: flex; flex-direction: column; gap: 6px; } .root :global(.scan-filter-row-label) { font-size: 12px; color: var(--text-muted); } .root :global(.scan-range-display) { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--text-secondary); } .root :global(.scan-range-slider) { flex: 1; appearance: none; height: 4px; background: rgba(255, 255, 255, 0.08); border-radius: 2px; outline: none; } .root :global(.scan-range-slider::-webkit-slider-thumb) { appearance: none; width: 14px; height: 14px; background: #4DA3FF; border-radius: 50%; cursor: pointer; border: 2px solid var(--bg-secondary); } /* Toggle */ .root :global(.scan-toggle) { width: 36px; height: 20px; border-radius: 10px; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.1); cursor: pointer; position: relative; transition: all 0.2s; padding: 0; } .root :global(.scan-toggle.active) { background: rgba(0, 224, 164, 0.3); border-color: #4DA3FF; } .root :global(.scan-toggle-knob) { width: 14px; height: 14px; border-radius: 50%; background: var(--text-secondary); position: absolute; top: 2px; left: 2px; transition: all 0.2s; } .root :global(.scan-toggle.active .scan-toggle-knob) { left: 18px; background: #4DA3FF; } /* Select */ .root :global(.scan-select) { background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 6px; padding: 6px 10px; font-size: 12px; color: var(--text-primary); outline: none; cursor: pointer; width: 100%; } .root :global(.scan-select:focus) { border-color: #4DA3FF; } /* Scan CTA */ .root :global(.scan-cta-button) { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 12px 16px; border: none; border-radius: 10px; background: linear-gradient(135deg, #4DA3FF, #00c48f); color: #030711; font-size: 14px; font-weight: 700; cursor: pointer; transition: all 0.25s; margin-top: auto; } .root :global(.scan-cta-button:hover) { background: linear-gradient(135deg, #00f0b0, #00d89a); transform: translateY(-1px); box-shadow: 0 4px 20px rgba(0, 224, 164, 0.3); } .root :global(.scan-cta-button:disabled) { opacity: 0.5; cursor: not-allowed; transform: none; } /* ── Center: Data Grid ── */ .root :global(.scan-data-grid) { flex: 1; display: flex; flex-direction: column; overflow: hidden; padding: 20px 24px; gap: 16px; } .root :global(.scan-data-grid-header) { display: flex; align-items: center; justify-content: space-between; } .root :global(.scan-data-grid-title) { font-size: 18px; font-weight: 700; color: var(--text-primary); } .root :global(.scan-data-grid-subtitle) { font-size: 12px; color: var(--text-muted); margin-top: 4px; } .root :global(.scan-data-grid-controls) { display: flex; align-items: center; gap: 8px; } /* KPI Bar */ .root :global(.scan-kpi-bar) { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; } .root :global(.scan-kpi-card) { background: rgba(13, 17, 23, 0.6); border: 1px solid rgba(255, 255, 255, 0.05); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; justify-content: center; position: relative; overflow: hidden; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); } .root :global(.scan-kpi-card:hover) { background: rgba(255, 255, 255, 0.04); border-color: rgba(0, 224, 164, 0.3); transform: translateY(-2px); box-shadow: 0 8px 16px -8px rgba(0, 0, 0, 0.5); } .root :global(.scan-kpi-card::after) { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 2px; background: linear-gradient( 90deg, transparent, rgba(0, 224, 164, 0.5), transparent ); transform: translateX(-100%); transition: transform 0.5s; } .root :global(.scan-kpi-card:hover::after) { transform: translateX(100%); } .root :global(.scan-kpi-green) { border-top: 2px solid rgba(0, 224, 164, 0.4); } .root :global(.scan-kpi-purple) { border-top: 2px solid rgba(123, 97, 255, 0.4); } .root :global(.scan-kpi-header) { display: flex; align-items: center; gap: 6px; } .root :global(.scan-kpi-icon) { color: var(--text-muted); } .root :global(.scan-kpi-label) { font-size: 11px; font-weight: 500; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.06em; } .root :global(.scan-kpi-value) { font-size: 22px; font-weight: 800; color: var(--text-primary); font-variant-numeric: tabular-nums; line-height: 1; } .root :global(.scan-kpi-green .scan-kpi-value) { color: #4DA3FF; } .root :global(.scan-kpi-delta) { font-size: 11px; color: var(--text-muted); } /* View Tabs */ .root :global(.scan-view-tabs) { display: flex; gap: 0; border-bottom: 1px solid var(--border-subtle); } .root :global(.scan-view-tab) { padding: 8px 16px; border: none; background: none; color: var(--text-muted); font-size: 13px; font-weight: 500; cursor: pointer; position: relative; transition: color 0.2s; } .root :global(.scan-view-tab:hover) { color: var(--text-primary); } .root :global(.scan-view-tab.active) { color: #4DA3FF; font-weight: 600; } .root :global(.scan-view-tab.active)::after { content: ""; position: absolute; bottom: -1px; left: 0; right: 0; height: 2px; background: #4DA3FF; border-radius: 4px; opacity: 0.8; transition: all 0.3s ease; } /* ── Right: Scan Detail Panel ── */ .root :global(.scan-detail-panel) { width: 360px; min-width: 360px; height: 100%; border-left: 1px solid var(--border-glass); background: var(--bg-secondary); overflow-y: auto; display: flex; flex-direction: column; } .root :global(.scan-detail-header) { padding: 20px; display: flex; align-items: flex-start; gap: 14px; border-bottom: 1px solid var(--border-subtle); } .root :global(.scan-detail-hero-img) { width: 64px; height: 64px; border-radius: 10px; object-fit: cover; flex-shrink: 0; } .root :global(.scan-detail-hero-placeholder) { width: 64px; height: 64px; border-radius: 10px; background: linear-gradient( 135deg, rgba(0, 224, 164, 0.15), rgba(123, 97, 255, 0.15) ); flex-shrink: 0; } .root :global(.scan-detail-city-info) { flex: 1; min-width: 0; } .root :global(.scan-detail-city-name) { font-size: 16px; font-weight: 700; color: var(--text-primary); } .root :global(.scan-detail-city-sub) { font-size: 12px; color: var(--text-muted); margin-top: 2px; } .root :global(.scan-detail-volume) { font-size: 13px; color: var(--text-secondary); font-weight: 600; margin-top: 6px; } .root :global(.scan-detail-section) { padding: 16px 20px; border-bottom: 1px solid var(--border-subtle); } .root :global(.scan-detail-section-title) { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 12px; } /* Conditions Table */ .root :global(.scan-conditions-table) { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .root :global(.scan-condition-item) { display: flex; flex-direction: column; gap: 2px; } .root :global(.scan-condition-label) { font-size: 11px; color: var(--text-muted); } .root :global(.scan-condition-value) { font-size: 14px; font-weight: 600; color: var(--text-primary); font-variant-numeric: tabular-nums; } .root :global(.scan-condition-value.accent-green) { color: #4DA3FF; } .root :global(.scan-condition-value.accent-red) { color: #EF4444; } /* Trade Cards */ .root :global(.scan-trade-cards) { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; } .root :global(.scan-trade-card) { background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: 10px; padding: 14px; display: flex; flex-direction: column; gap: 8px; } .root :global(.scan-trade-card.yes) { border-top: 2px solid #4DA3FF; } .root :global(.scan-trade-card.no) { border-top: 2px solid #EF4444; } .root :global(.scan-trade-card-title) { font-size: 13px; font-weight: 700; color: var(--text-primary); } .root :global(.scan-trade-card-price) { font-size: 12px; color: var(--text-secondary); } .root :global(.scan-trade-card-edge) { font-size: 11px; font-weight: 600; } .root :global(.scan-trade-card-edge.positive) { color: #4DA3FF; } .root :global(.scan-trade-card-edge.negative) { color: #EF4444; } .root :global(.scan-trade-card-note) { font-size: 10px; color: var(--text-muted); } /* Score Gauge */ .root :global(.scan-detail-score) { padding: 20px; display: flex; align-items: center; gap: 16px; } .root :global(.scan-detail-score-big) { font-size: 40px; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1; } .root :global(.scan-detail-score-label) { font-size: 12px; color: var(--text-muted); } .root :global(.scan-detail-score-suffix) { font-size: 18px; font-weight: 600; color: var(--text-muted); } /* Confidence Dots */ .root :global(.scan-confidence-dots) { display: flex; gap: 4px; align-items: center; } .root :global(.scan-confidence-dot) { width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, 0.1); } .root :global(.scan-confidence-dot.filled) { background: #4DA3FF; } .root :global(.scan-confidence-dot.filled.amber) { background: #F59E0B; } .root :global(.scan-confidence-dot.filled.red) { background: #EF4444; } /* Empty state */ .root :global(.scan-detail-empty) { flex: 1; display: flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: 13px; padding: 40px; text-align: center; } /* ══════════════════════════════════════════════════════════════ SCAN TERMINAL OVERRIDES — EMOS DESK ══════════════════════════════════════════════════════════════ */ .root :global(.scan-terminal) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, 420px); gap: 14px; width: 100%; min-height: 100vh; height: auto; margin-top: 0; padding: 16px; background: radial-gradient(circle at top, rgba(77, 163, 255, 0.12), transparent 36%), linear-gradient(180deg, #0B1220 0%, #07101D 100%); overflow: auto; } .root :global(.scan-filter-panel), .root :global(.scan-data-grid), .root :global(.scan-detail-panel) { min-height: calc(100vh - 32px); border: 1px solid rgba(159, 178, 199, 0.14); border-radius: 22px; background: linear-gradient(180deg, rgba(17, 26, 46, 0.96), rgba(11, 18, 32, 0.96)); box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28); backdrop-filter: blur(14px); } .root :global(.scan-filter-panel) { width: auto; min-width: 0; border-right: 1px solid rgba(159, 178, 199, 0.14); padding: 18px 14px; gap: 18px; overflow: hidden auto; } .root :global(.scan-sidebar-brand) { display: flex; align-items: center; gap: 0; padding: 8px 4px 18px; border-bottom: 1px solid rgba(118, 146, 188, 0.12); } .root :global(.scan-sidebar-brand-mark) { width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; color: #042113; background: radial-gradient(circle at 30% 30%, #29f2ab, #0da46a 60%, #073c28 100%); box-shadow: 0 0 24px rgba(23, 217, 139, 0.3); } .root :global(.scan-sidebar-brand-name) { font-size: 30px; font-weight: 800; letter-spacing: 0; color: #eef5ff; } .root :global(.scan-filter-heading) { display: flex; align-items: center; justify-content: space-between; margin: 6px 8px 8px; font-size: 14px; font-weight: 600; color: #b8c7dd; } .root :global(.scan-mode-tabs) { gap: 10px; } .root :global(.scan-mode-tab) { align-items: flex-start; gap: 12px; padding: 14px; border-radius: 14px; border: 1px solid rgba(87, 119, 166, 0.14); background: rgba(11, 24, 42, 0.95); color: #dbe7f8; } .root :global(.scan-mode-tab:hover) { background: rgba(13, 28, 48, 0.98); border-color: rgba(87, 119, 166, 0.24); } .root :global(.scan-mode-tab.active) { background: linear-gradient(180deg, rgba(15, 34, 59, 1), rgba(9, 19, 34, 1)); border-color: rgba(78, 222, 151, 0.7); color: #f3fbff; box-shadow: inset 0 0 0 1px rgba(78, 222, 151, 0.35), 0 0 0 2px rgba(7, 199, 119, 0.08); } .root :global(.scan-mode-tab.active::before) { display: none; } .root :global(.scan-mode-icon) { width: 28px; height: 28px; border-radius: 10px; display: grid; place-items: center; flex-shrink: 0; background: rgba(63, 140, 255, 0.12); color: #6cb1ff; } .root :global(.scan-mode-tab.active .scan-mode-icon) { background: rgba(23, 217, 139, 0.14); color: #2df3a5; } .root :global(.scan-mode-copy) { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .root :global(.scan-mode-tab-label) { font-size: 15px; font-weight: 700; color: inherit; } .root :global(.scan-mode-tab-sub) { font-size: 12px; line-height: 1.4; color: #8fa4c3; } .root :global(.scan-range-card), .root :global(.scan-filter-row) { background: rgba(11, 24, 42, 0.92); border: 1px solid rgba(87, 119, 166, 0.12); border-radius: 12px; padding: 12px 14px; } .root :global(.scan-range-card) { display: flex; flex-direction: column; gap: 10px; } .root :global(.scan-filter-row-title), .root :global(.scan-filter-row-label) { font-size: 14px; color: #d9e7f8; } .root :global(.scan-filter-row) { gap: 10px; } .root :global(.scan-filter-row.inline) { flex-direction: row; align-items: center; justify-content: space-between; } .root :global(.scan-range-track-wrap) { position: relative; height: 20px; } .root :global(.scan-range-track-wrap::before) { content: ""; position: absolute; inset: 7px 0; border-radius: 999px; background: linear-gradient(90deg, #1c2f4e, #2d4f84); } .root :global(.scan-range-slider) { position: absolute; inset: 0; width: 100%; height: 20px; background: transparent; pointer-events: none; } .root :global(.scan-range-slider::-webkit-slider-thumb) { width: 16px; height: 16px; border-radius: 50%; border: none; background: #4d93ff; box-shadow: 0 0 0 4px rgba(77, 147, 255, 0.16); pointer-events: auto; } .root :global(.scan-range-slider::-moz-range-thumb) { width: 16px; height: 16px; border-radius: 50%; border: none; background: #4d93ff; box-shadow: 0 0 0 4px rgba(77, 147, 255, 0.16); pointer-events: auto; } .root :global(.scan-range-slider::-webkit-slider-runnable-track), .root :global(.scan-range-slider::-moz-range-track) { background: transparent; } .root :global(.scan-range-labels) { display: flex; justify-content: space-between; font-size: 12px; color: #aec0d9; } .root :global(.scan-select) { border-radius: 10px; padding: 10px 12px; border-color: rgba(87, 119, 166, 0.12); background: rgba(10, 22, 38, 0.95); color: #d9e8fb; } .root :global(.scan-toggle) { width: 42px; height: 24px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.06); background: linear-gradient(90deg, #0e2840, #12324d); } .root :global(.scan-toggle.active) { background: linear-gradient(90deg, #0e2840, #1f7f57); border-color: rgba(39, 234, 152, 0.28); } .root :global(.scan-toggle-knob) { top: 2px; left: 3px; width: 18px; height: 18px; background: #8ca5c8; } .root :global(.scan-toggle.active .scan-toggle-knob) { left: 21px; background: #1bf1a2; box-shadow: 0 0 10px rgba(27, 241, 162, 0.45); } .root :global(.scan-cta-button) { border-radius: 14px; padding: 15px; margin-top: auto; background: linear-gradient(180deg, #1ddb8d, #0eb96d); box-shadow: 0 8px 22px rgba(14, 185, 109, 0.22); font-size: 16px; font-weight: 800; } .root :global(.scan-data-grid) { padding: 18px; gap: 18px; overflow: hidden; min-height: calc(100vh - 32px); max-height: calc(100vh - 32px); } .root :global(.scan-topbar) { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0 18px; border-bottom: 1px solid rgba(118, 146, 188, 0.1); } .root :global(.scan-topbar-title) { display: flex; flex-direction: column; gap: 6px; min-width: 0; } .root :global(.scan-topbar-title strong) { margin: 0; font-size: 28px; line-height: 1.08; letter-spacing: -0.04em; color: #f3f8ff; } .root :global(.scan-topbar-title span) { color: #8fa4c3; font-size: 14px; line-height: 1.5; } .root :global(.scan-topbar-actions) { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 12px; color: #b4c8e2; font-size: 14px; } .root :global(.scan-locale-switch) { height: 36px; padding: 3px; border-radius: 12px; border: 1px solid rgba(99, 132, 180, 0.18); background: rgba(8, 19, 34, 0.9); color: #a8bdd8; display: inline-flex; align-items: center; gap: 2px; font-size: 12px; font-weight: 800; cursor: pointer; } .root :global(.scan-locale-switch span) { min-width: 34px; height: 28px; padding: 0 8px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; } .root :global(.scan-locale-switch span.active) { color: #eef7ff; background: rgba(63, 140, 255, 0.16); box-shadow: inset 0 0 0 1px rgba(63, 140, 255, 0.22); } .root :global(.scan-topbar-time) { color: #b4c8e2; font-variant-numeric: tabular-nums; } .root :global(.scan-upgrade-announcement) { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; margin: -4px 0 6px; border: 1px solid rgba(77, 163, 255, 0.2); border-radius: 18px; background: radial-gradient(circle at top left, rgba(77, 163, 255, 0.18), transparent 36%), linear-gradient(135deg, rgba(18, 33, 58, 0.96), rgba(15, 23, 42, 0.92)); box-shadow: 0 18px 48px rgba(0, 0, 0, 0.2); padding: 16px 18px; } .root :global(.scan-upgrade-announcement-copy) { min-width: 0; } .root :global(.scan-upgrade-announcement-copy span) { color: #86efac; font-size: 12px; font-weight: 900; letter-spacing: 0.04em; text-transform: uppercase; } .root :global(.scan-upgrade-announcement-copy strong) { display: block; margin-top: 5px; color: #f3f8ff; font-size: 18px; line-height: 1.25; } .root :global(.scan-upgrade-announcement-copy p) { margin: 6px 0 0; color: #b4c8e2; font-size: 13px; line-height: 1.55; } .root :global(.scan-upgrade-announcement ul) { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin: 0; padding: 0; list-style: none; } .root :global(.scan-upgrade-announcement li) { border: 1px solid rgba(77, 163, 255, 0.22); border-radius: 999px; background: rgba(77, 163, 255, 0.1); color: #d7e5f7; font-size: 12px; font-weight: 850; padding: 7px 10px; } .root :global(.scan-ghost-button), .root :global(.scan-cta-ghost), .root :global(.scan-theme-button), .root :global(.scan-detail-action-button), .root :global(.scan-detail-icon-button), .root :global(.scan-view-all-button) { border: 1px solid rgba(99, 132, 180, 0.18); background: rgba(8, 19, 34, 0.9); color: #d7e5f7; border-radius: 12px; } .root :global(.scan-ghost-button), .root :global(.scan-cta-ghost) { display: inline-flex; align-items: center; gap: 8px; padding: 11px 14px; font-weight: 700; } .root :global(.scan-primary-button) { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 11px 16px; border: 1px solid rgba(77, 163, 255, 0.42); border-radius: 12px; background: linear-gradient(180deg, #4DA3FF, #3B82F6); color: #FFFFFF; font-size: 14px; font-weight: 900; text-decoration: none; box-shadow: 0 10px 24px rgba(59, 130, 246, 0.22); cursor: pointer; } .root :global(.scan-primary-button:hover:not(:disabled)) { filter: brightness(1.06); } .root :global(.scan-primary-button:disabled) { cursor: not-allowed; opacity: 0.68; } .root :global(.scan-ai-button) { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 11px 14px; border: 1px solid rgba(77, 163, 255, 0.3); border-radius: 12px; background: linear-gradient(180deg, rgba(77, 163, 255, 0.18), rgba(59, 130, 246, 0.12)); color: #CFE6FF; font-size: 13px; font-weight: 900; cursor: pointer; } .root :global(.scan-ai-button:hover:not(:disabled)) { border-color: rgba(111, 183, 255, 0.5); background: linear-gradient(180deg, rgba(77, 163, 255, 0.26), rgba(59, 130, 246, 0.18)); } .root :global(.scan-ai-button:disabled) { cursor: not-allowed; opacity: 0.55; } .root :global(.scan-cta-ghost) { color: #6FB7FF; border-color: rgba(23, 217, 139, 0.3); background: rgba(23, 217, 139, 0.12); } .root :global(.scan-account-button) { width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; color: #d7e5f7; text-decoration: none; border: 1px solid rgba(99, 132, 180, 0.18); background: rgba(8, 19, 34, 0.9); border-radius: 12px; } .root :global(.scan-account-button:hover) { border-color: rgba(63, 140, 255, 0.28); background: rgba(12, 26, 44, 0.96); } .root :global(.scan-theme-button) { width: 36px; height: 36px; display: inline-grid; place-items: center; color: #d7e5f7; cursor: pointer; } .root :global(.scan-ghost-button .spin) { animation: spin 1s linear infinite; } .root :global(.scan-kpi-bar) { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; } .root :global(.scan-kpi-card) { min-height: 124px; padding: 18px; border-radius: 16px; border: 1px solid rgba(92, 124, 170, 0.12); background: linear-gradient(180deg, rgba(14, 28, 48, 0.92), rgba(11, 21, 37, 0.94)); transform: none; } .root :global(.scan-kpi-card:hover) { transform: translateY(-2px); } .root :global(.scan-kpi-card::after) { display: none; } .root :global(.scan-kpi-card.green .scan-kpi-label) { color: #17d98b; } .root :global(.scan-kpi-card.cyan .scan-kpi-label) { color: #37d6ff; } .root :global(.scan-kpi-card.purple .scan-kpi-label) { color: #a35cff; } .root :global(.scan-kpi-card.blue .scan-kpi-label) { color: #49a3ff; } .root :global(.scan-kpi-card.red .scan-kpi-label) { color: #ff647c; } .root :global(.scan-kpi-card.amber .scan-kpi-label) { color: #ffb84f; } .root :global(.scan-kpi-card.orange .scan-kpi-label) { color: #F59E0B; } .root :global(.scan-kpi-label) { font-size: 13px; text-transform: none; letter-spacing: 0; } .root :global(.scan-kpi-value) { margin-top: 10px; font-size: 28px; } .root :global(.scan-kpi-note) { margin-top: 8px; font-size: 14px; color: #a8bedb; } .root :global(.scan-list-section) { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; } .root :global(.scan-list-header) { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; } .root :global(.scan-list-tabs) { display: flex; gap: 24px; } .root :global(.scan-list-tabs button) { border: none; background: transparent; font-size: 16px; font-weight: 700; color: #91a7c4; cursor: pointer; } .root :global(.scan-list-tabs button:disabled) { opacity: 0.42; cursor: not-allowed; } .root :global(.scan-list-tabs button.active) { color: #fff; } .root :global(.scan-list-status) { display: flex; gap: 10px; align-items: center; } .root :global(.scan-status-chip) { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid rgba(98, 126, 167, 0.22); background: rgba(10, 22, 38, 0.92); color: #c4d4e9; font-size: 12px; font-weight: 800; letter-spacing: 0.02em; } .root :global(.scan-status-chip.live) { border-color: rgba(55, 214, 255, 0.28); background: rgba(55, 214, 255, 0.1); color: #71e6ff; } .root :global(.scan-status-chip.stale) { border-color: rgba(255, 184, 79, 0.24); background: rgba(255, 184, 79, 0.1); color: #ffc765; } .root :global(.scan-status-chip.ai) { border-color: rgba(94, 234, 212, 0.28); background: rgba(20, 184, 166, 0.12); color: #87fff1; } .root :global(.scan-status-chip.focus) { border-color: rgba(255, 176, 32, 0.3); background: rgba(255, 176, 32, 0.12); color: #ffd078; } .root :global(button.scan-status-chip.refresh) { cursor: pointer; } .root :global(button.scan-status-chip.refresh:disabled) { cursor: wait; opacity: 0.68; } .root :global(.scan-status-chip .spin) { animation: spin 1s linear infinite; } .root :global(.scan-table-shell) { display: flex; flex-direction: column; flex: 1; min-height: 0; border: 1px solid rgba(90, 123, 166, 0.12); border-radius: 18px; background: rgba(8, 17, 30, 0.8); overflow: hidden; } .root :global(.scan-table-shell.empty) { min-height: 340px; } .root :global(.scan-table-banner) { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 12px 16px; border-bottom: 1px solid rgba(95, 124, 168, 0.12); background: linear-gradient(180deg, rgba(255, 184, 79, 0.08), rgba(255, 184, 79, 0.03)); } .root :global(.scan-table-banner strong) { font-size: 13px; font-weight: 800; color: #ffd27f; } .root :global(.scan-table-banner span) { font-size: 13px; color: #c7d4e7; } .root :global(.scan-table-header) { display: grid; grid-template-columns: minmax(220px, 1.1fr) minmax(128px, 0.68fr) minmax(230px, 1.08fr) minmax(150px, 0.78fr) 92px; gap: 10px; align-items: center; padding: 14px 18px; background: rgba(11, 23, 40, 0.98); border-bottom: 1px solid rgba(90, 123, 166, 0.12); color: #92a8c5; font-size: 13px; font-weight: 600; text-transform: none; letter-spacing: 0; } .root :global(.scan-table-body) { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; scrollbar-width: none; -ms-overflow-style: none; } .root :global(.scan-v4-analysis) { grid-column: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0 14px 14px; padding: 14px; border-color: rgba(56, 189, 248, 0.18); border-radius: 14px; background: linear-gradient(180deg, rgba(7, 20, 36, 0.96), rgba(5, 15, 28, 0.98)), radial-gradient(circle at 4% 0%, rgba(45, 212, 191, 0.11), transparent 28%); } .root :global(.scan-v4-analysis section) { padding: 13px; border-color: rgba(92, 132, 188, 0.14); background: rgba(10, 25, 43, 0.7); } .root :global(.scan-v4-analysis p), .root :global(.scan-v4-analysis ul) { color: #b8c9e3; } .root :global(.scan-v4-analysis .scan-v4-evidence) { grid-column: 1 / -1; } .root :global(.scan-v4-analysis .scan-v4-decision) { grid-column: 1 / -1; border-color: rgba(45, 212, 191, 0.24); background: linear-gradient(180deg, rgba(6, 31, 43, 0.86), rgba(8, 23, 38, 0.86)), radial-gradient(circle at 0 0, rgba(20, 184, 166, 0.12), transparent 32%); } .root :global(.scan-v4-analysis .scan-v4-decision.downgrade), .root :global(.scan-v4-analysis .scan-v4-decision.watchlist) { border-color: rgba(245, 158, 11, 0.24); } .root :global(.scan-v4-analysis .scan-v4-decision.veto) { border-color: rgba(248, 113, 113, 0.28); } .root :global(.scan-v4-decision p b) { color: #ecfeff; font-weight: 950; } .root :global(.scan-v4-metar-summary) { margin-top: 9px; color: #8fb3d8; font-size: 12px; font-weight: 800; line-height: 1.45; } .root :global(.scan-v4-evidence > div), .root :global(.scan-v4-model-sources) { gap: 8px; } .root :global(.scan-v4-analysis) { display: flex; flex-direction: column; gap: 13px; margin: 0 14px 14px; padding: 15px 16px 16px; border: 1px solid rgba(56, 189, 248, 0.16); border-radius: 12px; background: linear-gradient(180deg, rgba(7, 20, 36, 0.96), rgba(5, 15, 28, 0.98)), radial-gradient(circle at 4% 0%, rgba(45, 212, 191, 0.08), transparent 30%); } .root :global(.scan-v4-analysis section), .root :global(.scan-v4-analysis section:first-child), .root :global(.scan-v4-analysis .scan-v4-evidence) { grid-column: auto; min-width: 0; padding: 0; border: 0; border-radius: 0; background: transparent; } .root :global(.scan-v4-heading) { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 12px; border-bottom: 1px solid rgba(90, 123, 166, 0.14); } .root :global(.scan-v4-heading > div) { display: grid; gap: 7px; min-width: 0; } .root :global(.scan-v4-heading strong), .root :global(.scan-v4-current b), .root :global(.scan-v4-brief-grid strong) { color: #6FB7FF; font-size: 12px; font-weight: 950; letter-spacing: 0.02em; } .root :global(.scan-v4-heading p) { margin: 0; color: #d2e1f4; font-size: 14px; font-weight: 800; line-height: 1.55; } .root :global(.scan-v4-decision-pill) { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; min-height: 30px; padding: 0 12px; border: 1px solid rgba(45, 212, 191, 0.3); border-radius: 999px; background: rgba(20, 184, 166, 0.12); color: #7dfbe7; font-size: 12px; font-weight: 950; white-space: nowrap; } .root :global(.scan-v4-decision-pill.downgrade), .root :global(.scan-v4-decision-pill.watchlist) { border-color: rgba(245, 158, 11, 0.34); background: rgba(245, 158, 11, 0.12); color: #ffd166; } .root :global(.scan-v4-decision-pill.veto) { border-color: rgba(248, 113, 113, 0.34); background: rgba(248, 113, 113, 0.12); color: #ff8585; } .root :global(.scan-v4-current) { display: grid; gap: 6px; padding-bottom: 12px; border-bottom: 1px solid rgba(90, 123, 166, 0.12); } .root :global(.scan-v4-current span) { color: #c8d8ec; font-size: 13px; font-weight: 850; line-height: 1.5; } .root :global(.scan-v4-current small) { color: #8fb3d8; font-size: 12px; font-weight: 800; line-height: 1.45; } .root :global(.scan-v4-brief-grid) { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.85fr); gap: 26px; } .root :global(.scan-v4-brief-grid section:first-child) { grid-column: auto; } .root :global(.scan-v4-brief-grid ul) { display: grid; gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; } .root :global(.scan-v4-brief-grid li) { position: relative; padding-left: 16px; color: #aebfd8; font-size: 12px; font-weight: 800; line-height: 1.48; } .root :global(.scan-v4-brief-grid li::before) { content: ""; position: absolute; top: 0.65em; left: 0; width: 5px; height: 5px; border-radius: 999px; background: #4DA3FF; box-shadow: 0 0 10px rgba(45, 212, 191, 0.45); } .root :global(.scan-v4-brief-grid section:nth-child(2) li::before) { background: #f59e0b; box-shadow: 0 0 10px rgba(245, 158, 11, 0.35); } .root :global(details.scan-v4-evidence) { padding-top: 11px; border-top: 1px solid rgba(90, 123, 166, 0.12); } .root :global(details.scan-v4-evidence summary) { display: inline-flex; align-items: center; gap: 8px; min-height: 30px; padding: 0 11px; border: 1px solid rgba(65, 118, 216, 0.28); border-radius: 8px; background: rgba(10, 30, 58, 0.52); color: #8fbdff; font-size: 12px; font-weight: 950; cursor: pointer; list-style: none; } .root :global(details.scan-v4-evidence summary::-webkit-details-marker) { display: none; } .root :global(details.scan-v4-evidence summary::after) { content: "v"; color: #8fbdff; font-size: 12px; } .root :global(details.scan-v4-evidence[open] summary::after) { content: "^"; } .root :global(details.scan-v4-evidence > div) { margin-top: 10px; } .root :global(.scan-forecast-desk) { gap: 16px; padding: 16px 18px 20px; } .root :global(.scan-ai-workspace) { flex: 1; min-height: 0; max-height: 100%; overflow-y: auto; overscroll-behavior: contain; border: 1px solid rgba(77, 163, 255, 0.16); border-radius: 18px; background: #0b1220; padding: 18px; } .root :global(.scan-ai-workspace::-webkit-scrollbar) { width: 8px; } .root :global(.scan-ai-workspace::-webkit-scrollbar-thumb) { border-radius: 999px; background: rgba(77, 163, 255, 0.28); } .root :global(.scan-ai-workspace.empty) { display: grid; place-items: center; } .root :global(.scan-ai-workspace-head) { display: flex; justify-content: space-between; gap: 18px; align-items: flex-end; margin-bottom: 18px; padding: 0 2px; } .root :global(.scan-ai-workspace-head span) { display: block; color: #4da3ff; font-size: 12px; font-weight: 800; letter-spacing: 0; } .root :global(.scan-ai-workspace-head strong) { display: block; color: #e6edf3; font-size: 22px; line-height: 1.2; margin-top: 4px; } .root :global(.scan-ai-workspace-head p) { max-width: 560px; margin: 0; color: #9fb2c7; font-size: 13px; line-height: 1.55; text-align: right; } .root :global(.scan-table-body::-webkit-scrollbar), .root :global(.scan-calendar-view::-webkit-scrollbar), .root :global(.scan-detail-panel::-webkit-scrollbar) { display: none; } .root :global(.scan-calendar-view), .root :global(.scan-detail-panel) { scrollbar-width: none; -ms-overflow-style: none; } .root :global(.scan-map-view), .root :global(.scan-calendar-view), .root :global(.scan-settings-view) { flex: 1; min-height: 0; } .root :global(.scan-map-view) { display: flex; flex-direction: column; gap: 12px; } .root :global(.scan-map-shell) { position: relative; flex: 1; min-height: 520px; border: 1px solid rgba(90, 123, 166, 0.12); border-radius: 18px; overflow: hidden; background: rgba(8, 17, 30, 0.8); } .root :global(.scan-map-shell .map) { position: absolute; inset: 0; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; border-radius: 18px; box-shadow: none; } .root :global(.scan-map-shell .leaflet-container) { width: 100%; height: 100%; background: #060d18; } .root :global(.scan-map-caption) { color: #8fa4c3; font-size: 13px; } .root :global(.scan-summary-card.wide) { grid-column: span 1; } .root :global(.scan-summary-label) { font-size: 13px; color: #8fa4c3; } .root :global(.scan-summary-value) { margin-top: 10px; font-size: 28px; font-weight: 800; color: #eef7ff; } .root :global(.scan-settings-view) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } .root :global(.scan-settings-copy) { margin-top: 10px; color: #c8d8ee; font-size: 14px; line-height: 1.6; } .root :global(.scan-table-row) { display: grid; grid-template-columns: minmax(220px, 1.1fr) minmax(128px, 0.68fr) minmax(230px, 1.08fr) minmax(150px, 0.78fr) 92px; gap: 10px; align-items: center; min-height: 132px; padding: 14px 18px; border: none; border-bottom: 1px solid rgba(90, 123, 166, 0.08); border-radius: 0; background: linear-gradient(180deg, rgba(10, 20, 35, 0.92), rgba(8, 17, 29, 0.92)); text-align: left; } .root :global(.scan-table-row > *), .root :global(.scan-table-header > *) { min-width: 0; } .root :global(.scan-table-row:hover) { transform: none; background: linear-gradient(180deg, rgba(11, 24, 40, 0.96), rgba(8, 18, 31, 0.96)); } .root :global(.scan-table-row.selected) { background: linear-gradient(180deg, rgba(7, 34, 35, 0.92), rgba(8, 19, 29, 0.92)); box-shadow: inset 0 0 0 1px rgba(23, 217, 139, 0.48); } .root :global(.scan-edge-cell) { display: flex; align-items: center; justify-content: center; } .root :global(.scan-city-cell) { display: block; } .root :global(.scan-city-copy) { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .root :global(.scan-city-name) { font-size: 18px; font-weight: 800; } .root :global(.scan-city-sub) { font-size: 14px; color: #a5bad5; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .root :global(.scan-time-cell) { display: flex; flex-direction: column; gap: 10px; } .root :global(.scan-time-main) { font-size: 16px; font-weight: 700; } .root :global(.scan-time-remaining) { font-size: 14px; color: #9eb3ce; } .root :global(.scan-phase-badge), .root :global(.scan-status-badge) { width: fit-content; padding: 6px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; border: 1px solid rgba(255, 255, 255, 0.12); text-transform: none; } .root :global(.scan-phase-badge.red) { color: #ff7f7f; background: rgba(255, 93, 93, 0.1); } .root :global(.scan-phase-badge.green) { color: #34e49f; background: rgba(23, 217, 139, 0.12); } .root :global(.scan-phase-badge.blue) { color: #7cb5ff; background: rgba(63, 140, 255, 0.12); } .root :global(.scan-phase-badge.amber) { color: #ffc14b; background: rgba(255, 176, 32, 0.12); } .root :global(.scan-distribution-preview) { display: block; min-width: 0; } .root :global(.scan-model-compare) { min-width: 0; display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border: 1px solid rgba(86, 120, 168, 0.16); border-radius: 12px; background: rgba(13, 27, 45, 0.7); } .root :global(.scan-model-primary) { display: grid; grid-template-columns: minmax(76px, 1fr) auto auto; gap: 8px; align-items: baseline; } .root :global(.scan-model-primary span), .root :global(.scan-model-rows b) { color: rgba(146, 168, 197, 0.92); font-size: 11px; font-weight: 800; } .root :global(.scan-model-primary strong) { color: #22eb98; font-size: 18px; font-weight: 900; line-height: 1; } .root :global(.scan-model-primary em) { color: #d7e7fb; font-size: 13px; font-style: normal; font-weight: 800; white-space: nowrap; } .root :global(.scan-model-rows) { display: flex; flex-direction: column; gap: 5px; } .root :global(.scan-model-rows span) { display: grid; grid-template-columns: 42px minmax(54px, auto) minmax(0, 1fr); gap: 8px; align-items: center; min-width: 0; } .root :global(.scan-model-rows strong) { color: #eef7ff; font-size: 13px; font-weight: 800; white-space: nowrap; } .root :global(.scan-model-rows em) { overflow: hidden; color: #9fb4cf; font-size: 12px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; } .root :global(.scan-trade-cell) { display: flex; flex-direction: column; gap: 8px; } .root :global(.scan-trade-main) { font-size: 17px; font-weight: 800; overflow-wrap: anywhere; } .root :global(.scan-trade-main.buy) { color: #26e896; } .root :global(.scan-trade-main.sell) { color: #ff6969; } .root :global(.scan-trade-sub), .root :global(.scan-trade-note) { font-size: 14px; color: #a5bad5; } .root :global(.scan-edge-cell) { font-size: 18px; font-weight: 800; } .root :global(.scan-edge-cell.positive) { color: #1de28f; } .root :global(.scan-edge-cell.negative) { color: #ff6868; } .root :global(.scan-row-fav) { display: none; } .root :global(.scan-view-all-wrap) { display: flex; justify-content: center; padding: 16px; } .root :global(.scan-view-all-button) { padding: 12px 18px; font-weight: 700; } .root :global(.scan-ai-log-panel) { display: flex; flex-direction: column; gap: 10px; padding: 12px 14px; border: 1px solid rgba(68, 100, 150, 0.18); border-radius: 16px; background: linear-gradient(180deg, rgba(9, 23, 38, 0.92), rgba(7, 17, 30, 0.92)), radial-gradient(circle at 0 0, rgba(34, 211, 238, 0.12), transparent 34%); } .root :global(.scan-ai-log-panel.compact) { flex: 0 0 auto; display: block; margin-top: 10px; padding: 0; overflow: hidden; border-radius: 14px; background: rgba(7, 17, 30, 0.72); } .root :global(.scan-ai-log-panel.compact .scan-ai-log-summary) { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 42px; padding: 0 14px; color: #9fb4cf; font-size: 12px; font-weight: 900; cursor: pointer; list-style: none; } .root :global(.scan-ai-log-panel.compact .scan-ai-log-summary::-webkit-details-marker) { display: none; } .root :global(.scan-ai-log-panel.compact .scan-ai-log-summary span) { color: #c7d8ef; } .root :global(.scan-ai-log-panel.compact .scan-ai-log-summary strong) { color: #7fb4ff; font-size: 12px; font-weight: 900; } .root :global(.scan-ai-log-panel.compact[open] .scan-ai-log-list) { padding: 0 12px 12px; } .root :global(.scan-ai-analysis-view) { display: flex; flex-direction: column; gap: 14px; min-height: 520px; } .root :global(.scan-ai-analysis-view.empty) { min-height: 620px; } .root :global(.scan-ai-summary-card) { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border: 1px solid rgba(34, 211, 238, 0.22); border-radius: 18px; background: linear-gradient(135deg, rgba(8, 32, 52, 0.94), rgba(8, 21, 38, 0.94)), radial-gradient(circle at 0 0, rgba(45, 212, 191, 0.15), transparent 32%); } .root :global(.scan-ai-summary-card strong) { color: #ecf8ff; font-size: 16px; font-weight: 900; } .root :global(.scan-ai-summary-card p) { margin: 6px 0 0; color: #a6bbd7; font-size: 13px; font-weight: 700; line-height: 1.55; } .root :global(.scan-ai-inline-button) { min-height: 42px; display: inline-flex; align-items: center; gap: 8px; padding: 0 16px; border: 1px solid rgba(45, 212, 191, 0.3); border-radius: 12px; color: #d9fff6; background: linear-gradient(135deg, rgba(13, 148, 136, 0.36), rgba(8, 47, 73, 0.4)); font-size: 13px; font-weight: 900; cursor: pointer; } .root :global(.scan-ai-inline-button:disabled) { cursor: not-allowed; opacity: 0.48; } .root :global(.scan-ai-log-panel.in-tab) { margin: 0; } .root :global(.scan-ai-city-list) { display: flex; flex-direction: column; gap: 12px; } .root :global(.scan-ai-city-card) { border: 1px solid rgba(68, 100, 150, 0.2); border-radius: 18px; overflow: hidden; background: rgba(10, 24, 42, 0.82); } .root :global(.scan-ai-city-head) { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 16px 18px; background: rgba(15, 34, 57, 0.9); } .root :global(.scan-ai-city-head strong) { color: #f2f8ff; font-size: 17px; font-weight: 900; } .root :global(.scan-ai-city-head p) { margin: 6px 0 0; color: #9fb4d2; font-size: 13px; font-weight: 700; line-height: 1.45; } .root :global(.scan-ai-city-head span) { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; color: #68f3c8; background: rgba(16, 185, 129, 0.12); border: 1px solid rgba(16, 185, 129, 0.2); font-size: 11px; font-weight: 900; } .root :global(.scan-ai-cluster-note) { margin: 0 18px 14px; padding: 10px 12px; border: 1px solid rgba(34, 211, 238, 0.18); border-radius: 12px; color: #b7cbe6; background: rgba(6, 18, 32, 0.5); font-size: 12px; font-weight: 800; line-height: 1.45; } .root :global(.scan-ai-contracts) { display: flex; flex-direction: column; padding: 0 12px 12px; } .root :global(.scan-ai-contract) { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 10px 16px; align-items: center; padding: 12px; border-top: 1px solid rgba(68, 100, 150, 0.16); } .root :global(.scan-ai-contract b) { display: block; color: #edf7ff; font-size: 13px; font-weight: 900; } .root :global(.scan-ai-contract small) { display: block; margin-top: 3px; color: #8fa8c7; font-size: 11px; font-weight: 800; } .root :global(.scan-ai-contract > span) { justify-self: end; padding: 5px 9px; border-radius: 999px; color: #a8bedc; background: rgba(68, 100, 150, 0.16); font-size: 11px; font-weight: 900; } .root :global(.scan-ai-contract.approve > span) { color: #23f0a8; background: rgba(16, 185, 129, 0.14); } .root :global(.scan-ai-contract.veto > span) { color: #ff8a8a; background: rgba(248, 113, 113, 0.12); } .root :global(.scan-ai-contract.downgrade > span), .root :global(.scan-ai-contract.watchlist > span) { color: #ffd166; background: rgba(245, 158, 11, 0.12); } .root :global(.scan-ai-contract p) { grid-column: 1 / -1; margin: 0; color: #9fb4d2; font-size: 12px; font-weight: 700; line-height: 1.45; } .root :global(.scan-ai-log-head) { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .root :global(.scan-ai-log-head strong) { color: #e9f5ff; font-size: 13px; font-weight: 900; } .root :global(.scan-ai-log-head span) { color: #8fa8c7; font-size: 12px; font-weight: 800; } .root :global(.scan-ai-log-list) { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; } .root :global(.scan-ai-log-list::-webkit-scrollbar) { height: 5px; } .root :global(.scan-ai-log-list::-webkit-scrollbar-thumb) { background: rgba(88, 125, 180, 0.26); border-radius: 999px; } .root :global(.scan-ai-log-item) { display: grid; grid-template-columns: auto minmax(180px, 1fr); gap: 8px; min-width: 260px; padding: 9px 10px; border: 1px solid rgba(68, 100, 150, 0.16); border-radius: 12px; background: rgba(14, 29, 48, 0.76); } .root :global(.scan-ai-log-item b) { display: block; color: #edf7ff; font-size: 12px; font-weight: 900; line-height: 1.25; } .root :global(.scan-ai-log-item small) { display: block; margin-top: 3px; color: #9fb4d2; font-size: 11px; font-weight: 700; line-height: 1.35; } .root :global(.scan-ai-log-time) { color: #7892b1; font-size: 11px; font-weight: 900; font-variant-numeric: tabular-nums; } .root :global(.scan-ai-log-item.info) { border-color: rgba(56, 189, 248, 0.22); } .root :global(.scan-ai-log-item.success) { border-color: rgba(16, 185, 129, 0.32); } .root :global(.scan-ai-log-item.warning) { border-color: rgba(245, 158, 11, 0.34); } .root :global(.scan-ai-log-item.error) { border-color: rgba(248, 113, 113, 0.34); } .root :global(.scan-ai-log-empty) { color: #8fa8c7; font-size: 12px; font-weight: 800; } .root :global(.scan-detail-panel) { width: auto; min-width: 0; padding: 18px 16px; border-left: 1px solid rgba(82, 114, 161, 0.18); } .root :global(.scan-detail-header) { padding: 0 0 16px; justify-content: space-between; border-bottom: none; margin-bottom: 10px; } .root :global(.scan-detail-top) { display: flex; gap: 0; align-items: center; } .root :global(.scan-detail-title-wrap) { display: flex; flex-direction: column; gap: 6px; } .root :global(.scan-detail-icon-button) { width: 40px; height: 40px; display: grid; place-items: center; } .root :global(.scan-detail-hero-placeholder) { width: 66px; height: 66px; border-radius: 14px; background: linear-gradient(135deg, #314d7b, #0d2038 60%, #08131f); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); } .root :global(.scan-detail-city-name) { font-size: 22px; font-weight: 800; } .root :global(.scan-detail-city-sub) { font-size: 14px; color: #a4bad6; } .root :global(.scan-detail-volume-row) { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; } .root :global(.scan-detail-volume-big) { font-size: 28px; font-weight: 800; } .root :global(.scan-detail-volume-caption) { margin-top: 4px; font-size: 14px; color: #90a7c4; } .root :global(.scan-detail-action-button) { padding: 11px 14px; font-weight: 700; } .root :global(.scan-detail-primary-actions) { display: flex; margin-bottom: 16px; } .root :global(.scan-detail-analysis-button) { width: 100%; border: 1px solid rgba(23, 217, 139, 0.3); border-radius: 14px; background: rgba(23, 217, 139, 0.12); color: #27ea98; padding: 12px 14px; font-size: 14px; font-weight: 800; text-align: center; } .root :global(.scan-detail-analysis-button:hover) { background: rgba(23, 217, 139, 0.18); border-color: rgba(23, 217, 139, 0.4); } .root :global(.scan-detail-section) { padding: 16px 0; border-bottom: 1px solid rgba(90, 123, 166, 0.12); } .root :global(.scan-detail-section-title) { font-size: 16px; font-weight: 800; color: #e8f2ff; text-transform: none; letter-spacing: 0; margin-bottom: 12px; } .root :global(.scan-kv-list) { display: flex; flex-direction: column; gap: 8px; } .root :global(.scan-kv) { display: flex; justify-content: space-between; gap: 14px; padding: 4px 0; color: #dbe7f8; } .root :global(.scan-kv span:first-child) { color: #91a8c6; } .root :global(.scan-kv strong) { font-size: 15px; } .root :global(.scan-kv strong.warn) { color: #ffbf39; } .root :global(.scan-kv strong.danger) { color: #ff7f7f; } .root :global(.scan-timeline-head) { display: flex; justify-content: space-between; color: #a1b6d2; font-size: 13px; } .root :global(.scan-timeline-bar) { position: relative; height: 8px; margin-top: 8px; border-radius: 999px; background: linear-gradient(90deg, #e83c3c 0 72%, rgba(255, 255, 255, 0.18) 72% 100%); } .root :global(.scan-timeline-knob) { position: absolute; top: 50%; width: 16px; height: 16px; border-radius: 50%; background: #dfe8f6; box-shadow: 0 0 0 4px rgba(223, 232, 246, 0.12); transform: translate(-50%, -50%); } .root :global(.scan-timeline-caption) { margin-top: 8px; color: #a1b6d2; font-size: 13px; text-align: right; } .root :global(.scan-chart-legend) { display: flex; gap: 16px; margin-bottom: 14px; color: #a8bdd8; font-size: 13px; } .root :global(.scan-chart-legend .dot) { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; vertical-align: middle; } .root :global(.scan-chart-legend .dot.green) { background: #1ce393; } .root :global(.scan-chart-legend .dot.blue) { background: #4ca2ff; } .root :global(.scan-chart-bars) { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; height: 170px; padding: 8px 4px 0; } .root :global(.scan-chart-group) { flex: 1; display: flex; justify-content: center; align-items: flex-end; gap: 6px; position: relative; } .root :global(.scan-chart-group.highlighted .scan-chart-label) { color: #22eb98; font-weight: 800; } .root :global(.scan-chart-col) { width: 20px; border-radius: 8px 8px 0 0; } .root :global(.scan-chart-col.model) { background: linear-gradient(180deg, #1ce393, #0b8d5a); } .root :global(.scan-chart-col.market) { background: linear-gradient(180deg, #4ca2ff, #2263cf); } .root :global(.scan-chart-label) { position: absolute; bottom: -24px; left: 50%; transform: translateX(-50%); color: #93a8c4; font-size: 13px; } .root :global(.scan-trade-cards) { grid-template-columns: 1fr 1fr; gap: 12px; } .root :global(.scan-trade-card) { padding: 16px; border-radius: 16px; background: rgba(11, 24, 42, 0.92); border: 1px solid rgba(255, 255, 255, 0.08); } .root :global(.scan-trade-card.buy) { box-shadow: inset 0 0 0 1px rgba(23, 217, 139, 0.22); } .root :global(.scan-trade-card.sell) { box-shadow: inset 0 0 0 1px rgba(255, 93, 93, 0.22); } .root :global(.scan-trade-card-title) { font-size: 16px; font-weight: 800; } .root :global(.scan-trade-card.buy .scan-trade-card-title) { color: #20e391; } .root :global(.scan-trade-card.sell .scan-trade-card-title) { color: #ff7070; } .root :global(.scan-trade-card p) { margin: 10px 0 0; color: #d5e1f5; font-size: 14px; } .root :global(.scan-trade-card p.positive) { color: #20e391; } .root :global(.scan-trade-card p.negative) { color: #ff7070; } .root :global(.scan-detail-score-block) { margin-top: 18px; padding-top: 16px; } .root :global(.scan-detail-score-head) { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; } .root :global(.scan-detail-score-label-text) { font-size: 16px; font-weight: 800; } .root :global(.scan-detail-score-meta) { margin-top: 6px; color: #89a0bf; font-size: 13px; } .root :global(.scan-detail-score-value) { font-size: 40px; font-weight: 800; } .root :global(.scan-detail-score-value.green) { color: #23e694; } .root :global(.scan-detail-score-value.yellow) { color: #ffbe26; } .root :global(.scan-detail-score-value.red) { color: #ff6f86; } .root :global(.scan-detail-score-value span) { font-size: 22px; color: #9fb5d2; } .root :global(.scan-detail-score-line) { height: 6px; margin-top: 10px; overflow: hidden; border-radius: 999px; background: rgba(255, 255, 255, 0.08); } .root :global(.scan-detail-score-line span) { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #1be392, #12b46d); box-shadow: 0 0 18px rgba(27, 227, 146, 0.22); } .root :global(.scan-empty-state) { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 48px 32px; text-align: center; } .root :global(.scan-empty-title) { font-size: 20px; font-weight: 800; color: #e8f2ff; } .root :global(.scan-empty-copy) { margin-top: 10px; font-size: 14px; color: #8fa4c3; line-height: 1.6; } .root :global(.scan-loading-state) { flex: 1; min-height: 520px; display: grid; place-items: center; padding: 48px 32px; text-align: center; } .root :global(.scan-loading-signal) { position: relative; width: min(100%, 420px); display: grid; justify-items: center; gap: 18px; padding: 28px 30px; border: 1px solid rgba(125, 211, 252, 0.14); border-radius: 28px; background: radial-gradient(circle at 18% 18%, rgba(77, 163, 255, 0.18), transparent 34%), linear-gradient(145deg, rgba(12, 20, 36, 0.92), rgba(5, 11, 22, 0.74)); box-shadow: 0 22px 70px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05); overflow: hidden; } .root :global(.scan-loading-signal::before) { content: ""; position: absolute; inset: 0; background: linear-gradient( 100deg, transparent 0%, rgba(125, 211, 252, 0.08) 42%, rgba(34, 197, 94, 0.1) 50%, transparent 58% ); transform: translateX(-120%); animation: scan-loading-sweep 2.6s ease-in-out infinite; pointer-events: none; } .root :global(.scan-loading-signal.compact) { width: min(100%, 340px); gap: 12px; padding: 18px 20px; border-radius: 22px; background: radial-gradient(circle at 20% 20%, rgba(77, 163, 255, 0.14), transparent 36%), rgba(10, 18, 32, 0.62); box-shadow: none; } .root :global(.scan-loading-decision-flow) { position: relative; z-index: 1; display: grid; grid-template-columns: 16px minmax(70px, 1fr) 16px minmax(70px, 1fr) 16px; align-items: center; width: min(100%, 300px); } .root :global(.scan-loading-node) { width: 16px; height: 16px; border: 1px solid rgba(226, 232, 240, 0.16); border-radius: 999px; background: #0b1220; box-shadow: 0 0 0 5px rgba(77, 163, 255, 0.05); } .root :global(.scan-loading-node.hot) { background: linear-gradient(135deg, #f97316, #fde047); box-shadow: 0 0 24px rgba(251, 146, 60, 0.26); } .root :global(.scan-loading-node.market) { background: linear-gradient(135deg, #38bdf8, #4da3ff); box-shadow: 0 0 24px rgba(56, 189, 248, 0.26); } .root :global(.scan-loading-node.action) { background: linear-gradient(135deg, #22c55e, #1be392); box-shadow: 0 0 24px rgba(34, 197, 94, 0.3); animation: scan-loading-node-breathe 1.8s ease-in-out infinite; } .root :global(.scan-loading-rail) { position: relative; height: 2px; overflow: hidden; background: rgba(148, 163, 184, 0.16); } .root :global(.scan-loading-rail i) { position: absolute; inset: 0; width: 48%; border-radius: 999px; background: linear-gradient(90deg, transparent, #7dd3fc, #22c55e); transform: translateX(-110%); animation: scan-loading-rail-flow 1.55s ease-in-out infinite; } .root :global(.scan-loading-rail:nth-of-type(4) i) { animation-delay: 0.45s; } .root :global(.scan-loading-copy-block) { position: relative; z-index: 1; display: grid; gap: 7px; justify-items: center; } .root :global(.scan-loading-copy-block strong) { color: #e6edf3; font-size: 18px; font-weight: 900; letter-spacing: -0.02em; } .root :global(.scan-loading-copy-block span) { max-width: 320px; color: #9fb2c7; font-size: 13px; font-weight: 650; line-height: 1.55; } .root :global(.scan-loading-signal-bars) { position: relative; z-index: 1; display: flex; align-items: end; gap: 5px; height: 28px; } .root :global(.scan-loading-signal-bars span) { width: 7px; min-height: 8px; border-radius: 999px 999px 4px 4px; background: linear-gradient(180deg, #7dd3fc, #4da3ff 52%, #1be392); opacity: 0.42; transform-origin: center bottom; animation: scan-loading-bars 1.35s ease-in-out infinite; } .root :global(.scan-loading-signal-bars span:nth-child(1)) { height: 12px; } .root :global(.scan-loading-signal-bars span:nth-child(2)) { height: 22px; animation-delay: 0.16s; } .root :global(.scan-loading-signal-bars span:nth-child(3)) { height: 16px; animation-delay: 0.32s; } .root :global(.scan-loading-signal-bars span:nth-child(4)) { height: 25px; animation-delay: 0.48s; } @keyframes scan-loading-sweep { 0% { transform: translateX(-130%); } 46%, 100% { transform: translateX(130%); } } @keyframes scan-loading-rail-flow { 0% { transform: translateX(-110%); opacity: 0.15; } 45% { opacity: 1; } 100% { transform: translateX(220%); opacity: 0.15; } } @keyframes scan-loading-node-breathe { 0%, 100% { transform: scale(0.92); filter: saturate(0.9); } 50% { transform: scale(1.08); filter: saturate(1.25); } } @keyframes scan-loading-bars { 0%, 100% { opacity: 0.38; transform: scaleY(0.72); } 50% { opacity: 0.95; transform: scaleY(1); } }