.variation-choice-intro {
  background: rgba(184,160,106,0.09);
  border: 1px solid rgba(184,160,106,0.42);
  border-radius: 5px;
  display: grid;
  gap: 0.3rem;
  margin-top: 0.65rem;
  padding: 0.85rem 0.95rem;
}
.variation-choice-intro strong { color: var(--ivory); font-size: 13px; }
.variation-choice-intro span { color: var(--muted); font-size: 11px; line-height: 1.55; }
.variation-path-selector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
  margin: 0.75rem 0;
}
.variation-path-option {
  appearance: none;
  background: rgba(255,255,255,0.025);
  border: 1px solid var(--border);
  border-radius: 5px;
  color: var(--ivory);
  cursor: pointer;
  display: grid;
  gap: 0.25rem;
  padding: 0.9rem;
  text-align: left;
}
.variation-path-option:hover,
.variation-path-option:focus-visible {
  border-color: var(--gold);
  outline: none;
}
.variation-path-option.active {
  background: rgba(184,160,106,0.12);
  border-color: var(--gold);
  box-shadow: inset 3px 0 0 var(--gold);
}
.variation-path-option span {
  color: var(--gold);
  font-family: var(--fm);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.variation-path-option strong { font-size: 13px; }
.variation-path-option em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}
.variation-path-guidance,
.variation-upload-assurance {
  background: rgba(34,139,134,0.08);
  border: 0.5px solid rgba(34,139,134,0.3);
  border-radius: 4px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
  margin-bottom: 0.85rem;
  padding: 0.7rem 0.8rem;
}
.variation-path-guidance strong,
.variation-upload-assurance strong { color: var(--ivory); }
.variation-details-heading,
.variation-upload-heading {
  display: grid;
  gap: 0.22rem;
  margin-bottom: 0.25rem;
}
.variation-details-heading span,
.variation-upload-heading span {
  color: var(--gold);
  font-family: var(--fm);
  font-size: 9px;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.variation-details-heading strong,
.variation-upload-heading strong { color: var(--ivory); font-size: 14px; }
.variation-details-heading em,
.variation-upload-heading em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.5;
}
.variation-upload-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  padding: 0.85rem;
  border: 1px dashed var(--gold);
  border-radius: 5px;
  background: rgba(184,160,106,0.06);
  margin: 0.85rem 0;
}
.variation-upload-fields[hidden] { display: none; }
.variation-upload-assurance { margin: 0; }
.variation-file-field {
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(184,160,106,0.4);
  border-radius: 4px;
  padding: 0.7rem;
}
.variation-file-field.has-file {
  background: rgba(34,139,134,0.1);
  border-color: rgba(34,139,134,0.55);
}
.variation-file-field input[type="file"] {
  background: var(--paper);
  border: 1px solid var(--border);
  color: var(--ink);
  cursor: pointer;
  padding: 0.65rem;
  width: 100%;
}
.required-marker {
  background: rgba(179,75,53,0.12);
  border: 1px solid rgba(179,75,53,0.3);
  border-radius: 999px;
  color: #b34b35;
  font-size: 8px;
  margin-left: 0.35rem;
  padding: 0.12rem 0.38rem;
  text-transform: uppercase;
}
.variation-file-state {
  color: var(--muted);
  font-size: 10px;
  margin-top: 0.42rem;
}
.variation-file-field.has-file .variation-file-state { color: #28796f; font-weight: 700; }
.variation-file-state.invalid { color: #b34b35; }
@media (max-width: 760px) {
  .variation-path-selector,
  .variation-upload-fields { grid-template-columns: 1fr; }
}