/* ============================================================
   ON3VZ - QSO Dashboard  (subpage of /logbook/)
   Added 2026-07-12. Self-contained: delete qso-dashboard.{html,js,css}
   and the logbook.html link block to revert.
   ============================================================ */

.qd-wrap { padding-bottom: 5rem; }

/* ── HERO ── */
.qd-hero {
  padding: 2.5rem 0 1.5rem;
  border-bottom: 1px solid var(--c-border);
}
.qd-back {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-family: var(--f-mono);
  font-size: .72rem;
  letter-spacing: .08rem;
  color: var(--c-text-3);
  text-decoration: none;
  margin-bottom: 1rem;
  transition: color var(--t);
}
.qd-back:hover { color: var(--c-primary); }
.qd-sub {
  color: var(--c-text-2);
  font-size: .9rem;
  max-width: 62ch;
  margin-top: .35rem;
}
.qd-updated {
  font-family: var(--f-mono);
  font-size: .62rem;
  letter-spacing: .1rem;
  color: var(--c-text-3);
  margin-top: .8rem;
  text-transform: uppercase;
}

/* ── KPI GRID ── */
.qd-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: .8rem;
  padding: 1.6rem 0 0;
}
.qd-kpi {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-left: 2px solid var(--c-primary);
  border-radius: 0 10px 10px 0;
  padding: .9rem 1rem .85rem;
  transition: border-color var(--t), box-shadow var(--t), transform var(--t);
}
.qd-kpi:hover {
  border-color: var(--c-border-hard);
  border-left-color: var(--c-primary);
  box-shadow: var(--glow-sm);
  transform: translateY(-2px);
}
.qd-kpi--cyan  { border-left-color: var(--c-cyan); }
.qd-kpi--amber { border-left-color: var(--c-amber); }
.qd-kpi-lbl {
  font-family: var(--f-mono);
  font-size: .58rem;
  letter-spacing: .14rem;
  text-transform: uppercase;
  color: var(--c-text-3);
}
.qd-kpi-val {
  font-family: var(--f-display);
  font-size: 1.55rem;
  font-weight: 700;
  color: var(--c-primary);
  line-height: 1.15;
  margin-top: .3rem;
  text-shadow: var(--glow-sm);
  word-break: break-word;
}
.qd-kpi--cyan  .qd-kpi-val { color: var(--c-cyan);  text-shadow: var(--glow-cyan); }
.qd-kpi--amber .qd-kpi-val { color: var(--c-amber); text-shadow: 0 0 12px rgba(240,165,0,0.4); }
.qd-kpi-sub {
  font-family: var(--f-mono);
  font-size: .62rem;
  letter-spacing: .04rem;
  color: var(--c-text-3);
  margin-top: .35rem;
  line-height: 1.4;
}
.qd-kpi-sub .up   { color: var(--c-primary); }
.qd-kpi-sub .down { color: var(--c-red); }

/* ── PANELS ── */
.qd-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 1rem;
}
.qd-grid--three { grid-template-columns: 1fr 1fr 1fr; }
.qd-panel {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 12px;
  padding: 1.1rem 1.2rem 1.2rem;
  transition: border-color var(--t), box-shadow var(--t);
  min-width: 0;
}
.qd-panel:hover { border-color: var(--c-border-hard); box-shadow: var(--glow-sm); }
.qd-panel--full { grid-column: 1 / -1; }
.qd-panel-title {
  font-family: var(--f-mono);
  font-size: .62rem;
  letter-spacing: .18rem;
  text-transform: uppercase;
  color: var(--c-text-3);
  margin-bottom: .9rem;
  display: flex;
  align-items: center;
  gap: .6rem;
}
.qd-panel-title::before {
  content: '';
  display: block;
  width: 14px; height: 1px;
  background: var(--c-primary);
  box-shadow: var(--glow-sm);
}
.qd-panel-note {
  font-family: var(--f-mono);
  font-size: .58rem;
  letter-spacing: .04rem;
  color: var(--c-text-3);
  margin-top: .7rem;
  opacity: .8;
}
.qd-chart-box { position: relative; height: 190px; }
.qd-chart-box--tall { height: 230px; }

