/* keido_readiness - the check, the report, the staff area.
 * Built on the theme's redesign primitives (tw/base/site.css): .k-site,
 * .k-panel, .k-ground, .k-micro-label, .k-pips, .k-bar, .k-btn. Prefix: krd-. */

.krd {
  font-family: var(--font-ui, system-ui, sans-serif);
  color: var(--color-ink, #14161a);
}

.krd-check {
  padding-block: clamp(40px, 5vw, 72px) clamp(64px, 8vw, 104px);
}

.krd-h2 {
  margin: 0 0 14px;
  font-family: var(--font-heading, inherit);
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  line-height: 1.14;
  letter-spacing: -0.028em;
  font-weight: 600;
}

.krd-h3 {
  margin: 0 0 10px;
  font-family: var(--font-heading, inherit);
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.02em;
  font-weight: 600;
}

.krd-muted { color: var(--color-ink-subtle, #6b7075); }
.krd-nowrap { white-space: nowrap; }

/* ── Question card ─────────────────────────────────────────────── */
.krd-card {
  border: 1px solid var(--color-line, #dcd8d1);
  background: var(--color-paper-raised, #fff);
}

.krd-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px clamp(22px, 3vw, 40px);
  border-bottom: 1px solid var(--color-line-light, #e3dfd8);
}

.krd-card__body {
  padding: clamp(26px, 3.4vw, 48px);
}

.krd-card__question {
  margin: 14px 0 0;
  font-size: clamp(1.4375rem, 2.8vw, 2.125rem);
  line-height: 1.14;
  letter-spacing: -0.028em;
  text-wrap: pretty;
}

.krd-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 30px;
}

.krd-option {
  width: 100%;
  padding: 18px 20px;
  border: 1px solid var(--color-line, #dcd8d1);
  background: var(--color-paper, #faf9f7);
  font: inherit;
  font-size: 1.0625rem;
  line-height: 1.45;
  text-align: left;
  color: var(--color-ink, #14161a);
  cursor: pointer;
}

.krd-option:hover,
.krd-option.is-selected {
  border-color: var(--color-ground, #1f2a44);
  background: var(--color-paper-raised, #fff);
}

.krd-option:focus-visible {
  outline: 2px solid var(--color-accent, #b23e1f);
  outline-offset: 2px;
}

.krd-card__foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin: 0 clamp(26px, 3.4vw, 48px);
  padding: 22px 0 28px;
  border-top: 1px solid var(--color-line-light, #e3dfd8);
}

.krd-back {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 0.9375rem;
  color: var(--color-ink-secondary, #41464c);
  cursor: pointer;
}

.krd-back:disabled {
  color: #b6b1a8;
  cursor: default;
}

.krd-card__note {
  font-size: 0.875rem;
  color: var(--color-ink-subtle, #6b7075);
}

/* ── Result ────────────────────────────────────────────────────── */
.krd-result {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 28px;
  align-items: center;
  padding: clamp(28px, 3.6vw, 48px);
}

.krd-result:focus { outline: none; }

.krd-result__score {
  margin: 14px 0 0;
  font-family: var(--font-heading, inherit);
  font-size: clamp(3.375rem, 7vw, 5.25rem);
  line-height: 0.95;
  letter-spacing: -0.045em;
  font-weight: 600;
}

.krd-result__score span {
  font-size: 0.4em;
  color: var(--color-dark-ink-muted, #a7b0c2);
}

.krd-tier-chip {
  display: inline-block;
  padding: 8px 14px;
  background: var(--color-accent, #b23e1f);
  color: #fff;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.krd-result__blurb {
  margin: 18px 0 0;
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--color-dark-ink-soft, #c8cbcf);
}

.krd-breakdown {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.krd-breakdown__row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) 2fr auto;
  gap: 16px;
  align-items: center;
}

.krd-breakdown__label { font-size: 0.9375rem; font-weight: 500; }
.krd-breakdown__value { font-size: 0.875rem; color: var(--color-ink-subtle, #6b7075); font-variant-numeric: tabular-nums; }

/* ── Gate form ─────────────────────────────────────────────────── */
.krd-gate {
  margin-top: 2px;
  border: 1px solid var(--color-line, #dcd8d1);
  background: var(--color-paper-raised, #fff);
  padding: clamp(26px, 3.4vw, 48px);
}

.krd-gate__title { margin: 0; font-family: var(--font-heading, inherit); font-size: clamp(1.25rem, 2.2vw, 1.625rem); letter-spacing: -0.022em; font-weight: 600; max-width: 26ch; }
.krd-gate__copy { margin: 12px 0 20px; max-width: 52ch; font-size: 1rem; line-height: 1.6; color: var(--color-ink-secondary, #41464c); }

.krd-gate .form-item { margin: 0 0 16px; }
.krd-gate .form-item label { display: block; margin-bottom: 6px; font-size: 0.875rem; font-weight: 600; }
.krd-gate .form-type-checkbox { display: flex; gap: 10px; align-items: flex-start; font-size: 0.875rem; line-height: 1.5; color: var(--color-ink-secondary, #41464c); }
.krd-gate .form-type-checkbox label { font-weight: 400; margin: 0; }
.krd-gate .form-type-checkbox input { margin-top: 4px; }
.krd-gate .form-actions { margin-top: 20px; }
.krd-gate input.k-input, .krd-gate select.k-input, .krd-gate textarea.k-input {
  width: 100%;
  border: 1px solid var(--color-line-input, #c9c4bb);
  background: var(--color-paper, #faf9f7);
  padding: 15px 16px;
  font: inherit;
  font-size: 1rem;
  color: var(--color-ink, #14161a);
}

/* ── Sent ──────────────────────────────────────────────────────── */
.krd-sent p { margin: 10px 0 0; line-height: 1.6; color: var(--color-ink-secondary, #41464c); }
.krd-sent__note { font-size: 0.875rem; color: var(--color-ink-subtle, #6b7075); }
.krd-sent__again { margin-top: 24px; font-size: 0.9375rem; }

/* ── Report ────────────────────────────────────────────────────── */
.krd-report__frame {
  max-width: 60rem;
  padding-block: clamp(32px, 4vw, 56px) clamp(64px, 8vw, 104px);
}

.krd-report__runhead {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-ink-subtle, #6b7075);
}

.krd-report__masthead { padding: clamp(28px, 4vw, 56px); }
.krd-report__title { margin: 14px 0 0; max-width: 18ch; font-size: clamp(2rem, 4.4vw, 3.25rem); line-height: 1.04; letter-spacing: -0.035em; }
.krd-report__prepared { margin: 22px 0 0; max-width: 60ch; font-size: 1.0625rem; line-height: 1.6; color: var(--color-dark-ink-standfirst, #b9bdc2); }
.krd-report__scoreline { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 32px; align-items: center; margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--color-ground-line, #374260); }
.krd-report__score { margin: 8px 0 0; font-family: var(--font-heading, inherit); font-size: clamp(3rem, 6vw, 4.5rem); line-height: 0.95; letter-spacing: -0.045em; font-weight: 600; }
.krd-report__score span { font-size: 0.4em; color: var(--color-dark-ink-muted, #a7b0c2); }
.krd-report__blurb { margin: 14px 0 0; max-width: 46ch; font-size: 1.0625rem; line-height: 1.6; color: var(--color-dark-ink-secondary, #c5cdda); }

.krd-report__body { max-width: 72ch; padding-top: clamp(28px, 4vw, 44px); }
.krd-report__body p { font-size: 1.0625rem; line-height: 1.65; color: var(--color-ink-body, #23262b); text-wrap: pretty; }
.krd-report__body .krd-h2 { margin-top: clamp(36px, 5vw, 56px); }
.krd-report__body .krd-h3 { margin-top: 28px; }
.krd-report__lede { font-size: 1.125rem; }
.krd-report__howto { margin-top: 28px; }
.krd-report__howto p { margin: 0; font-size: 1rem; }

.krd-table { width: 100%; border-collapse: collapse; border: 1px solid var(--color-line, #dcd8d1); background: var(--color-paper-raised, #fff); margin: 20px 0 0; }
.krd-table thead { background: var(--color-paper-band, #f1efea); }
.krd-table th { padding: 14px 16px; text-align: left; font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-ink-muted, #5c6169); }
.krd-table td { padding: 16px; font-size: 1rem; line-height: 1.55; vertical-align: top; border-top: 1px solid var(--color-line-light, #e3dfd8); color: var(--color-ink-secondary, #41464c); }
.krd-table td strong { color: var(--color-ink, #14161a); }

.krd-ladder tr.is-current { background: var(--color-accent-tint, #fcf1ec); box-shadow: inset 3px 0 0 var(--color-accent, #b23e1f); }
.krd-ladder tr.is-current .krd-ladder__range, .krd-ladder tr.is-current .krd-ladder__name strong { color: var(--color-accent, #b23e1f); }
.krd-ladder__range { white-space: nowrap; font-weight: 600; color: var(--color-ink, #14161a); }
.krd-ladder__here { display: block; margin-top: 4px; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-accent, #b23e1f); }

.krd-dims__score { white-space: nowrap; font-weight: 600; color: var(--color-ink, #14161a); font-variant-numeric: tabular-nums; }
.krd-dims__score.is-low { color: var(--color-accent, #b23e1f); }
.krd-dims__total td { background: var(--color-paper, #faf9f7); border-top: 2px solid var(--color-ground, #1f2a44); font-weight: 600; color: var(--color-ink, #14161a); }

.krd-dim { padding: 24px 0 8px; border-top: 2px solid var(--color-ground, #1f2a44); }
.krd-dim + .krd-dim { margin-top: 20px; }
.krd-dim__head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.krd-dim__head .krd-h3 { margin: 0; }
.krd-dim__score { font-weight: 600; font-variant-numeric: tabular-nums; }
.krd-dim__score.is-low { color: var(--color-accent, #b23e1f); }
.krd-dim .k-micro-label { margin: 18px 0 6px; }
.krd-dim p { margin: 0; }
.krd-dim__answer { font-style: italic; }
.krd-move { margin-top: 18px; padding: 4px 0 4px 20px; border-left: 3px solid var(--color-accent, #b23e1f); }
.krd-move .k-micro-label { margin: 0 0 6px; }

.krd-bigmove { margin-top: 20px; }
.krd-bigmove__title { display: flex; gap: 16px; align-items: baseline; margin: 0 0 12px; font-size: 1.375rem; }
.krd-bigmove__n { color: var(--color-accent, #b23e1f); font-variant-numeric: tabular-nums; }
.krd-bigmove p { margin: 0; }
.krd-bigmove__meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 20px; margin: 22px 0 0; padding-top: 18px; border-top: 1px solid var(--color-line-light, #e3dfd8); }
.krd-bigmove__meta dt { margin: 0 0 6px; }
.krd-bigmove__meta dd { margin: 0; font-size: 1rem; line-height: 1.5; color: var(--color-ink-secondary, #41464c); }

.krd-sequence__window { white-space: nowrap; font-weight: 600; color: var(--color-ground, #1f2a44); }

.krd-comp { padding: 24px 0 8px; border-top: 1px solid var(--color-line, #dcd8d1); }
.krd-comp__head { display: flex; justify-content: space-between; gap: 16px; }
.krd-comp__start { font-size: 0.875rem; color: var(--color-ink-subtle, #6b7075); }
.krd-comp .krd-h3 { margin: 10px 0 8px; }
.krd-comp p { margin: 0 0 10px; }

.krd-second { margin-top: clamp(40px, 5vw, 64px); padding: clamp(28px, 3.4vw, 44px); }
.krd-second .krd-h2 { margin: 0 0 14px; }
.krd-second p { color: var(--color-dark-ink-secondary, #c5cdda); max-width: 56ch; }
.krd-second__cta { margin: 22px 0 0; }
.krd-second__ref { margin: 14px 0 0 !important; font-size: 0.9375rem; color: var(--color-dark-ink-muted, #a7b0c2) !important; }

.krd-report__foot { margin-top: 28px; font-size: 0.875rem; color: var(--color-ink-subtle, #6b7075) !important; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }

/* ── Staff area ────────────────────────────────────────────────── */
.krd-admin { padding-block: 8px 48px; }
.krd-admin__stats { display: flex; flex-wrap: wrap; gap: 2px; margin: 0 0 24px; background: var(--color-line, #dcd8d1); border: 1px solid var(--color-line, #dcd8d1); }
.krd-stat { flex: 1 1 140px; display: flex; flex-direction: column; gap: 6px; padding: 16px 20px; background: var(--color-paper-raised, #fff); }
.krd-stat__value { font-family: var(--font-heading, inherit); font-size: 1.75rem; font-weight: 600; letter-spacing: -0.03em; }
.krd-stat--alert .krd-stat__value { color: var(--color-accent, #b23e1f); }
.krd-filters { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: flex-end; margin-bottom: 20px; }
.krd-filters .form-item { margin: 0; }
.krd-filters .form-actions { margin: 0; }
.krd-admin__table td { font-size: 0.9375rem; }
.krd-badge { display: inline-block; padding: 4px 8px; font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; background: var(--color-paper-band, #f1efea); color: var(--color-ink-muted, #5c6169); }
.krd-badge--good { background: var(--color-status-good-bg, #eef3ef); color: var(--color-status-good, #4a5d4f); }
.krd-badge--alert { background: var(--color-accent-tint, #fcf1ec); color: var(--color-accent, #b23e1f); }
.krd-inline-form { display: inline; }
.krd-admin-detail__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 20px; margin-top: 16px; }
.krd-admin-detail .k-panel { padding: 24px; }
.krd-admin-detail__total { font-size: 1rem; font-weight: 500; color: var(--color-ink-subtle, #6b7075); }
.krd-dl { display: grid; gap: 12px; margin: 0; }
.krd-dl dt { font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-ink-faint, #8a8578); }
.krd-dl dd { margin: 2px 0 0; font-size: 0.9375rem; }
.krd-action { padding: 16px 0; border-top: 1px solid var(--color-line-light, #e3dfd8); }
.krd-action:first-of-type { border-top: 0; padding-top: 0; }
.krd-action label { display: block; margin: 0 0 12px; font-size: 0.875rem; font-weight: 600; }
.krd-action label input, .krd-action label textarea { display: block; width: 100%; margin-top: 6px; font-weight: 400; }
.krd-action p { margin: 0 0 12px; font-size: 0.875rem; }

@media (max-width: 640px) {
  .krd-breakdown__row { grid-template-columns: 1fr auto; }
  .krd-breakdown__row .k-bar { grid-column: 1 / -1; }
  .krd-report__scoreline { grid-template-columns: 1fr; }
  .krd-table th:nth-child(4), .krd-ladder td:nth-child(4) { display: none; }
}
