/* bots feature styles (BOT workstream): computer players on the room screen, course of the day (room library,
   honours board, final card) */

/* ------------------------------------------------------------------ computer players: add bar under the pairing */
.botbar { margin-top: 10px; }
.botbar-h { display: flex; justify-content: space-between; align-items: center; }
.botbar-h .eyebrow .ico, .botbar-note .ico { display: inline-block; width: 15px; height: 15px; vertical-align: -3px; margin-right: 6px; }
.botbar-b { display: flex; gap: 8px; margin-top: 8px; }
.bot-add { flex: 1; min-width: 0; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 6px; align-items: center;
  padding: 8px 10px 8px 8px; text-align: left; border: 1.5px solid var(--ink); border-radius: 2px; background: rgba(255, 255, 255, .25);
  transition: background .15s, transform .1s, opacity .15s; }
.bot-add .ico { grid-row: 1 / span 2; width: 18px; height: 18px; color: var(--g700); }
.bot-add b { font: 700 17px/1 var(--f-cond); letter-spacing: .06em; text-transform: uppercase; }
.bot-add small { font: 500 11px/1.15 var(--f-cond); letter-spacing: .03em; color: var(--ink2); }
.bot-add:hover:not(:disabled) { background: #fff; }
.bot-add:active:not(:disabled) { transform: translateY(1px); }
.bot-add:disabled { opacity: .4; cursor: default; }
.bot-add.busy { opacity: .6; }
.bot-add.sk-easy b { color: var(--g500); }
.bot-add.sk-club b { color: var(--slate); }
.bot-add.sk-pro b { color: var(--red); }
.botbar-note { margin: 4px 0 0; color: var(--ink2); }

/* CPU tag + remove button on bot rows (pairing) */
.pr.bot .nm { display: flex; flex-direction: column; line-height: 1.1; }
.pr .cpu { display: inline-flex; align-items: center; gap: 3px; margin-top: 2px; font: 700 10px/1 var(--f-cond); font-style: normal;
  letter-spacing: .12em; text-transform: uppercase; color: var(--ink2); }
.pr .cpu .ico { width: 11px; height: 11px; display: block; }
.pr .cpu i { font-style: normal; }
.pr .cpu.sk-easy i { color: var(--g500); }
.pr .cpu.sk-club i { color: var(--slate); }
.pr .cpu.sk-pro i { color: var(--red); }
.pr .bot-x { flex: none; width: 18px; height: 22px; margin-left: -6px; display: grid; place-items: center; color: var(--ink2); border-radius: 2px; transition: background .15s, color .15s; }
.pr .bot-x .ico { width: 14px; height: 14px; }
.pr .bot-x:hover { background: var(--red); color: #fff; }

/* ------------------------------------------------------------------ course of the day: library row */
.crs[data-course="daily"] .crs-b b { display: flex; align-items: center; gap: 6px; }
.crs-day { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 2px; background: var(--brass); color: var(--acc-ink); }
.crs-day .ico { width: 14px; height: 14px; }

/* honours board section */
.hb-row.dly .hb-who { display: flex; align-items: center; gap: 6px; }
.hb-row.dly.me .hb-who { font-weight: 700; }
.dly-pos { font: 700 12px/1 var(--f-cond); font-style: normal; opacity: .7; min-width: 1.2em; }
.dly-dot { flex: none; display: inline-block; width: 10px; height: 10px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .25); }
.dly-y { margin: 4px 0 8px; font: 500 12px/1.3 var(--f-cond); letter-spacing: .06em; opacity: .75; text-align: center; }

/* final card panel */
.dly-fin { margin: 14px 0 6px; padding: 10px 12px; border: 1.5px solid var(--brass); border-radius: 2px; background: rgba(196, 154, 60, .08); }
.dly-h { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.dly-list { list-style: none; margin: 8px 0 0; padding: 0; }
.dly-list li { display: flex; align-items: center; gap: 8px; padding: 4px 0; border-bottom: 1px solid var(--rule2); font: 600 15px/1.2 var(--f-body); }
.dly-list li:last-child { border-bottom: 0; }
.dly-list li i { font: 700 13px/1 var(--f-cond); font-style: normal; min-width: 1.4em; color: var(--ink2); }
.dly-list li .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dly-list li b { font: 700 17px/1 var(--f-cond); }
.dly-list li b.neg { color: var(--red); }
.dly-list li small { font: 500 12px/1 var(--f-cond); color: var(--ink2); min-width: 2em; text-align: right; }
.dly-list li.me { background: rgba(255, 255, 255, .5); }
.dly-me { margin: 6px 0 0; font: 500 13px/1.3 var(--f-cond); letter-spacing: .06em; text-transform: uppercase; color: var(--ink2); }
.dly-me b { color: var(--ink); }

/* CPU tag next to a bot's ball in lists (leaderboard, scorecard, podium, tickers) */
.cpu-tag { display: inline-block; margin: 0 4px 0 3px; padding: 1px 3px 0; border-radius: 2px; vertical-align: middle;
  font: 700 9px/1.2 var(--f-cond); font-style: normal; letter-spacing: .08em; color: #fff; background: var(--slate, #44505c); }
.cpu-tag.sk-easy { background: var(--g500, #3e7d57); }
.cpu-tag.sk-pro { background: var(--red, #b8322b); }
.pr .cpu-tag { display: none; } /* the pairing list already has its own CPU badge */
.br .cpu-tag { display: none; } /* the leaderboard is a fixed grid: an extra cell would shift every column */

/* course of the day: today's leaderboard in the room (under the course library) */
.dly-room { margin: 10px 0 4px; padding: 10px 12px; border: 1.5px solid var(--brass); border-radius: 2px; background: rgba(196, 154, 60, .08); }
.dly-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 6px; }
.dly-cols .eyebrow { display: block; }
.dly-cols .dly-list li { font-size: 14px; }
.dly-list li.top i { color: var(--brass); }

/* main page: both daily boards are visible before joining a room */
.dly-home { grid-column: 1 / -1; min-width: 0; padding: 26px 44px 30px; border-top: 1px solid var(--rule); background: rgba(196, 154, 60, .06); }
.dly-home .dly-h { align-items: center; }
.dly-home h2 { margin-top: 4px; font-size: 28px; }
.dly-conditions { margin: 8px 0 18px; font-size: 14px; color: var(--ink2); }
.dly-home .dly-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.dly-home h3 { margin: 0 0 8px; }
.dly-scroll { max-height: 252px; overflow: auto; }
.dly-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 14px; font-variant-numeric: tabular-nums; }
.dly-table th, .dly-table td { padding: 8px 4px; border-bottom: 1px solid var(--rule2); text-align: right; }
.dly-table thead th { position: sticky; top: 0; background: var(--paper); font: 600 12px/1.2 var(--f-cond); text-transform: uppercase; color: var(--ink2); }
.dly-table th:first-child, .dly-table td:first-child { width: 28px; text-align: left; color: var(--ink2); }
.dly-table th:nth-child(3), .dly-table th:nth-child(4) { width: 50px; }
.dly-table th:nth-child(2) { text-align: left; }
.dly-table tbody th { font-weight: 500; }
.dly-player { display: flex; align-items: center; gap: 7px; }
.dly-table .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dly-table small { color: var(--ink2); font-size: 11px; }
.dly-table .neg { color: var(--red); }
.dly-table .top td:first-child { color: var(--brass); font-weight: 700; }
.dly-table .me { background: rgba(196, 154, 60, .15); }
.dly-table .me th { font-weight: 700; }
.dly-empty { margin: 0; padding: 18px 12px; border: 1px dashed var(--rule); }
.dly-home > .fine { margin-bottom: 0; }
@media (max-width: 820px) { .dly-home { padding: 24px; } }
@media (max-width: 560px) { .dly-home { padding: 20px; } .dly-home .dly-cols { grid-template-columns: 1fr; gap: 20px; } }
@media (max-width: 560px) { .dly-cols { grid-template-columns: 1fr; } }