/* ── ACTIVITY HEATMAP (calendar) ── */
.qd-cal {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(7, 1fr);
  gap: 3px;
  overflow-x: auto;
  padding-bottom: .3rem;
}
.qd-cal-cell {
  width: 13px; height: 13px;
  border-radius: 2.5px;
  background: rgba(0,255,136,0.05);
  border: 1px solid rgba(0,255,136,0.07);
}
.qd-cal-cell[data-lvl="1"] { background: rgba(0,255,136,0.18); }
.qd-cal-cell[data-lvl="2"] { background: rgba(0,255,136,0.38); }
.qd-cal-cell[data-lvl="3"] { background: rgba(0,255,136,0.62); }
.qd-cal-cell[data-lvl="4"] { background: var(--c-primary); box-shadow: 0 0 6px rgba(0,255,136,0.55); }
.qd-cal-cell.qd-cal-future { opacity: 0; pointer-events: none; }
.qd-cal-legend {
  display: flex;
  align-items: center;
  gap: .35rem;
  margin-top: .6rem;
  font-family: var(--f-mono);
  font-size: .58rem;
  color: var(--c-text-3);
}
.qd-cal-legend .qd-cal-cell { width: 10px; height: 10px; }

/* ── BAND x HOUR FINGERPRINT ── */
.qd-fp {
  display: grid;
  gap: 2px;
  font-family: var(--f-mono);
}
.qd-fp-row { display: contents; }
.qd-fp-band {
  font-size: .62rem;
  color: var(--c-text-2);
  letter-spacing: .05rem;
  align-self: center;
  padding-right: .5rem;
  text-align: right;
}
.qd-fp-cell {
  aspect-ratio: 1.35;
  min-width: 0;
  border-radius: 2px;
  background: rgba(0,212,255,0.05);
  border: 1px solid rgba(0,212,255,0.06);
}
.qd-fp-cell[data-lvl="1"] { background: rgba(0,212,255,0.16); }
.qd-fp-cell[data-lvl="2"] { background: rgba(0,212,255,0.34); }
.qd-fp-cell[data-lvl="3"] { background: rgba(0,212,255,0.58); }
.qd-fp-cell[data-lvl="4"] { background: var(--c-cyan); box-shadow: 0 0 6px rgba(0,212,255,0.5); }
.qd-fp-hour {
  font-size: .52rem;
  color: var(--c-text-3);
  text-align: center;
  padding-top: .2rem;
}

/* ── MILESTONES ── */
.qd-miles { display: flex; flex-direction: column; }
.qd-mile {
  display: flex;
  gap: 1rem;
  padding: .55rem 0;
  border-bottom: 1px solid rgba(0,255,136,0.06);
  font-family: var(--f-mono);
  font-size: .74rem;
  align-items: baseline;
}
.qd-mile:last-child { border-bottom: none; }
.qd-mile-date {
  color: var(--c-amber);
  min-width: 6.4rem;
  font-size: .68rem;
  letter-spacing: .04rem;
  flex-shrink: 0;
}
.qd-mile-text { color: var(--c-text-2); line-height: 1.5; }
.qd-mile-text .hl { color: var(--c-cyan); }

/* ── TOOLTIP (shared, plain DOM) ── */
.qd-tip {
  position: fixed;
  z-index: 2000;
  pointer-events: none;
  background: var(--c-surface-2);
  border: 1px solid var(--c-border-hard);
  border-radius: 6px;
  padding: .4rem .6rem;
  font-family: var(--f-mono);
  font-size: .66rem;
  color: var(--c-text);
  box-shadow: 0 6px 24px rgba(0,0,0,0.5);
  white-space: nowrap;
  display: none;
}

/* ── LOADING / EMPTY ── */
.qd-loading {
  font-family: var(--f-mono);
  font-size: .74rem;
  color: var(--c-text-3);
  text-align: center;
  padding: 3rem 0;
  letter-spacing: .08rem;
}

/* ── STATION NOTE (copied from dxcc-matrix.css so this page stays
      self-contained; same visual as logbook / matrix) ── */
.dm-station {
  margin-top: 1.25rem;
  padding: 1rem 1.15rem;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-left: 3px solid var(--c-amber);
  border-radius: 10px;
}
.dm-station-label {
  font-family: var(--f-mono);
  font-size: .62rem;
  letter-spacing: .14rem;
  color: var(--c-amber);
  text-transform: uppercase;
  margin-bottom: .45rem;
}
.dm-station-text {
  color: var(--c-text-2);
  font-size: .85rem;
  line-height: 1.55;
  max-width: 70ch;
  margin: 0;
}
.dm-station-text strong { color: var(--c-text); font-weight: 600; }

