/* Public records and personal history share the cabin's instrument materials.
   This layer changes presentation only: every amount, period and proof remains
   the value and control produced by ui.js. No decorative motion in live lists. */

#pane-board, #pane-history {
  --record-line: rgba(166, 194, 210, .2);
  --record-muted: #a6bac7;
  --record-metal: #c5dce5;
}

#pane-board .fair-h {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 30px 0 16px;
  color: #eeece4;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -.025em;
  text-transform: none;
}
#pane-board .fair-h::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--record-line), transparent);
}
#pane-board .board-view > .fair-h:first-child { margin-top: 20px; }
#pane-board .small {
  color: var(--record-muted);
  font-size: 12px;
  line-height: 1.65;
}
#pane-board #board-summary {
  margin: 16px 0 22px;
  padding: 0 1px;
  line-height: 1.7;
}

/* Two different levels of navigation: the window is a segmented instrument,
   while the view name is an underlined section of the record. */
#pane-board .board-periods {
  flex-direction: row;
  gap: 3px;
  margin: 0 0 12px;
  padding: 4px;
  background: #06111b;
  border: 1px solid var(--record-line);
  border-radius: 6px;
  box-shadow: none;
}
#pane-board .board-periods .small-btn {
  min-width: 0;
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  box-shadow: none;
  font-family: var(--ui);
  font-size: 12px;
  color: var(--record-muted);
  transition: color .16s ease, background .16s ease, border-color .16s ease, box-shadow .18s ease;
}
#pane-board .board-periods .small-btn[aria-pressed="true"] {
  color: #e8eff1;
  border-color: rgba(167, 198, 216, .26);
  background: #233b49;
  box-shadow: inset 0 1px #d8f2ff0d;
}
#pane-board .board-views {
  flex-direction: row;
  gap: 0;
  margin: 0 0 18px;
  border-bottom: 1px solid var(--record-line);
}
#pane-board .board-views .small-btn {
  min-height: 44px;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--record-muted);
  font-size: 12px;
  font-weight: 600;
  transition: color .16s ease, background .16s ease, box-shadow .18s ease;
}
#pane-board .board-views .small-btn[aria-pressed="true"] {
  color: #dff6ff;
  background: linear-gradient(0deg, #6fe6ff0b, transparent 85%);
  box-shadow: inset 0 -2px #91c9d8;
}
#pane-board .small-btn:hover:not(:disabled) { color: var(--ink-hi); }
#pane-board :is(.board-periods, .board-views) .small-btn:active:not(:disabled) {
  box-shadow: inset 0 2px 5px #0004;
}
#pane-board .board-view:not([hidden]) { animation: record-view-in .2s ease-out both; }
@keyframes record-view-in { from { opacity: .5; } to { opacity: 1; } }
#pane-board :is(button, [role="button"]):focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 3px;
}
#pane-board #board-back {
  min-height: 44px;
  margin-bottom: 14px;
  padding-inline: 0 12px;
  border: 0;
  background: none;
  color: var(--record-metal);
  box-shadow: none;
  font-size: 12px;
}

/* The profile is a signed identity plate. The etching is decorative; its
   concentric aperture cannot imply a score, progress or status. */
#pane-board .you-card {
  position: relative;
  overflow: hidden;
  gap: 16px;
  padding: 24px;
  margin: 0 0 24px;
  border: 1px solid rgba(162, 197, 213, .26);
  border-radius: 8px;
  background:
    radial-gradient(ellipse at 100% 0%, #4c798522, transparent 65%),
    linear-gradient(115deg, #1c3543, #10222f 80%);
  box-shadow: inset 0 1px #e6faff12, 0 6px 20px #0002;
}
#pane-board .you-card::before {
  content: "";
  position: absolute;
  pointer-events: none;
  width: 174px;
  height: 174px;
  right: -35px;
  top: -75px;
  border: 1px solid #b3e6fb0c;
  border-radius: 50%;
  box-shadow: 0 0 0 19px #b3e6fb06, 0 0 0 20px #b3e6fb08,
              0 0 0 42px #b3e6fb04, 0 0 0 43px #b3e6fb06;
}
#pane-board .you-card > * { position: relative; }
#pane-board .you-mark {
  padding: 6px;
  border: 1px solid #afcbd13b;
  border-radius: 50%;
  background: linear-gradient(145deg, #334957, #08151f);
  box-shadow: inset 0 1px #fff2, 0 3px 7px #0005;
}
#pane-board .you-mark .board-avatar svg { width: 44px; height: 44px; }
#pane-board .you-name { font-family: var(--ui); font-size: 25px; letter-spacing: -.03em; color: #eeece4; }
#pane-board .you-k { margin-top: 6px; color: #aec5d1; font-size: 10px; letter-spacing: .09em; }
#pane-board .you-stats { gap: 8px; }
#pane-board .you-stats > div {
  min-width: 70px;
  padding: 12px 0;
  border: 0; border-top: 1px solid #a2c4d32b;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#pane-board .you-stat-k { color: #aec5d1; font-size: 11px; letter-spacing: .045em; }
