
.amber-door__eyebrow {
  font-size: var(--font-size-sm);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-sky);
  margin-bottom: var(--space-xs);
}
.amber-door__title { max-width: 18ch; margin-bottom: 0; }
.amber-door__lead { color: var(--color-text-soft); max-width: 38rem; }
.amber-door__price, .amber-stall__price { gap: var(--space-sm); margin: var(--space-sm) 0 var(--space-md); }
.amber-door__old, .amber-stall__old { color: var(--color-text-soft); font-size: var(--font-size-lg); }
.amber-door__new, .amber-stall__new {
  font-family: var(--font-head);
  font-size: clamp(1.9rem, 3.2vw, 2.6rem);
  font-weight: 700;
  color: var(--color-accent-light);
  line-height: 1;
}
.amber-door__badge, .amber-stall__badge {
  display: inline-block;
  padding: 0.2rem 0.6rem;
  border-radius: 0.4rem;
  background: var(--color-sky);
  color: var(--color-sky-ink);
  font-weight: 700;
  font-size: var(--font-size-sm);
}
.amber-door__actions { gap: var(--space-sm); }
.amber-door__stats {
  list-style: none;
  padding: 0;
  margin: var(--space-md) 0 0;
  gap: var(--space-xs) var(--space-md);
  font-size: var(--font-size-sm);
  color: var(--color-text-soft);
}
.amber-door__stat::before { content: "✓ "; color: var(--color-accent); font-weight: 700; }


.amber-blend__title, .amber-picking__title, .amber-letter__title, .amber-bloom__title,
.amber-hedge__title, .amber-routine__title, .amber-queries__title, .amber-label__title,
.amber-markers__title, .amber-last-row__title { margin-bottom: var(--space-md); }
.amber-blend__intro, .amber-picking__text, .amber-routine__text, .amber-last-row__text { max-width: 44rem; color: var(--color-text-soft); }
.amber-picking__text { margin-bottom: var(--space-md); }


.amber-blend__grid, .amber-bloom__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr));
  gap: var(--space-md);
  margin-top: var(--space-md);
}
.amber-leaf {
  text-align: center;
  padding: var(--space-lg) var(--space-md);
  border-radius: 0.9rem;
  background: var(--color-bg);
  border: var(--border-width) solid var(--color-line);
  box-shadow: var(--shadow-sm);
}
.amber-leaf__icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin: 0 auto var(--space-sm);
  background: rgba(245, 160, 58, 0.12);
  color: var(--color-accent);
}
.amber-leaf__title { font-size: var(--font-size-lg); }
.amber-leaf__text { color: var(--color-text-soft); font-size: var(--font-size-sm); margin: 0; }


.amber-letter__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: var(--space-md); margin: 0 0 var(--space-md); }
.amber-letter__item { padding: var(--space-md); border-left: 3px solid var(--color-accent); background: rgba(0, 0, 0, 0.18); border-radius: 0 0.6rem 0.6rem 0; }
.amber-letter__label { font-size: var(--font-size-sm); color: var(--color-sky); font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
.amber-letter__value { margin: 0.25rem 0 0; font-weight: 500; overflow-wrap: anywhere; }
.amber-letter__note { color: var(--color-text-soft); max-width: 44rem; }


.amber-hedge__row, .amber-markers__row {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr));
  border: var(--border-width) solid var(--color-line);
  border-radius: 0.8rem;
  overflow: hidden;
}
.amber-hedge__fact, .amber-markers__fact {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: var(--space-md);
  border-right: var(--border-width) solid var(--color-line);
}
.amber-hedge__fact:last-child, .amber-markers__fact:last-child { border-right: none; }
.amber-hedge__key { font-size: var(--font-size-sm); color: var(--color-text-soft); }
.amber-hedge__val, .amber-markers__fact strong { font-family: var(--font-head); font-weight: 600; color: var(--color-accent-light); }
.amber-markers__fact span { font-size: var(--font-size-sm); color: var(--color-text-soft); }


.amber-queries__list { list-style: none; margin: 0; padding: 0; max-width: 52rem; }
.amber-queries__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-md);
  padding: var(--space-md) 0;
  border-bottom: var(--border-width) solid var(--color-line);
}
.amber-queries__num { font-family: var(--font-head); font-size: 1.6rem; font-weight: 700; color: var(--color-accent); line-height: 1.2; min-width: 2.2ch; }
.amber-queries__q { font-size: var(--font-size-lg); margin-bottom: 0.35rem; }
.amber-queries__a { color: var(--color-text-soft); margin: 0; }


