/**
 * KopiKatts entry form (sub-phase 1E). BEM-scoped under .ks-entry-form so form
 * styles don't leak into the theme and theme styles don't break the form.
 */

[x-cloak] { display: none !important; }

/* ===========================================================================
 * THE TOKEN LAYER (1.70.4).
 *
 * Published on EVERY selector this sheet's rules can render under, because a
 * token that resolves in one scope and not another is not a cosmetic problem —
 * it is a silent one. `var(--x)` with no fallback, where --x is undefined, makes
 * the whole declaration invalid at computed-value time; an inherited property
 * like `color` then falls back to `inherit` and quietly takes the surrounding
 * shell's value. Nothing errors, nothing logs, and the rule you wrote simply is
 * not the rule that runs.
 *
 * That is exactly what happened to the entry form. Its tokens lived on
 * .ks-entry-form, which the PUBLIC route provides (templates/entry/shell.php) but
 * the ADMIN on-behalf route does not — entries-onbehalf.php requires the same form
 * body straight into .ks-admin. So on that screen --ks-muted resolved to nothing,
 * every `color: var(--ks-muted)` inherited the shell's light body ink instead, and
 * in dark mode that ink landed on the form's own still-white cards.
 *
 * The three scopes, all of which must resolve every token:
 *   .ks-entry-form             public route wrapper       /shows/{slug}/enter/
 *   .ks-entry-form__container  present in ALL FIVE views, and therefore the only
 *                              hook the admin on-behalf form also has
 *   .ks-admin-*                the exhibitor-picker sub-states, which render
 *                              .ks-btn outside any container at all
 *
 * Adding a token means adding it HERE and in the dark block at the foot of the
 * file — never in a rule. §7 of tools/test-lyndsey-schedule-fixes.php enumerates
 * every var() in this sheet and fails if one of them is not declared in both.
 * ======================================================================== */
.ks-entry-form,
.ks-entry-form__container,
.ks-admin-create,
.ks-admin-search,
.ks-admin-list,
.ks-admin-head,
/* .ks-admin-empty is a bare <p> in entries-onbehalf.php, not inside any of the
 * containers above. kopikatts-admin.css styles it — and .ks-admin-head__lead and
 * .ks-admin-list__sub — as `color: var(--ks-muted, #555)`, reading a token the
 * ADMIN sheet never defines: all three were living on that #555 fallback, which is
 * 2.39 on the dark page. Publishing the token layer here fixed the first two,
 * because they sit inside .ks-admin-head / .ks-admin-list; this line is the third,
 * which would otherwise have been left as the one unreadable line on a page where
 * everything around it had just been fixed. */
