/* Scan my book — broker pilot (v5.9.0). Shares tokens with styles.css. */
.book-main { padding: 28px 18px 40px; }
.bk-view h1 { margin: 6px 0 0; }
.kicker {
  font: 600 0.74rem 'Inter', sans-serif; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--azure); margin: 0;
}
.fine { color: var(--muted); font-size: 0.84rem; }
.bk-error {
  margin: 12px 0 0; padding: 10px 14px; border-radius: var(--r-sm); font-size: 0.9rem;
  color: #F3C2C2; background: rgba(224, 92, 92, 0.12); border: 1px solid rgba(224, 92, 92, 0.45);
}
.bk-facts { list-style: none; padding: 0; margin: 20px 0 6px; display: grid; gap: 8px; }
.bk-facts li {
  padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface);
  font-size: 0.92rem;
}
.bk-facts b { color: var(--heading); font-weight: 600; margin-right: 6px; }

.bk-form { margin-top: 22px; display: grid; gap: 14px; }
.bk-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bk-form label { display: grid; gap: 6px; font-size: 0.8rem; color: var(--muted); }
.bk-form input {
  width: 100%; padding: 11px 12px; border-radius: var(--r-sm); border: 1px solid var(--border);
  background: var(--surface); color: var(--heading); font: 500 0.95rem 'Inter', sans-serif;
}
.bk-form input:focus { outline: none; border-color: var(--azure); }
.bk-form .btn { justify-self: start; }
.btn.gold-btn.solid, .bk-view .btn.gold-btn { background: var(--gold); color: #141414; border-color: var(--gold); font-weight: 600; }
.bk-view .btn.gold-btn:hover { filter: brightness(1.07); background: var(--gold); }
.btn.file-btn { display: inline-block; cursor: pointer; }

.bk-cards { margin-top: 20px; }
.bk-card { border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); padding: 18px; display: grid; gap: 10px; align-content: start; }
.bk-card h3 { margin: 0; font-size: 1rem; }
.bk-card p { margin: 0; font-size: 0.88rem; }
.bk-card .btn { justify-self: start; }

.bk-table-wrap { overflow-x: auto; margin-top: 16px; border: 1px solid var(--border); border-radius: var(--r-md); }
.bk-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; min-width: 560px; }
.bk-table th, .bk-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--border); vertical-align: top; }
.bk-table th { font: 600 0.72rem 'Inter', sans-serif; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); background: var(--surface); }
.bk-table tr:last-child td { border-bottom: 0; }
.bk-table td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.bk-table .client { color: var(--heading); font-weight: 600; }
.bk-table .sub { display: block; color: var(--muted); font-size: 0.78rem; font-weight: 400; margin-top: 2px; }
.bk-table select {
  width: 100%; max-width: 260px; padding: 7px 8px; border-radius: var(--r-sm); border: 1px solid var(--border);
  background: var(--surface-2); color: var(--heading); font: 500 0.84rem 'Inter', sans-serif;
}
.bk-table .ok { color: var(--covered); }
.bk-table .warn { color: var(--silent); }
.bk-table .bad { color: var(--excluded); }
.bk-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }

.bk-drop {
  display: grid; gap: 4px; justify-items: center; text-align: center; margin-top: 18px; padding: 30px 18px;
  border: 1.5px dashed var(--border); border-radius: var(--r-md); background: var(--surface); cursor: pointer;
}
.bk-drop.over { border-color: var(--azure); background: var(--azure-dim); }
.bk-drop-title { color: var(--heading); font-weight: 600; }

.bk-progress { height: 6px; border-radius: 3px; background: var(--surface-2); overflow: hidden; margin-top: 18px; }
.bk-progress div { height: 100%; width: 0; background: linear-gradient(90deg, var(--azure), var(--gold)); transition: width .6s var(--ease); }
.bk-legend { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 22px; font-size: 0.82rem; }

.bk-ranked td.rank { color: var(--gold); font: 600 1.05rem 'Space Grotesk', sans-serif; white-space: nowrap; }
.bk-ranked .bar { display: flex; height: 6px; border-radius: 3px; overflow: hidden; background: var(--surface-2); min-width: 120px; margin-top: 6px; }
.bk-ranked .bar i { display: block; height: 100%; }
.bk-ranked .bar .ex { background: var(--excluded); }
.bk-ranked .bar .si { background: var(--silent); }
.bk-ranked .bar .co { background: var(--covered); }
.bk-ranked .word { color: var(--heading); font-weight: 600; white-space: nowrap; }
.bk-ranked .aichip {
  display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 0.74rem; font-weight: 600;
  border: 1px solid rgba(77, 166, 255, 0.5); color: var(--azure); background: var(--azure-dim); white-space: nowrap;
}
.bk-ranked .aichip.none { border-color: var(--border); color: var(--muted); background: transparent; }
.bk-ranked .status { white-space: nowrap; }
.bk-ranked .spin { display: inline-block; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--border); border-top-color: var(--azure); animation: bkspin 1s linear infinite; vertical-align: -1px; margin-right: 6px; }
@keyframes bkspin { to { transform: rotate(360deg); } }
.bk-ranked a.open { white-space: nowrap; }
.bk-ranked a.client-link { color: var(--heading); text-decoration: underline; text-decoration-color: rgba(77,166,255,0.5); text-underline-offset: 3px; }
.bk-ranked a.client-link:hover { color: var(--azure); }
#book-disclaimer { margin-top: 24px; }