.amber-crumbs__list { list-style: none; margin: 0 0 var(--space-sm); padding: 0; gap: 0.35rem; font-size: var(--font-size-sm); color: var(--color-text-soft); }
.amber-crumbs__item + .amber-crumbs__item::before { content: "›"; margin-right: 0.35rem; color: var(--color-accent); }
.amber-crumbs__link { color: var(--color-text-soft); }


.amber-walk { min-width: 0; }
.amber-walk__main {
  display: grid;
  border-radius: var(--border-radius-lg);
  overflow: hidden;
  background: var(--color-surface-raised);
  box-shadow: var(--shadow-md);
}
.amber-walk__panel { grid-area: 1 / 1; margin: 0; visibility: hidden; }
.amber-walk__panel.is-active { visibility: visible; }
.amber-walk__img, .amber-walk__svg { display: block; width: 100%; height: auto; }
.amber-walk__thumbs { gap: var(--space-xs); margin-top: var(--space-sm); flex-wrap: wrap; }
.amber-walk__thumb {
  min-height: 2.75rem;
  padding: 0.5rem 0.9rem;
  border-radius: 0.5rem;
  border: var(--border-width) solid var(--color-line);
  background: var(--color-surface);
  color: var(--color-text-soft);
  font-size: var(--font-size-sm);
  cursor: pointer;
}
.amber-walk__thumb.is-active { border-color: var(--color-accent); color: var(--color-text); }


.amber-stall { min-width: 0; }
.amber-stall__title { margin-bottom: 0.3rem; }
.amber-stall__sub { color: var(--color-text-soft); }
.amber-stall__meta { display: grid; gap: 0.3rem; margin: 0 0 var(--space-md); font-size: var(--font-size-sm); }
.amber-stall__meta div { display: flex; gap: 0.5rem; }
.amber-stall__meta dt { color: var(--color-text-soft); min-width: 6rem; }
.amber-stall__meta dd { margin: 0; }
.amber-stall__stock { color: var(--color-sky); font-weight: 600; }
.amber-stall__buy { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; margin-bottom: var(--space-md); }
.amber-stall__add { flex: 1 1 12rem; }
.amber-stall__perks { margin: 0; padding-left: 1.2rem; color: var(--color-text-soft); }
.amber-stall__perks li::marker { color: var(--color-accent); }

.amber-stepper { border: var(--border-width) solid var(--color-line); border-radius: 0.6rem; overflow: hidden; }
.amber-stepper__btn {
  width: 2.75rem;
  height: 2.9rem;
  border: none;
  background: var(--color-surface-raised);
  color: var(--color-text);
  font-size: 1.25rem;
  cursor: pointer;
}
.amber-stepper__input {
  width: 3.4rem;
  height: 2.9rem;
  border: none;
  text-align: center;
  background: var(--color-bg);
  color: var(--color-text);
  font-weight: 600;
  -moz-appearance: textfield;
}


.amber-label__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }
.amber-label__block { padding: var(--space-md); background: var(--color-bg); border-radius: 0.8rem; border: var(--border-width) solid var(--color-line); min-width: 0; }
.amber-label__name { font-size: var(--font-size-lg); color: var(--color-accent-light); }
.amber-label__block p { color: var(--color-text-soft); margin: 0; }


.amber-fold__toggle {
  all: unset;
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  min-height: 2.75rem;
  cursor: default;
}
.amber-fold__toggle:focus-visible { outline: 2px solid var(--color-sky); outline-offset: 3px; }


.amber-trug__title { margin-bottom: var(--space-md); }
.amber-trug__line {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-sm) var(--space-md);
  align-items: center;
  padding: var(--space-md);
  border-radius: 0.9rem;
  background: var(--color-surface);
  border: var(--border-width) solid var(--color-line);
}
.amber-trug__thumb { width: 6rem; height: 6rem; object-fit: contain; border-radius: 0.6rem; background: var(--color-surface-raised); }
.amber-trug__name { font-family: var(--font-head); font-weight: 600; font-size: var(--font-size-lg); margin: 0; }
.amber-trug__unit { margin: 0; color: var(--color-text-soft); font-size: var(--font-size-sm); }
.amber-trug__sum { margin: 0; justify-self: end; }
.amber-trug__sum strong { color: var(--color-accent-light); font-size: var(--font-size-lg); }
.amber-trug__remove { grid-column: 1 / -1; justify-self: start; background: none; border: none; color: var(--color-text-soft); text-decoration: underline; cursor: pointer; min-height: 2.75rem; padding: 0; }
.amber-trug__steps { margin-top: var(--space-md); color: var(--color-text-soft); font-size: var(--font-size-sm); }
.amber-trug__empty { padding: var(--space-lg); border: var(--border-width) dashed var(--color-line); border-radius: 0.9rem; }
.amber-trug__checkout { padding: var(--space-lg); background: var(--color-surface-raised); border-radius: var(--border-radius-lg); min-width: 0; }