#pane-board .you-stat-v {
  margin-top: 4px; font-family: var(--ui); font-size: 30px; font-weight: 500;
  line-height: 1.25; letter-spacing: -.035em; overflow-wrap: anywhere;
}
#pane-board .you-stat-v.down { color: #b7c7d1; }
#wallet-modal.you-open #pane-board .you-card { flex-wrap: wrap; }
#wallet-modal.you-open #pane-board .you-stats { width: 100%; padding-top: 8px; }
#wallet-modal.you-open #pane-board .you-stats > div { flex: 1; min-width: 0; align-items: flex-start; padding: 18px 0 0; }

#pane-board .board-self {
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas: "rank-label net-label" "rank-value net-value";
  gap: 6px 24px;
  margin: 0 0 22px;
  padding: 18px 20px;
  border: 1px solid var(--record-line);
  border-radius: 6px;
  background: #142936;
  box-shadow: none;
}
#pane-board .board-self::after {
  content: "";
  position: absolute;
  left: 50%; top: 13px; bottom: 13px;
  width: 1px;
  background: var(--record-line);
}
#pane-board .board-self-k { grid-area: rank-label; font-size: 11px; letter-spacing: .045em; }
#pane-board .board-self-v { grid-area: rank-value; color: #d9eef7; font-family: var(--ui); font-size: 28px; letter-spacing: -.035em; overflow-wrap: anywhere; }
#pane-board .board-self-k.right { grid-area: net-label; }
#pane-board .board-self-v.right { grid-area: net-value; }
#pane-board .board-self-v.down { color: #b4c4ce; }

/* Denominators remain visible under every player. The proportional tint uses
   the existing net bar; it never competes with the actual right-aligned amount. */
#pane-board .board-list { gap: 0; margin: 10px 0 16px; border-top: 1px solid var(--record-line); }
/* The personal list shares the word "bets" with the compact live dock.
   Release that dock's height cap here so every settled record is reachable
   through the modal's one scroller, including on a landscape phone. */
#pane-board .board-list.bets {
  display: flex;
  flex: none;
  max-height: none;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}
#pane-board .board-row {
  min-height: 76px;
  grid-template-columns: 30px 36px minmax(0, 1fr) auto;
  gap: 5px 12px;
  padding: 15px 12px;
  border: 0; border-bottom: 1px solid #a0c6da20;
  border-radius: 0;
  background: #10222e55;
  box-shadow: none;
  transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