.ks-admin-empty {
	--ks-accent: var(--kk-accent, #A85828);
	--ks-accent-dark: var(--kk-accent-hover, #8E4820);
	/* Part B (1.19.0): a light wash DERIVED from the brand brown (never a second
	 * hex) for outline/secondary/inactive hovers — auto-adapts in dark mode. */
	--ks-accent-wash: color-mix(in srgb, var(--ks-accent) 12%, transparent);
	/* FILL vs INK. In dark the accent lightens so it can be read AS TEXT on a dark
	 * surface; a fill with white text on it has to move the other way. Two names,
	 * so the two can never be forced to be one colour. In light they are the same. */
	--ks-accent-fill: var(--ks-accent);
	--ks-accent-fill-hover: var(--ks-accent-dark);

	--ks-text: #221b2e;
	--ks-muted: #6b6577;
	--ks-border: #d9d4e0;
	--ks-surface: #fff;
	--ks-bg-soft: #f7f5fa;

	/* 1.70.4: --ks-ok / --ks-warn darkened a shade. As #2e7d32 and #b26a00 they
	 * measured 4.47 / 3.86 against their own pale pills (.ks-match--exact on
	 * #e3f4e4, .ks-match--fuzzy on #fff3e0) — i.e. LIGHT mode was already below AA
	 * on the two semantic pills, which the dark-mode report had not noticed. Same
	 * hues, one shade down: 5.17 and 5.10. See §7 of the harness. */
	--ks-ok: #2a7230;
	--ks-ok-soft: #e3f4e4;
	--ks-warn: #9a5a00;
	--ks-warn-soft: #fff6e6;
	--ks-warn-border: #f0d49a;
	--ks-err: #b3261e;
	--ks-err-soft: #fdeceb;
	--ks-err-border: #f3b9b5;
	/* A fill, not an ink: the danger button puts WHITE on this. See --ks-err in the
	 * dark block, which becomes a light red and would be a 1.9 fill under white.
	 *
	 * #b3261e, not the #c0392b that was this rule's hardcoded fallback. The two
	 * scopes previously disagreed — the public form resolved --ks-err and painted
	 * Withdraw #b3261e, while the admin form fell through to #c0392b — so aligning
	 * them forces a choice, and the deeper red is both what the public form already
	 * showed and the higher contrast of the two (6.54 against 5.44). */
	--ks-err-fill: #b3261e;
	--ks-info-soft: #eef4ff;
	--ks-info-border: #b6cdf5;
	/* The amber "double pen requested" / withdrawn-cat note ink. */
	--ks-note-ink: #8a5a00;
	/* brand.css renders the required-field asterisk as var(--ks-danger, …). This
	 * sheet's own .ks-req rule currently wins, but naming it keeps the marker on the
	 * form's red if that rule is ever removed. */
	--ks-danger: #b3261e;
	/* TRANSPARENT ON PURPOSE — see the legibility floor below. The VALUE is inert;
	 * the point of this token is its literal fallback, which can only ever apply
	 * when this whole block has stopped matching. */
	--ks-page: transparent;
}

/* ---------------------------------------------------------------------------
 * THE LEGIBILITY FLOOR.
 *
 * A last resort, on the top-level surfaces only. If this sheet's token layer ever
 * stops matching a scope again — a new render context, a renamed wrapper, a sixth
 * route — every `var()` in the file goes unresolved at once, and the failure is
 * silent: `color` resolves to `inherit` and the form takes the surrounding shell's
 * ink onto its own cards. That is the exact shape of the bug this release fixes,
 * and it fails INVISIBLE.
 *
 * These two declarations make it fail LEGIBLE instead. --ks-page is `transparent`
 * whenever the token layer is in scope, so in normal operation this changes nothing
 * at all — the shell keeps painting the backdrop, as it does today. Only when the
 * layer is gone do the literal fallbacks engage, and they engage TOGETHER: #221b2e
 * on #fff, 16.61:1. A guaranteed pair, not a guessed one.
 *
 * Deliberately NOT applied to the 93 bare var() uses in the rules below. Fallbacks
 * everywhere would put a second copy of the palette in the file to drift out of
 * step, and — the reason that matters — it would make "unresolved references" a
 * number that can never rise again. That count is what caught this release's own
 * first cut going 22 → 45. The audit is worth more than the belt.
 *
 * .ks-admin-empty is deliberately absent: it is a leaf <p>, not a surface, and it
 * carries its own muted ink from kopikatts-admin.css, which a `color` here would
 * override (this sheet loads last).
 *
 * KNOWN LIMIT, so this does not read as broader cover than it is: the floor sits on
 * the same selectors as the token layer, so it catches the TOKENS failing, not the
 * SELECTORS ceasing to match. A sixth render scope with neither .ks-entry-form nor
 * .ks-entry-form__container would lose both at once — which is the original bug's
 * shape. Guarding that is the token audit's job (§7b2), plus the fact that
 * .ks-entry-form__container is present in all five entry views.
 * ------------------------------------------------------------------------- */
.ks-entry-form,
.ks-entry-form__container,
.ks-admin-create,
.ks-admin-search,
.ks-admin-list,
.ks-admin-head {
	color: var(--ks-text, #221b2e);
}

/* The background half goes ONLY where this sheet owns the surface. The picker
 * containers do not qualify: .ks-admin-create carries `background: var(--ks-surface,
 * #fff)` from kopikatts-admin.css, and because this sheet loads last at equal
 * specificity, a background-color here WINS and silently strips that panel's white
 * card — measured, and caught, as the "Create a new exhibitor" disclosure dropping to
 * the page grey. Their own fallback already degrades them legibly. */
.ks-entry-form,
.ks-entry-form__container {
	background-color: var(--ks-page, #fff);
}

/* Layout stays on the public wrapper only — the admin route has its own. */
.ks-entry-form {
	max-width: 880px;
	margin: 0 auto;
	padding: 1.5rem 1rem 4rem;
}

.ks-entry-form__container { width: 100%; }
.ks-entry-form__eyebrow { text-transform: uppercase; letter-spacing: .06em; font-size: .8rem; color: var(--ks-muted); margin: 0 0 .25rem; }
.ks-entry-form__title { font-size: 1.8rem; line-height: 1.2; margin: 0 0 .5rem; }
.ks-entry-form__lead { color: var(--ks-muted); margin: 0 0 1.5rem; }
.ks-noindex-badge { background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 999px; padding: .05rem .5rem; font-size: .72rem; }

.ks-entry-form__header { border-bottom: 1px solid var(--ks-border); padding-bottom: 1rem; margin-bottom: 1.25rem; }
.ks-entry-form__meta { list-style: none; display: flex; flex-wrap: wrap; gap: 1rem; padding: 0; margin: .5rem 0 0; color: var(--ks-muted); font-size: .9rem; }
.ks-entry-form__meta .dashicons { vertical-align: middle; }

/* Notices */
.ks-notice { border-radius: 8px; padding: .75rem 1rem; margin: 0 0 1rem; border: 1px solid var(--ks-border); }
.ks-notice--info { background: var(--ks-info-soft, #eef4ff); border-color: var(--ks-info-border, #b6cdf5); }
.ks-notice--error { background: var(--ks-err-soft, #fdeceb); border-color: var(--ks-err-border, #f3b9b5); color: var(--ks-err); }
.ks-notice--warn { background: var(--ks-warn-soft, #fff6e6); border-color: var(--ks-warn-border, #f0d49a); color: var(--ks-warn); }
.ks-notice__actions { margin: .5rem 0 0; display: flex; gap: .5rem; }

/* ===========================================================================
 * Stepper.
 *
 * ★★ 1.71.4 — READ THIS BEFORE "GIVING THE STEPPER A DARK SCOPE". IT HAS ONE. ★★
 *
 * Reported: `.ks-stepper__item` computes background rgb(247,245,250) and inactive
 * ink rgb(107,101,119) in BOTH themes, i.e. near-white chips on a dark page.
 *
 * Measured from this file via tools/token-census.php, the rules below resolve:
 *
 *     light  inactive chip  #6b6577 on #f7f5fa = 5.17:1
 *     dark   inactive chip  #a2acba on #262e3a = 5.96:1
 *     both   active pill    #ffffff on #a85828 = 5.13:1
 *
 * So the dark values EXIST, they are correct, and both themes clear AA. 1.70.4 gave
 * this sheet a full dark token block and the stepper is inside it. Writing a second
 * `[data-ks-theme="dark"] .ks-stepper__item` rule here would change nothing — the
 * tokens it would read are the ones already resolving.
 *
 * THE ACTUAL CAUSE is that the attribute never arrives on the PUBLIC entry route.
 * `Theme::print_bootstrap()` (includes/class-theme.php) writes `data-ks-theme` onto
 * <html> only when `Theme::is_shell()` is true — a logged-in user on the
 * /kopikatts-admin/ shell, or in the account area. The entry form at
 * /shows/{slug}/enter/ (body class `ks-entry-page`) is NEITHER, so the whole dark
 * block at the foot of this file is DORMANT there and every token falls back to its
 * light value. The two figures reported are simply the light ones; the active pill
 * agrees across themes because #a85828 is the fill in both, which is why it looked
 * like only the chips were wrong.
 *
 * On the ADMIN "enter on behalf" route the attribute IS present, and the stepper
 * renders dark correctly today.
 *
 * ★ This is the SAME dormancy already documented in brand.css for the public Show
 * Calendar (see the LANDMINE block there, ~line 152), and it carries the same trap:
 * the moment /shows/{slug}/enter/ receives `data-ks-theme="dark"`, this sheet's dark
 * block wakes up and paints the form dark while the GeneratePress header, footer and
 * page background around it stay LIGHT — because `body.ks-entry-page` is not in
 * brand.css's viewport selector list. A dark panel in a light page is worse than the
 * light-everywhere status quo.
 *
 * So bringing the entry form into the theme system is ONE change with TWO halves:
 *   1. widen Theme::is_shell() to include the entry route, and
 *   2. add `body.ks-entry-page` to brand.css's viewport rules
 * plus a decision that does not belong to a CSS fix: it gives every EXHIBITOR the
 * plugin's dark palette and a floating theme toggle on a public page. That is why
 * 1.71.4 reports this rather than acting on it. Nothing here is an accessibility
 * failure — both themes measure above the 4.5 floor.
 *
 * ✔ DONE in 1.72.0 §5a (Ross's decision, 01/08/2026). Both halves shipped in the same
 * commit: `Theme::is_themed()` (a SIBLING of is_shell(), so the full-screen toggle did
 * NOT follow it onto a public page) now admits the entry route, and `body.ks-entry-page`
 * is in brand.css's viewport selector lists. The dark block below is therefore LIVE on
 * /shows/{slug}/enter/ for a logged-in exhibitor — it is no longer dormant, so treat
 * every token in it as load-bearing on a public page.
 * ======================================================================== */
.ks-stepper { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1.25rem; }
.ks-stepper__item { background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 999px; padding: .35rem .85rem; font-size: .85rem; cursor: pointer; color: var(--ks-muted); }
.ks-stepper__item.is-active { background: var(--ks-accent-fill, var(--ks-accent)); border-color: var(--ks-accent-fill, var(--ks-accent)); color: #fff; }
.ks-stepper__item.is-done { color: var(--ks-accent-dark); border-color: var(--ks-accent); }

.ks-entry-form__savestate { min-height: 1.2rem; font-size: .8rem; color: var(--ks-muted); text-align: right; margin-bottom: .5rem; }

/* Steps */
.ks-step { background: var(--ks-surface, #fff); border: 1px solid var(--ks-border); border-radius: 12px; padding: 1.25rem; margin-bottom: 1.25rem; }
.ks-step__title { margin: 0 0 .25rem; font-size: 1.3rem; }
.ks-step__lead { color: var(--ks-muted); margin: 0 0 1rem; }

/* Fields */
.ks-fields { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem 1rem; }
.ks-field { display: flex; flex-direction: column; gap: .25rem; font-size: .9rem; }
.ks-field--wide { grid-column: 1 / -1; }
.ks-field--inline { flex-direction: row; align-items: center; justify-content: space-between; gap: 1rem; }
.ks-field--inline input { max-width: 90px; }
.ks-field > span { color: var(--ks-muted); font-weight: 600; }
.ks-field input, .ks-field select, .ks-input, .ks-select { width: 100%; padding: .5rem .6rem; border: 1px solid var(--ks-border); border-radius: 8px; font: inherit; }
.ks-req { color: var(--ks-err); margin-left: .15rem; }
.ks-hint { color: var(--ks-muted); font-size: .82rem; margin: .35rem 0 0; }

fieldset { border: 1px solid var(--ks-border); border-radius: 10px; padding: .75rem 1rem; margin: 1rem 0 0; }
legend { font-weight: 700; padding: 0 .35rem; }

.ks-check, .ks-radio { display: flex; align-items: center; gap: .5rem; margin: .35rem 0; font-size: .92rem; }
.ks-radio.is-disabled, .is-disabled { color: var(--ks-muted); }

/* Exhibits */
.ks-exhibit { border: 1px solid var(--ks-border); border-radius: 10px; padding: 1rem; margin-bottom: 1rem; background: var(--ks-bg-soft); }
.ks-exhibit__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: .5rem; }
.ks-exhibit__head h3 { margin: 0; font-size: 1.05rem; }
.ks-tabs { display: flex; gap: .25rem; margin-bottom: .75rem; }
/* .ks-tab and .ks-lookup-result are <button>s with no `color` of their own, so they
 * fell back to the UA's `buttontext` system colour. Under `color-scheme: dark` that
 * flips to pure WHITE — which is how the class-picker rows and the cat-source tabs
 * measured 1.00 (white ink on the still-white panel): not "no classes appeared" but
 * classes rendered invisibly. `color: inherit` takes the ink off the system palette
 * and onto ours, in both themes. */
.ks-tab { background: var(--ks-surface, #fff); color: inherit; border: 1px solid var(--ks-border); border-radius: 8px; padding: .35rem .75rem; cursor: pointer; }
.ks-tab.is-active { background: var(--ks-accent-fill, var(--ks-accent)); color: #fff; border-color: var(--ks-accent-fill, var(--ks-accent)); }

.ks-lookup-results { list-style: none; margin: .5rem 0 0; padding: 0; border: 1px solid var(--ks-border); border-radius: 8px; overflow: hidden; background: var(--ks-surface, #fff); }
.ks-lookup-result { display: flex; gap: .5rem; align-items: center; width: 100%; text-align: left; padding: .5rem .75rem; background: none; color: inherit; border: 0; border-bottom: 1px solid var(--ks-border); cursor: pointer; }
.ks-lookup-result__name { font-weight: 600; }
.ks-lookup-result__meta { color: var(--ks-muted); font-size: .82rem; }
.ks-match { margin-left: auto; font-size: .72rem; padding: .05rem .45rem; border-radius: 999px; background: var(--ks-bg-soft); }
.ks-match--exact { background: var(--ks-ok-soft, #e3f4e4); color: var(--ks-ok); }
.ks-match--fuzzy { background: var(--ks-warn-soft, #fff3e0); color: var(--ks-warn); }

.ks-classblock { background: var(--ks-surface, #fff); border: 1px solid var(--ks-border); border-radius: 8px; padding: .75rem; margin-top: .75rem; }
.ks-classblock h4 { margin: 0 0 .5rem; }

/* Class-picker combobox (1.26.0) — searchable breed/Open + Title pickers. The
 * results list overlays (absolute) so opening it never reflows the form. Styling
 * reuses the cat-lookup result rows for visual consistency. */
.ks-classcombo__control { position: relative; }
.ks-classcombo__list { position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 20; margin: 0; max-height: 16rem; overflow-y: auto; box-shadow: 0 6px 18px rgba(0, 0, 0, .12); }
.ks-classcombo__opt { gap: .6rem; }
.ks-classcombo__opt.is-selected { background: var(--ks-accent-wash); }
.ks-classcombo__opt:hover, .ks-classcombo__opt:focus-visible { background: var(--ks-accent-wash); }
.ks-classcombo__opt .ks-lookup-result__meta { min-width: 2.5rem; font-variant-numeric: tabular-nums; }
.ks-classcombo__empty { padding: .5rem .75rem; color: var(--ks-muted); font-size: .85rem; }

/* Miscellaneous picker (D4, 1.72.0). Token-only — every colour below is an
 * existing --ks-* token, so the dark block at the foot of this file recolours
 * the whole picker with no dark-specific rule and no second palette. */
.ks-miscpicker__chosen { list-style: none; margin: 0 0 .6rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.ks-miscpicker__empty { margin: 0 0 .6rem; color: var(--ks-muted); font-size: .85rem; }
.ks-miscpicker__cap { margin: .5rem 0 0; color: var(--ks-muted); font-size: .85rem; }
.ks-miscpicker__search { margin: 0; }
.ks-miscchip { display: inline-flex; align-items: center; gap: .45rem; background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 999px; padding: .25rem .3rem .25rem .6rem; font-size: .85rem; color: var(--ks-text); }
.ks-miscchip__num { font-weight: 700; font-variant-numeric: tabular-nums; }
.ks-miscchip__remove { border: 0; background: transparent; color: var(--ks-muted); cursor: pointer; font-size: 1.05rem; line-height: 1; padding: .1rem .35rem; border-radius: 999px; }
.ks-miscchip__remove:hover, .ks-miscchip__remove:focus-visible { background: var(--ks-accent-wash); color: var(--ks-accent-dark); }

/* Cart */
.ks-cart__exhibit { border-bottom: 1px solid var(--ks-border); padding: .5rem 0; }
.ks-cart__exhibit h4 { margin: 0 0 .35rem; }
.ks-cart__line { display: flex; justify-content: space-between; padding: .15rem 0; }
/* 1.70.4: was `var(--ks-text-muted, #6b7280)`. --ks-text-muted is the ADMIN shell's
 * token, not this sheet's, so on the admin on-behalf form it resolved to the shell's
 * #8A929E — 3.14 in LIGHT mode, a pre-existing AA failure. Read this sheet's own
 * --ks-muted, with the entry-form value as the fallback: 5.59 light, 6.79 dark. */
.ks-cart__line--reason { padding-left: 1rem; font-size: .9rem; color: var(--ks-muted, #6b6577); font-style: italic; }
.ks-cart__line--total { font-weight: 700; font-size: 1.1rem; border-top: 2px solid var(--ks-accent); margin-top: .5rem; padding-top: .5rem; }
.ks-cart__totals { margin-top: .5rem; }

.ks-declaration { background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 8px; padding: .75rem 1rem; margin-bottom: 1rem; font-size: .9rem; }
.ks-entry-form__total { font-size: 1.15rem; margin-top: 1rem; }

/* Buttons */
.ks-step-nav { display: flex; justify-content: space-between; gap: .75rem; margin-top: 1rem; }
.ks-btn { display: inline-block; border: 1px solid var(--ks-accent); border-radius: 8px; padding: .6rem 1.2rem; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; }
.ks-btn--primary { background: var(--ks-accent-fill, var(--ks-accent)); color: #fff; }
.ks-btn--primary:hover { background: var(--ks-accent-fill-hover, var(--ks-accent-dark)); }
.ks-btn--secondary { background: var(--ks-surface, #fff); color: var(--ks-accent-dark); }
.ks-btn--ghost { background: transparent; border-color: var(--ks-border); color: var(--ks-muted); }
.ks-btn--small { padding: .35rem .8rem; font-size: .85rem; }
.ks-btn[disabled] { opacity: .5; cursor: not-allowed; }

/* Confirmation */
.ks-entry-ref { display: inline-block; background: var(--ks-bg-soft); border: 1px dashed var(--ks-accent); border-radius: 8px; padding: .2rem .6rem; font-size: 1.2rem; letter-spacing: .04em; }
.ks-entry-summary dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1.5rem 0; }
.ks-entry-summary dt { color: var(--ks-muted); font-size: .82rem; }
.ks-entry-summary dd { margin: 0; font-weight: 700; font-size: 1.1rem; }
.ks-entry-pay-instructions { background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 10px; padding: 1rem 1.25rem; margin: 1.25rem 0; }
.ks-entry-form__note--muted { color: var(--ks-muted); font-size: .85rem; }

.ks-entry-form__actions, .ks-entry-form__auth-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }

@media ( max-width: 600px ) {
	.ks-fields { grid-template-columns: 1fr; }
	.ks-entry-summary dl { grid-template-columns: 1fr; }
}

/* BoB/BiC opt-out + admin on-behalf bits (1.18.0). */
.ks-exhibit__bob { margin: 0.75rem 0 0; padding: 0.6rem 0.85rem; border: 1px dashed var(--ks-border, #d9d9d9); border-radius: 8px; }
.ks-exhibit__bob legend { font-weight: 600; padding: 0 0.4rem; }
.ks-cart__note { margin: 0.15rem 0 0.4rem; font-size: 0.85rem; color: var(--ks-note-ink, #8a5a00); }
.ks-entry-form__onbehalf { margin: 0.75rem 0; }
.ks-admin-markpaid { margin-top: 1rem; padding: 0.6rem 0.85rem; border: 1px solid var(--ks-border, #e2e2e2); border-radius: 8px; }
.ks-admin-markpaid legend { font-weight: 600; padding: 0 0.4rem; }
.ks-entry-summary__cats { list-style: none; margin: 0.75rem 0 0; padding: 0; display: grid; gap: 0.3rem; }
.ks-entry-summary__cats li { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: baseline; }
.ks-entry-summary__cat-name { font-weight: 600; }
.ks-entry-summary__cat-note { font-size: 0.85rem; color: var(--ks-note-ink, #8a5a00); }

/* ===========================================================================
 * Part B (1.19.0) — branded button + step-pill hovers (pure visual).
 *
 * Every hover/ring below derives from the existing brand brown (--ks-accent →
 * --kk-accent): filled controls darken ~10% via --ks-accent-dark; outline /
 * inactive controls warm to a light wash of the SAME brown instead of the
 * theme's grey; a 2px brand-brown focus-visible ring is added for keyboards.
 * No new hue, no markup change.
 *
 * The picker sub-states render .ks-btn / .ks-stepper OUTSIDE .ks-entry-form. 1.19.0
 * republished the three accent tokens on those containers to cover that; 1.70.4
 * folds them into the single token layer at the top of the file, which publishes
 * the WHOLE set there instead. Three tokens was never the right number: .ks-btn
 * also reads --ks-surface, --ks-border, --ks-muted and --ks-err-fill, and on the
 * picker page --ks-muted was one of the ones resolving to nothing.
 * ======================================================================== */

/* Smooth the colour change (respecting reduced-motion). */
@media ( prefers-reduced-motion: no-preference ) {
	.ks-btn,
	.ks-stepper__item,
	.ks-tab {
		transition: background-color .15s ease, border-color .15s ease, color .15s ease;
	}
}

/* Step-nav pills. Active pill darkens; inactive/done pills warm to the wash
 * (keeping brown text) rather than falling back to the theme grey. */
.ks-stepper__item:hover {
	background: var(--ks-accent-wash);
	border-color: var(--ks-accent);
	color: var(--ks-accent-dark);
}
.ks-stepper__item.is-active:hover {
	background: var(--ks-accent-fill-hover, var(--ks-accent-dark));
	border-color: var(--ks-accent-fill-hover, var(--ks-accent-dark));
	color: #fff;
}

/* Filled brown buttons: darken ~10% on hover/focus, white text kept. */
.ks-btn--primary:hover,
.ks-btn--primary:focus {
	background: var(--ks-accent-fill-hover, var(--ks-accent-dark));
	border-color: var(--ks-accent-fill-hover, var(--ks-accent-dark));
	color: #fff;
}

/* Outline / secondary / ghost buttons: fill with the brand wash, keeping the
 * brown border + text — never the theme grey. */
.ks-btn--secondary:hover,
.ks-btn--secondary:focus {
	background: var(--ks-accent-wash);
	border-color: var(--ks-accent);
	color: var(--ks-accent-dark);
}
.ks-btn--ghost:hover,
.ks-btn--ghost:focus {
	background: var(--ks-accent-wash);
	border-color: var(--ks-accent);
	color: var(--ks-accent-dark);
}

/* Tabs (Your cats / Extras …): inactive tab hover warms to the wash. */
.ks-tab:hover {
	background: var(--ks-accent-wash);
	color: var(--ks-accent-dark);
}
.ks-tab.is-active:hover {
	background: var(--ks-accent-fill-hover, var(--ks-accent-dark));
	border-color: var(--ks-accent-fill-hover, var(--ks-accent-dark));
	color: #fff;
}

/* Accessible keyboard focus: a 2px brand-brown ring. */
.ks-btn:focus-visible,
.ks-stepper__item:focus-visible,
.ks-tab:focus-visible {
	outline: 2px solid var(--ks-accent);
	outline-offset: 2px;
}

/* ===========================================================================
 * Entry-form quick wins (1.30.0).
 *  - #1/#6: exhibit heading = "Exhibit N", any title(s) in front, name in bold.
 *  - #6/#7: "Show fees" disclosure + inline double-pen fee hint.
 * All colours use the existing brand/theme tokens so they adapt with the rest.
 * ======================================================================== */

/* Exhibit heading. */
.ks-exhibit__heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem; }
.ks-exhibit__num { color: var(--ks-muted); font-weight: 600; }
.ks-exhibit__titles { color: var(--ks-accent-dark); font-weight: 600; }
.ks-exhibit__catname { font-weight: 700; }
.ks-exhibit__sep { color: var(--ks-muted); }

/* Inline double-pen fee hint beside the checkbox. */
.ks-exhibit__dp-fee { color: var(--ks-muted); font-weight: 600; }

/* "Show fees" disclosure in the header. */
.ks-fee-summary { margin: .75rem 0 0; border: 1px solid var(--ks-border); border-radius: 8px; background: var(--ks-bg-soft); }
.ks-fee-summary__toggle { cursor: pointer; padding: .5rem .85rem; font-weight: 600; list-style: none; display: flex; align-items: center; gap: .4rem; }
.ks-fee-summary__toggle::-webkit-details-marker { display: none; }
.ks-fee-summary__body { padding: 0 .85rem .85rem; }
.ks-fee-summary__hint { color: var(--ks-muted); font-size: .82rem; margin: 0 0 .6rem; }
.ks-fee-summary__name { font-size: 1rem; margin: .6rem 0 .35rem; }
.ks-fee-summary__table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.ks-fee-summary__table th, .ks-fee-summary__table td { text-align: left; padding: .25rem .5rem; border-bottom: 1px solid var(--ks-border); }
.ks-fee-summary__table thead th { color: var(--ks-muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.ks-fee-summary__table td { text-align: right; font-variant-numeric: tabular-nums; }
.ks-fee-summary__table th[scope="row"] { font-weight: 600; }
.ks-fee-summary__sub { font-weight: 600; margin: .6rem 0 .2rem; font-size: .85rem; }
.ks-fee-summary__list { margin: .2rem 0 0; padding-left: 1.1rem; font-size: .88rem; }
.ks-fee-summary__note { color: var(--ks-muted); font-size: .82rem; margin: .5rem 0 0; }

/* Withdraw entry (1.32.0) */
/* --ks-err is an INK token: in dark it becomes a light red (#F0938B), which as a
 * FILL under white text would measure 1.9. The danger button therefore reads a
 * separate fill token, so the two can be lightened and darkened independently. */
.ks-btn--danger { background: var(--ks-err-fill, var(--ks-err, #c0392b)); color: #fff; border-color: var(--ks-err-fill, var(--ks-err, #c0392b)); }
.ks-btn--danger:hover,
.ks-btn--danger:focus { background: #a5281c; border-color: #a5281c; color: #fff; }
.ks-withdraw-form__choices { border: 1px solid var(--ks-border); border-radius: 8px; padding: .75rem 1rem; margin: 0 0 1rem; }
.ks-withdraw-form__choices legend { font-weight: 600; padding: 0 .35rem; }
.ks-withdraw-form__choice { display: flex; gap: .6rem; align-items: flex-start; padding: .55rem .35rem; border-top: 1px solid var(--ks-border); cursor: pointer; }
.ks-withdraw-form__choice:first-of-type { border-top: 0; }
.ks-withdraw-form__choice--whole { border-top: 2px solid var(--ks-border); margin-top: .25rem; }
.ks-withdraw-form__choice-text { display: flex; flex-direction: column; gap: .15rem; }
.ks-withdraw-form__choice-sub { color: var(--ks-muted); font-size: .85rem; }
.ks-withdraw-form__choice-total { color: var(--ks-muted); font-size: .85rem; }
.ks-withdraw-form__reason { display: flex; flex-direction: column; gap: .3rem; margin: 0 0 1rem; }
.ks-entry-detail__exhibit--withdrawn { opacity: .7; }
.ks-entry-detail__exhibit--withdrawn .ks-entry-detail__name { text-decoration: line-through; }
.ks-entry-detail__note--withdrawn { text-decoration: none; background: var(--ks-err-soft, #fdeceb); color: var(--ks-err, #c0392b); border-radius: 4px; padding: .05rem .4rem; font-size: .78rem; }

/* ===========================================================================
 * E1 — dark theme for the entry form (1.70.4).
 *
 * WHY THIS WAS MISSING. The E1 dark pass (1.53.0 and before) authored palettes in
 * kopikatts-admin.css and kopikatts-account.css. This sheet was never included, so
 * it carried ZERO [data-ks-theme] rules and seven hardcoded light fills. On the
 * admin "enter on behalf" form the shell repainted around it and the inherited text
 * went light, leaving light ink on white cards: the class picker measured 1.22
 * ("no classes have appeared" — they had, invisibly), the form cards 1.22, the
 * secondary buttons 3.56.
 *
 * THE SELECTOR LIST IS THE ONE AT THE TOP OF THE FILE, and must stay that way. The
 * hook cannot be .ks-entry-form alone: the admin on-behalf route has no such wrapper,
 * so a dark block hooked there would change nothing on the screen the bug was
 * reported from. Every light token declared in the token layer has its dark
 * counterpart here, and §7 of the harness fails if the two lists ever diverge —
 * a token that is dark-only silently keeps its LIGHT value in dark mode, which is
 * the same class of defect as one that resolves to nothing.
 *
 * NO SECOND PALETTE. Every value below is lifted from the dark palette already
 * authored in kopikatts-admin.css (§E1, ~line 3184) — surfaces #1E242E / #262E3A,
 * border #333C49, text #E6E9EE / #A2ACBA, accent #E08A5B, and the badge pairs for
 * the semantic colours. Where this sheet needed a token the shell has no name for,
 * it is a new NAME over an existing VALUE, never a new colour.
 *
 * FILL vs INK. The dark accent #E08A5B is authored to carry AA as INK on a dark
 * surface; underneath white text it is a 2.64 fill, which is what the Next button,
 * the active step pill and the active tab all measured. Fills therefore read
 * --ks-accent-fill / --ks-accent-fill-hover, which stay dark in both themes, while
 * --ks-accent-dark is free to lighten for ink. Same split for --ks-err-fill.
 *
 * Every pair below was measured from getComputedStyle in both themes and both
 * scopes — not read off this file — via tools/fixtures/entry-form-contrast.html,
 * and the numbers are in the 1.70.4 hand-back. CSS only, reversible.
 * ======================================================================== */
[data-ks-theme="dark"] .ks-entry-form,
[data-ks-theme="dark"] .ks-entry-form__container,
[data-ks-theme="dark"] .ks-admin-create,
[data-ks-theme="dark"] .ks-admin-search,
[data-ks-theme="dark"] .ks-admin-list,
[data-ks-theme="dark"] .ks-admin-head,
[data-ks-theme="dark"] .ks-admin-empty {
	--ks-text: #E6E9EE;
	--ks-muted: #A2ACBA;
	--ks-border: #333C49;
	--ks-surface: #1E242E;
	--ks-bg-soft: #262E3A;

	/* Ink: the lighter clay, authored to AA on the dark surfaces. */
	--ks-accent: #E08A5B;
	--ks-accent-dark: #E08A5B;
	/* Fill: kept dark, because white text sits on it. Both are existing brand values
	 * (#A85828 / #8E4820 — --kk-accent and --kk-accent-hover). Note the hover fill
	 * DARKENS rather than lightens on dark: the admin shell's own button-hover clay
	 * #B5623E carries white at only 4.39, so lightening the fill cannot reach AA at
	 * all, and inventing a new hex would mean a second palette. */
	--ks-accent-fill: #A85828;
	--ks-accent-fill-hover: #8E4820;
	/* The 1.19.0 hover wash is a TRANSLUCENT color-mix, so on dark its real contrast
	 * depends on whatever it happens to be composited over. That is how the ghost
	 * button's hover measured 4.46 — not on a card, but inside the info notice, whose
	 * mid-blue fill lifted the backdrop out from under the ink. Opaque in dark (the
	 * admin palette's own --ks-accent-tint) makes every wash-based hover a single
	 * known pair — 5.48 — whatever sits behind it. Light keeps the color-mix. */
	--ks-accent-wash: #33271F;

	/* Semantic pairs — the fills and inks from the admin badge palette, so an
	 * error still reads as an error and a warning as a warning rather than as a
	 * darker version of the light-mode pastel. */
	--ks-ok: #8FD6A2;
	--ks-ok-soft: #1B3B27;
	--ks-warn: #ECB877;
	--ks-warn-soft: #45330F;
	--ks-warn-border: #5A4332;
	--ks-err: #F0938B;
	--ks-err-soft: #3A1D1C;
	--ks-err-border: #6E3A37;
	--ks-err-fill: #C5443B;
	--ks-info-soft: #1E3A52;
	--ks-info-border: #333C49;
	/* The amber "double pen requested" / withdrawn-cat note ink. */
	--ks-note-ink: #ECB877;
	/* brand.css renders the required-field asterisk as var(--ks-danger, #e5736b);
	 * naming it here puts the marker on the same red as the rest of the form. */
	--ks-danger: #F0938B;
	/* Transparent here too: the floor's fallback is a LIGHT pair, and it must not
	 * engage in dark mode while the tokens are working. If this block has stopped
	 * matching, dark mode is not working either, and the light pair is the right
	 * thing to land on. */
	--ks-page: transparent;

	/* Root-cause fix for the white browser-default controls, exactly as the admin
	 * shell does it: the entry form's inputs and selects carry only a border, so
	 * their fill is the UA's. Tell the UA which palette to draw them in. The admin
	 * scope already inherits this from .ks-admin; this covers the public route. */
	color-scheme: dark;
}