/* ── RESPONSIVE ── */
@media (max-width: 860px) {
  .qd-grid, .qd-grid--three { grid-template-columns: 1fr; }
  .qd-kpis { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
  .qd-fp-band { font-size: .55rem; }
  .qd-fp-hour { font-size: .45rem; }
}

/* ============================================================
   VISUAL OVERHAUL 2026-07-24
   Manual removal block: delete everything from this banner to the
   end of the file, or use git revert <sha>. These rules only
   restyle existing components and add the new scale legend, band
   dots and fingerprint totals. Nothing above is deleted.
   ============================================================ */

/* ── HEAT RAMP ──
   Six perceptual steps instead of four alpha values of one hue. The
   old single-hue ramp made a busy day and a quiet day look nearly
   identical on a dark background. */
.qd-cal-cell,
.qd-fp-cell,
.qd-scale-step {
  background: #101a2e;
  border: 1px solid rgba(122,150,176,0.10);
}
.qd-cal-cell[data-lvl="1"], .qd-fp-cell[data-lvl="1"], .qd-scale-step[data-lvl="1"] { background: #0f4f68; border-color: rgba(15,79,104,0.9); }
.qd-cal-cell[data-lvl="2"], .qd-fp-cell[data-lvl="2"], .qd-scale-step[data-lvl="2"] { background: #0d8a8a; border-color: rgba(13,138,138,0.9); }
.qd-cal-cell[data-lvl="3"], .qd-fp-cell[data-lvl="3"], .qd-scale-step[data-lvl="3"] { background: #14b877; border-color: rgba(20,184,119,0.9); }
.qd-cal-cell[data-lvl="4"], .qd-fp-cell[data-lvl="4"], .qd-scale-step[data-lvl="4"] { background: #63e06a; border-color: rgba(99,224,106,0.9); }
.qd-cal-cell[data-lvl="5"], .qd-fp-cell[data-lvl="5"], .qd-scale-step[data-lvl="5"] {
  background: #c8ff66;
  border-color: rgba(200,255,102,0.95);
  box-shadow: 0 0 7px rgba(200,255,102,0.45);
}
.qd-cal-cell { width: 14px; height: 14px; border-radius: 3px; }
.qd-cal-cell.qd-cal-future { opacity: 0; }
.qd-cal-today { outline: 1px solid var(--c-primary); outline-offset: 1px; }

/* ── SCALE LEGEND (replaces the wordless less/more strip) ── */
.qd-scale {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: .85rem;
  font-family: var(--f-mono);
}
.qd-scale-cap {
  font-size: .55rem;
  letter-spacing: .14rem;
  text-transform: uppercase;
  color: var(--c-text-3);
  margin-right: .35rem;
  padding-bottom: 2px;
}
.qd-scale-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
}
.qd-scale-step {
  width: 24px;
  height: 11px;
  border-radius: 2px;
  display: block;
}
.qd-scale-num {
  font-size: .53rem;
  letter-spacing: .04rem;
  color: var(--c-text-3);
}

/* ── FINGERPRINT: band colour key + row totals ── */
.qd-fp-band {
  display: flex;
  align-items: center;
  gap: .32rem;
  padding-right: .35rem;
}
.qd-fp-band i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: 0 0 auto;
  box-shadow: 0 0 5px currentColor;
}
.qd-fp-total {
  font-size: .6rem;
  color: var(--c-text-2);
  text-align: right;
  align-self: center;
  padding-left: .35rem;
  border-left: 1px solid var(--c-border);
}
.qd-fp-hour--tot {
  font-size: .5rem;
  text-align: right;
  color: var(--c-text-3);
}
.qd-fp-peak {
  outline: 1px solid rgba(255,255,255,0.55);
  outline-offset: 0;
}

/* ── CHARTS: more breathing room so labels are legible ── */
.qd-chart-box { height: 215px; }
.qd-chart-box--bands { height: 260px; }
@media (max-width: 640px) {
  .qd-chart-box { height: 195px; }
  .qd-chart-box--bands { height: 230px; }
  .qd-cal-cell { width: 11px; height: 11px; }
  .qd-scale-step { width: 18px; }
}

/* ============================================================
   SLICERS + REPORT POLISH 2026-07-24
   Manual removal block: delete from this banner to the end of the
   file, or git revert <sha>.
   ============================================================ */

:root { --cal-cell: 14px; --cal-gap: 3px; }

/* ── SLICER BAR (page level filters, BI report style) ── */
.qd-slicers {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 1.4rem;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-top: 2px solid var(--c-primary);
  border-radius: 4px 4px 12px 12px;
  padding: 1rem 1.2rem;
  margin-bottom: 1.4rem;
}
.qd-slicer { display: flex; flex-direction: column; gap: .5rem; min-width: 0; }
.qd-slicer--end { margin-left: auto; align-items: flex-end; justify-content: center; gap: .6rem; }
.qd-slicer-lbl {
  font-family: var(--f-mono);
  font-size: .55rem;
  letter-spacing: .18rem;
  text-transform: uppercase;
  color: var(--c-text-3);
}

/* Segmented period control */
.qd-seg { display: inline-flex; border: 1px solid var(--c-border); border-radius: 7px; overflow: hidden; }
.qd-seg-btn {
  font-family: var(--f-mono);
  font-size: .64rem;
  letter-spacing: .05rem;
  padding: .42rem .8rem;
  background: transparent;
  color: var(--c-text-3);
  border: none;
  border-right: 1px solid var(--c-border);
  cursor: pointer;
  transition: color var(--t), background var(--t);
}
.qd-seg-btn:last-child { border-right: none; }
.qd-seg-btn:hover { color: var(--c-text); background: rgba(0,255,136,0.06); }
.qd-seg-btn.is-on { background: rgba(0,255,136,0.14); color: var(--c-primary); }

/* Multi select pills, coloured by band or mode */
.qd-pills { display: flex; flex-wrap: wrap; gap: .38rem; }
.qd-pill {
  display: inline-flex;
  align-items: center;
  gap: .34rem;
  font-family: var(--f-mono);
  font-size: .64rem;
  letter-spacing: .04rem;
  padding: .36rem .62rem;
  border-radius: 20px;
  background: transparent;
  color: var(--c-text-3);
  border: 1px solid var(--c-border);
  cursor: pointer;
  transition: all var(--t);
}
.qd-pill i {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--pill, var(--c-primary));
  flex: 0 0 auto;
}
.qd-pill span { font-size: .55rem; opacity: .6; }
.qd-pill:hover { color: var(--c-text); border-color: var(--c-border-hard); }
.qd-pill.is-on {
  color: var(--c-text);
  border-color: var(--pill, var(--c-primary));
  background: color-mix(in srgb, var(--pill, #00ff88) 14%, transparent);
}
.qd-pill.is-on i { box-shadow: 0 0 7px var(--pill, var(--c-primary)); }

.qd-filter-state {
  font-family: var(--f-mono);
  font-size: .62rem;
  color: var(--c-text-3);
  white-space: nowrap;
}
.qd-filter-state strong { color: var(--c-primary); font-weight: 400; }
.qd-reset {
  font-family: var(--f-mono);
  font-size: .6rem;
  letter-spacing: .1rem;
  text-transform: uppercase;
  padding: .4rem .8rem;
  border-radius: 6px;
  background: transparent;
  color: var(--c-text-3);
  border: 1px solid var(--c-border);
  cursor: pointer;
  transition: all var(--t);
}
.qd-reset:hover { color: var(--c-primary); border-color: var(--c-primary); }

/* ── PANEL LEAD TEXT (explains a visual before you have to guess) ── */
.qd-panel-lead {
  font-size: .78rem;
  line-height: 1.6;
  color: var(--c-text-2);
  margin: -.2rem 0 .9rem;
  max-width: 62ch;
}

/* ── CALENDAR WITH LABELLED AXES ── */
.qd-cal-wrap { overflow-x: auto; padding-bottom: .2rem; }
.qd-cal-months {
  display: grid;
  gap: var(--cal-gap);
  margin-left: calc(2.1rem + var(--cal-gap));
  margin-bottom: .3rem;
  font-family: var(--f-mono);
  font-size: .55rem;
  letter-spacing: .08rem;
  color: var(--c-text-3);
}
.qd-cal-months span { white-space: nowrap; overflow: visible; }
.qd-cal-body { display: flex; gap: var(--cal-gap); align-items: flex-start; }
.qd-cal-days {
  display: grid;
  grid-template-rows: repeat(7, var(--cal-cell));
  gap: var(--cal-gap);
  width: 2.1rem;
  font-family: var(--f-mono);
  font-size: .55rem;
  color: var(--c-text-3);
}
.qd-cal-days span { display: flex; align-items: center; height: var(--cal-cell); }
.qd-cal { grid-template-rows: repeat(7, var(--cal-cell)); gap: var(--cal-gap); }
.qd-cal-cell { width: var(--cal-cell); height: var(--cal-cell); }

/* ── REPORT POLISH ── */
.qd-panel { border-radius: 4px 4px 12px 12px; border-top: 2px solid var(--c-border-hard); }
.qd-panel:hover { border-top-color: var(--c-primary); }
.qd-kpi { border-radius: 4px 10px 10px 4px; }

@media (max-width: 720px) {
  .qd-slicers { gap: 1rem; padding: .9rem 1rem; }
  .qd-slicer--end { margin-left: 0; align-items: flex-start; }
  .qd-seg { flex-wrap: wrap; }
  :root { --cal-cell: 11px; }
}