/* Percentage heights use the root's zoom-adjusted viewport, unlike 100dvh. */
html {
  --project-bar-height: 27px;
  height: 100%;
}
/* Theme variables live on external chrome only, never the game viewport. */
body {
  margin: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #101820;
  overflow: hidden;
}
/* Browser-owned project chrome shares the Windows 95 shell used by loading. */
#project-bar {
  box-sizing: border-box;
  display: flex;
  flex: 0 0 var(--project-bar-height);
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  padding: 0 3px;
  border-bottom: 1px solid #808080;
  background: #c0c0c0;
  color: #101010;
  font:
    11px/1 "MS Sans Serif",
    Tahoma,
    Geneva,
    Verdana,
    system-ui,
    sans-serif;
}
#project-bar a,
#project-bar button {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 21px;
  padding: 0 8px;
  border: 1px solid transparent;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-decoration: none;
}
/* Live server ping on the shell's left edge; the dot and text share the quality color. */
#project-ping {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-right: auto;
  padding: 0 8px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
#project-ping::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 1px #ffffff88;
}
#project-ping[data-quality="good"] {
  color: #0a7a0a;
}
#project-ping[data-quality="fair"] {
  color: #a15c00;
}
#project-ping[data-quality="poor"] {
  color: #c00000;
}
#project-ping[data-quality="unknown"] {
  color: #6b6b6b;
}
#project-bar a:hover,
#project-bar button:hover {
  border-color: #dfdfdf #808080 #808080 #dfdfdf;
}
#project-bar a:active,
#project-bar button:active {
  border-color: #808080 #dfdfdf #dfdfdf #808080;
}
#project-bar a:focus-visible,
#project-bar button:focus-visible,
#project-about :focus-visible {
  outline: 1px dotted #000;
  outline-offset: -4px;
}
/* About is a modal Windows 95 window: caption bar, close box and dialog button. */
#project-about {
  box-sizing: border-box;
  width: min(380px, calc(100% - 32px));
  padding: 3px;
  border: 2px solid;
  border-color: #dfdfdf #000 #000 #dfdfdf;
  border-radius: 0;
  background: #c0c0c0;
  color: #101010;
  box-shadow:
    inset 1px 1px #fff,
    inset -1px -1px #808080;
  font:
    11px/1.5 "MS Sans Serif",
    Tahoma,
    Geneva,
    Verdana,
    system-ui,
    sans-serif;
}
#project-about::backdrop {
  background: #0006;
}
#project-about .about-titlebar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 2px 2px 2px 4px;
  background: linear-gradient(90deg, #000080, #1084d0);
  color: #fff;
}
#project-about h2 {
  flex: 1;
  margin: 0;
  font-size: 11px;
  font-weight: 700;
}
#project-about .about-close-form {
  display: flex;
  margin: 0;
}
#project-about .about-close {
  display: grid;
  place-items: center;
  box-sizing: border-box;
  width: 17px;
  height: 15px;
  padding: 0 0 1px;
  border: 1px solid;
  border-color: #dfdfdf #000 #000 #dfdfdf;
  background: #c0c0c0;
  color: #000;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
