/* Shared control contract, loaded after layout styles on every entry page. */
:where(button, input, select, textarea, summary, a) { touch-action: manipulation; }
:where(button, input, select, textarea, summary, a, [tabindex]):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
:where(input, select, textarea) { font: inherit; accent-color: var(--accent); }
:where(input:not([type="range"]):not([type="checkbox"]):not([type="color"]), select, textarea) {
  background: var(--input);
  color: var(--text);
  border: 1px solid var(--control-border);
  border-radius: var(--control-radius);
  padding: 8px 10px;
  min-width: 0;
  max-width: 100%;
}
:where(button, a.button, a.primary, summary, select) { min-height: 44px; }
:where(button, a.button, a.primary) { border-radius: var(--control-radius); }
:where(button):disabled { cursor: default; opacity: .5; }
:where(input, textarea)::placeholder { color: var(--muted); opacity: 1; }
:where(a) { text-underline-offset: 3px; }
:where(dialog) { background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: var(--radius); }
:where(dialog)::backdrop { background: var(--shadow); }
:where(pre, code) { overflow-wrap: anywhere; }
:where(th) { color: var(--muted); }
:where(td, th) { border-color: var(--line); }
:where(body) { font: var(--font-body); }
:where(header) { gap: 12px; }
.appearance { display: flex; justify-content: flex-end; margin-bottom: 16px; }
button.theme-toggle, .desk-app button.theme-toggle {
  flex: 0 0 auto;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--control-border);
  border-radius: var(--control-radius);
  background: var(--desk-raised);
  color: var(--text);
  font: 600 12px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  cursor: pointer;
  white-space: nowrap;
}
button.theme-toggle:hover { background: var(--hover); }
.pilot-header .danger { color: var(--on-danger); }
.rig-preview canvas { background: var(--preview-bg); }
.rig-preview :is(button, input, select) { min-height: 44px; border-radius: var(--control-radius); }
.rig-preview label, .rig-preview select { max-width: 100%; min-width: 0; }
.desk-app #lighting :is(button, select), .desk-app .desk-console-nav a { min-height: 44px; }
.desk-app #lighting .desk-group-select { min-height: 44px; }
.pi-screen .screen-header { height: auto; }
.pi-screen .screen-header .theme-toggle { margin-left: auto; }
.pi-screen .screen-mark, .pi-screen .screen-mark span { color: var(--on-accent); }
@media (max-width: 600px) {
  .shell main > header { height: auto; min-height: 64px; flex-wrap: wrap; padding-block: 12px; }
  .pi-screen .screen-header { flex-wrap: wrap; }
  .pilot-header { flex-wrap: wrap; }
  .pilot-header .header-actions { flex-direction: row; flex-wrap: wrap; width: 100%; }
  .pilot-header .header-actions button { flex: 1 1 auto; }
  .pi-screen .screen-brand { min-width: 0; }
  .pi-screen .screen-brand-caption { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* HomeDMX App Kit: one vocabulary for tools, editors and performance pages. */
:where(h1) { font-size:var(--type-title); letter-spacing:-.6px; line-height:1.2; }
:where(h2,h3) { line-height:1.35; }
:where(button,a.button) { transition:background-color 100ms ease,border-color 100ms ease; }
:where(button,a.button):active:not(:disabled) { filter:brightness(.92); }
:where(output,.mono) { font-variant-numeric:tabular-nums; }
:where(label) { line-height:1.4; }
:where(input:not([type=range]):not([type=checkbox]):not([type=color]),select) { min-height:44px; }
:where(textarea) { min-height:88px; }
:where(.kit-panel,.studio-panel,.lighting-patch-editor) { border:1px solid var(--line); border-radius:var(--control-radius); background:var(--panel); padding:var(--space-4); }
:where(.kit-title) { margin:0 0 8px; font-size:18px; }
:where(.kit-caption,.kit-help) { color:var(--muted); font-size:12px; }
:where(.kit-row,.kit-actions) { display:flex; gap:var(--space-2); align-items:center; flex-wrap:wrap; }
:where(.kit-actions) { margin-top:var(--space-4); }
button.kit-primary, a.kit-primary { background:var(--accent); color:var(--on-accent); border-color:var(--accent); font-weight:650; }
button.kit-danger, a.kit-danger { background:var(--danger-soft); color:var(--danger); border-color:var(--danger-border); }
:where(.kit-status) { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border:1px solid var(--line); border-radius:5px; font:11px/1.5 var(--desk-mono); }
:where(.kit-status[data-state=ready]) { color:var(--ready); background:var(--ready-soft); border-color:var(--ready-border); }
:where(.kit-status[data-state=warning]) { color:var(--amber); background:var(--warning-soft); border-color:var(--warning-border); }
:where(.kit-status[data-state=error]) { color:var(--danger); background:var(--danger-soft); border-color:var(--danger-border); }
:where(.kit-empty) { padding:24px; border:1px dashed var(--line-strong); border-radius:var(--control-radius); color:var(--muted); }
:where(.kit-link) { display:inline-flex; align-items:center; min-height:44px; color:var(--accent); }
:where(.kit-grid) { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:16px; }
:where(.kit-field) { display:grid; gap:6px; min-width:0; }
:where(.kit-field > span) { color:var(--muted); font-size:12px; }
:where(.kit-callout) { padding:12px 16px; border:1px solid var(--accent-border); border-radius:8px; background:var(--accent-soft); color:var(--accent-text); }
:where(.lighting-confirmation,.event-confirmation,.confirmation) { border-radius:var(--control-radius); }
:where(.studio-row,.lighting-toolbar,.settings-shortcuts) { gap:var(--space-2); }
.kit-gallery { max-width:1100px; padding:32px 20px; margin:auto; }
.kit-gallery h1 { margin-bottom:8px; }
.kit-gallery section { margin-block:24px; }
.kit-gallery .kit-panel { padding:20px; }
@media(prefers-reduced-motion:reduce) { :where(button,a.button) { transition:none; } }
/* Remove platform button bevels so both themes use the same semantic fills. */
button { appearance:none; -webkit-appearance:none; }
/* Safari's native popup bezel ignores the console's touch height. Keep the
   native picker interaction, with a CSS-sized field and visible disclosure. */
.desk-app #lighting select, select {
 appearance:none; -webkit-appearance:none;
 background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
 background-size:5px 5px,5px 5px; background-repeat:no-repeat;
 background-position:right 17px center,right 12px center;
 padding-right:32px !important;
}
@media(pointer:coarse) {
 input:not([type=range]):not([type=checkbox]), select, textarea { font-size:16px; }
}

.pi-screen .screen-output-dot { background:var(--muted); box-shadow:none; }

/* Fixture configuration badges do not imply live output. */
.fixture-setup-badge { display:inline-flex; align-items:center; width:fit-content; padding:3px 7px; border:1px solid var(--line); border-radius:5px; color:var(--muted); font:500 11px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; white-space:normal; }
.fixture-setup-badge[data-state=unmapped], .fixture-setup-badge[data-state=profile] { color:var(--amber); background:var(--warning-soft); border-color:var(--warning-border); }