/* Tools hub: the tool search's matching list (the design's result rows) and the highlight of a card jumped to
 * (assets/js/p/tools.js). */
html main #tl-results[data-open] { display: flex; }
html main .wc-tl-opt { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 60px; padding: 8px 12px; border: 0; border-radius: 16px; background: rgba(0, 0, 0, 0); cursor: pointer; font: inherit; text-align: left; color: #F5F5F7; }
html main .wc-tl-opt[aria-selected="true"] { background: rgba(255, 255, 255, 0.07); }
html main .wc-tl-ic { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; }
html main .wc-tl-calc { background: linear-gradient(145deg, #5E9EFF, #2F6BD8); }
html main .wc-tl-conv { background: linear-gradient(145deg, #5AC8FA, #0071A4); }
html main .wc-tl-mkt { background: linear-gradient(145deg, #FFB340, #E07800); }
html main .wc-tl-port { background: linear-gradient(145deg, #BF8CFF, #7B3FE4); }
html main .wc-tl-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
html main .wc-tl-n { font-size: 16px; font-weight: 600; letter-spacing: -0.01em; }
html main .wc-tl-s { font-size: 13px; color: #86868B; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html main .wc-tl-go { flex: none; opacity: 0; font-size: 13px; font-weight: 600; color: #86868B; }
html main .wc-tl-opt[aria-selected="true"] .wc-tl-go { opacity: 1; }
html main .wc-tl-none { padding: 18px 14px; font-size: 15px; line-height: 1.45; color: #86868B; text-align: center; }
html main label.wc-tl-focus { box-shadow: rgba(41, 151, 255, 0.9) 0 0 0 1px inset; }
html main a.wc-tl-hi { box-shadow: rgb(41, 151, 255) 0 0 0 2px, rgba(0, 0, 0, 0.5) 0 18px 48px; }

html[data-theme=light] main .wc-tl-opt { color: #1D1D1F; }
html[data-theme=light] main .wc-tl-opt[aria-selected="true"] { background: rgba(0, 0, 0, 0.05); }
html[data-theme=light] main .wc-tl-s, html[data-theme=light] main .wc-tl-go, html[data-theme=light] main .wc-tl-none { color: #6E6E73; }
html[data-theme=light] main label.wc-tl-focus { box-shadow: rgba(0, 113, 227, 0.8) 0 0 0 1px inset; }
html[data-theme=light] main a.wc-tl-hi { box-shadow: rgb(0, 113, 227) 0 0 0 2px, rgba(0, 0, 0, 0.12) 0 18px 48px; }

/* gas and halving cards when their reading is older than 30 minutes (the scheduler stopped): the badge says Delayed
 * in orange instead of the green Live, the note gives the reading's time in orange */
html main [data-wc-old="1"] { color: rgb(255, 159, 10); }
html main span[data-wc-old="1"] > span[aria-hidden="true"] { background: rgb(255, 159, 10); }
html main span[data-wc-old="1"]:has(> span[aria-hidden="true"]) { background: rgba(255, 159, 10, 0.14); }
html[data-theme=light] main [data-wc-old="1"] { color: rgb(201, 52, 0); }
html[data-theme=light] main span[data-wc-old="1"] > span[aria-hidden="true"] { background: rgb(201, 52, 0); }
html[data-theme=light] main span[data-wc-old="1"]:has(> span[aria-hidden="true"]) { background: rgba(201, 52, 0, 0.12); }