/* Scanner layout; dimensions and palette are supplied by tokens.css. */
.scanner { line-height: 1.5; }
.scanner header { margin-bottom: var(--size-16); }
.scanner .stats-row { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; background: var(--color-surface); border: var(--size-1) solid var(--color-border); border-radius: var(--size-12); margin-bottom: var(--size-12); }
.scanner .stat-card { border: 0; border-radius: 0; background: transparent; text-align: left; padding: var(--size-12) var(--size-20); }
.scanner .stat-card + .stat-card { border-left: var(--size-1) solid var(--color-border); }
.scanner .stat-value { font-size: var(--size-24); font-variant-numeric: tabular-nums; }
.scanner .countdown-row { display: flex; flex-wrap: wrap; gap: var(--size-8) var(--size-24); margin-bottom: var(--size-16); }
.scanner .countdown-card { display: flex; align-items: center; gap: var(--size-8); padding: 0; border: 0; background: transparent; }
.scanner .countdown-label { margin: 0; }
.scanner .countdown-timer { font-size: var(--size-13); font-weight: 500; font-variant-numeric: tabular-nums; }
.scanner .countdown-timer.warning { animation: none; }
.scanner .countdown-exchanges { display: none; }
.filter-panel { margin-bottom: var(--size-16); }
.filter-panel > summary { cursor: pointer; color: var(--color-text-muted); font-size: var(--size-13); min-height: var(--size-44); padding: var(--size-12) 0; }
.scanner .filters { margin: 0; padding: var(--size-12) 0; gap: var(--size-16); }
.scanner .filters input, .scanner .filters select { min-height: var(--size-40); }
.list-heading { display: flex; align-items: center; gap: var(--size-8); margin-bottom: var(--size-12); }
.list-heading h2 { font-size: var(--size-16); font-weight: 600; margin-right: auto; }
.list-heading label { color: var(--color-text-muted); font-size: var(--size-12); display: flex; align-items: center; gap: var(--size-8); }
.list-heading select { max-width: var(--size-180); min-height: var(--size-40); }
#sortDirection, .sort-direction { border: var(--size-1) solid var(--color-border); border-radius: var(--size-6); background: var(--color-surface-raised); color: var(--color-text); width: var(--size-40); height: var(--size-40); cursor: pointer; }
.scanner th, .scanner td { padding: var(--size-8) var(--size-16); }
.scanner td.numeric, .scanner th.numeric, .scanner .price-cell { text-align: right; font-variant-numeric: tabular-nums; }
.scanner .return-cell { font-size: var(--size-18); }
.scanner .pair-details { min-width: var(--size-120); }
.scanner .pair-details summary { cursor: pointer; color: var(--color-accent); min-height: var(--size-28); display: flex; align-items: center; gap: var(--size-8); }
.scanner .pair-details summary::before { content: '+'; }
.scanner .pair-details[open] summary::before { content: '−'; }
.pair-metrics { display: grid; grid-template-columns: auto auto; gap: var(--size-8) var(--size-16); font-size: var(--size-12); margin: var(--size-8) 0 var(--size-12); }
.pair-metrics span:nth-child(odd) { color: var(--color-text-muted); }
.pair-metrics span:nth-child(even) { text-align: right; font-variant-numeric: tabular-nums; }
.trade-link { display: inline-flex; align-items: center; min-height: var(--size-44); color: var(--color-accent); text-decoration: none; font-size: var(--size-13); }
.scanner .history-section { border: 0; border-top: var(--size-1) solid var(--color-border); border-radius: 0; background: transparent; padding: var(--size-24) 0; }
.scanner .history-desc { max-width: 100%; }
.scanner .clickable-row:hover { background: var(--color-surface-hover) !important; }
.scanner .clickable-row:hover td { color: inherit !important; }
#basisTable td:nth-child(6), #kimchiTable td:nth-child(6) { text-align: right; font-variant-numeric: tabular-nums; }
@media (min-width: 769px) { .filter-panel > summary { display: none; } }
@media (max-width: 768px) {
    .scanner { padding: var(--size-16); padding-bottom: calc(var(--size-80) + env(safe-area-inset-bottom)); }
    .scanner header { flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--size-12); }
    .scanner .logo { max-width: var(--size-180); object-fit: contain; }
    .scanner .subtitle { display: none; }
    .scanner .header-right { width: auto; flex: 1; justify-content: flex-end; gap: var(--size-8); }
    .scanner .last-update { font-size: var(--size-11); }
    .scanner .refresh-btn { min-height: var(--size-40); padding: var(--size-8); }
    .scanner .stats-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .scanner .stat-card { padding: var(--size-12); }
    .scanner .stat-card:nth-child(3) { border-left: 0; }
    .scanner .stat-card:nth-child(n+3) { border-top: var(--size-1) solid var(--color-border); }
    .scanner .stat-value { font-size: var(--size-20); }
    .scanner .countdown-row { gap: var(--size-4) var(--size-12); }
    .scanner .countdown-label { font-size: var(--size-11); }
    .scanner .countdown-timer { font-size: var(--size-12); }
    .filter-panel { border-bottom: var(--size-1) solid var(--color-border); }
    .scanner .filters { display: grid; grid-template-columns: 1fr; }
    .scanner .filter-group input, .scanner .filter-group select { max-width: var(--size-200); min-height: var(--size-44); }
    .list-heading { flex-wrap: wrap; }
    .list-heading h2 { width: 100%; }
    .list-heading label { flex: 1; }
    .list-heading select { flex: 1; max-width: none; }
    .scanner .table-container { overflow: visible; margin: 0; border: 0; border-radius: 0; background: transparent; }
    .scanner .table-container table { display: block; min-width: 0; width: 100%; }
    .scanner .table-container thead { display: none; }
    .scanner .table-container tbody { display: grid; gap: var(--size-12); }
    .scanner .table-container tr { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--size-8); padding: var(--size-12); background: var(--color-surface); border: var(--size-1) solid var(--color-border); border-radius: var(--size-12); }
    .scanner .table-container td { display: block; padding: 0; border: 0; white-space: normal; min-width: 0; overflow-wrap: anywhere; }
    .scanner .table-container td::before { content: attr(data-label); display: block; color: var(--color-text-muted); font-size: var(--size-11); font-weight: 400; margin-bottom: var(--size-4); }
    .scanner .table-container td:first-child { grid-column: 1; grid-row: 1; align-self: center; }
    .scanner .table-container td:first-child::before { display: none; }
    .scanner .return-cell, #basisTable td:nth-child(6), #kimchiTable td:nth-child(6) { grid-column: 2; grid-row: 1; text-align: right; font-size: var(--size-18); }
    .scanner .long-cell { grid-column: 1; grid-row: 2; }
    .scanner .short-cell { grid-column: 2; grid-row: 2; text-align: right; }
    .scanner .detail-cell { grid-column: 1 / -1; border-top: var(--size-1) solid var(--color-border) !important; padding-top: var(--size-4) !important; }
    .scanner .detail-cell::before { display: none !important; }
    .scanner .table-container td[colspan] { grid-column: 1 / -1; }
    .scanner .exchange-badge { font-size: var(--size-12); padding: 0; max-width: 100%; }
    .scanner .history-section { margin: var(--size-24) 0 0; }
    .scanner .history-stats { gap: var(--size-12); flex-wrap: wrap; }
    .scanner .legend { font-size: var(--size-11); }
    .scanner .history-desc { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

.mobile-sort { display: none; }
@media (max-width: 768px) { .mobile-sort { display: flex; } }


/* Compact identity: logo + name, without CEX/DEX pills. */
.scanner .exchange-badge.cex, .scanner .exchange-badge.dex {
    background: transparent;
    color: var(--color-text);
    padding: 0;
    border-radius: 0;
    gap: var(--size-8);
    font-size: var(--size-13);
    line-height: var(--size-20);
}
.scanner .exchange-logo, .scanner .exchange-logo-fallback {
    width: var(--size-18);
    height: var(--size-18);
    flex: 0 0 var(--size-18);
}
.scanner .exchange-logo { object-fit: contain; border-radius: 0; }
.scanner .exchange-logo-fallback {
    display: none;
    align-items: center;
    justify-content: center;
    color: var(--color-text-muted);
    font-size: var(--size-11);
    font-weight: 600;
}
.scanner .exchange-name { white-space: nowrap; }