/* App-level rules the design system does not cover: accessibility affordances,
   print, and reduced motion. Visual tokens stay in design-system.css. */

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: 10px 16px;
  background: var(--color-accent);
  color: #fff;
  font-family: var(--font-heading);
  font-size: 14px;
}
.skip-link:focus {
  left: 8px;
  top: 8px;
}

/* Native controls should read as part of the system, not the OS default. */
input, select, textarea, button { font-family: inherit; }
select.input {
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%235d5d60' stroke-width='1.5'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 30px;
}

/* Tables in the operator console scroll rather than forcing the page sideways. */
[data-app] table { min-width: 720px; }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

@media print {
  [data-m="hdr"], .btn { display: none !important; }
  body { background: #fff; }
}