#pane-board .board-bar {
  inset: 0 auto 0 0;
  max-width: 100%;
  border-radius: 0;
  background: linear-gradient(90deg, #87bfcb0b, #87bfcb03);
}
#pane-board .board-row.rank-1 { border-color: #bb9c5747; background: linear-gradient(110deg, #62522c22, #16262b22 80%); }
#pane-board .board-row.rank-2 { border-color: #acc6d32e; }
#pane-board .board-row.rank-3 { border-color: #bc95632b; }
#pane-board .board-rank { font-size: 11px; color: #8ca3b3; letter-spacing: -.035em; }
#pane-board :is(.rank-1, .rank-2, .rank-3) .board-rank {
  position: relative;
  width: 27px; height: 27px;
  border: 1px solid #fff5;
  font-size: 11px;
  font-weight: 800;
  color: #273039;
  box-shadow: inset 0 0 0 2px #19252a40, inset 0 3px 5px #ffffff45,
              0 0 0 2px #07131c, 0 3px 6px #0006;
}
#pane-board .rank-1 .board-rank { background: conic-gradient(from 25deg, #d2ab62, #fae2a3, #b98a42, #eac881, #d2ab62); }
#pane-board .rank-2 .board-rank { background: conic-gradient(from 25deg, #92aaba, #dfecf4, #879cab, #d3e1e9, #92aaba); }
#pane-board .rank-3 .board-rank { background: conic-gradient(from 25deg, #b68155, #edc29b, #95623f, #d1a37d, #b68155); }
#pane-board .board-row > .board-avatar svg {
  width: 34px; height: 34px;
  border: 1px solid #a9d5e32b;
  padding: 4px;
  background: #08131bd9;
  box-shadow: inset 0 1px 3px #0006;
}
#pane-board .board-who { align-self: end; color: #e1edf4; font-size: 14px; font-weight: 500; font-family: var(--ui); }
#pane-board .board-over { align-self: start; color: #afc2ce; font-size: 11px; line-height: 1.6; }
#pane-board .board-net { padding-left: 5px; color: #b4dccb; font-family: var(--ui); font-size: 20px; font-weight: 500; letter-spacing: -.025em; white-space: nowrap; }
#pane-board .board-net.down { color: #b0bdc7; }
#pane-board .board-row.you {
  border-color: #8fd3ea46;
  background: linear-gradient(110deg, #294d5b50, #0e23324d);
  box-shadow: inset 2px 0 #9ad5e5, inset 0 1px #d3f0ff0b;
}
#pane-board .board-you { margin-left: 5px; padding: 2px 4px; background: #91cad81c; color: #c6eaf5; font-size: 8px; }
#board-leader-rows .board-row:hover, #board-leader-rows .board-row:focus-visible {
  background-color: #adcde90a; border-color: #a4d0e14d;
  box-shadow: inset 0 1px #d3f0ff0d, inset 2px 0 #8bbbc9;
}
#pane-board #board-standing { margin: 12px 0; padding: 10px 12px; border-left: 2px solid #759aac; color: #c8dce6; }

/* Insets, hairline scales and extra plotting height give the charts space.
   SVG geometry, logarithmic axes and independent candle semantics stay intact. */
#pane-board .board-chart:not(:empty) {
  height: 160px;
  margin: 12px 0 12px;
  padding: 20px 16px 10px;
  border: 1px solid var(--record-line);
  border-radius: 6px;
  color: #a6bac8;
  background:
    repeating-linear-gradient(90deg, transparent 0, transparent calc(20% - 1px), #9acde606 calc(20% - 1px), #9acde606 20%),
    linear-gradient(180deg, #04101a, #0b1c28);
  box-shadow: inset 0 2px 8px #0003, inset 0 -1px #d3f0ff06;
}
#pane-board .board-chart svg { width: 100%; height: 100%; overflow: visible; }
#pane-board :is(#board-series-note, #board-chart-note, #board-curve-note) { margin: 0 3px 20px; font-size: 10px; }

#pane-board .board-list.rounds .board-row {
  grid-template-columns: 48px 66px minmax(0, 1fr) auto;
  gap: 10px;
  min-height: 66px;
}
#pane-board .board-list.bets .board-row {
  grid-template-columns: 48px 66px minmax(0, 1fr);
  gap: 5px 10px;
}
#pane-board .board-list.bets .board-rank,
#pane-board .board-list.rounds .board-rank { text-align: left; }
#pane-board .board-list.bets .board-over { grid-area: over; }
#pane-board .board-list.rounds .board-over { white-space: normal; overflow: visible; }
#pane-board .board-mult { font-size: 15px; letter-spacing: -.025em; }
#pane-board .board-mult.lo { color: #a9b6c3; }
#pane-board .board-mult.mid { color: #a0d4e2; }
#pane-board .board-mult.hi { color: #e5c78c; }
#pane-board .board-row.bet.won { border-left-color: #93bbac54; }
#pane-board .board-row.bet.lost { background: linear-gradient(100deg, #1a253042, #0a141c6b); }
#pane-board .board-row.bet.refused { background: #0a16206b; opacity: 1; }
#pane-board .board-row.bet.refused .board-net { color: #9caab4; }
#pane-board .board-seed { color: #93adbd; font-size: 10px; }
#pane-board button.board-seed { border-bottom: 1px dotted #8bb7c940; color: #a6c4d5; }
#pane-board .board-seed.inline { opacity: 1; color: #91a8b8; }
#pane-board .board-more {
  margin: 16px 0 8px;
  min-height: 46px;
  border: 1px solid var(--record-line);
  border-radius: 6px;
  background: #1a303d;
  color: #bad1df;
  font-size: 11px;
}

