/* Arena adopts the treg redesign reference: pixel type, neutral canvas, quiet white cards. */
:root {
  --bg:#F8F8F8; --surface:#fff; --card:#F7F7F7; --ink:#1A1A1A;
  --muted:#737373; --subtle:#909090; --line:rgba(37,37,34,.1);
  --teal:#54B9A6; --teal-ink:#2E7A6B; --teal-soft:#EEF7F4;
  --display:"Geist Pixel","DM Mono",ui-monospace,monospace;
  --text:"Google Sans Flex","Segoe UI",system-ui,sans-serif;
  --mono:"DM Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --shadow:none;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font:14px/1.55 var(--text); -webkit-font-smoothing:antialiased; }
body::before { content:""; position:fixed; inset:64px 0 0; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2296%22%20height%3D%2296%22%3E%3Cg%20fill%3D%22%23C6C6C6%22%20fill-opacity%3D%22.36%22%3E%3Crect%20x%3D%224%22%20y%3D%2212%22%20width%3D%222%22%20height%3D%222%22/%3E%3Crect%20x%3D%2218%22%20y%3D%224%22%20width%3D%223%22%20height%3D%223%22/%3E%3Crect%20x%3D%2240%22%20y%3D%2218%22%20width%3D%222%22%20height%3D%222%22/%3E%3Crect%20x%3D%2264%22%20y%3D%2210%22%20width%3D%223%22%20height%3D%223%22/%3E%3Crect%20x%3D%2284%22%20y%3D%2230%22%20width%3D%222%22%20height%3D%222%22/%3E%3Crect%20x%3D%2212%22%20y%3D%2242%22%20width%3D%223%22%20height%3D%223%22/%3E%3Crect%20x%3D%2232%22%20y%3D%2238%22%20width%3D%222%22%20height%3D%222%22/%3E%3Crect%20x%3D%2254%22%20y%3D%2250%22%20width%3D%223%22%20height%3D%223%22/%3E%3Crect%20x%3D%2272%22%20y%3D%2262%22%20width%3D%222%22%20height%3D%222%22/%3E%3Crect%20x%3D%226%22%20y%3D%2276%22%20width%3D%222%22%20height%3D%222%22/%3E%3Crect%20x%3D%2224%22%20y%3D%2268%22%20width%3D%223%22%20height%3D%223%22/%3E%3Crect%20x%3D%2242%22%20y%3D%2288%22%20width%3D%222%22%20height%3D%222%22/%3E%3Crect%20x%3D%2288%22%20y%3D%2286%22%20width%3D%223%22%20height%3D%223%22/%3E%3Crect%20x%3D%2258%22%20y%3D%2278%22%20width%3D%222%22%20height%3D%222%22/%3E%3Crect%20x%3D%2280%22%20y%3D%224%22%20width%3D%222%22%20height%3D%222%22/%3E%3C/g%3E%3C/svg%3E"); mask-image:radial-gradient(ellipse at 0% 35%,#000,transparent 55%),radial-gradient(ellipse at 100% 10%,#000,transparent 50%); }
::selection { background:#54B9A647; }
[v-cloak] { display:none!important; }
#arena { position:relative; min-height:100svh; display:flex; flex-direction:column; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
button,input,select { font:inherit; color:inherit; }
button,a,input,select,summary { outline-offset:4px; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible { outline:2px solid var(--teal); }
button { cursor:pointer; border:1px solid var(--line); background:var(--surface); border-radius:999px; padding:10px 18px; font-weight:500; transition:background .16s,border-color .16s,box-shadow .16s; }
button:hover:not(:disabled) { background:var(--card); border-color:#D7D4CE; }
button:disabled { opacity:.45; cursor:not-allowed; }
a { color:inherit; text-underline-offset:4px; }
input,select { min-width:0; border:1px solid var(--line); border-radius:10px; background:var(--surface); padding:12px 14px; }
input::placeholder { color:var(--subtle); }
h1,h2,h3,p { margin:0; }
h1,h2,h3 { font-family:var(--display); font-weight:400; }
h1 { font-size:28px; line-height:1.25; letter-spacing:0; text-wrap:balance; }
h2 { font-size:32px; line-height:1.12; letter-spacing:0; }
h3 { font-size:19px; letter-spacing:0; }
.masthead { min-height:64px; padding:12px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { display:flex; align-items:center; gap:10px; color:var(--ink); text-decoration:none; font:400 16px var(--display); white-space:nowrap; }
.brandmark { width:26px; height:26px; flex-shrink:0; }
.brand-divider { color:#BDB9B1; margin:0 4px; font-weight:400; }
.brand-sub { font:500 14px var(--text); color:var(--muted); }
.masthead nav { display:flex; align-items:center; gap:20px; font-size:13px; }
.team-switcher { display:flex; align-items:center; gap:4px; min-width:0; overflow:clip; padding:4px; }
.team-switcher>span { color:var(--muted); }
.masthead select { max-width:150px; background:transparent; border:0; padding:6px; }
.text-button { padding:6px 0; border:0; border-radius:0; background:transparent; font-size:13px; }
.text-button:hover:not(:disabled) { background:transparent; color:var(--teal-ink); }
.masthead .sign-in-button { background:var(--ink); color:#fff; border:0; padding:10px 22px; font-size:13px; }
.masthead .sign-in-button:hover { background:#2B2B2A; }
.balance { display:flex; align-items:center; gap:7px; padding:9px 13px; border:1px solid var(--line); border-radius:999px; font:12px var(--mono); white-space:nowrap; }
.balance span { font:10px var(--text); letter-spacing:.03em; color:var(--muted); }
main { width:100%; max-width:1080px; margin:0 auto; padding:0 28px; flex:1; }
.intro { display:flex; align-items:center; gap:12px; padding:34px 0 24px; text-align:left; }
.intro-icon { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:var(--surface); color:var(--muted); }
.intro-icon svg { width:18px; height:18px; }
.intro-title { display:flex; flex-direction:column; gap:6px; }
.powered-by { display:flex; align-items:center; gap:5px; color:var(--muted); font:400 11px/1.4 var(--text); }
.powered-by svg { width:14px; height:14px; margin-left:2px; }
.powered-by-name { color:var(--ink); font-weight:500; }
.eyebrow { font:500 11px/1.5 var(--text); letter-spacing:.06em; color:var(--muted); margin-bottom:12px; }
.workspace { width:100%; margin:0 auto 24px; border:.5px solid var(--line); border-radius:32px; background:var(--surface); box-shadow:var(--shadow); overflow:hidden; scroll-margin-top:24px; }
.compose-main { padding:16px 18px 8px; }
.input-row { display:flex; align-items:stretch; gap:12px; padding:8px 16px; border-radius:22px; background:var(--card); }
.query-field { display:flex; flex:1; min-width:0; flex-direction:column; gap:6px; }
.query-field>span { font-size:12px; color:var(--muted); }
.query-field input { width:100%; height:42px; padding:7px 6px; border:0; background:transparent; font-size:18px; }
.query-field+.query-field { border-left:1px solid var(--line); padding-left:18px; }
.entry-inputs { display:grid; gap:6px; }
.multiple-entries .input-row { border-radius:14px; padding:4px 12px; gap:8px; }
.multiple-entries .query-field input { font-size:15px; height:36px; }
.entry-number { align-self:center; min-width:16px; color:var(--subtle); font:10px var(--mono); }
.remove-entry { align-self:center; flex-shrink:0; padding:0; width:28px; height:28px; border:0; background:transparent; color:var(--muted); font-size:19px; }
.entry-tools { display:flex; align-items:center; flex-wrap:wrap; gap:16px; margin:6px 4px 0; }
.entry-tools button { font-size:11px; }
.entry-actions { display:flex; align-items:center; gap:16px; min-width:0; max-width:100%; }
.entry-actions>.text-button { flex-shrink:0; white-space:nowrap; }
.entry-actions .input-method { min-width:0; }
.entry-actions .input-method select { min-width:0; text-overflow:ellipsis; }
.entry-tools>span { color:var(--subtle); font-size:10px; margin-left:auto; }
.batch-scoreboard { margin-top:12px; }
.vendor-summary.clickable { cursor:pointer; }
.vendor-summary.clickable:hover { background:var(--card); }
.vendor-summary.picked>* { background:var(--teal-soft); }
.vendor-summary:focus-visible { outline:2px solid var(--teal); outline-offset:-2px; }
.batch-scoreboard .vendor-expansion>td { padding:8px 14px 16px; background:var(--teal-soft); }
.vendor-detail-panel .result-detail-table { border-radius:12px; border-color:#D9E8E3; }
.result-entry-name { overflow-wrap:anywhere; }
.batch-controls { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin:16px 4px 8px; color:var(--muted); font-size:12px; }
.batch-matrix { table-layout:fixed; min-width:calc(200px + var(--vendor-count)*180px); }
.batch-results-wrap { overflow-x:auto; container-type:inline-size; }
.batch-matrix>thead>tr>th:first-child { width:200px; }
.batch-matrix>thead>tr>th:first-child,.batch-matrix>tbody>.matrix-overview>th { position:sticky; left:0; z-index:2; background:var(--surface); box-shadow:1px 0 var(--line); }
.batch-matrix>thead>tr>th:first-child { background:#FBFBFB; }
.batch-matrix>thead .vendor-name { white-space:normal; overflow-wrap:normal; flex-wrap:wrap; }
.batch-matrix>thead .vendor-name img { flex-shrink:0; }
.batch-matrix>tbody>.matrix-overview.picked>* { background:var(--teal-soft); }
.batch-matrix>tbody>.matrix-overview>td.unattempted { background:#FAFAFA; }
.matrix-overview { cursor:pointer; }
.matrix-overview.picked,.vendor-summary.picked { position:relative; z-index:2; transform:translateY(var(--entry-offset,0px)); }
.matrix-overview:hover { background:var(--card); }
.matrix-overview:focus-visible { outline:2px solid var(--teal); outline-offset:-2px; }
.entry-chevron { display:inline-block; width:16px; color:var(--muted); }
.batch-matrix>tbody>.entry-expansion>td { padding:8px 14px 16px; background:var(--teal-soft); }
/* Only the full-width detail panel stays in view as overview columns scroll. */
.entry-detail-panel { position:sticky; left:14px; width:calc(100cqw - 28px); }
.entry-expansion .result-detail-table { border-radius:12px; border-color:#D9E8E3; }
.matrix-entry,.matrix-result { display:block; width:100%; padding:0; border:0; border-radius:4px; background:transparent; text-align:left; font-weight:400; overflow-wrap:anywhere; }
.matrix-entry { font-weight:500; font-size:12px; }
.matrix-result:hover:not(:disabled),.matrix-entry:hover:not(:disabled) { background:transparent; color:var(--teal-ink); }
.matrix-value { display:block; font-size:12px; margin-top:6px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.award-badge.coverage { color:#85681B; background:#FFF8DB; }
@media(max-width:600px) {
  .multiple-entries .query-field input { font-size:13px; }
  .entry-tools { gap:10px; }
  .batch-matrix,.batch-matrix>tbody { display:block; min-width:0; }
  .batch-matrix>thead { display:none; }
  .batch-matrix .matrix-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-bottom:1px solid var(--line); }
  .batch-matrix .matrix-overview>th { grid-column:1 / -1; border:0; }
  .batch-matrix .matrix-overview>td { display:none; border:0; }
  .batch-matrix .matrix-overview>td:has(.matrix-result) { display:block; }
  .batch-matrix .matrix-overview>td::before { content:attr(data-vendor); display:block; margin-bottom:8px; color:var(--muted); font-size:11px; }
  .batch-matrix>tbody>.entry-expansion,.batch-matrix>tbody>.entry-expansion>td { display:block; width:100%; }
}
.run-button { width:auto; height:32px; flex:0 0 auto; min-width:110px; margin:0; background:var(--ink); color:#fff; border-color:var(--ink); border-radius:999px; padding:0 15px; display:flex; align-items:center; justify-content:center; gap:8px; font-size:11px; line-height:1; white-space:nowrap; }
.run-button:hover:not(:disabled) { background:#2B2B2A; border-color:#2B2B2A; box-shadow:0 3px 8px #00000012; }
.muted { color:var(--muted); }
footer { width:calc(100% - 56px); max-width:1024px; margin:0 auto; padding:25px 0; border-top:1px solid var(--line); display:flex; gap:25px; justify-content:space-between; color:var(--muted); font-size:11px; }
footer a { text-decoration:none; }
.notice { background:var(--card); border:1px solid var(--line); padding:14px 18px; border-radius:10px; font-size:13px; margin:20px 0; }
.error-notice { background:#FFF5F1; border-color:#ECD9D0; display:flex; justify-content:space-between; gap:20px; }
.error-notice button { padding:0 5px; border:0; background:transparent; }
.results-section { margin:24px 0 44px; }
.outcome { font:500 10px var(--text); padding:4px 9px; border-radius:999px; background:var(--card); color:var(--muted); }
.outcome.hit { color:#14663D; background:#DDF5E6; }
.outcome.miss { color:#B42332; background:#FDE8EB; }
.outcome.hit::before { content:"✓ "; font-weight:700; }
.outcome.miss::before { content:"× "; font-weight:700; }
.outcome.error,.outcome.timeout { color:#9A5A43; background:#FFF1E9; }
.variant-name { font:10px var(--mono); color:var(--subtle); overflow-wrap:anywhere; margin-top:6px; }
.field-list { margin:20px 0; }
.field-list>div { display:grid; grid-template-columns:90px minmax(0,1fr); gap:15px; border-bottom:1px solid var(--line); padding:10px 0; font-size:13px; }
.field-list dt { color:var(--muted); font-size:11px; }
.field-list dd { margin:0; overflow-wrap:anywhere; }
.field-list .missing dd { color:var(--subtle); }
.quality-note { font-size:11px; line-height:1.65; color:var(--muted); border-left:2px solid #B6DAD1; padding-left:10px; margin:15px 0; }
details { font-size:12px; margin-top:16px; color:var(--muted); }
summary { cursor:pointer; }
pre { white-space:pre-wrap; overflow-wrap:anywhere; max-height:350px; overflow:auto; background:var(--card); border-radius:8px; padding:14px; font:11px/1.6 var(--mono); }
.primary { background:var(--ink); border-color:var(--ink); color:#fff; font-size:13px; }
.primary:hover:not(:disabled) { background:#2B2B2A; border-color:#2B2B2A; color:#fff; }
.after-actions { display:flex; align-items:center; gap:22px; margin-top:14px; flex-wrap:wrap; }
.after-actions button { font-size:12px; }
.after-actions span { font-size:11px; color:var(--muted); margin-left:auto; }
.timing-track { height:5px; background:var(--card); border-radius:4px; overflow:hidden; }
.timing-track>div { height:100%; background:var(--teal); min-width:2px; }
.step-reason { color:var(--muted); font-size:12px; }
/* One compact row per vendor; full fields and source responses open on demand. */
.results-table-wrap { overflow-x:auto; border:.5px solid var(--line); border-radius:24px; background:var(--surface); }
.results-table-wrap:focus-visible { outline:2px solid var(--teal); outline-offset:4px; }
.results-table { width:100%; border-collapse:collapse; text-align:left; font-size:12px; }
.results-table th,.results-table td { padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:middle; }
.results-table thead th { padding-top:11px; padding-bottom:11px; background:#FBFBFB; color:var(--muted); font-size:11px; font-weight:400; white-space:nowrap; }
.results-table thead { position:relative; z-index:3; transform:translateY(var(--header-offset,0px)); }
.results-table tbody th { font-weight:500; }
.results-table tbody tr:last-child>* { border-bottom:0; }
.vendor-row.picked { background:var(--teal-soft); }
.vendor-row.unattempted { background:#FAFAFA; color:var(--muted); }
.vendor-row.unattempted .vendor-logo { opacity:.85; }
.results-table .vendor-row.unattempted .row-actions { background:transparent; }
.vendor-name { display:flex; align-items:center; gap:9px; white-space:nowrap; }
.vendor-logo { position:relative; display:grid; place-items:center; width:24px; height:24px; flex:0 0 24px; border-radius:6px; background:var(--card); color:var(--muted); font-size:11px; }
.vendor-logo img { position:absolute; inset:0; width:24px; height:24px; object-fit:contain; border-radius:6px; background:var(--surface); }
.step-number { min-width:14px; color:var(--subtle); font:11px var(--mono); }
.result-cell { width:100%; min-width:230px; max-width:420px; overflow-wrap:anywhere; }
.result-value { font-size:13px; line-height:1.45; }
.result-meta { display:flex; flex-wrap:wrap; gap:2px 12px; font-size:11px; color:var(--muted); margin-top:3px; }
.result-empty { color:var(--muted); font-size:12px; }
.result-note { color:#956247; font-size:10px; line-height:1.5; margin-top:4px; }
.results-table .outcome { white-space:nowrap; }
.number-cell { text-align:right; white-space:nowrap; font:11px var(--mono); }
.number-cell small { display:block; color:var(--muted); font:10px var(--text); margin-top:3px; }
.time-cell { min-width:80px; white-space:nowrap; }
.duration { font:11px var(--mono); }
.waterfall-table .time-cell { min-width:135px; }
.time-cell .timing-track { height:4px; margin-top:7px; }
.row-actions>div { display:flex; align-items:center; justify-content:flex-end; gap:9px; }
.details-button { width:26px; height:26px; flex:0 0 26px; display:grid; place-items:center; padding:0; border:0; background:transparent; color:var(--muted); font-size:17px; }
.detail-row>td { padding:0; background:var(--bg); }
.row-detail { padding:18px 24px; }
.row-detail .field-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 30px; margin:8px 0; }
.row-detail .field-list>div { padding:7px 0; }
.row-detail .quality-note { margin:10px 0; }
.row-detail details { margin-top:12px; }
.row-detail pre { max-width:900px; }
/* Keep expanded tables inside the visible matrix, even with many vendors. */
.result-detail-table { container-type:inline-size; }
.result-detail-table>.results-table { table-layout:fixed; }
.result-detail-table th,.result-detail-table td { min-width:0; overflow-wrap:anywhere; }
.result-detail-table thead th:nth-child(1) { width:18%; }
.result-detail-table thead th:nth-child(2) { width:12%; }
.result-detail-table thead th:nth-child(3) { width:28%; }
.result-detail-table thead th:nth-child(4) { width:12%; }
.result-detail-table thead th:nth-child(5) { width:12%; }
.result-detail-table thead th:nth-child(6) { width:18%; }
.result-detail-table .number-cell { padding-left:12px; padding-right:12px; }
.result-detail-table .number-cell small { white-space:normal; overflow-wrap:anywhere; line-height:1.4; }
.verification-cost>span { display:block; }
.verification-cost .verification-cost-amount { font-family:var(--mono); white-space:nowrap; }
.result-detail-table .vendor-name { white-space:normal; gap:6px; }
.result-detail-table .row-actions>div { flex-wrap:wrap; gap:4px; }
@container(max-width:700px) {
  .result-detail-table>.results-table,.result-detail-table tbody { display:block; }
  .result-detail-table thead { display:none; }
  .result-detail-table .vendor-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); padding:10px; border-bottom:1px solid var(--line); }
  .result-detail-table .vendor-row>* { width:auto; max-width:none; border:0; padding:6px; }
  .result-detail-table .vendor-row>.result-cell { grid-column:1 / -1; }
  .result-detail-table .vendor-row>.number-cell { text-align:left; }
  .result-detail-table .vendor-row>.number-cell::before { content:"Cost "; color:var(--muted); font:11px var(--text); }
  .result-detail-table .vendor-row>.time-cell::before { content:"Time "; color:var(--muted); font:11px var(--text); }
  .result-detail-table .vendor-row>.row-actions { grid-column:2; grid-row:1; }
  .result-detail-table .detail-row,.result-detail-table .detail-row>td { display:block; width:100%; }
  .result-detail-table .row-detail { padding:14px; }
}
.waterfall-stop { margin:12px 0 0; color:var(--muted); font-size:11px; }
@media(max-width:800px) {
  .results-table th,.results-table td { padding-left:12px; padding-right:12px; }
  .results-table .detail-row>td { padding:0; }
  .row-detail .field-list { grid-template-columns:1fr; }
}
dialog { border:1px solid var(--line); border-radius:22px; background:var(--bg); color:var(--ink); padding:38px; width:min(94vw,470px); max-height:calc(100dvh - 24px); overscroll-behavior:contain; overflow:auto; box-shadow:0 30px 90px -20px #14120C40; }
dialog::backdrop { background:#10101066; backdrop-filter:blur(4px); }
dialog h2 { font-size:36px; margin-bottom:18px; }
dialog>p:not(.eyebrow) { color:var(--muted); font-size:14px; margin-bottom:22px; }
.dialog-close { position:absolute; right:15px; top:10px; border:0; background:transparent; font-size:23px; padding:0 6px; color:var(--muted); }
dialog label { display:flex; flex-direction:column; gap:6px; font-size:12px; margin:16px 0; }
dialog form>.primary { width:100%; margin-top:5px; }
.social-buttons { display:flex; gap:10px; flex-wrap:wrap; }
.social-buttons button { width:100%; font-size:13px; }
.fine { font-size:11px!important; color:var(--muted); line-height:1.7; margin-top:17px; }
.auth-error { color:#9A5A43; font-size:12px; margin:12px 0; }
.loader-fallback { text-align:center; padding:80px 20px; }
.input-method { display:flex; align-items:center; gap:7px; margin:0; color:var(--muted); font-size:12px; }
.input-method select { border:0; background:transparent; padding:3px 20px 3px 0; font-size:12px; color:var(--muted); }
/* Task selection below the input; quiet mode links beside the priced action. */
.query-options { display:flex; align-items:flex-start; justify-content:flex-end; gap:16px; padding:0 22px 12px; }
.price-hint { font-size:10px; color:var(--muted); margin-top:1px; text-align:right; }
@media(max-width:1080px) { footer { margin:0 28px; } }
@media(max-width:800px) {
  .masthead { min-height:68px; padding:14px 22px; }
  .masthead nav { gap:12px; }
  .balance span { display:none; }
  main { padding:0 22px; }
  .intro { padding:22px 0 24px; }
  .compose-main { padding:16px 18px 8px; }
  .input-row { flex-wrap:wrap; }

  footer { width:calc(100% - 44px); margin:0 22px; }
}
@media(max-width:540px) {
  .masthead { padding:14px 16px; gap:12px; flex-wrap:wrap; }
  .brand { font-size:15px; gap:8px; }
  .brand-sub { font-size:12px; }
  .brand-divider { margin:0 1px; }
  .brandmark { width:24px; height:24px; }
  .masthead nav { gap:10px; font-size:11px; }
  .masthead select { max-width:100px; font-size:12px; }
  .masthead .text-button { font-size:12px; }
  .masthead .sign-in-button { padding:8px 15px; }
  .balance { display:none; }
  main { padding:0 16px; }
  h1 { font-size:24px; }
  .intro { padding:18px 0 22px; }
  .workspace { border-radius:24px; }
  .compose-main { padding:14px 12px 8px; }
  .query-field { flex:1 1 100%; }
  .run-button { min-width:0; height:32px; padding:0 10px; font-size:11px; }
  .query-field+.query-field { border-left:0; border-top:1px solid var(--line); padding-left:0; }
  .query-options { padding:0 16px 10px; gap:10px; }
  footer { width:calc(100% - 32px); margin:0 16px; flex-wrap:wrap; gap:10px; justify-content:flex-start; font-size:10px; }
  footer span:first-child { width:100%; }
  dialog { padding:30px 23px; }
  .after-actions span { margin-left:0; width:100%; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
}

.pricing-note { color:var(--muted); font-size:11px; margin-top:10px; }

/* Tiny logo-headed fighters: the animation follows real attempt states. */
.pixel-arena { margin:0 0 12px; background:#FFFFFFD9; border:.5px solid var(--line); border-radius:24px; overflow:hidden; }
.fighter-roster { position:relative; display:flex; justify-content:safe center; gap:30px; padding:4px 18px 10px; overflow-x:auto; scrollbar-width:thin; }
.fighter-roster:focus-visible { outline-offset:-3px; }
.fighter { position:relative; flex:0 0 92px; text-align:center; color:var(--ink); }
.fighter-scene { height:85px; position:relative; isolation:isolate; }
.fighter-scene::after { content:''; position:absolute; bottom:2px; left:-6px; right:-6px; height:2px; background:repeating-linear-gradient(90deg,#D9D6CF 0 4px,transparent 4px 8px); z-index:-1; }
.fighter-facing { position:absolute; width:64px; height:72px; left:14px; bottom:3px; }
.compare .fighter:nth-child(even) .fighter-facing { transform:scaleX(-1); }
.compare .fighter:nth-child(even) .fighter-head { transform:scaleX(-1); }
.fighter-sprite { position:relative; height:72px; transform-origin:32px 65px; }
.fighter-body { width:64px; height:72px; display:block; overflow:visible; }
.fighter-shirt { fill:#506964; }
.fighter-belt { fill:#7ED7C3; }
.fighter-glove { fill:#526D65; }
.fighter-head { position:absolute; top:3px; left:17px; width:30px; height:30px; display:grid; place-items:center; background:var(--surface); border:2px solid var(--ink); box-shadow:2px 2px 0 #10101020; font:12px var(--mono); }
.fighter-head img { position:absolute; inset:0; width:26px; height:26px; object-fit:contain; padding:2px; background:var(--surface); }
.fighter-shadow { position:absolute; left:27px; bottom:6px; width:38px; height:4px; background:#10101012; z-index:-1; }
.fighter-name { display:block; margin-top:5px; font:400 12px var(--display); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fighter-verdict { display:block; margin-top:3px; font:9px var(--mono); color:var(--muted); }
.fighter-celebration { position:absolute; top:0; left:10px; width:72px; height:20px; fill:#48A68F; opacity:0; shape-rendering:crispEdges; }
.vote-crown { display:none; fill:#C19436; }
.fighter-alert { display:none; position:absolute; top:0; right:15px; color:#A37135; font:bold 15px var(--mono); }
.fighter-impact { position:absolute; right:-13px; top:20px; width:20px; height:20px; fill:#DFA45C; opacity:0; }
.fighter-arm.front { transform-origin:42px 36px; }
.fighter-arm.back { transform-origin:22px 36px; }
.fighter.waiting .fighter-sprite,.fighter.benched .fighter-sprite { opacity:.35; }
.fighter.benched .fighter-sprite,.fighter.paused .fighter-sprite { filter:grayscale(1); }
.fighter.defeated .fighter-sprite { transform:translate(8px,2px) rotate(-80deg); opacity:.45; filter:grayscale(1); }
.fighter.error .fighter-alert,.fighter.paused .fighter-alert { display:block; }
.fighter.error .fighter-sprite { transform:rotate(-8deg); }
.fighter.won .fighter-arm.front,.fighter.champion .fighter-arm.front { transform:translate(5px,-10px) rotate(-35deg); }
.fighter.won .fighter-arm.back,.fighter.champion .fighter-arm.back { transform:translate(-5px,-10px) rotate(35deg); }
.fighter.won .fighter-celebration,.fighter.champion .fighter-celebration { opacity:1; }
.fighter.champion .vote-crown { display:block; }
.fighter.won .fighter-verdict,.fighter.champion .fighter-verdict { color:var(--teal-ink); }
.fighter.fighting .fighter-verdict { color:var(--ink); }
.is-live .fighter.fighting .fighter-sprite { animation:fighter-bounce .68s steps(2,end) infinite; animation-delay:var(--beat); }
.is-live .fighter.fighting .fighter-arm.front { animation:fighter-punch .68s steps(2,end) infinite; animation-delay:var(--beat); }
.is-live .fighter.fighting .fighter-arm.back { animation:fighter-guard .68s steps(2,end) infinite; animation-delay:var(--beat); }
.is-live .fighter.fighting .fighter-impact { animation:fighter-spark .68s steps(1,end) infinite; animation-delay:var(--beat); }
.is-live .fighter.won .fighter-sprite { animation:fighter-victory .48s steps(3,end) 2; }
@keyframes fighter-bounce { 0%,100% { transform:translate(0,0); } 25% { transform:translate(-2px,-2px); } 50% { transform:translate(4px,-2px); } 75% { transform:translate(2px,0); } }
@keyframes fighter-punch { 0%,100% { transform:translate(0,0); } 25% { transform:translate(-4px,-2px); } 50%,65% { transform:translate(10px,-4px); } }
@keyframes fighter-guard { 50% { transform:translate(0,-4px); } }
@keyframes fighter-spark { 0%,45%,75%,100% { opacity:0; } 50%,70% { opacity:1; } }
@keyframes fighter-victory { 50% { transform:translateY(-6px); } }
@media(max-width:540px) { .fighter-roster { gap:24px; padding-left:8px; padding-right:8px; } .fighter { flex-basis:82px; } .fighter-facing { left:9px; } .fighter-celebration { left:5px; } }

/* Mode selection belongs to the battle; the composer stays focused on the query. */
.battle-toolbar { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:12px 50px 4px; }
.battle-modes { display:flex; align-items:center; gap:3px; }
.battle-modes button { display:flex; align-items:center; gap:6px; border:1px solid transparent; padding:5px 8px; border-radius:8px; background:transparent; color:var(--muted); font-size:11px; font-weight:400; }
.battle-modes button.active { border-color:var(--line); background:var(--card); color:var(--ink); }
.battle-modes svg { width:21px; height:17px; fill:none; stroke:currentColor; stroke-width:1; }
.battle-modes svg rect { fill:currentColor; stroke:none; }
.battle-explainer,.battle-mode-label { color:var(--muted); font-size:10px; }
.fighter-link { position:absolute; top:47px; right:-27px; width:24px; font:11px var(--display); color:#A19F98; }
.fighter-link svg { width:24px; height:14px; fill:none; stroke:currentColor; stroke-width:1.5; }
@media(max-width:540px) { .battle-toolbar { gap:4px; padding:10px 46px 3px; } .battle-explainer { text-align:center; } .price-hint { max-width:150px; } .fighter-link { right:-24px; } }

.battle-stop { position:absolute; right:18px; top:15px; font-size:11px; padding:4px 0; }

/* Query history behaves like sessions, without opening a modal. */
.arena-layout { display:flex; width:100%; flex:1; margin:0 auto; }
.arena-layout.has-history { max-width:none; }
.has-history main { max-width:1080px; margin-inline:auto; }
.arena-layout main { min-width:0; }
.session-sidebar { position:sticky; top:20px; align-self:flex-start; flex:0 0 248px; width:248px; max-height:calc(100svh - 118px); display:flex; flex-direction:column; gap:14px; margin:34px 0 24px 28px; }
.new-session { display:flex; align-items:center; justify-content:center; gap:8px; flex-shrink:0; padding:9px 12px; font-size:12px; border-radius:12px; background:var(--surface); }
.new-session>span { font-size:18px; line-height:1; }
.session-list { overflow-y:auto; scrollbar-width:none; display:flex; flex-direction:column; gap:3px; padding:2px; }
.session-list::-webkit-scrollbar { display:none; }
.history-load-more { flex-shrink:0; padding:10px 14px; margin-top:4px; border-radius:12px; font-size:12px; background:var(--surface); }
.session-item { display:block; flex-shrink:0; width:100%; border:1px solid transparent; border-radius:12px; padding:10px 11px; text-align:left; background:transparent; font-weight:400; }
.session-item.active { background:var(--surface); border-color:var(--line); }
.session-item:hover:not(:disabled) { background:#EEEDE980; }
.session-title { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:500; }
.session-meta,.session-date { display:block; color:var(--muted); font-size:10px; line-height:1.5; margin-top:3px; }
.session-date { font-size:9px; color:var(--subtle); margin-top:1px; }
@media(max-width:1050px) { .session-sidebar { flex-basis:176px; width:176px; margin-left:16px; } .has-history main { padding-left:20px; padding-right:20px; } }
@media(max-width:700px) {
  .arena-layout.has-history { flex-direction:column; }
  .session-sidebar { position:static; width:calc(100% - 32px); flex-basis:auto; max-height:none; margin:14px 16px 0; gap:8px; }
  .new-session { align-self:flex-start; padding:6px 12px; }
  .session-list { flex-direction:row; overflow-x:auto; overflow-y:hidden; }
  .session-item { width:180px; padding:8px 10px; }
  .has-history main { padding-left:16px; padding-right:16px; }
}

.try-vendor { padding:6px 9px; font-size:11px; white-space:nowrap; }
.rating-button { width:25px; height:25px; display:grid; place-items:center; padding:4px; border:0; background:transparent; color:var(--muted); }
.rating-button svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.3; }
.reported-note { margin-top:4px; color:#956247; font-size:10px; }
.report-form { display:grid; gap:12px; padding:18px 22px; max-width:600px; }
.report-form strong { font-size:13px; font-weight:500; }
.report-form label { display:grid; gap:5px; font-size:11px; color:var(--muted); }
.report-form select,.report-form textarea { width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:9px; font:12px var(--text); background:var(--surface); color:var(--ink); }
.report-form textarea { resize:vertical; }
.report-form>div { display:flex; align-items:center; gap:15px; }
.report-form button { font-size:11px; }
.results-table .row-actions { background:var(--surface); }
.results-table .picked .row-actions { background:var(--teal-soft); }

.vendor-row { cursor:pointer; }
.vendor-row:hover,.results-table .vendor-row:hover .row-actions { background:#F7F7F4; }
.vendor-row.picked:hover,.results-table .vendor-row.picked:hover .row-actions { background:var(--teal-soft); }
.vendor-row:focus-visible { outline:2px solid var(--teal); outline-offset:-2px; }
.reported-note { display:flex; align-items:center; gap:4px; }
.reported-note svg { width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:1.3; }

.rating-button { width:28px; height:28px; border-radius:7px; }
.rating-button.thumb-up svg { transform:rotate(180deg); }
.rating-button[aria-pressed="true"] { opacity:1; color:var(--teal-ink); background:#E3F0EB; }
.rating-button.thumb-down[aria-pressed="true"] { color:#956247; background:#F5EAE3; }
.rating-button[aria-pressed="true"] svg { fill:currentColor; fill-opacity:.12; }

.fighter-toggle { padding:0; border:0; border-radius:10px; background:transparent; font:inherit; }
.fighter-toggle:hover { background:#50696408; }
.fighter-toggle:focus-visible { outline-offset:2px; }
.fighter-check { position:absolute; right:0; top:4px; width:16px; height:16px; border-radius:50%; background:#E3F0EB; color:var(--teal-ink); font:11px var(--text); line-height:16px; }
.fighter.excluded .fighter-sprite { opacity:.3; filter:grayscale(1); }
.fighter.excluded .fighter-name { color:var(--muted); }
.fighter.excluded .fighter-check { background:#EEEDE9; color:var(--muted); }
.fighter-hint { text-align:center; margin:0 0 12px; color:var(--muted); font-size:10px; }

.result-awards { display:flex; flex-wrap:wrap; gap:4px; margin-top:5px; }
/* Award belts sit on the sprite and move with it, with readable text when mirrored. */
.fighter-awards { position:absolute; z-index:2; top:40px; left:-2px; width:68px; display:grid; gap:1px; pointer-events:none; }
.compare .fighter:nth-child(even) .fighter-awards { transform:scaleX(-1); }
.award-badge { display:inline-flex; padding:2px 5px; border-radius:5px; font:9px var(--text); line-height:1.3; white-space:nowrap; }
.award-badge.fastest { color:#6B5792; background:#F0ECF7; }
.award-badge.cheapest { color:var(--teal-ink); background:#E3F0EB; }

.fighter-awards.double-belt { top:33px; }
.fighter-awards .award-badge { display:block; padding:0 3px; border:2px solid currentColor; border-radius:0; font:500 7.5px/9px var(--mono); letter-spacing:.2px; text-transform:uppercase; text-align:center; clip-path:polygon(2px 0,calc(100% - 2px) 0,calc(100% - 2px) 2px,100% 2px,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,2px 100%,2px calc(100% - 2px),0 calc(100% - 2px),0 2px,2px 2px); }
.fighter-awards .award-badge.fastest { background:#E8DCF8; color:#67458A; }
.fighter-awards .award-badge.cheapest { background:#BFE8D7; color:#295B49; }

.award-badge.winner { background:#F7ECCF; color:#8A641E; }
.fighter-awards .award-badge.winner { background:#F5D783; color:#785219; }

/* Historical metrics share the existing vendor pricing table. */
.pricing-table { min-width:690px; }
.pricing-table th:nth-child(2),.pricing-table th:nth-child(3) { width:26%; }
.inline-metric { display:flex; align-items:center; gap:12px; min-width:150px; }
.metric-track { flex:1; min-width:60px; height:10px; background:#EEF2EF; border-radius:3px; overflow:hidden; }
.metric-track>span { display:block; height:100%; background:#70A398; border-radius:3px; }
.time-track { background:#F0F2F5; }
.time-track>span { background:#9AAAC0; }
.metric-track.missing { background:transparent; border-bottom:1px dashed #D1D6D2; height:1px; border-radius:0; }
.metric-value { width:64px; text-align:right; flex-shrink:0; font:12px var(--mono); font-variant-numeric:tabular-nums; }
.pricing-table .historical-rate { min-width:125px; }
.pricing-table .number-cell small { white-space:normal; line-height:1.4; }
.stats-methodology { color:var(--muted); font-size:11px; margin-top:10px; }
.stats-methodology summary { cursor:pointer; width:fit-content; }
.stats-methodology summary span { margin-left:8px; }
.stats-methodology p { max-width:90ch; margin:8px 0; line-height:1.6; }
.stats-methodology a { display:inline-block; margin-bottom:6px; }
@media(max-width:600px) {
  .stats-methodology summary span { display:block; margin:4px 0 0 14px; }
}

/* One compact chart surface, backed by the same database snapshot as the table. */
.stats-views { display:flex; flex-wrap:wrap; gap:4px; padding:4px; margin:18px 0 12px; width:fit-content; background:#EDEDEA; border:1px solid var(--line); border-radius:10px; }
.stats-views button { border:0; border-radius:7px; background:transparent; padding:8px 15px; font-size:12px; color:var(--muted); }
.stats-views button.active { background:#fff; color:var(--ink); box-shadow:0 1px 3px #00000012; }
.vendor-chart { border:1px solid var(--line); border-radius:16px; background:#fff; padding:24px 24px 14px; }
.chart-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.chart-heading h3 { font:500 16px var(--text); }
.chart-heading h3 span { color:var(--muted); font-weight:400; }
.chart-heading p { margin-top:6px; color:var(--muted); font-size:12px; }
.chart-source { font:10px var(--mono); color:var(--muted); white-space:nowrap; padding-top:4px; }
.bar-chart-scroll { overflow-x:auto; padding-top:22px; }
.bar-chart { position:relative; height:334px; min-width:calc(var(--chart-columns)*112px + 48px); }
.bar-grid { position:absolute; top:18px; bottom:76px; left:48px; right:0; pointer-events:none; }
.bar-grid>div,.scatter-grid>div { position:absolute; width:100%; border-top:1px solid #ECEEEB; }
.bar-grid>div>span,.scatter-grid>div>span { position:absolute; right:calc(100% + 10px); transform:translateY(-50%); font:10px var(--mono); color:var(--subtle); white-space:nowrap; }
.bar-columns { position:absolute; inset:18px 0 0 48px; display:grid; grid-template-columns:repeat(var(--chart-columns),minmax(0,1fr)); gap:14px; }
.bar-column { padding:0 2px; display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr) 76px; border:0; border-radius:0; background:transparent; min-width:0; text-align:center; }
.bar-column:hover:not(:disabled),.bar-column.picked { background:transparent; }
.bar-track { position:relative; display:block; width:100%; max-width:72px; min-width:0; justify-self:center; border-bottom:1px solid var(--vendor-color); }
.bar-fill { position:absolute; bottom:0; left:0; width:100%; background:var(--vendor-color); opacity:.76; border-radius:5px 5px 0 0; }
.bar-column:hover .bar-fill,.bar-column.picked .bar-fill,.bar-column:focus-visible .bar-fill { opacity:1; }
.bar-value { position:absolute; bottom:calc(100% + 8px); left:50%; transform:translateX(-50%); color:var(--ink); font:500 12px var(--mono); white-space:nowrap; }
.bar-vendor { display:flex; flex-direction:column; align-items:center; gap:4px; padding-top:10px; min-width:0; font-size:11px; line-height:1.25; }
.bar-vendor>span { max-width:100%; overflow-wrap:anywhere; }
.bar-vendor img { width:18px; height:18px; object-fit:contain; }
.bar-vendor small { font-size:10px; color:var(--muted); }
.scatter-chart { padding:32px 14px 0 42px; }
.scatter-plot { height:240px; position:relative; border-bottom:1px solid #C7CECA; border-left:1px solid #C7CECA; }
.scatter-grid { position:absolute; inset:0; pointer-events:none; }
.scatter-x { position:absolute; bottom:-12px; width:100%; }
.scatter-x span { position:absolute; transform:translateX(-50%); white-space:nowrap; color:var(--muted); font:10px var(--mono); }
.scatter-dot { position:absolute; display:grid; place-items:center; width:36px; height:36px; padding:5px; border:1px solid var(--line); border-radius:10px; background:#fff; transform:translate(-50%,50%); box-shadow:0 2px 6px #00000012; }
.scatter-dot img { position:relative; grid-area:1 / 1; width:24px; height:24px; object-fit:contain; background:#fff; }
.scatter-logo-fallback { grid-area:1 / 1; font:500 14px var(--text); color:var(--ink); }
.scatter-dot:hover:not(:disabled),.scatter-dot.picked,.scatter-dot:focus-visible { background:#fff; border-color:var(--vendor-color); box-shadow:0 0 0 3px #DDEBE5,0 2px 6px #00000012; z-index:2; }
.scatter-axis-title { text-align:center; margin:38px 0 18px; color:var(--muted); font-size:11px; }
.chart-legend { display:flex; flex-wrap:wrap; justify-content:center; gap:4px 10px; }
.chart-legend button { display:flex; align-items:center; gap:6px; padding:5px 7px; font-size:11px; border:0; border-radius:5px; background:transparent; }
.chart-legend button[aria-pressed=true] { background:var(--card); }
.chart-legend i { width:8px; height:8px; border-radius:50%; }
.chart-detail { display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; min-height:46px; margin-top:12px; padding:12px 0; border-top:1px solid var(--line); color:var(--muted); font-size:11px; }
.chart-detail strong { color:var(--ink); font-size:12px; font-weight:500; }
.chart-detail b { color:var(--ink); font:11px var(--mono); margin-left:4px; }
.chart-caveat { color:var(--muted); font-size:10px; line-height:1.5; }
.chart-empty { min-height:240px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:var(--muted); text-align:center; }
@media(max-width:600px) {
  .vendor-chart { padding:18px 14px 12px; }
  .chart-heading { display:block; }
  .chart-heading h3 { font-size:14px; }
  .chart-source { display:none; }
  .stats-views { width:100%; }
  .stats-views button { flex:1 1 auto; padding:8px; font-size:11px; }
  .scatter-chart { padding-left:32px; padding-right:14px; }
  .scatter-plot { height:210px; }
  .scatter-x span:nth-child(even) { display:none; }
}

/* The dashboard and Arena share the agent picker and setup instructions. */
.intro { flex-wrap:wrap; }
.setup-trigger { margin-left:auto; display:inline-flex; align-items:center; gap:10px; padding:9px 12px; border-radius:12px; background:var(--surface); font-size:12px; white-space:nowrap; }
.setup-logos { display:inline-flex; align-items:center; gap:5px; }
.setup-logos img { width:20px; height:20px; object-fit:contain; }
.setup-logos>span { color:var(--muted); font-size:11px; }
.setup-dialog { width:min(94vw,560px); padding:28px; }
.setup-dialog h2 { font-family:var(--text); font-size:20px; margin:0 0 8px; }
.setup-dialog .eyebrow { margin-bottom:12px; }
.setup-subtitle { color:var(--muted); font-size:14px; margin-bottom:18px; }
.setup-dialog .agent-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.setup-dialog .agent-card { display:flex; align-items:center; gap:9px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); font-size:13px; text-align:left; }
.setup-dialog .agent-card img { width:20px; height:20px; flex:none; }
.setup-dialog .agent-card.on { border-color:var(--ink); box-shadow:inset 0 0 0 1px var(--ink); background:var(--bg); }
.setup-footer { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:22px; padding-top:16px; border-top:1px solid var(--line); }
.setup-dialog .sub { color:var(--muted); }
.setup-dialog .lc-codewrap { position:relative; background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:48px 16px 16px; }
.setup-dialog pre { font-family:var(--mono); font-size:13px; line-height:1.6; margin:0; }
.setup-dialog .lc-cp { position:absolute; right:10px; top:10px; padding:5px 10px; font-size:12px; border-radius:7px; }
.setup-dialog .btn { padding:10px 14px; border:1px solid var(--line); border-radius:10px; }
@media(max-width:560px){
  .setup-trigger { margin-left:0; }
  .setup-dialog .agent-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
.setup-dialog.setup-try-dialog { width:min(94vw,680px); }
.setup-dialog .wc-wait { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:13px; }
.setup-dialog .wc-waitdot { width:8px; height:8px; border-radius:50%; background:var(--teal); flex:none; }
.setup-dialog .try-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.setup-dialog .try-card { text-align:left; padding:14px 16px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); }
.setup-dialog .try-card:hover,.setup-dialog .prov-chip:hover { border-color:var(--ink); }
.setup-dialog .try-cat { display:flex; justify-content:space-between; align-items:center; gap:6px; font-size:10px; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.setup-dialog .try-ico { width:15px; height:15px; flex:none; }
.setup-dialog .try-ico.avatar { border-radius:50%; }
.setup-dialog .try-copy { text-transform:none; white-space:nowrap; }
.setup-dialog .try-copy.done { color:var(--teal-ink); }
.setup-dialog .try-txt { display:block; font-size:13px; line-height:1.55; }
.setup-dialog .oauth-div { margin:24px 0 12px; padding-top:16px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.setup-dialog .oauth-grp { font-size:12px; font-weight:600; margin-bottom:8px; }
.setup-dialog .prov-chip { display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border:1px solid var(--line); border-radius:999px; background:var(--surface); font-size:12px; }
.setup-dialog .prov-chip img { width:15px; height:15px; }
@media(max-width:560px){ .setup-dialog .try-grid { grid-template-columns:1fr; } }

.search-results { width:100%; }
.search-match { display:grid; grid-template-columns:24px 1fr; gap:10px; padding:14px 0; border-bottom:1px solid var(--line); }
.search-match-index { font:11px var(--mono); color:var(--subtle); padding-top:3px; }
.search-match strong { font-weight:500; font-size:14px; }
.search-match p { color:var(--muted); font-size:12px; margin-top:4px; overflow-wrap:anywhere; }
.search-match-links { display:flex; flex-wrap:wrap; gap:12px; font-size:12px; margin-top:6px; }
.search-match-links a { color:var(--teal-ink); }
.pricing-table.discovery-pricing { min-width:0; }

/* Batch inputs share one header, with accessible labels retained on every field. */
.entry-labels,.multiple-entries .input-row { display:grid; grid-template-columns:16px repeat(var(--input-columns),minmax(0,1fr)) 28px; gap:8px; padding:4px 12px; }
.entry-column-label { min-width:0; padding-left:6px; color:var(--muted); font-size:12px; }
.entry-column-label+.entry-column-label { padding-left:19px; }
.multiple-entries .query-field+.query-field { border-top:0; border-left:1px solid var(--line); padding-left:12px; }

/* Use cases lead the composer; input tools and Run share its footer. */
.composer-tab-scroll { padding:16px 18px 0; }
.composer-tabs { display:flex; align-items:center; min-width:0; gap:3px; overflow-x:auto; padding:2px 0; scrollbar-width:none; overscroll-behavior-x:contain; }
.composer-tabs button { display:flex; flex:0 0 auto; align-items:center; gap:7px; padding:9px 11px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--muted); font-size:13px; white-space:nowrap; }
.composer-tabs button svg { width:15px; height:15px; flex-shrink:0; }
.composer-tabs button.active { background:#F0F2EF; color:var(--ink); border-color:#E3E7E1; }
.composer-tabs button:focus-visible { outline-offset:-2px; }
#composer .compose-main { padding-bottom:16px; }
.entry-tools { margin-top:14px; gap:12px; }
.entry-submit { display:flex; align-items:center; gap:12px; margin-left:auto; max-width:100%; }
.spreadsheet-hint { color:var(--muted); font-size:11px; line-height:1.4; }
.entry-tools>span { margin-left:0; }
.discovery-hint { margin:0 22px 12px; color:var(--muted); font-size:11px; }
@media(max-width:540px) {
  .composer-tab-scroll { padding:12px 12px 0; }
  .composer-tabs button { padding:7px 9px; }
  .entry-tools { gap:10px; }
  .entry-actions { flex-wrap:wrap; column-gap:12px; row-gap:4px; }
  .discovery-hint { margin:0 16px 12px; font-size:10px; }
}

.masthead { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); }
.masthead>nav[aria-label="Arena account"] { justify-self:end; }
.masthead .arena-page-tabs { display:flex; justify-self:center; gap:4px; padding:5px; margin:0; border:1px solid #E9ECE9; border-radius:999px; background:#fff; box-shadow:0 2px 8px #18241C04; }
.arena-page-tabs a { display:flex; align-items:center; justify-content:center; gap:8px; padding:9px 18px; border-radius:999px; text-decoration:none; font-size:13px; line-height:20px; color:var(--muted); font-weight:500; white-space:nowrap; transition:background .15s,color .15s; }
.arena-page-tabs a svg { width:16px; height:16px; flex-shrink:0; }
.arena-page-tabs a:hover { color:var(--ink); background:#F7F9F7; }
.arena-page-tabs a[aria-current="page"] { color:#31594F; background:#EDF5F1; box-shadow:inset 0 0 0 1px #E2EEE7; }
@media(max-width:960px) {
  .masthead { grid-template-columns:minmax(0,1fr) auto; }
  .masthead .arena-page-tabs { grid-column:1 / -1; grid-row:2; margin-top:4px; }
  .masthead>nav[aria-label="Arena account"] { grid-column:2; grid-row:1; }
}
/* Dedicated leaderboard: category row, quiet filter rail and one comparison canvas. */
.leaderboard-controls { margin-bottom:32px; }
.leaderboard-title { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:20px; text-align:center; padding:34px 0 28px; }
.leaderboard-title>div { grid-column:2; }
.leaderboard-title .setup-trigger { grid-column:3; justify-self:end; margin-left:0; }
.leaderboard-title p { margin-top:8px; color:var(--muted); font-size:14px; }
.leaderboard-controls .composer-tab-scroll { padding:0; width:fit-content; max-width:100%; margin-inline:auto; }
.leaderboard-controls .composer-tabs { gap:5px; background:#fff; border:1px solid var(--line); border-radius:999px; padding:5px; }
.leaderboard-controls .composer-tabs button { padding:10px 17px; border:0; border-radius:999px; }
.leaderboard-controls .composer-tabs button[aria-selected="true"] { background:#EDF4F0; color:#345D50; box-shadow:none; }
.leaderboard-results { display:grid; grid-template-columns:200px minmax(0,1fr); gap:0 24px; align-items:start; }
.leaderboard-filters { grid-column:1; grid-row:1 / span 5; }
.leaderboard-results>.vendor-chart,.leaderboard-results>.pricing-note,.leaderboard-results>.stats-methodology { grid-column:2; }
.filter-label { color:var(--muted); font-size:11px; font-weight:500; margin-bottom:10px; }
.leaderboard-filters .stats-views { display:grid; gap:4px; width:100%; margin:0 0 28px; border:0; background:none; padding:0; }
.leaderboard-filters .stats-views button { display:flex; gap:10px; align-items:center; text-align:left; padding:11px 12px; font-size:13px; border-radius:7px; }
.leaderboard-filters .stats-views button svg { width:17px; height:17px; flex-shrink:0; }
.leaderboard-filters .stats-views button.active { background:#E9ECE9; box-shadow:none; color:#365C52; }
.leaderboard-inputs { border:0; padding:0; margin:0; min-width:0; }
.leaderboard-inputs label { display:flex; gap:9px; align-items:center; padding:10px 12px; font-size:12px; color:var(--muted); cursor:pointer; border-radius:7px; }
.leaderboard-inputs label.active { color:var(--ink); background:#EEEEEB; }
.leaderboard-inputs input { margin:0; width:13px; height:13px; accent-color:#52796E; flex-shrink:0; }
.leaderboard-source { margin:26px 12px 0; color:var(--muted); font-size:11px; line-height:1.7; }
.leaderboard-source span { display:block; font-size:10px; margin-top:6px; }
.leaderboard-results .vendor-chart { border-radius:10px; padding:22px 22px 16px; }
.leaderboard-results .bar-chart { height:380px; }
.leaderboard-results .chart-heading h3 { font-size:16px; }
.leaderboard-results .chart-heading h3 span { display:block; font-size:12px; margin-top:5px; }
.leaderboard-results .chart-source { font:500 11px var(--text); }
@media(max-width:760px) {
  .leaderboard-results { grid-template-columns:minmax(0,1fr); }
  .leaderboard-filters { grid-column:1; grid-row:auto; margin-bottom:18px; }
  .leaderboard-results>.vendor-chart,.leaderboard-results>.pricing-note,.leaderboard-results>.stats-methodology { grid-column:1; }
  .leaderboard-filters .stats-views { display:flex; margin-bottom:16px; gap:3px; }
  .leaderboard-filters .stats-views button { flex:1; padding:10px 8px; font-size:11px; justify-content:center; }
  .leaderboard-inputs { display:flex; flex-wrap:wrap; gap:4px; }
  .leaderboard-inputs label { padding:8px 10px; }
  .leaderboard-source { display:none; }
  .leaderboard-title { padding:12px 0 22px; }
  .leaderboard-controls { margin-bottom:22px; }
}

/* Show directional overflow affordances without a visible scrollbar. */
.composer-tab-viewport { position:relative; min-width:0; --tab-edge:#fff; }
.composer-tabs::-webkit-scrollbar { display:none; }
.tab-overflow { position:absolute; top:0; bottom:0; z-index:1; width:46px; display:flex; align-items:center; pointer-events:none; }
.tab-overflow-left { left:0; justify-content:flex-start; background:linear-gradient(to right,var(--tab-edge) 55%,transparent); }
.tab-overflow-right { right:0; justify-content:flex-end; background:linear-gradient(to left,var(--tab-edge) 55%,transparent); }
.tab-overflow button { display:grid; place-items:center; width:27px; height:27px; padding:0; border:1px solid #E8ECE8; border-radius:50%; background:#fff; color:#7A827C; pointer-events:auto; box-shadow:0 1px 4px #00000006; }
.tab-overflow button:hover { background:#F2F6F3; color:var(--ink); }
.tab-overflow svg { width:14px; height:14px; }
.leaderboard-controls .composer-tab-viewport { --tab-edge:#fff; border-radius:999px; overflow:hidden; }

@media(max-width:960px) {
  .leaderboard-title { grid-template-columns:minmax(0,1fr); gap:16px; }
  .leaderboard-title>div { grid-column:1; }
  .leaderboard-title .setup-trigger { grid-column:1; justify-self:center; }
}

.price-chart .bar-grid { left:76px; }
.price-chart .bar-columns { left:76px; }
.price-chart .bar-chart { min-width:calc(var(--chart-columns)*112px + 76px); }

.price-comparison { margin-top:20px; }
.price-comparison-row { display:grid; grid-template-columns:minmax(130px,190px) minmax(0,1fr) 84px; align-items:center; gap:16px; width:100%; border:0; border-radius:8px; padding:10px 8px; background:transparent; text-align:left; }
.price-comparison-row:hover:not(:disabled),.price-comparison-row.picked { background:#F6F8F6; }
.price-vendor { display:flex; align-items:center; gap:10px; min-width:0; font-size:12px; }
.price-vendor img { flex-shrink:0; object-fit:contain; }
.price-vendor>span { overflow-wrap:anywhere; }
.price-track { height:12px; border-radius:3px; background:#F1F3F0; overflow:hidden; }
.price-track>span { display:block; height:100%; border-radius:3px; opacity:.8; }
.price-amount { text-align:right; font:12px var(--mono); font-variant-numeric:tabular-nums; }
.price-scale-note { text-align:right; font-size:10px; color:var(--muted); padding:8px; }
@media(max-width:600px) {
  .price-comparison-row { grid-template-columns:minmax(0,1fr) 72px; gap:8px 10px; padding:12px 0; }
  .price-comparison-row .price-vendor { grid-column:1; grid-row:1; }
  .price-comparison-row .price-amount { grid-column:2; grid-row:1; }
  .price-comparison-row .price-track { grid-column:1/-1; grid-row:2; height:8px; }
  .price-vendor { font-size:11px; gap:7px; }
  .price-amount { font-size:11px; }
}

.auto-verify-control { position:relative; flex-shrink:0; width:fit-content; max-width:100%; margin:0; }
.verification-switch { position:relative; display:inline-flex; align-items:center; gap:9px; padding:7px 0; border:0; border-radius:6px; background:transparent; color:var(--muted); font-size:12px; font-weight:500; cursor:pointer; transition:border-color .15s,background .15s; }
.verification-switch:hover { color:var(--ink); }
.verification-switch.enabled { color:var(--ink); }
.verification-switch input { position:absolute; width:1px; height:1px; padding:0; margin:0; opacity:0; }
.verification-switch:has(input:focus-visible) { outline:2px solid var(--teal-ink); outline-offset:3px; }
.verification-switch.disabled { opacity:.5; cursor:not-allowed; }
.verification-switch-track { display:flex; align-items:center; width:30px; height:18px; padding:2px; flex-shrink:0; border-radius:999px; background:#DCE2DE; transition:background .15s; }
.verification-switch-track>span { width:14px; height:14px; border-radius:50%; background:white; box-shadow:0 1px 3px #0002; transition:transform .15s; }
.verification-switch input:checked+.verification-switch-track { background:var(--teal-ink); }
.verification-switch input:checked+.verification-switch-track>span { transform:translateX(12px); }
.verification-info { width:14px; height:14px; stroke:currentColor; stroke-width:1.4; opacity:.65; }
.verification-cost-hint { position:absolute; z-index:5; bottom:calc(100% + 8px); left:0; width:260px; max-width:calc(100vw - 80px); padding:12px 14px; border:1px solid #E4E8E4; border-radius:12px; background:#fff; color:var(--muted); box-shadow:0 6px 24px #182F2414; font-size:11px; line-height:1.5; visibility:hidden; opacity:0; transition:opacity .15s; }
.verification-cost-hint::after { content:""; position:absolute; left:0; right:0; top:100%; height:10px; }
.verification-cost-hint strong { display:block; margin-bottom:4px; color:var(--ink); font-size:12px; font-weight:500; }
.auto-verify-control:not(.hint-dismissed):is(:hover,:focus-within) .verification-cost-hint { visibility:visible; opacity:1; }
@media (prefers-reduced-motion:reduce) { .verification-switch,.verification-switch-track,.verification-switch-track>span,.verification-cost-hint { transition:none; } }
.verification-result { display:flex; flex-wrap:wrap; align-items:center; gap:5px 8px; margin-top:6px; font-size:11px; }
.verification-result strong { font-weight:500; text-transform:capitalize; background:#EFF4F1; border-radius:5px; padding:2px 6px; }
.verification-result>span { color:var(--muted); font-size:10px; }

.outcome.verdict-valid,.verification-result strong.verdict-valid { color:#14663D; background:#DDF5E6; }
.outcome.verdict-invalid,.verification-result strong.verdict-invalid { color:#B42332; background:#FDE8EB; }
.outcome.verdict-risky,.verification-result strong.verdict-risky { color:#805400; background:#FFF2CC; }
.outcome.verdict-unknown,.verification-result strong.verdict-unknown { color:#58616B; background:#EDF0F3; }

/* Published people-search benchmark, separate from observed vendor call stats. */
.is-benchmark .arena-layout { display:block; }
.is-benchmark main { width:100%; max-width:1160px; margin:0 auto; }
.bench-title { margin-bottom:12px; }
.bench-source { text-align:center; color:var(--muted); font-size:12px; margin:0 0 32px; }
.bench-source a,.bench-methodology a { color:var(--teal-ink); text-underline-offset:3px; }
.bench-category-tabs { display:flex; justify-content:center; flex-wrap:wrap; gap:5px; width:fit-content; max-width:100%; padding:5px; margin:0 auto 28px; border:1px solid var(--line); background:white; border-radius:999px; }
.bench-category-tabs button { padding:10px 17px; border:0; border-radius:999px; background:transparent; color:var(--muted); font-size:13px; }
.bench-category-tabs button[aria-pressed="true"] { background:#EDF4F0; color:#345D50; }
.bench-chart,.bench-mini { background:white; border:1px solid var(--line); border-radius:24px; }
.bench-chart { padding:30px; }
.bench-chart-heading { display:flex; justify-content:space-between; align-items:start; margin-bottom:28px; gap:12px; }
.bench-chart h2,.bench-overview-heading h2 { margin:0; font-size:23px; font-weight:500; }
.bench-chart-heading p,.bench-overview-heading p { margin:6px 0 0; color:var(--muted); font-size:13px; }
.bench-chart-heading>span { color:var(--muted); font:11px var(--mono); }
.bench-axis { display:flex; justify-content:space-between; margin:0 57px 8px 206px; color:var(--subtle); font:10px var(--mono); }
.bench-bar-row { display:grid; grid-template-columns:190px minmax(0,1fr) 42px; align-items:center; gap:16px; min-height:65px; }
.bench-system { display:flex; gap:10px; align-items:center; font-size:13px; }
.bench-system img,.bench-mini-row img { object-fit:contain; border-radius:4px; flex-shrink:0; }
.bench-bar-track { background:repeating-linear-gradient(to right,#E9EDEA 0,#E9EDEA 1px,transparent 1px,transparent 25%); border-right:1px solid #E9EDEA; height:32px; }
.bench-bar-track>span { display:block; height:100%; background:var(--bench-color); border-radius:0 7px 7px 0; }
.bench-bar-row>strong,.bench-mini-row>strong { font:13px var(--mono); font-weight:500; text-align:right; }
.bench-chart-note { border-top:1px solid var(--line); padding-top:18px; margin:24px 0 0; font-size:12px; color:var(--muted); line-height:1.6; }
.bench-overview-heading { margin:38px 0 18px; }
.bench-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.bench-mini { padding:24px; }
.bench-mini h3 { margin:0 0 20px; font-size:17px; font-weight:500; }
.bench-mini-row { display:grid; grid-template-columns:155px minmax(0,1fr) 36px; align-items:center; gap:12px; margin:15px 0; }
.bench-mini-row>span { display:flex; align-items:center; gap:8px; font-size:11px; }
.bench-mini-row .bench-bar-track { height:17px; }
.bench-mini-row>strong { font-size:11px; }
.bench-methodology { margin-top:24px; padding:20px 24px; border:1px solid var(--line); border-radius:18px; background:#FFFFFFA6; color:var(--muted); font-size:12px; line-height:1.7; }
.bench-methodology summary { cursor:pointer; color:var(--ink); font-size:13px; }
.bench-methodology a { margin-right:20px; }
.bench-message { padding:50px 20px; text-align:center; color:var(--muted); }
@media(max-width:1100px) { .masthead .brand-sub,.masthead .brand-divider { display:none; } }
@media(max-width:760px) {
  .masthead { grid-template-columns:1fr auto; }
  .masthead .arena-page-tabs { grid-column:1/-1; grid-row:2; margin-top:12px; max-width:100%; }
  .masthead>nav[aria-label="Arena account"] { grid-column:2; grid-row:1; }
  .bench-overview { grid-template-columns:1fr; }
  .bench-chart { padding:20px 16px; }
  .bench-bar-row { grid-template-columns:140px minmax(0,1fr) 35px; gap:10px; }
  .bench-system { font-size:11px; gap:6px; }
  .bench-system img { width:19px; height:19px; }
  .bench-axis { margin-left:150px; margin-right:45px; }
}
@media(max-width:440px) {
  .masthead .arena-page-tabs a { padding:9px 8px; font-size:11px; gap:0; }
  .masthead .arena-page-tabs a svg { display:none; }
  .bench-category-tabs { border-radius:18px; }
  .bench-bar-row { grid-template-columns:minmax(0,1fr) 40px; gap:8px; margin:18px 0; }
  .bench-system { grid-column:1/-1; }
  .bench-axis { margin-left:0; margin-right:48px; }
  .bench-mini { padding:20px 16px; }
  .bench-mini-row { grid-template-columns:132px minmax(0,1fr) 32px; gap:8px; }
}

/* Verification estimates share the existing metric layout. */
.verified-track>span{background:#7b8fae}
.verified-explanation{font-size:13px;line-height:1.6;color:var(--muted,#777);margin:0 0 18px;max-width:80ch}

.metric-help-header { cursor:help; }
.metric-help-trigger { border:0; padding:4px 0; background:transparent; color:inherit; font:inherit; cursor:help; text-decoration:underline dotted; text-underline-offset:5px; text-decoration-color:#a9b5af; }
.metric-help-trigger:focus-visible { outline:2px solid #5b8f88; outline-offset:4px; border-radius:4px; }
.metric-help-tooltip { position:fixed; z-index:10000; box-sizing:border-box; padding:14px 16px; border:1px solid #dfe5e1; border-radius:14px; background:#fff; color:#38473f; box-shadow:0 8px 28px #182e2026; font:13px/1.6 system-ui,sans-serif; text-align:left; pointer-events:none; }

/* A quiet addition to the vendor lineup, separate from selectable fighters. */
.fighter-request { flex:0 0 40px; display:grid; place-items:center; align-self:center; padding:0; background:transparent; border:0; color:#98a59e; cursor:pointer; }
.fighter-request-plus { display:grid; place-items:center; width:34px; height:34px; border:1px solid #e0e6e2; border-radius:50%; background:transparent; transition:background .15s,color .15s; }
.fighter-request-plus svg { width:16px; height:16px; }
.fighter-request:hover { color:#315e50; }
.fighter-request:hover .fighter-request-plus { background:#f0f5f2; border-color:#b9ccc1; }
.fighter-request:focus-visible { outline:2px solid #5b8f88; outline-offset:3px; border-radius:50%; }
.vendor-request-dialog { width:min(540px,calc(100vw - 32px)); box-sizing:border-box; padding:28px; background:#fff; }
.vendor-request-dialog h2 { padding-right:28px; font-size:26px; margin:0 0 12px; }
.vendor-request-dialog .request-intro,.vendor-selfserve>p { font-size:13px; line-height:1.6; color:var(--muted); margin:0; }
.vendor-request-dialog textarea { display:block; width:100%; box-sizing:border-box; resize:vertical; min-height:80px; border:1px solid var(--line); border-radius:12px; padding:12px; background:#fafbfa; color:var(--ink); font:inherit; margin-top:6px; }
.request-optional { color:var(--muted); font-size:12px; font-weight:400; }
.request-footer { display:flex; align-items:center; gap:14px; margin-top:18px; }
.request-footer>span { color:var(--muted); font-size:11px; line-height:1.5; }
.vendor-request-success { display:flex; align-items:flex-start; gap:10px; padding:0 0 4px; }
.vendor-request-success>span { display:grid; place-items:center; flex:0 0 24px; height:24px; border-radius:50%; background:#e9f4ee; color:#35735d; font-size:15px; }
.vendor-request-success>p { font-size:14px; line-height:1.6; color:var(--muted); margin:0; }
.vendor-selfserve { border-top:1px solid var(--line); padding-top:20px; margin-top:22px; }
.vendor-selfserve h3 { font-family:inherit; font-size:14px; font-weight:600; margin:0 0 6px; }
.vendor-selfserve .vendor-listing-prompt { min-height:94px; resize:none; font:12px/1.65 var(--mono); margin-top:12px; }
.vendor-selfserve-actions { display:flex; align-items:center; justify-content:space-between; margin-top:12px; }
.vendor-copy-prompt { background:#f4f7f5; color:#315e50; border:1px solid #dbe5df; border-radius:9px; padding:8px 12px; font-family:inherit; font-size:12px; cursor:pointer; }
.vendor-copy-prompt:hover { background:#eaf1ed; }

/* Shared landing-page community links, kept visible beside the account controls. */
.masthead>nav[aria-label="Arena account"] { flex-wrap:nowrap; justify-content:flex-end; }
.masthead>nav[aria-label="Arena account"]>.text-button { flex-shrink:0; white-space:nowrap; }
.arena-community { display:flex; align-items:center; gap:14px; flex-shrink:0; }
.arena-community a { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; color:var(--muted); text-decoration:none; white-space:nowrap; }
.arena-community a:hover { color:var(--ink); }
.arena-community a:focus-visible { outline:2px solid var(--teal-ink); outline-offset:4px; border-radius:6px; }
.arena-community svg { flex-shrink:0; }
@media(max-width:1800px) {
  .masthead { grid-template-columns:minmax(0,1fr) auto; }
  .masthead .arena-page-tabs { grid-column:1/-1; grid-row:2; }
  .masthead>nav[aria-label="Arena account"] { grid-column:2; grid-row:1; }
}

@media(min-width:601px) and (max-width:960px) {
  .masthead>nav[aria-label="Arena account"] { gap:10px; }
  .arena-community { gap:4px; }
  .arena-community a { min-width:32px; }
  .arena-community a>span { display:none; }
}

/* Mobile layouts keep wide data inside their own scroll regions. */
body:has(dialog[open]) { overflow:hidden; }
@media(max-width:760px) {
  .leaderboard-filters .stats-views { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
  .leaderboard-filters .stats-views button { min-height:44px; font-size:13px; justify-content:flex-start; }
  .leaderboard-filters .stats-views button:last-child:nth-child(odd) { grid-column:1/-1; }
  .leaderboard-inputs label { min-height:44px; font-size:13px; }
}
@media(max-width:600px) {
  .masthead { grid-template-columns:minmax(0,1fr) auto auto; gap:8px; padding:12px 16px; }
  .masthead>nav[aria-label="Arena account"] { display:contents; }
  .masthead .brand { grid-column:1; grid-row:1; min-height:44px; }
  .masthead .sign-in-button,.masthead .account-actions { grid-column:3; grid-row:1; justify-self:end; }
  .masthead .arena-community { grid-column:2; grid-row:1; }
  .masthead .arena-page-tabs { grid-column:1/-1; grid-row:2; width:100%; gap:2px; margin-top:0; }
  .masthead .arena-page-tabs a { flex:1; min-height:44px; justify-content:center; padding:10px 6px; font-size:12px; }
  .arena-community { gap:0; }
  .arena-community a { min-width:44px; min-height:44px; }
  .masthead .balance { display:flex; min-height:44px; }
  .masthead .text-button,.masthead .sign-in-button { min-height:44px; }
  .masthead select { width:160px; max-width:100%; min-height:44px; font-size:16px; }
  .masthead select,.input-method select,dialog select,.report-form select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='m3 5 4 4 4-4' fill='none' stroke='%23737373' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 6px center; background-size:14px; padding-right:26px; }
  .composer-tabs button { min-height:44px; }
  .tab-overflow { width:50px; }
  .tab-overflow button { width:44px; height:44px; }
  .entry-inputs { overflow-x:auto; scrollbar-width:thin; overscroll-behavior-x:contain; padding-bottom:4px; }
  .entry-labels,.multiple-entries .input-row { min-width:calc(108px + var(--input-columns)*112px); grid-template-columns:16px repeat(var(--input-columns),minmax(0,1fr)) 44px; }
  .query-field input,.multiple-entries .query-field input { height:44px; font-size:16px; }
  .remove-entry { width:44px; height:44px; }
  .entry-actions { width:100%; flex-wrap:wrap; gap:4px 16px; }
  .entry-tools .text-button { min-height:44px; }
  .input-method { min-width:0; max-width:100%; }
  .input-method select { min-height:44px; font-size:16px; }
  .verification-switch { min-height:44px; font-size:13px; }
  .entry-submit { width:100%; justify-content:space-between; margin-top:4px; }
  .spreadsheet-hint { min-width:0; max-width:160px; font-size:12px; }
  .run-button { min-height:44px; min-width:120px; font-size:13px; flex-shrink:0; }
  .battle-modes button { min-height:44px; font-size:13px; }
  .battle-explainer { font-size:12px; }
  .setup-trigger { min-height:44px; }
  .results-table-wrap { overscroll-behavior-x:contain; }
  .matrix-overview.picked,.vendor-summary.picked { transform:none; }
  .entry-detail-panel { position:static; width:100%; }
  .result-detail-table .vendor-row>.row-actions { grid-column:1/-1; grid-row:auto; }
  .rating-button,.details-button,.try-vendor { min-width:44px; min-height:44px; }
  .matrix-entry,.matrix-result { min-height:44px; }
  .batch-controls select,.report-form select,.report-form textarea { font-size:16px; }
  .after-actions .text-button { min-height:44px; }
  .fighter-request { min-width:44px; min-height:44px; }
  .bench-category-tabs button { min-height:44px; }
  .pricing-table th:first-child,.pricing-table td:first-child { position:sticky; left:0; z-index:1; background:var(--surface); }
  dialog,.setup-dialog,.vendor-request-dialog { padding:24px 18px; border-radius:22px; }
  dialog>h2 { padding-right:36px; }
  .dialog-close { width:44px; height:44px; right:6px; top:6px; }
  dialog input,dialog select,dialog textarea { font-size:16px; }
  dialog button { min-height:44px; }
  .setup-dialog .agent-card { min-width:0; padding:10px 8px; overflow-wrap:anywhere; }
  .setup-dialog .lc-codewrap { padding-inline:12px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

@container(max-width:400px) {
  .result-detail-table .field-list>div { grid-template-columns:minmax(0,1fr); gap:4px; }
}

/* Keep community links in the top row without shrinking their touch targets. */
@media(max-width:600px) { .masthead .arena-community a>span { display:none; } }
@media(max-width:360px) {
  .masthead .brand-name { display:none; }
  .masthead .sign-in-button { padding-inline:14px; }
}

.run-cost-summary { display:flex; align-items:center; flex-wrap:wrap; gap:20px 40px; margin:24px 4px 12px; scroll-margin-top:24px; }
.run-cost-metrics { display:flex; flex-wrap:wrap; gap:20px 40px; margin:0; }
.run-cost-summary dt { color:var(--muted); font-size:13px; margin-bottom:6px; }
.run-cost-summary dd { margin:0; font-size:20px; font-variant-numeric:tabular-nums; }
.run-cost-summary dd small { font-size:12px; color:var(--muted); }

.account-actions { display:flex; align-items:center; gap:10px; }
.mobile-account-menu { display:none; position:relative; margin:0; }
.mobile-account-menu summary { display:flex; align-items:center; justify-content:center; width:32px; min-height:44px; cursor:pointer; list-style:none; border-radius:10px; }
.mobile-account-menu summary::-webkit-details-marker { display:none; }
.mobile-account-menu summary:focus-visible { outline:2px solid var(--teal-ink); outline-offset:2px; }
.account-menu-panel { position:absolute; top:calc(100% + 6px); right:0; z-index:30; min-width:128px; padding:6px; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 8px 24px #00000012; }
.account-menu-panel button { width:100%; text-align:left; padding:10px 14px; white-space:nowrap; }
@media(max-width:600px) {
  .account-actions { gap:0; }
  .account-actions .desktop-signout,.masthead .desktop-team-switcher { display:none; }
  .mobile-account-menu { display:block; }
}

.account-menu-panel .team-switcher { flex-direction:column; align-items:stretch; gap:6px; padding:8px; width:220px; max-width:calc(100vw - 56px); }
.account-menu-panel .team-switcher>span { padding:0 4px; font-size:12px; }
.masthead .account-menu-panel select { width:100%; max-width:100%; }
