/* tweetpad's Bordrless section (/borderless), on top of feature.css, scan.css and b.css (Bordrless's look): the tabs, the token
   rows, the launcher and the hooks. */
.bh-mark { width: 16px; height: 16px; filter: grayscale(1) contrast(1.2); }

/* the three tabs, ink segments under the bar */
.bh-tabs { display: flex; flex: none; border-bottom: 2px solid #111; background: #111; }
.bh-tabs button { flex: 1; padding: 9px 0 8px; color: #cfcfca; font: 400 15px/1 var(--head); letter-spacing: .02em; background: #111; border: 0; border-right: 1px solid #333;
  box-shadow: none; border-radius: 0; }
.bh-tabs button:last-child { border-right: 0; }
.bh-tabs button:hover { color: #fff; background: #1d1d1d; transform: none; box-shadow: none; }
.bh-tabs button[aria-selected="true"] { color: #111; background: #f2c230; }
.bh-pane { display: flex; flex-direction: column; gap: 8px; }
.bh-pane[hidden] { display: none; }

/* tokens: the search, then rows by market cap */
.bh-search { display: flex; gap: 8px; align-items: center; }
.bh-search input.text { flex: 1; min-width: 0; padding: 8px 10px; font: 12px/1.2 var(--mono); background: #fff; border: 2px solid #111; border-radius: 0; box-shadow: none; }
.bh-search input.text:focus { border-color: var(--blue); }
.bh-list { margin: 0; padding: 0; list-style: none; background: #fff; border: 2px solid #111; box-shadow: 4px 4px 0 #111; }
.bh-list li + li { border-top: 1px solid var(--line); }
.scroll a.bh-row { display: flex; align-items: center; gap: 9px; padding: 7px 9px; color: #111; text-decoration: none; }
.scroll a.bh-row:hover { color: #111; background: #fbf3d6; }
.bh-pic { width: 36px; height: 36px; flex: none; object-fit: cover; border: 2px solid #111; background: #cfcfca; }
.bh-pic.sc-ph { display: grid; place-items: center; font: 400 18px/1 var(--head); }
.bh-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bh-main b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font: 700 13px/1.2 var(--ui); }
.bh-main small { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--dim); font: 10px/1.3 var(--mono); }
.bh-rank { color: var(--dim); font: 700 10px/1 var(--mono); }
.bh-mkt { width: 72px; flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.bh-mkt b { font: 700 13px/1.2 var(--mono); }
.bh-mkt small { font: 700 10px/1.2 var(--mono); }

/* the launcher */
.bh-coin { display: flex; gap: 8px; padding-top: 6px; }
.bh-drop { position: relative; width: 74px; height: 74px; flex: none; display: grid; place-items: center; cursor: pointer; overflow: hidden; text-align: center;
  color: var(--dim); font: 700 11px/1.3 var(--mono); background: #fff; border: 2px dashed #111; }
.bh-drop.has { border-style: solid; box-shadow: 3px 3px 0 #111; }
.bh-drop img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bh-fields { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.bh-fields input.text, .bh-desc { padding: 8px 9px; font: 500 13px/1.2 var(--ui); background: #fff; border: 2px solid #111; border-radius: 0; box-shadow: none; }
.bh-fields input.text:focus, .bh-desc:focus { border-color: var(--blue); }
.bh-desc { margin: 8px 0 4px; min-height: 40px; resize: vertical; }
.bh-label { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-top: 8px; }
.bh-label b { font: 700 11px/1 var(--mono); }
.bh-label span { color: var(--dim); font: 10px/1.2 var(--mono); text-align: right; }
.bh-chips { flex-wrap: wrap; margin: 6px 0 2px; }
.sc-note.bad { color: var(--bad); }
.bh-cost { margin: 0; text-align: center; font: 10px/1.4 var(--mono); }
.bh-checks { padding: 8px 10px; background: #fff; border: 2px solid #111; }
.bh-checks a { color: #111; text-decoration: underline; }
.bh-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 4px; }
.bh-actions .btn { padding: 6px 10px; font-size: 11px; box-shadow: 2px 2px 0 #111; }

/* the hooks */
.bh-hook { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; border-top: 1px solid var(--line); }
.sc-card-head + .bh-hook, .sc-card-head + .sc-note + .bh-hook { border-top: 0; }
.bh-hook-head { display: flex; align-items: center; gap: 8px; }
.bh-hook-head b { font: 400 18px/1.1 var(--head); letter-spacing: .01em; }
.bh-hook-head .btn { margin-left: auto; padding: 5px 9px; font-size: 11px; box-shadow: 2px 2px 0 #111; }
.bh-title { font: 700 12px/1.3 var(--ui); }
.bh-verdict { margin-left: auto; padding: 3px 6px; color: #fff; font: 700 9px/1 var(--mono); text-transform: uppercase; }
.bh-verdict.ok { background: var(--ok); }
.bh-verdict.warn { background: var(--warn); }
.bh-verdict.bad { background: var(--bad); }
.bh-watch { margin: 4px 0 2px; padding: 0 0 0 2px; list-style: none; display: grid; gap: 3px; color: var(--soft); font-size: 11px; }
.bh-watch li::before { content: "■ "; color: var(--warn); font-size: 8px; vertical-align: 1px; }

/* the card image: the section's still, the tabs hidden */
html[data-mode="card"] .bh-tabs, html[data-mode="card"] .bh-pane { display: none; }