/* A quiet record icon accompanies the existing explanatory sentence. Empty
   messages reserve no card: loading is explained by the actual summary. */
#pane-board #board-view-mine.is-empty #board-mine-note,
#pane-board #board-view-leaders:has(#board-leader-rows:empty) #board-leaders-note,
#pane-board #board-view-rounds:has(#board-round-rows:empty) #board-rounds-note {
  position: relative;
  margin: 12px 0 18px;
  padding: 20px 18px 20px 56px;
  border: 1px solid var(--record-line);
  border-radius: 6px;
  background: #142936;
  color: #c0d2dd;
  text-align: left;
  font-size: 13px;
  line-height: 1.7;
}
#pane-board #board-view-mine.is-empty #board-mine-note::before,
#pane-board #board-view-leaders:has(#board-leader-rows:empty) #board-leaders-note::before,
#pane-board #board-view-rounds:has(#board-round-rows:empty) #board-rounds-note::before {
  content: "";
  position: absolute;
  top: 23px; left: 18px;
  width: 23px; height: 27px;
  border: 1px solid #9ac9d75e;
  border-radius: 4px;
  background: linear-gradient(#9ac9d74d, #9ac9d74d) 5px 7px / 11px 1px no-repeat,
              linear-gradient(#9ac9d74d, #9ac9d74d) 5px 12px / 11px 1px no-repeat,
              linear-gradient(#9ac9d74d, #9ac9d74d) 5px 17px / 7px 1px no-repeat;
}
#pane-board :is(#board-mine-note, #board-leaders-note, #board-rounds-note):empty { display: none; }

/* Account ledger: a quiet financial statement with complete numeric columns. */
#pane-history .statement-explainer {
  margin: 0 0 20px;
  border: 1px solid var(--record-line);
  border-radius: 6px;
  background: #142936;
}
#pane-history .statement-explainer summary {
  min-height: 46px; padding: 14px 16px; cursor: pointer;
  color: #c7dce4; font: 500 13px/1.45 var(--ui);
}
#pane-history .statement-explainer summary::marker { color: #9fc6d2; }
#pane-history .statement-explainer summary:hover { color: #edf2ed; background: #a7cbd908; }
#pane-history .statement-explainer summary:focus-visible {
  outline: 2px solid var(--cyan); outline-offset: 3px;
}
#pane-history .statement-explainer .small {
  padding: 14px 16px 18px; margin: 0;
  border-top: 1px solid var(--record-line);
  color: #becfd9;
  font-size: 12px;
  line-height: 1.7;
}
#pane-history .stmt-wrap { border-color: var(--record-line); border-radius: 6px; background: #091924; box-shadow: inset 0 2px 7px #0003; }
#pane-history .stmt th { z-index: 1; padding-block: 15px; background: #1a303d; color: #c4d6df; font-size: 10px; letter-spacing: .045em; text-transform: uppercase; }
#pane-history .stmt td { padding-block: 15px; border-color: #a0c6da20; color: #c1d1da; font-size: 12px; line-height: 1.5; }
#pane-history .stmt tbody tr:nth-child(even) { background: #9fc8dc04; }
#pane-history .stmt .what { color: #d2e1e9; }
#pane-history .stmt .tx { margin-top: 4px; color: #a9bdca; font-size: 10px; }
#pane-history .stmt td.up { color: #b1d7c7; }
#pane-history .stmt td.down { color: #c9b7b1; }
#pane-history .stmt td.num { font-weight: 550; letter-spacing: -.025em; }
#pane-history :is(#stmt-status, .foot) { color: #aec2cf; font-size: 12px; line-height: 1.65; }
#pane-history .limits-row { gap: 8px; }
#pane-history .limits-row .btn-quiet { min-height: 44px; border-radius: 6px; font-size: 12px; }

/* Conversation rows: the identity and timestamp get one small line, leaving
   the message the full column. Mobile drawer sizing remains in styles.css. */