#project-about .about-close:active {
  border-color: #000 #dfdfdf #dfdfdf #000;
}
#project-about .about-body {
  padding: 12px 10px 10px;
}
#project-about p {
  margin: 0 0 14px;
}
#project-about .about-actions {
  display: flex;
  justify-content: flex-end;
  margin: 0;
}
#project-about .about-ok {
  min-width: 75px;
  padding: 3px 10px;
  border: 1px solid;
  border-color: #dfdfdf #000 #000 #dfdfdf;
  background: #c0c0c0;
  color: #101010;
  font: inherit;
  cursor: pointer;
}
#project-about .about-ok:active {
  border-color: #000 #dfdfdf #dfdfdf #000;
}
main {
  position: relative;
  display: flex;
  flex: 1;
  min-height: 0;
}
#viewport {
  position: relative;
  isolation: isolate;
  flex: 1;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: #101820;
}
#viewport canvas {
  display: block;
  image-rendering: pixelated;
  touch-action: none;
}
#viewport canvas[hidden] {
  display: none;
}
/* Browser startup admission precedes both the game and its shared storage. */
#game-tab-gate {
  position: fixed;
  inset: var(--project-bar-height) 0 0;
  z-index: 2147483647;
  display: grid;
  place-items: center;
  padding: 32px;
  background: #008080;
  color: #000;
  font:
    14px/1.5 Arial,
    sans-serif;
}
#game-tab-gate > div {
  box-sizing: border-box;
  width: min(100%, 420px);
  padding: 4px 4px 20px;
  border: 2px outset #fff;
  background: #c0c0c0;
  box-shadow: 2px 2px #000;
}
#game-tab-gate h1 {
  margin: 0;
  padding: 4px 8px;
  background: #000080;
  color: #fff;
  font-size: 15px;
}
#game-tab-gate p {
  margin: 20px 16px;
}
#game-tab-gate button {
  display: block;
  min-width: 96px;
  margin: 0 auto;
  padding: 5px 12px;
  border: 2px outset #fff;
  border-radius: 0;
  background: #c0c0c0;
  color: #000;
  font: inherit;
}
#game-tab-gate button:active {
  border-style: inset;
}
#game-tab-gate button:focus-visible {
  outline: 1px dotted #000;
  outline-offset: -5px;
}
#game-tab-gate [hidden] {
  display: none;
}
/* Browser-owned loading chrome. The Windows 95 download page covers login
   startup; field preparation keeps the resident mushroom presentation. */