@media (max-width: 640px) {
  .bk-grid2 { grid-template-columns: 1fr; }
  .bk-table { min-width: 520px; }
  .header-tag { display: none; }
}

/* v5.9.2 — client cards (fill in on the page; spreadsheet upload is the alternative) */
.bk-clients { display: grid; gap: 14px; margin-top: 20px; }
.bk-client { border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); padding: 14px 16px 16px; }
.bk-client-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.bk-client-n { font: 600 0.74rem 'Inter', sans-serif; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold); }
.bk-remove { background: none; border: 0; color: var(--muted); font: 500 0.8rem 'Inter', sans-serif; cursor: pointer; padding: 4px 6px; }
.bk-remove:hover { color: var(--excluded); }
.bk-client-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 12px; }
.bk-client-grid label { display: grid; gap: 5px; font-size: 0.78rem; color: var(--muted); }
.bk-client-grid .span2 { grid-column: span 2; }
.bk-client-grid input, .bk-client-grid select {
  width: 100%; min-width: 0; padding: 10px 11px; border-radius: var(--r-sm); border: 1px solid var(--border);
  background: var(--surface-2); color: var(--heading); font: 500 0.92rem 'Inter', sans-serif; -webkit-appearance: none; appearance: none;
}
.bk-client-grid input:focus, .bk-client-grid select:focus { outline: none; border-color: var(--azure); }
.bk-client-grid input[type="date"] { min-height: 42px; }
.bk-actions-tight { margin-top: 12px; align-items: center; }
.bk-alt { margin-top: 22px; border: 1px dashed var(--border); border-radius: var(--r-md); padding: 0 16px; }
.bk-alt summary { cursor: pointer; padding: 14px 0; color: var(--azure); font-weight: 500; font-size: 0.92rem; list-style: none; }
.bk-alt summary::-webkit-details-marker { display: none; }
.bk-alt summary::before { content: '+ '; color: var(--muted); }
.bk-alt[open] summary::before { content: '– '; }
.bk-alt-body { padding: 0 0 16px; display: grid; gap: 10px; }
.bk-alt-body p { margin: 0; }
@media (max-width: 640px) {
  .bk-client-grid { grid-template-columns: 1fr 1fr; }
  .bk-client-grid .span2 { grid-column: span 2; }
}
.bk-summary { margin: 10px 0 0; font-size: 0.88rem; color: var(--covered); }
.bk-summary:empty { display: none; }

/* v5.10.0 — rings in a row + sample book */
.bk-sample-note { margin: 10px 0 0; padding: 8px 12px; border-radius: var(--r-sm); border: 1px solid rgba(217,180,91,0.45); background: rgba(217,180,91,0.08); color: var(--heading); font-size: 0.86rem; display: inline-block; }
.bk-rings { margin-top: 22px; display: grid; gap: 14px; }
.bk-ring { display: grid; justify-items: center; text-align: center; gap: 2px; padding: 16px 12px 14px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); color: inherit; text-decoration: none; position: relative; }
a.bk-ring:hover { border-color: var(--azure); }
.bk-ring svg { width: 170px; max-width: 100%; height: auto; display: block; margin: 4px 0 0; }
.bk-ring svg text { font-family: 'Space Grotesk', sans-serif; }
.bk-ring-book svg { width: 230px; }
.bk-ring-rank { position: absolute; top: 10px; left: 12px; color: var(--gold); font: 600 1.05rem 'Space Grotesk', sans-serif; }
.bk-ring-name { color: var(--heading); font-weight: 600; font-size: 1rem; }
.bk-ring-word { color: var(--heading); font-weight: 600; font-size: 0.92rem; margin-top: 2px; }
.bk-ring-sub { color: var(--muted); font-size: 0.78rem; }
.bk-ring-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
@media (max-width: 640px) {
  .bk-ring-row { grid-template-columns: 1fr 1fr; gap: 10px; }
  .bk-ring svg { width: 130px; }
  .bk-ring-book svg { width: 200px; }
  .bk-ring-name { font-size: 0.9rem; }
}
a.bk-ring:hover, a.bk-ring:hover * { text-decoration: none; }

/* v5.11 · fill from website */
.bk-span2 { grid-column: 1 / -1; }
.bk-siterow { display: flex; gap: 8px; }
.bk-siterow input { flex: 1; min-width: 0; }
.btn.bk-mini { flex: none; white-space: nowrap; padding: 8px 12px; font-size: 0.8rem; border: 1px solid var(--border); color: var(--heading); background: transparent; border-radius: 999px; cursor: pointer; }
.btn.bk-mini:hover { border-color: var(--azure); color: var(--azure); }
.btn.bk-mini:disabled { opacity: 0.6; cursor: default; }
.bk-client-grid .bk-siterow { grid-column: span 2; }
.bk-client-grid label.bk-site { grid-column: span 2; }
.filled { border-color: var(--gold) !important; box-shadow: 0 0 0 3px rgba(217, 180, 91, 0.18); }
.bk-fillnote { grid-column: 1 / -1; color: var(--muted); font-size: 0.78rem; margin: 0; }
@media (max-width: 520px) { .bk-siterow { flex-direction: column; } .btn.bk-mini { width: 100%; } }
.bk-ms { margin: 14px 0 6px; border: 1px solid var(--border); border-radius: 14px; padding: 16px; background: var(--surface); }
.bk-ms h3 { font-family: 'Space Grotesk', sans-serif; font-size: 1rem; margin: 0 0 4px; color: var(--heading); }
