body.reposteria {
  --bakery-ink: #35251f;
  --bakery-muted: #665249;
  --bakery-line: #e5d4c8;
  --bakery-field-line: #9e8072;
  --bakery-paper: #fffdfa;
  --bakery-tint: #f7eae1;
  --bakery-dark: #66372d;
  min-height: 100vh;
  color: var(--bakery-ink);
  background: radial-gradient(ellipse at 75% 0%, #f3e0d5 0%, transparent 32rem), #faf5ee;
}

.reposteria .skip-link:not(:focus) { clip-path: inset(50%); }

#workspace.bakery-workspace {
  width: min(100%, 52rem);
  padding: clamp(1.1rem, 4vw, 3.25rem) clamp(.85rem, 4vw, 2rem) 4rem;
}

.bakery-intro {
  display: grid;
  grid-template-areas: 'title icon' 'description description';
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .6rem .65rem;
  padding: clamp(1rem, 4.2vw, 2.1rem);
  border: 1px solid #6e352b;
  border-radius: 1.25rem;
  background: radial-gradient(ellipse at 100% 0%, #984a39, transparent 70%), #633229;
  color: #fff6e8;
  box-shadow: 0 .55rem 1.35rem #642d211f;
}

.bakery-intro h1 {
  grid-area: title;
  margin: 0;
  font-size: clamp(2.35rem, 7vw, 4.2rem);
  line-height: .99;
  color: inherit;
}

.bakery-intro p {
  grid-area: description;
  max-width: 32rem;
  margin: 0;
  color: #ffede0;
  font-size: clamp(.92rem, 2vw, 1.04rem);
}

.bakery-icon {
  grid-area: icon;
  justify-self: end;
  padding: .23rem;
  border: 1px solid #ffe2c987;
  border-radius: 1.05rem;
  background: #fff6e815;
  box-shadow: 0 .3rem .9rem #33130f35;
}

.bakery-icon img { display: block; width: clamp(3.2rem, 11vw, 6rem); height: auto; border-radius: .8rem; }

.bakery-glyph {
  width: 1.25rem;
  height: 1.25rem;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.bakery-draft {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .15rem .6rem;
  margin: .65rem 0 .9rem;
  padding: .15rem .35rem;
  border-bottom: 1px solid var(--bakery-line);
}

.bakery-draft-note { display: flex; flex: 1 1 12rem; align-items: center; gap: .5rem; min-width: 0; }
.bakery-draft-note .bakery-glyph { color: var(--accent); width: 1.05rem; height: 1.05rem; }
.bakery-draft p { margin: 0; font-size: .87rem; color: var(--bakery-muted); overflow-wrap: anywhere; }
.bakery-draft button { margin-left: 1.5rem; }

.bakery-panel {
  padding: clamp(1rem, 3.5vw, 1.8rem);
  background: var(--bakery-paper);
  border: 1px solid var(--bakery-line);
  border-radius: 1.15rem;
  box-shadow: 0 .35rem 1rem #66372d0c;
}

.bakery-panel + .bakery-panel, .bakery-result { margin-top: 1rem; }
.bakery-heading {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin: 0 0 .85rem;
  color: var(--bakery-ink);
  font-family: var(--font-display);
  font-size: clamp(1.7rem, 4.7vw, 2.2rem);
  font-weight: 400;
  line-height: 1.07;
}

.bakery-heading .bakery-glyph {
  width: 2.35rem;
  height: 2.35rem;
  padding: .43rem;
  border: 1px solid var(--bakery-line);
  border-radius: .65rem;
  background: var(--bakery-tint);
  color: var(--accent);
}

.bakery-panel h2 + p { color: var(--bakery-muted); }
.bakery-grid, .bakery-quantity, .bakery-ingredient-head { display: grid; gap: .8rem; }
.bakery-quantity { grid-template-columns: minmax(0, 1.32fr) minmax(0, 1fr); }
.bakery-quantity > label > [id$='-label'] { min-height: 2.6em; display: flex; align-items: end; }
.bakery-ingredient-head { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.bakery-ingredient-head:has(button[hidden]) { grid-template-columns: minmax(0, 1fr); }
.bakery-ingredient-head button { margin-top: 1.55rem; }
.bakery-field { min-width: 0; display: grid; align-content: start; gap: .33rem; line-height: 1.3; }
.bakery-field > :is(input, select, textarea) {
  min-height: 48px;
  margin: 0;
  border-color: var(--bakery-field-line);
  border-radius: .65rem;
  color: var(--bakery-ink);
  background-color: #fffcf8;
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.bakery-field > :is(input, select, textarea):hover { background-color: #fff; border-color: var(--bakery-dark); }
.bakery-field > :is(input, select, textarea)[aria-invalid='true'] { background-color: #fff3ee; border-color: #a33328; }
.bakery-field > input::placeholder { color: #775f54; opacity: 1; }
.bakery-optional, .bakery-hint { font-size: .86rem; color: var(--bakery-muted); font-weight: 400; }
.bakery-hint { overflow-wrap: anywhere; }
.bakery-section-row { margin-top: 1rem; }
#labor-fields { margin-top: .8rem; }
#pricing-hint {
  margin: .9rem 0 1.15rem;
  padding: .65rem .75rem;
  border-left: 2px solid var(--accent);
  border-radius: 0 .4rem .4rem 0;
  background: var(--bakery-tint);
}

.bakery-ingredient {
  display: grid;
  gap: .85rem;
  margin-top: 1.05rem;
  border-color: var(--bakery-line);
  padding: .65rem clamp(.75rem, 2vw, 1.05rem) 1rem;
  background: #fbf3ec;
}

.bakery-ingredient legend { padding-inline: .5rem; color: var(--bakery-dark); font-size: .9rem; }
.bakery-line-cost {
  grid-column: 1 / -1;
  margin: 0;
  padding: .5rem .65rem;
  border-radius: .45rem;
  background: #f4e1d4;
  color: var(--bakery-dark);
  font-size: .87rem;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.bakery-action { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; }
.bakery-text-button {
  padding-inline: .5rem;
  background: transparent;
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: .2em;
}

.bakery-secondary { color: var(--accent); background: var(--bakery-paper); border-color: var(--bakery-field-line); }
.bakery-primary { width: 100%; background: var(--accent); color: #fff; box-shadow: 0 .25rem .6rem #762b2625; }
.bakery-primary:hover { background: #89372d; }
#add-ingredient { margin-top: 1rem; }
.bakery-error { color: #942e22; font-size: .87rem; overflow-wrap: anywhere; }
#form-status, #copy-status { margin: .6rem 0 0; }
#form-status:empty, #copy-status:empty { position: absolute; }
#form-status:not(:empty), #copy-status:not(:empty), #zero-cost:not([hidden]) {
  padding: .6rem .75rem;
  border-radius: .55rem;
  background: var(--bakery-tint);
}

.bakery-result { border-top: 3px solid var(--accent); }
.bakery-price {
  display: grid;
  gap: .85rem;
  padding: clamp(.9rem, 3vw, 1.4rem);
  border: 1px solid #8c4d3c;
  border-radius: .85rem;
  background: radial-gradient(ellipse at 100% 0%, #8f4234, transparent 80%), #70372d;
  color: #fff5e9;
}

.bakery-price > div { min-width: 0; }
.bakery-price > div + div { border-top: 1px solid #ffe6cb55; padding-top: .8rem; }
.bakery-price p { margin: 0; font-size: .91rem; }
.bakery-price .bakery-hero-price, .bakery-price .bakery-lot-price {
  margin-top: .12rem;
  font-family: var(--font-display);
  font-variant-numeric: tabular-nums;
  line-height: 1.02;
  overflow-wrap: anywhere;
}

.bakery-price .bakery-hero-price { font-size: clamp(2.6rem, 7.6vw, 4rem); }
.bakery-price .bakery-lot-price { font-size: clamp(1.85rem, 5.5vw, 2.75rem); }
.bakery-currency {
  font-family: var(--font-body);
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .06em;
}

.bakery-breakdown { margin: 1.15rem 0; }
.bakery-breakdown div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, auto);
  gap: .65rem;
  padding: .42rem .65rem;
  font-size: .94rem;
}

.bakery-breakdown dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.bakery-total { border-top: 1px solid var(--bakery-line); background: #f9eee5; font-weight: 700; }
.bakery-share { display: grid; gap: .7rem; padding: 1rem 0; border-top: 1px solid var(--bakery-line); }
.bakery-share h3 { margin: 0; color: var(--bakery-dark); }
.bakery-share textarea { min-height: 4.65rem; }

@media (min-width: 38rem) {
  .bakery-intro { grid-template-areas: 'title icon' 'description icon'; column-gap: 1.35rem; }
  .bakery-intro h1 { align-self: end; }
  .bakery-intro p { align-self: start; }
  .bakery-draft button { margin-left: 0; }
  .bakery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
  .bakery-primary { width: auto; justify-self: start; min-width: 11rem; }
  .bakery-price { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 1.35rem; align-items: center; }
  .bakery-price > div + div { border-top: 0; border-left: 1px solid #ffe6cb55; padding: 0 0 0 1.35rem; }
}

@media (min-width: 45rem) {
  .bakery-ingredient { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.15rem; }
}

.bakery-pro-entry {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .6rem 1rem;
  margin-bottom: 1rem;
  padding: .7rem 1rem;
  border: 1px solid var(--bakery-line);
  border-radius: .85rem;
  background: var(--bakery-tint);
}

.bakery-pro-entry p { flex: 1 1 16rem; margin: 0; color: var(--bakery-muted); font-size: .88rem; }
.bakery-pro-entry a { display: inline-flex; align-items: center; color: var(--accent); border-color: var(--bakery-field-line); }
#bakery-records-link { min-height: 44px; }

#bakery-pro { margin-top: clamp(1.5rem, 5vw, 2.8rem); }
.bakery-pro-header {
  margin-bottom: 1rem;
  padding: 1rem 0 .85rem;
  border-top: 2px solid var(--accent);
}

.bakery-pro-header .bakery-heading { margin-bottom: .45rem; font-size: clamp(2rem, 5vw, 2.8rem); }
.bakery-pro-header p { margin: 0 0 .5rem; color: var(--bakery-muted); }
.bakery-catalog-choice { grid-column: 1 / -1; }
.bakery-field > :is(input[readonly], select:disabled) { background: #f5e9df; opacity: 1; }
.bakery-field > textarea[readonly] { background: #fffcf8; }
.bakery-pro-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: .85rem; }
.bakery-pro-actions [role='status'] { flex: 1 0 100%; margin: 0; }
:is(.bakery-pro-actions, .bakery-pro-header, .bakery-pro-box) [role='status']:empty { position: absolute; }
.bakery-records { list-style: none; margin: .85rem 0 0; padding: 0; }
.bakery-records:empty { margin: 0; }
.bakery-records li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .45rem 1rem;
  padding: .7rem .15rem;
  border-top: 1px solid var(--bakery-line);
}

.bakery-records li > div { flex: 1 1 12rem; min-width: 0; overflow-wrap: anywhere; }
.bakery-records li span { display: block; }
.bakery-pro-box { margin-top: 1rem; padding: 1rem; border: 1px solid var(--bakery-line); border-radius: .8rem; background: #fbf3ec; }
.bakery-pro-box h4, .bakery-history-heading { margin: 0 0 .75rem; color: var(--bakery-dark); overflow-wrap: anywhere; }
#catalog-preview { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--bakery-line); }
#catalog-update-status:not(:empty) { margin: .5rem 0; }
#catalog-confirm, #quote-add { margin-top: .65rem; }
#catalog-empty, .bakery-history-heading { margin-top: 1rem; }
.bakery-quote-line { grid-template-columns: minmax(0, 1fr); }
.bakery-quote-line button { justify-self: start; }

@media (max-width: 23rem) {
  .bakery-pro-actions > button, .bakery-pro-entry .button { width: 100%; }
}