/* Optional adapter for the existing .modal > .win markup. Load last.
   Add .basu-ui ONLY to mStart, mTactic and mMenu, never to #wrap.
   Deliberately targets direct .win children: .scorecard.win means victory. */
.basu-ui.modal {
  position: fixed;
  inset: 0;
  z-index: 30;
  padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right))
    max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  background: rgba(11, 12, 18, .75);
  align-items: center;
  justify-content: center;
}
.basu-ui.modal > .win {
  width: min(100%, 1120px);
  max-height: 100%;
  max-height: calc(100dvh - max(16px, env(safe-area-inset-top)) - max(16px, env(safe-area-inset-bottom)));
  min-width: 0;
  overflow: auto;
  overscroll-behavior: contain;
  font-size: var(--ui-text);
  font-family: var(--ui-font);
  line-height: 1.6;
  color: var(--ui-ink);
  background: var(--ui-bg);
  border-radius: 3px;
  box-shadow: 0 4px 0 rgba(0, 0, 0, .25);
}
.basu-ui > .win > .hd { padding: 16px; font-size: max(1.25rem, 20px); font-family: var(--ui-pixel-font); color: white; background: var(--ui-heading); }
.basu-ui > .win > .bd { padding: 16px; }
.basu-ui .sec { padding: 16px; margin: 0 0 16px; border: 1px solid var(--ui-border); border-radius: 3px; background: var(--ui-surface); min-width: 0; }
.basu-ui .sec h3 { font-size: max(1.125rem, 18px); margin: 0 0 12px; color: var(--ui-heading); font-weight: 700; }
.basu-ui .go, .basu-ui .opt { font-size: var(--ui-text); padding: 8px 16px; min-height: var(--ui-hit); min-width: var(--ui-hit); max-width: 100%; line-height: 1.5; border: 1px solid var(--ui-border); border-radius: 3px; white-space: normal; }
.basu-ui .go { background: var(--ui-accent); color: var(--ui-accent-ink); border-color: #a67522; font-weight: 700; margin: 16px auto 0; }
.basu-ui .go.sub { background: white; color: var(--ui-ink); border-color: var(--ui-border); font-weight: normal; }
.basu-ui .opt.sel { background: var(--ui-selection); border-color: #a67522; box-shadow: inset 0 0 0 1px #a67522; }
.basu-ui .opt small, .basu-ui .why, .basu-ui .why .adv, .basu-ui .muted, .basu-ui select.ord { font-size: var(--ui-small); }
.basu-ui .row { display: flex; flex-wrap: wrap; gap: 8px; }
.basu-ui label.chk { min-height: var(--ui-hit); gap: 12px; }
.basu-ui label.chk input { width: 20px; height: 20px; }
.basu-ui .sl { display: grid; align-items: center; grid-template-columns: minmax(0, 1fr) 44px minmax(80px, 2fr) 44px minmax(0, 1fr); gap: 8px; white-space: normal; margin: 16px 0; }
.basu-ui .sl .ar { width: 44px; height: 44px; font-size: var(--ui-text); }
.basu-ui .sl .desc, .basu-ui .sl .track .ends { font-size: var(--ui-small); line-height: 1.5; }
.basu-ui .form { min-height: 44px; min-width: 44px; padding: 8px; font-size: var(--ui-small); }
.basu-ui .scorecard { width: auto; max-height: none; font-size: var(--ui-text); background: var(--ui-heading); color: white; }
.basu-ui .scorecard .sc-row { flex-wrap: wrap; }
/* Legacy inline font-size fragments must be removed at integration; no blanket
   !important override here: nested inline scaling is explicitly not guaranteed. */
@media (max-width: 600px) {
  .basu-ui.modal { padding: 0; }
  .basu-ui.modal > .win { width: 100%; height: 100%; max-height: 100%; max-height: 100dvh; border-radius: 0; }
  .basu-ui > .win > .hd { padding: max(16px, env(safe-area-inset-top)) 16px 16px; }
  .basu-ui > .win > .bd { padding: 16px max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
  .basu-ui .sl { grid-template-columns: 44px minmax(0, 1fr) 44px; }
  .basu-ui .sl > span:first-child { grid-column: 1 / -1; font-weight: 700; }
  .basu-ui .sl .desc { grid-column: 1 / -1; }
}