/* Mission layout only. Typography, navigation, buttons, choices and dialogs
   inherit the shared Arcade styles from styles.css and experience.css. */
.traces-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  max-width: 1200px;
}
.traces-heading .arcade-intro {
  min-width: 0;
}
.traces-avatar {
  width: clamp(140px, 17vw, 200px);
  height: auto;
  object-fit: contain;
  flex-shrink: 0;
}
.traces-stage {
  max-width: 1200px;
}
.traces-boundary {
  margin-top: 0;
  padding: 12px 18px;
  border-left: 3px solid var(--mint);
  border-radius: 0 8px 8px 0;
  background: #9cf1cc09;
  color: #d4c8da;
  font-size: 13px;
}
.traces-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.traces-toolbar p {
  flex: 1 1 240px;
  color: var(--muted);
  font-size: 13px;
}
#traces-status {
  color: var(--yellow);
  line-height: 1.65;
  overflow-wrap: anywhere;
}
#traces-status:empty {
  margin: 0;
}
.traces-stage fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.traces-stage fieldset:disabled {
  opacity: 0.65;
}
.traces-stage .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.traces-nav {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 24px 0 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}
.traces-nav button {
  flex: 1 1 140px;
  font-size: 13px;
  font-weight: 700;
}
.traces-nav button[aria-current] {
  background: #9cf1cc12;
  border-color: var(--mint);
  color: var(--mint);
}
.traces-stage button {
  white-space: normal;
  line-height: 1.5;
}
.traces-stage button:disabled {
  opacity: 0.55;
  cursor: default;
}
.traces-stage p,
.traces-stage li,
.traces-stage dd {
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.traces-stage h3 {
  font:
    700 20px 'Space Grotesk',
    sans-serif;
  line-height: 1.3;
}
.traces-stage h4 {
  font-size: 16px;
}
.traces-lead {
  max-width: 76ch;
  color: #ded1e2;
}
.traces-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-block: 24px 8px;
}
.traces-source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-block: 20px;
}
.traces-source-grid button {
  justify-content: flex-start;
  text-align: left;
  width: 100%;
}
.traces-stage .traces-choice-group {
  display: grid;
  gap: 12px;
  margin: 24px 0;
}
.traces-stage legend {
  font-weight: 700;
  line-height: 1.6;
  margin-bottom: 12px;
}
.traces-stage .choice {
  margin: 0;
}
.traces-stage details {
  border: 1px solid #685477;
  border-radius: 8px;
  padding: 16px;
  margin-block: 16px;
}
.traces-stage summary {
  cursor: pointer;
  min-height: 44px;
  line-height: 1.5;
  padding-block: 9px;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.traces-stage details[open] > summary {
  margin-bottom: 16px;
}
.traces-origin {
  font-family: ui-monospace, monospace;
  overflow-wrap: anywhere;
}
.traces-dates {
  color: var(--muted);
}
.traces-quote,
.traces-card {
  padding: 18px;
  margin-block: 16px;
  border: 1px solid #685477;
  border-radius: 8px;
  background: #100f19;
}
.traces-quote h3 {
  margin-top: 0;
}
.traces-stage pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.7;
}
.traces-field {
  display: grid;
  gap: 8px;
  margin-block: 16px;
  font-weight: 500;
  min-width: 0;
}
.traces-field select,
.traces-field input {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 44px;
  padding: 10px;
  color: var(--text);
  background: #211a2b;
  border: 1px solid #8a729b;
  border-radius: 6px;
  font: inherit;
}
.traces-selected-text {
  border-left: 3px solid var(--line);
  padding-left: 12px;
  color: #e0d6e5;
}
.traces-two-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.traces-dossier-card {
  background: #ffffff05;
}
.traces-stage blockquote {
  margin: 14px 0;
  border-left: 3px solid var(--mint);
  padding-left: 14px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.traces-score {
  font:
    700 36px 'Space Grotesk',
    sans-serif;
  color: var(--yellow);
}
.traces-result .button {
  margin: 8px 12px 8px 0;
}
#traces-help:not(:empty) {
  margin-top: 24px;
}
.traces-stage dt {
  font-weight: 700;
  margin-top: 16px;
}
.traces-stage dd {
  margin-left: 0;
  color: var(--muted);
}
@media (max-width: 700px) {
  .traces-heading {
    align-items: flex-start;
    gap: 16px;
  }
  .traces-avatar {
    width: 96px;
    margin-top: 22px;
  }
  .traces-nav button {
    flex: 1 1 calc(50% - 8px);
  }
  .traces-source-grid,
  .traces-two-columns {
    grid-template-columns: minmax(0, 1fr);
  }
  .traces-dossier-card,
  .traces-quote {
    padding: 12px;
  }
  .traces-actions > button {
    width: 100%;
  }
}
@media (max-width: 500px) {
  .traces-avatar {
    display: none;
  }
}