#chat-log { padding: 8px 12px; border-color: #a0c6da1c; border-radius: 6px; background: #091822; }
#chat-log .chat-line { grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; padding: 10px 3px; border-bottom: 1px solid #a0c6da0d; }
#chat-log .chat-line:last-child { border-bottom: 0; }
#chat-log .chat-who { grid-column: 1; grid-row: 1; color: #a8c9d9; font-size: 10px; font-weight: 600; }
#chat-log .chat-when { grid-column: 2; grid-row: 1; align-self: center; color: #8ca2b1; font-family: var(--mono); font-size: 9px; }
#chat-log .chat-body { grid-column: 1 / -1; grid-row: 2; min-width: 0; color: #cddce5; font-size: 12px; line-height: 1.55; }
#chat-log .chat-line.mine .chat-who { color: #b5d6c9; }
#chat-log .chat-line.removed .chat-body { color: #9aaaB6; }
#chat-note { color: #91a9b8; font-size: 10px; line-height: 1.6; }

/* The embedded roster inherits the same finishes at its existing compact size.
   Its live ordering, animation classes and mobile column visibility stay intact. */
#bets .bets-head {
  background: linear-gradient(180deg, #2439466b, #1428354d);
  border-bottom-color: #a5cada24;
  box-shadow: inset 0 1px #d7f1ff06;
}
#bets .bets-tab { color: #92a9b8; font-weight: 600; }
#bets .bets-tab[aria-selected="true"] { color: #d0e5ee; background: #96c3d30a; box-shadow: inset 0 -2px #90bccb; }
#bets #table .who:not(.hdr){
  border-bottom-color: #a2c1d212;
  background: linear-gradient(90deg, #2540502e, #10232e0f);
  box-shadow: inset 0 1px #d5f0ff03;
}
#bets #table .who:nth-child(even):not(.hdr){ background-color: #98bfd005; }
#bets #table .who.hdr{ color: #b0c6d2; letter-spacing: .035em; }
#bets #table .who.hdr :is(.name, .stake, .at, .win){ color: inherit; font-size: 10px; font-weight: 500; }
#bets .who-av { border-color: #a7cad12c; box-shadow: inset 0 1px #dbf5ff15, 0 1px 3px #0004; }
#bets #table .who:not(.hdr) .name{ color: #d4e3eb; font-size: 13px; font-weight: 600; }
#bets #table .who:not(.hdr) :is(.stake, .win){
  font-family: var(--ui); font-size: 12px; font-variant-numeric: tabular-nums;
  letter-spacing: -.015em;
}
#bets #table .who:not(.hdr) .stake{ color: #b5c9d5; }
#bets #table .who:not(.hdr) .at { font-size: 11px; }
#bets #table .who.me{
  border-color: #82b8c937;
  background: linear-gradient(90deg, #32566638, #10263233);
  box-shadow: inset 2px 0 #9bc5d1;
}
#bets #table .who.busted .name { color: #9babb6; }
#bets #table .table-empty{ color: #b6cbd7; font-size: 12px; line-height: 1.65; }
#bets #table > .table-empty:only-child{
  margin: 12px 2px; padding: 14px 16px;
  border: 1px solid #a2c1d21c; border-left: 2px solid #88b6c552; border-radius: 8px;
  background: #24404e26;
}

#wallet-modal.you-open .wallet-sheet { width: min(540px, 100%); }
#pane-board .board-self-k { color: #a8bfcc; }
#pane-board .board-who { line-height: 1.35; }
#pane-board .board-list.bets .board-row { min-height: 76px; }
#pane-board .board-list.bets .board-over { line-height: 1.8; }
#pane-history .stmt-wrap { scrollbar-width: thin; scrollbar-color: #8eafc15e #0b1b26; }
#pane-history .stmt { font-variant-numeric: tabular-nums; }
#pane-history .stmt tbody tr:hover { background: #a7cbd908; }
#pane-history .stmt .tx { user-select: all; }
#pane-history .limits-row .btn-quiet { background: #1a303d; border-color: var(--record-line); }
#pane-history .limits-row .btn-quiet:hover { background: #254350; }

/* The public board uses its desktop width for context beside the ranking.
   Mobile keeps the same DOM and reading order in one continuous scroller. */