.amber-form { display: grid; gap: var(--space-sm); }
.amber-form__field { display: grid; gap: 0.3rem; min-width: 0; }
.amber-form__label { font-size: var(--font-size-sm); font-weight: 600; }
.amber-form__input {
  width: 100%;
  min-height: 2.9rem;
  padding: 0.6rem 0.8rem;
  border-radius: 0.55rem;
  border: var(--border-width) solid rgba(251, 243, 230, 0.3);
  background: var(--color-bg);
  color: var(--color-text);
  font-size: 1rem;
}
.amber-form__input--area { min-height: 4.5rem; resize: vertical; }
.amber-form__input:focus { border-color: var(--color-accent); outline: none; box-shadow: 0 0 0 3px rgba(245, 160, 58, 0.25); }
.amber-form__check { display: flex; gap: 0.6rem; align-items: flex-start; font-size: var(--font-size-sm); color: var(--color-text-soft); }
.amber-form__check input { width: 1.25rem; height: 1.25rem; margin-top: 0.15rem; accent-color: var(--color-accent); flex-shrink: 0; }
.amber-form__hint { font-size: var(--font-size-sm); color: var(--color-text-soft); margin: 0; }
.amber-form__error { padding: var(--space-sm) var(--space-md); border-radius: 0.55rem; background: rgba(255, 179, 166, 0.12); border: var(--border-width) solid var(--color-error); color: var(--color-error); }
.amber-form__submit { width: 100%; }
.amber-form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }


.amber-ground-rules__title, .amber-carrier__title, .amber-back__title, .amber-letter__title { max-width: 100%; }
.amber-ground-rules__updated { font-size: var(--font-size-sm); color: var(--color-text-soft); }
.amber-ground-rules__inner h2, .amber-carrier__inner h2, .amber-back__inner h2 { font-size: var(--font-size-lg); margin-top: var(--space-lg); }
.amber-ground-rules__inner p, .amber-ground-rules__inner li, .amber-carrier__inner p, .amber-carrier__inner li, .amber-back__inner p { color: var(--color-text-soft); }
.amber-ground-rules__inner ul, .amber-carrier__steps { padding-left: 1.2rem; }
.amber-carrier__steps li::marker { color: var(--color-accent); font-weight: 700; }
.amber-carrier__inner > .amber-btn, .amber-ground-rules__inner > .amber-btn, .amber-letter__inner > .amber-btn { margin-top: var(--space-md); }
.amber-ground-rules__table { overflow-x: auto; margin: var(--space-sm) 0 var(--space-md); }
.amber-ground-rules__table table { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.amber-ground-rules__table th, .amber-ground-rules__table td { text-align: left; padding: 0.6rem; border-bottom: var(--border-width) solid var(--color-line); vertical-align: top; }
.amber-ground-rules__table td:first-child { overflow-wrap: anywhere; }
.amber-ground-rules__order strong { color: var(--color-accent-light); font-size: var(--font-size-lg); }

@media (max-width: 767px) {
  .amber-label__grid { grid-template-columns: minmax(0, 1fr); }
  .amber-hedge__fact, .amber-markers__fact { border-right: none; border-bottom: var(--border-width) solid var(--color-line); }
  .amber-trug__line { grid-template-columns: auto minmax(0, 1fr); }
  .amber-trug__sum { justify-self: start; }
  .amber-door__actions .amber-btn { flex: 1 1 100%; }
  .js-fold .amber-fold { border-bottom: var(--border-width) solid var(--color-line); }
  .js-fold .amber-fold:not(.is-open) .amber-fold__body { display: none; }
  .amber-fold__toggle { cursor: pointer; }
  .amber-fold__toggle::after { content: "+"; font-size: 1.5rem; color: var(--color-accent); }
  .amber-fold.is-open .amber-fold__toggle::after { content: "−"; }
}
