/* Board Audit's own look, on top of the kit (ui/*.css), on the kit's tokens only (ui/tokens.css). The sheet set fills the
   window under the bar. */
#sheets { height: calc(100dvh - var(--topbar)); }
/* the board: on a touch screen one finger scrolls the page (the site's gesture rule; the kit's ZuTouch sets the same) and
   two fingers move and zoom it (js/app.js); a mouse drags it */
.ba-view { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.ba-view svg { width: 100%; height: 100%; display: block; }
.ba-empty { color: var(--ink-light); text-align: center; font-size: 14px; line-height: 1.6; padding: 16px; }
/* the board picture's marker colours (engine/render.mjs reads --ba-*), the kit's */
.ba-page { --ba-fail: var(--alarm); --ba-warn: var(--warn); --ba-info: var(--dim); --ba-pass: var(--good); }
/* files dragged over the page: only where there is a mouse to drag them with */
@media (pointer: fine) {
  body.ba-drop::after { content: 'Drop your .sch and .brd here'; position: fixed; inset: 12px; display: flex; align-items: center; justify-content: center;
    border: 3px dashed var(--brand); border-radius: var(--r-lg); background: color-mix(in srgb, var(--paper) 85%, transparent);
    font: 600 22px var(--sans); color: var(--ink); z-index: 1000; pointer-events: none; }
}