.fx-notice { background: #fff7e6; border: 2px solid var(--warn); border-radius: 12px; padding: 12px 16px; margin: 1rem 0; }
.fx-notice strong { display: block; font-size: 1.1rem; color: var(--warn); }
.fx-notice p { margin: .35rem 0 0; font-size: 1rem; }
.fx-date { margin: .75rem 0; font-size: 1rem; }
.fx-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.fx-grid > * { min-width: 0; }
.fx-dir { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0; }
.fx-dir .btn { padding: 0 6px; }
.fx-dir .btn[aria-pressed="true"] { background: var(--brand); color: #fff; }
.fx-tool .total-box { margin-top: 12px; }
.fx-tool .total-box strong { overflow-wrap: anywhere; }
.fx-tool .total-box span { font-size: .95rem; }
.fx-table { border-collapse: collapse; width: 100%; font-size: 1rem; }
.fx-table th, .fx-table td { border: 1px solid var(--line); padding: 8px; vertical-align: middle; }
.fx-table thead th { background: var(--soft); text-align: left; font-weight: 600; }
.fx-table tbody th { text-align: left; font-weight: 600; }
.fx-table small { color: var(--muted); font-weight: 400; }
.fx-table .num { text-align: right; white-space: nowrap; }
.fx-up { color: var(--bad); }
.fx-down { color: var(--ok); }
.fx-flat { color: var(--muted); }
@media (max-width: 480px) {
  .fx-table th, .fx-table td { padding: 6px; font-size: .95rem; }
  .fx-dir .btn { font-size: .95rem; }
}