#delivery-startup {
  position: absolute;
  inset: 0;
  z-index: 2147483647;
  box-sizing: border-box;
  overflow: auto;
  overscroll-behavior: contain;
  text-align: center;
}
#delivery-startup[hidden],
#delivery-startup [hidden] {
  display: none;
}
#delivery-startup .delivery-window {
  box-sizing: border-box;
  width: min(100%, 360px);
  margin: auto;
  padding: 24px 12px;
}
#delivery-startup .delivery-monster:not([hidden]) {
  display: block;
  margin: 0 auto 16px;
  image-rendering: pixelated;
}
#delivery-startup .delivery-status {
  margin: 0 0 12px;
  font-variant-numeric: tabular-nums;
}
#delivery-startup .delivery-titlebar,
#delivery-startup .delivery-progress,
#delivery-startup .delivery-count,
#delivery-startup .delivery-hint {
  display: none;
}
#delivery-startup:not([hidden]) {
  display: grid;
  place-items: center;
  padding: clamp(12px, 4vw, 40px);
  background: #008080;
  color: #101010;
  font:
    12px/1.5 "MS Sans Serif",
    Tahoma,
    Geneva,
    Verdana,
    system-ui,
    sans-serif;
}
#delivery-startup .delivery-window {
  width: min(100%, 400px);
  padding: 3px;
  border: 2px solid;
  border-color: #dfdfdf #000 #000 #dfdfdf;
  background: #c0c0c0;
  box-shadow:
    inset 1px 1px #fff,
    inset -1px -1px #808080;
  text-align: left;
}
#delivery-startup .delivery-titlebar:not([hidden]) {
  display: flex;
  align-items: center;
  padding: 3px 4px;
  background: linear-gradient(90deg, #000080, #1084d0);
  color: #fff;
  font-weight: 700;
}
#delivery-startup .delivery-title {
  flex: 1;
}
#delivery-startup .delivery-card {
  padding: 12px;
  text-align: left;
}
#delivery-startup .delivery-monster {
  margin-bottom: 10px;
}
#delivery-startup .delivery-status {
  font-weight: 700;
}
#delivery-startup .delivery-progress:not([hidden]) {
  display: block;
  box-sizing: border-box;
  height: 20px;
  padding: 2px;
  overflow: hidden;
  border: 1px solid;
  border-color: #808080 #fff #fff #808080;
  background: #fff;
}
#delivery-startup .delivery-fill {
  height: 100%;
  width: 0;
  background-color: #000080;
  background-image: repeating-linear-gradient(
    90deg,
    #000080 0 10px,
    transparent 10px 12px
  );
  transition: width 120ms linear;
}
#delivery-startup .delivery-progress[data-indeterminate="true"] .delivery-fill {
  width: 30%;
  background-image: none;
  animation: delivery-marquee 1.1s linear infinite;
}
@keyframes delivery-marquee {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(340%);
  }
}
#delivery-startup .delivery-count:not([hidden]),
#delivery-startup .delivery-hint:not([hidden]) {
  display: block;
  margin: 6px 0 0;
  color: #3b3b3b;
}
#delivery-startup[data-state="error"] .delivery-status {
  color: #a80000;
  font-weight: 700;
}
#delivery-startup :focus-visible {
  outline: 1px dotted #000;
  outline-offset: -4px;
}
@media (prefers-reduced-motion: reduce) {
  #delivery-startup .delivery-fill {
    transition: none;
  }
  #delivery-startup
    .delivery-progress[data-indeterminate="true"]
    .delivery-fill {
    width: 100%;
    animation: none;
  }
}
.inspection-chrome {
  --console-bg: #c0c0c0;
  --console-panel: #fff;
  --console-text: #101010;
  --console-muted: #3b3b3b;
  --console-border: #808080;
  --console-frame: #808080;
  --console-accent: #000080;
  --console-on-accent: #fff;
  --console-caption: #000080;
  --console-button: #c0c0c0;
  --console-radius: 0;
  --console-shadow: inset 1px 1px #fff, inset -1px -1px #404040;
  color-scheme: light;
  color: var(--console-text);
  background: var(--console-bg);
  font:
    13px/1.45 "MS Sans Serif",
    Tahoma,
    sans-serif;
}
.inspection-chrome[data-inspection-theme="xp"] {
  --console-bg: #ece9d8;
  --console-panel: #fff;
  --console-text: #17233b;
  --console-muted: #49505a;
  --console-border: #7f9db9;
  --console-frame: #0054e3;
  --console-accent: #245edb;
  --console-caption: linear-gradient(
    #0997ff,
    #0053ee 12%,
    #0050ee 65%,
    #0045c7
  );
  --console-button: linear-gradient(#fff, #f4f3ec 55%, #e4e1cf);
  --console-radius: 3px;
  --console-shadow: inset 1px 1px #fff, inset -1px -1px #d6d0bd;
  font-family: Tahoma, Verdana, sans-serif;
}
.inspection-chrome,
.inspection-chrome * {
  box-sizing: border-box;
}
#console-access {
  flex: 0 0 44px;
  width: 44px;
  padding: 5px 4px;
  border-right: 1px solid var(--console-border);
  z-index: 3;
}
#console-access #console-toggle {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
}
.inspection-chrome .console-rail-label {
  display: block;
  margin-top: 12px;
  text-align: center;
  font-size: 10px;
  letter-spacing: 1px;
  color: var(--console-muted);
}
.inspection-chrome .console-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: none;
  gap: 8px;
  margin: 2px -12px 0;
  padding: 8px 10px;
  color: #fff;
  background: var(--console-caption);
}
.inspection-chrome .console-heading h1 {
  margin: 0;
  font-size: 14px;
}
.inspection-chrome .console-badge {
  font-size: 10px;
  letter-spacing: 1px;
}
.inspection-chrome[data-inspection-theme="xp"] .console-heading {
  border-radius: 6px 6px 0 0;
  text-shadow: 1px 1px #0a246a;
}
.inspection-chrome h2 {
  margin: 0;
  font-size: 17px;
}
#agent-controls {
  display: grid;
  gap: 14px;
  min-width: 0;
  margin-top: 12px;
}
.inspection-chrome .agent-card {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--console-border);
  border-radius: var(--console-radius);
}
.inspection-chrome .agent-card h3 {
  margin: 0 0 8px;
}
.inspection-chrome .agent-state-grid {
  display: grid;
  gap: 8px;
  margin: 12px 0;
}
.inspection-chrome .agent-state {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  gap: 8px;
}
.inspection-chrome .agent-state dt {
  color: var(--console-muted);
}
/* Human pointerdown revokes a lease; that must not move the pending click target. */
.inspection-chrome .agent-state-value {
  height: 3em;
  margin: 0;
  overflow: auto;
  overflow-wrap: anywhere;
  font-weight: 700;
}
.inspection-chrome .agent-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.inspection-chrome .agent-warning {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--console-border);
}
.inspection-chrome .agent-warning h4 {
  margin: 0;
  font-size: 12px;
}
.inspection-chrome .agent-reason {
  height: 4.5em;
  overflow: auto;
  font-size: 12px;
  line-height: 1.5;
}
.inspection-chrome .agent-guide ol {
  padding-left: 20px;
}
.inspection-chrome .agent-guide li {
  margin: 8px 0;
}
.inspection-chrome .agent-guide pre {
  padding: 10px;
  background: var(--console-panel);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 12px;
}
.inspection-chrome :is(button, select, input) {
  font: inherit;
  color: var(--console-text);
  border: 1px solid var(--console-border);
  border-radius: var(--console-radius);
  max-width: 100%;
}
.inspection-chrome button {
  cursor: pointer;
  min-height: 36px;
  padding: 6px 11px;
  background: var(--console-button);
  box-shadow: var(--console-shadow);
  white-space: normal;
}
.inspection-chrome button:hover:not(:disabled) {
  background: var(--console-panel);
  border-color: var(--console-accent);
}
.inspection-chrome button:active:not(:disabled),
.inspection-chrome button[aria-pressed="true"] {
  box-shadow: inset 1px 2px 3px #0005;
}
.inspection-chrome :is(button, select, input):disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.inspection-chrome :focus-visible {
  outline: 3px solid var(--console-accent);
  outline-offset: 2px;
}
.inspection-chrome
  :is(
    select,
    input:not([type="checkbox"]):not([type="range"]):not([type="radio"])
  ) {
  background: var(--console-panel);
  min-height: 36px;
  padding: 6px;
  width: 100%;
  box-shadow: inset 1px 1px #0002;
}
.inspection-chrome :is(.transport, .button-row) {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}
.inspection-chrome .transport {
  margin: 0 0 10px;
}
.inspection-chrome .step-label {
  display: flex;
  align-items: center;
  gap: 5px;
}
.inspection-chrome #step-ms {
  width: 80px;
}
aside.inspection-chrome {
  display: flex;
  flex-direction: column;
  width: clamp(350px, 29vw, 400px);
  flex-shrink: 0;
  min-height: 0;
  padding: 0 14px;
  border: 2px solid var(--console-frame);
  border-left: 0;
  overflow: hidden;
  z-index: 2;
}
.inspection-chrome[data-inspection-theme="xp"]#gm-console {
  border-radius: 8px 8px 0 0;
}
.inspection-chrome details {
  margin: 12px 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--console-border);
  border-radius: 0;
  overflow-wrap: anywhere;
}
.inspection-chrome details > summary {
  cursor: pointer;
  font-weight: 700;
  padding: 10px 0;
  margin: 0;
  border-radius: 0;
  min-height: 42px;
}
.inspection-chrome details[open] > summary {
  margin-bottom: 8px;
}
.inspection-chrome fieldset {
  margin: 12px 0;
  padding: 0;
  border: 0;
  min-width: 0;
}
.inspection-chrome legend {
  margin-bottom: 8px;
  font-weight: 700;
  font-size: 14px;
}
.inspection-chrome label:not(.check):not(.sr-only) {
  display: block;
  margin: 8px 0 4px;
  color: var(--console-text);
}
.inspection-chrome .check {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 14px 0;
}
.inspection-chrome .check input {
  accent-color: var(--console-accent);
  width: 17px;
  height: 17px;
  flex-shrink: 0;
}
.inspection-chrome .label-row {
  display: flex;
  justify-content: space-between;
  margin: 16px 0 8px;
  color: var(--console-muted);
}
.inspection-chrome output {
  font-variant-numeric: tabular-nums;
}
.inspection-chrome .camera-buttons {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.inspection-chrome .hint {
  margin: 8px 0;
  color: var(--console-muted);
  font-size: 13px;
}
.inspection-chrome :is(p, [role="status"]) {
  overflow-wrap: anywhere;
}
.inspection-chrome #status {
  display: block;
}
.inspection-chrome #ui-status:empty {
  display: none;
}
.inspection-chrome #error {
  display: block;
  box-sizing: border-box;
  width: 100%;
  margin: 8px 0;
  padding: 12px;
  border: 2px solid #b34815;
  background: #fff0df;
  color: #732800;
  overflow-wrap: anywhere;
  resize: vertical;
  font: 11px/15px monospace;
}
.inspection-chrome[hidden],
.inspection-chrome [hidden] {
  display: none !important;
}
.inspection-chrome :is(#settings, .physics-debug-readout) {
  max-width: 100%;
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 11px;
}
.inspection-chrome #audio-controls input[type="range"] {
  width: 100%;
}
.inspection-chrome .profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 10px;
}
.inspection-chrome .profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 12px 0;
}
.inspection-chrome .console-toolbar {
  flex: none;
  margin: 0 -14px 14px;
  padding: 10px 14px;
  background: var(--console-bg);
  border-bottom: 1px solid var(--console-border);
}
.inspection-chrome .console-toolbar > .transport {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--console-border);
}
.inspection-chrome #console-section {
  display: block;
  width: 100%;
  min-height: 32px;
  padding: 4px 6px;
  border: 1px solid var(--console-border);
  background: var(--console-panel);
  color: var(--console-text);
  font: inherit;
}
.inspection-chrome > section[id^="console-"] {
  min-width: 0;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
  margin: 0 -14px;
  padding: 0 14px 20px;
}
.inspection-chrome > section[id^="console-"]:focus-visible {
  outline-offset: 4px;
}
.inspection-chrome .map-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
}
.inspection-chrome :is(#map, #mob-template) {
  height: 196px;
  margin: 8px 0;
  padding: 3px;
}
.inspection-chrome :is(#map, #mob-template) option {
  padding: 4px 6px;
}
.inspection-chrome :is(#map-go, #mob-spawn) {
  width: 100%;
}
.inspection-chrome #mob-template {
  height: 150px;
}
.inspection-chrome #inspection-theme .theme-choice {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) 42px;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
  padding: 12px;
  border: 1px solid var(--console-border);
  border-radius: var(--console-radius);
  cursor: pointer;
}
.inspection-chrome .theme-choice:has(input:checked) {
  outline: 2px solid var(--console-accent);
  outline-offset: -2px;
}
.inspection-chrome .theme-choice input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--console-accent);
}
.inspection-chrome .theme-choice small {
  display: block;
  margin-top: 4px;
  color: var(--console-muted);
}
.inspection-chrome .theme-swatch {
  height: 32px;
  border: 2px solid #808080;
  background: linear-gradient(#000080 0 8px, #c0c0c0 8px);
  box-shadow: inset 1px 1px #fff;
}
.inspection-chrome .theme-swatch-xp {
  border-color: #0054e3;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(#1686ff, #0054e3 8px, #ece9d8 8px);
}
.inspection-chrome #console-character {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: 0;
}
.inspection-chrome #console-character > :is(h2, p) {
  flex: none;
}
.inspection-chrome #inspection-controls,
.inspection-chrome .profile-workspace {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
}
.inspection-chrome .profile-scroll {
  flex: 1;
  min-height: 0;
  margin: 0 -14px;
  padding: 0 14px 16px;
  overflow-y: auto;
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}
.inspection-chrome .profile-scroll :is(input, select, button, summary) {
  scroll-margin-block: 12px;
}
.inspection-chrome h3 {
  font-size: 15px;
  margin: 20px 0 8px;
}
.inspection-chrome p:empty {
  display: none;
}
.inspection-chrome .profile-grid > .profile-wide {
  grid-column: 1 / -1;
}
.inspection-chrome .profile-group {
  margin: 20px 0;
}
.inspection-chrome .profile-savebar {
  flex: none;
  padding: 12px 0;
  background: var(--console-bg);
  border-top: 1px solid var(--console-border);
}
.inspection-chrome .profile-savebar .profile-actions {
  margin: 0;
}
.inspection-chrome .profile-savebar p {
  margin-bottom: 0;
  max-height: 4.5em;
  overflow-y: auto;
  font-size: 13px;
}
.inspection-chrome .profile-preset-preview {
  margin: 12px 0;
  padding: 10px;
  border: 1px solid var(--console-border);
  background: var(--console-panel);
}
.inspection-chrome .profile-preset-preview :is(h3, h4) {
  margin: 8px 0;
}
.inspection-chrome .profile-preset-bindings {
  margin: 8px 0;
  padding: 0;
  list-style: none;
}
.inspection-chrome .profile-preset-bindings li {
  padding: 6px 0;
  border-bottom: 1px solid #80808040;
}
.inspection-chrome .profile-preset-skills {
  padding-left: 18px;
}
.inspection-chrome .profile-preset-skills li {
  margin: 10px 0;
}
.inspection-chrome button.primary:not(:disabled) {
  color: var(--console-on-accent);
  background: var(--console-accent);
  box-shadow: none;
  font-weight: 700;
}
.inspection-chrome .audio-channel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 14px;
  align-items: center;
  margin: 16px 0;
}
.inspection-chrome .audio-channel > label {
  margin: 0;
}
.inspection-chrome .audio-channel > output {
  text-align: right;
}
.inspection-chrome .audio-channel > input {
  min-height: 36px;
  accent-color: var(--console-accent);
}
.inspection-chrome .audio-channel > .check {
  margin: 0;
  min-height: 36px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 960px) {
  aside.inspection-chrome {
    position: absolute;
    inset: 0 auto 0 44px;
    width: min(380px, calc(100% - 44px));
    box-shadow: 8px 0 20px #0004;
  }
  .inspection-chrome
    :is(button, select, input:not([type="checkbox"]):not([type="radio"])) {
    min-height: 40px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .inspection-chrome * {
    scroll-behavior: auto;
  }
}
.inspection-chrome .state-testing > section {
  border-top: 1px solid var(--console-accent);
  margin-top: 12px;
  padding-top: 8px;
}
.inspection-chrome .state-testing pre {
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.inspection-chrome .state-testing-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

/* Background activity is a compact project-bar symbol; the dialog owns the detail. */
#project-bar #asset-loading {
  justify-content: center;
  width: 24px;
  min-height: 21px;
  padding: 0;
  color: #000080;
}
#asset-loading::before {
  content: "";
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  box-sizing: border-box;
  border: 2px solid #808080;
  border-top-color: #000080;
  border-right-color: #000080;
  border-radius: 50%;
}
#asset-loading[data-state="downloading"]::before {
  animation: asset-loading-spin 1s steps(8) infinite;
}
#asset-loading[data-state="complete"]::before {
  content: "✓";
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  color: #0a7a0a;
  font-weight: bold;
}
#asset-loading:is(
    [data-state="failed"],
    [data-state="cache-unavailable"],
    [data-state="storage-full"]
  )::before {
  border-color: #a15c00;
}
#asset-loading[hidden] {
  display: none;
}
/* Fallback for shells without the project bar; keeps the symbol out of the scene. */
#asset-loading[data-host="viewport"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  position: absolute;
  top: 6px;
  left: 6px;
  width: 24px;
  height: 21px;
  padding: 0;
  z-index: 2147483646;
  border: 1px solid;
  border-color: #dfdfdf #000 #000 #dfdfdf;
  background: #c0c0c0;
  cursor: pointer;
}
.download-progress {
  height: 14px;
  border: 2px solid;
  border-color: #808080 #fff #fff #808080;
  background: #fff;
  overflow: hidden;
}
.download-progress[hidden] {
  display: none;
}
.download-fill {
  height: 100%;
  background: repeating-linear-gradient(
    90deg,
    #000080 0 10px,
    #c0c0c0 10px 12px
  );
}
.download-dialog {
  width: min(520px, calc(100vw - 48px));
  max-height: calc(100vh - 64px);
  padding: 3px;
  border: 2px solid;
  border-color: #fff #000 #000 #fff;
  background: #c0c0c0;
  color: #000;
  box-shadow:
    inset -1px -1px #808080,
    3px 3px #0008;
  font:
    12px/1.5 "MS Sans Serif",
    Tahoma,
    sans-serif;
}
.download-dialog::backdrop {
  background: #0004;
}
.download-titlebar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 3px 5px;
  background: #000080;
  color: white;
  font-weight: bold;
}
.download-dialog button {
  border: 2px solid;
  border-color: white #000 #000 white;
  border-radius: 0;
  background: #c0c0c0;
  color: #000;
  font: inherit;
  cursor: pointer;
}
.download-dialog button:active,
#asset-loading:active {
  border-color: #000 white white #000;
}
.download-close {
  width: 22px;
  height: 22px;
  padding: 0;
  font-weight: bold !important;
}
.download-body {
  padding: 16px;
}
.download-heading {
  display: block;
  margin-bottom: 10px;
}
.download-current {
  min-height: 36px;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.download-storage,
.download-queued,
.download-hint {
  color: #333;
}
.download-toggle {
  padding: 4px 14px;
}
@keyframes asset-loading-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  #asset-loading[data-state="downloading"]::before {
    animation: none;
  }
}