:root {
  --test-control-min: 3rem;
  --test-copy-size: 1rem;
  --test-section-size: 1.25rem;
  --test-heading-size: 1.5625rem;
  --test-display-size: 1.953125rem;
}

body {
  margin: 0;
  font: var(--aldelo-font-weight-regular) var(--test-copy-size) / 1.5 var(--aldelo-font-family-body);
  color: var(--aldelo-color-text);
  background: var(--aldelo-color-background);
  transition: none;
}

[hidden] { display: none !important; }

.test-shell {
  max-inline-size: 70rem;
  margin-inline: auto;
  padding-inline: clamp(var(--aldelo-space-400), 4vw, var(--aldelo-space-1000));
  padding-block-end: var(--aldelo-space-1200);
}

.test-header, .test-lockup {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.test-header {
  justify-content: space-between;
  gap: var(--aldelo-space-400);
  min-block-size: 4.5rem;
  padding-block: var(--aldelo-space-200);
  border-block-end: var(--aldelo-border-width) solid var(--aldelo-color-border);
}

.test-lockup { gap: var(--aldelo-space-300); }

.test-wordmark {
  display: inline-block;
  inline-size: 5.5rem;
  block-size: 1.25rem;
  background: var(--aldelo-color-brand-wordmark);
  mask: url("/assets/brand/aldelo-wordmark.svg") center / contain no-repeat;
}

@media (forced-colors: active) {
  .test-wordmark { background: CanvasText; forced-color-adjust: none; }
}

.test-product {
  border-inline-start: var(--aldelo-border-width) solid var(--aldelo-color-border);
  padding-inline-start: var(--aldelo-space-300);
  font-weight: var(--aldelo-font-weight-strong);
  font-size: var(--test-section-size);
  line-height: 1.25;
}

.test-label { font-size: var(--test-copy-size); }
.test-main { padding-block-start: clamp(var(--aldelo-space-800), 6vw, 5rem); }
.test-muted { color: var(--aldelo-color-text-muted); }

.test-entry {
  background: transparent;
  min-block-size: auto;
  display: block;
}

.test-entry .test-entry-panel {
  inline-size: min(100%, 28rem);
  max-inline-size: none;
  display: block;
  margin-inline: auto;
  padding: clamp(var(--aldelo-space-400), 4vw, var(--aldelo-space-800));
  border: var(--aldelo-border-width) solid var(--aldelo-color-border);
  border-block-start: var(--aldelo-border-width-emphasis) solid var(--aldelo-color-action);
  border-radius: var(--aldelo-component-panel-radius);
  background: var(--aldelo-color-surface);
}

.test-main h1, .test-main h2, .test-main p { margin: 0; }

.test-main h1 {
  font-size: var(--test-display-size);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.test-entry h1 { font-size: var(--test-heading-size); }

.test-main h2 {
  font-size: var(--test-section-size);
  line-height: 1.25;
}

.test-main h1 + p, .test-main h2 + p { margin-block-start: var(--aldelo-space-200); }

#entry-form, #preferences-form, .test-entry-footer {
  display: grid;
  gap: var(--aldelo-space-400);
  margin-block-start: var(--aldelo-space-600);
}

.test-entry-footer {
  border-block-start: var(--aldelo-border-width) solid var(--aldelo-color-border);
  padding-block-start: var(--aldelo-space-400);
}

.test-field {
  display: grid;
  align-content: start;
  min-inline-size: 0;
  gap: var(--aldelo-space-200);
}
.test-field .ac-label { font-size: var(--test-copy-size); }
.test-language { justify-self: start; min-inline-size: min(100%, 10rem); }

.test-main :is(.ac-input, .ac-select, .ac-button) {
  min-block-size: var(--test-control-min);
  min-inline-size: 3rem;
  max-inline-size: 100%;
  font-size: var(--test-copy-size);
}

.test-main :is(.ac-input, .ac-select) { inline-size: 100%; }

.test-main .ac-button {
  block-size: auto;
  white-space: normal;
  text-align: center;
  line-height: 1.35;
  padding-block: var(--aldelo-space-200);
}

.test-main .ac-button[data-pending] { opacity: .72; cursor: wait; }

.test-main :is(.test-alert, #entry-state, #retry-entry, #retry-workspace) {
  margin-block-start: var(--aldelo-space-400);
}
.test-main .test-alert { font-size: var(--test-copy-size); overflow-wrap: anywhere; }
.test-feedback:empty { display: none; }
.test-main .test-feedback { margin-block-start: var(--aldelo-space-400); }

.test-workspace-heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: start;
  gap: var(--aldelo-space-400);
}

.test-workspace-heading #logout { flex: none; }

.test-main .test-kicker {
  margin-block-end: var(--aldelo-space-100);
  color: var(--aldelo-color-text-muted);
  font-weight: var(--aldelo-font-weight-medium);
}

.test-workspace-panels {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  gap: var(--aldelo-space-400);
  margin-block-start: var(--aldelo-space-800);
}

.test-card {
  padding: var(--aldelo-space-600);
  min-inline-size: 0;
}
.test-profile { margin-block: var(--aldelo-space-600); }
.test-profile > div + div { margin-block-start: var(--aldelo-space-400); }
.test-profile dt { color: var(--aldelo-color-text-muted); }
.test-profile dd { margin: 0; font-weight: var(--aldelo-font-weight-strong); overflow-wrap: anywhere; }

.test-access-note {
  padding-block-start: var(--aldelo-space-400);
  border-block-start: var(--aldelo-border-width) solid var(--aldelo-color-border);
}

.test-preference-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  gap: var(--aldelo-space-400);
}

#save-preferences { justify-self: start; }
.test-main #preferences-read-only { margin-block-start: var(--aldelo-space-400); }

@media (max-width: 47.99rem) {
  .test-workspace-panels { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .test-main * { transition: none !important; }
}
/* Shared human-test banner reflows with Spanish copy and enlarged text. */
.test-header .test-label { max-inline-size: 100%; min-inline-size: 0; white-space: normal; overflow-wrap: anywhere; }

.test-workspace-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr)); gap: var(--aldelo-space-300); inline-size: 100%; align-items: stretch; }
.test-workspace-actions > .ac-button { inline-size: 100%; min-block-size: 3rem; block-size: 100%; white-space: normal; text-align: center; }