@media (min-width: 1000px) {
  #wallet-modal:not(.you-open) .wallet-sheet:has(#pane-board:not(.hidden)) { width: min(1040px, 100%); }
  #wallet-modal:not(.you-open) #pane-board {
    display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); column-gap: 30px;
  }
  #wallet-modal:not(.you-open) #pane-board.hidden { display: none; }
  #wallet-modal:not(.you-open) #pane-board .you-card { margin: 0; min-height: 84px; padding: 18px 20px; }
  #wallet-modal:not(.you-open) #pane-board .board-periods { align-self: center; margin: 0; }
  #wallet-modal:not(.you-open) #pane-board :is(#board-summary, .board-views, .board-view, #board-back) { grid-column: 1 / -1; }
  #wallet-modal:not(.you-open) #pane-board #board-summary { margin-bottom: 18px; }
  #wallet-modal:not(.you-open) #board-view-leaders {
    display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    column-gap: 30px; align-items: start;
  }
  #wallet-modal:not(.you-open) #board-view-leaders > div { min-width: 0; }
  #wallet-modal:not(.you-open) #board-view-leaders > div > .fair-h:first-child { margin-top: 0; }
  #wallet-modal:not(.you-open) #board-leader-rows { margin-top: 0; }
  #wallet-modal:not(.you-open) #board-self { margin-bottom: 16px; }
  #wallet-modal:not(.you-open) #board-chart { margin-top: 0; }
  #wallet-modal:not(.you-open) #board-series { margin-top: 0; }

}

@media (max-width: 560px) {
  #pane-board .you-card { padding: 15px; gap: 12px; }
  #pane-board .you-name { font-size: 22px; }
  #pane-board .board-row { grid-template-columns: 26px 30px minmax(0, 1fr) auto; gap: 5px 8px; padding: 14px 8px; }
  #pane-board .board-row > .board-avatar svg { width: 30px; height: 30px; padding: 3px; }
  #pane-board .board-net { font-size: 18px; }
  #pane-board .board-who { font-size: 13px; }
  #pane-board .board-over { font-size: 11px; }
  #pane-board .board-chart:not(:empty) { height: 140px; padding-inline: 10px; }
  #pane-board .board-list.rounds .board-row { grid-template-columns: 48px 1fr auto; grid-template-areas: "rank mult net" "over over over"; gap: 6px 9px; }
  #pane-board .board-list.rounds .board-over { padding-top: 2px; }
  #pane-board .board-list.bets .board-row { grid-template-columns: 42px 54px minmax(0, 1fr); grid-template-areas: "rank mult net" "over over over"; }
  #pane-history .stmt td { padding-block: 10px; font-size: 11px; }
  #pane-history .stmt th { font-size: 9px; letter-spacing: .02em; }
}
@media (max-width: 380px) {
  #pane-board .board-row { grid-template-columns: 26px 28px minmax(0, 1fr); grid-template-areas: "rank mark who" "rank mark net" ". over over"; gap: 4px 8px; }
  #pane-board .board-net { padding-left: 0; text-align: left; font-size: 16px; }
  #pane-board .board-row > .board-avatar svg { width: 28px; height: 28px; }
  #pane-board .board-list.bets .board-net { text-align: right; }
  #pane-board .board-self { padding: 12px; }
  #pane-board .board-self-v { font-size: 18px; }
  #pane-board .you-mark .board-avatar svg { width: 36px; height: 36px; }
  #pane-board .you-card { padding: 13px; }
  /* A complete figure needs more than half a narrow card. Give each account
     statistic one full row, with its label beside the stationary value. */
  #wallet-modal.you-open #pane-board .you-stats { flex-direction: column; }
  #wallet-modal.you-open #pane-board .you-stats > div {
    flex-direction: row; align-items: baseline; justify-content: space-between;
    gap: 12px; padding: 10px 12px;
  }
  #pane-board .you-stat-v { margin-top: 0; font-size: 24px; text-align: right; }
}
@media (pointer: coarse) {
  #pane-board .board-periods .small-btn,
  #pane-board .board-views .small-btn,
  #pane-board #board-back,
  #pane-board .board-more,
  #pane-history .limits-row .btn-quiet { min-height: 44px; }
  #pane-board button.board-seed { min-height: 44px; min-width: 66px; }
  #pane-board button.board-seed.inline { display: inline-flex; align-items: center; }
}
@media (prefers-reduced-motion: reduce) {
  #pane-board .board-view { animation: none; }
  #pane-board :is(.small-btn, .board-row) { transition: none; }
}