.bakery-page { background: #c6e5ed; color: #4c3b35; --ink: #4c3b35; --gold: #f3b84b; }
#loading { margin: 22vh auto; text-align: center; font-weight: 700; }
.bakery-page .game-shell { padding-bottom: 12px; }
.bakery-page .shell-topbar { min-height: 74px; }
.bakery-page .shell-main { gap: 10px; padding-top: 0; }
.bakery-page .shell-stage { background: #e9f6f5; box-shadow: 0 7px 0 #a5c4ce, 0 16px 32px #436a7b19; }
.bakery-page .shell-controls { flex-direction: column; gap: 7px; min-height: 64px; }
.bakery-page .shell-hint { font-size: 13px; max-width: 400px; min-height: 19px; }
.bakery-page .shell-card { background: #fff9e9; border-color: #fff; }
.bakery-page .shell-eyebrow { text-transform: none; letter-spacing: 0; color: #51666a; font-size: 12px; }
.bakery-page .shell-game-icon { width: 105px; height: 105px; }
.bakery-actions { display: flex; align-items: stretch; justify-content: center; gap: 8px; width: 100%; }
.bakery-actions button { min-height: 56px; padding: 5px 12px; border: 2px solid #71949d; background: #f1faf8; border-radius: 16px; }
.bakery-actions .bakery-oven { display: flex; align-items: center; justify-content: center; gap: 8px; min-width: 145px; background: #f3b84b; border-color: #b87531; box-shadow: 0 3px 0 #ae7439; font-size: 18px; }
.bakery-oven svg { width: 42px; height: 40px; }
.bakery-oven[data-hint="true"] { outline: 3px dashed #70502e; outline-offset: 2px; }
.bakery-actions .bakery-undo { min-width: 58px; font-size: 25px; padding: 5px 10px; }
.bakery-tidy { font-size: 14px; }
.bakery-fuel { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 3px; max-width: 350px; min-height: 18px; }
.bakery-fuel strong { font-size: 12px; margin-right: 5px; }
.bakery-fuel i { display: block; width: 7px; height: 8px; background: #b87531; border: 1px solid #75512b; border-radius: 3px 3px 1px 1px; }
.bakery-fuel i.used { background: transparent; opacity: .45; }
.bakery-grid { position: absolute; left: 4.861111%; top: 29.166667%; width: 90.277778%; height: 62.5%; display: grid; grid-template-columns: repeat(5,1fr); grid-template-rows: repeat(6,1fr); z-index: 2; touch-action: none; user-select: none; -webkit-user-select: none; }
.bakery-cell, .bakery-order { background: transparent; min-width: 0; min-height: 0; padding: 0; border: 0; touch-action: none; }
.bakery-cell { border-radius: 12px; }
.bakery-cell:focus-visible { outline: 3px solid #315f82; outline-offset: -5px; }
.bakery-page .bakery-cell:hover, .bakery-page .bakery-order:hover { filter: none; }
.bakery-order { position: absolute; left: 58.333333%; top: 10.9375%; width: 34.027778%; height: 15.625%; z-index: 3; border-radius: 24px; }
.bakery-order:focus-visible { outline: 4px solid #315f82; outline-offset: -4px; }
.bakery-day-picker { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 12px 0; }
.bakery-day-picker button { background: #e0eeed; font-size: 25px; }
.bakery-day-picker output { flex: 1; max-width: 240px; font-size: 15px; font-weight: 800; }
.bakery-picture-guide { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 5px 0; font-size: 25px; }
.bakery-picture-guide img { width: 44px; height: 44px; object-fit: contain; }
.bakery-story { font-size: 15px; margin: 10px 0; }
.bakery-page .bakery-next { margin-top: 12px; background: #dceecf; }
.bakery-days { margin-top: 9px; }
@media (max-width: 620px) {
  .bakery-page .shell-topbar { min-height: 68px; flex-wrap: nowrap; gap: 5px; }
  .bakery-page .shell-brand { font-size: 13px; gap: 5px; }
  .bakery-page .shell-brand-mark { width: 25px; height: 25px; font-size: 16px; }
  .bakery-page .shell-toolbar { gap: 4px; }
  .bakery-page .shell-mode-badge { position: static; min-height: 28px; padding: 4px 6px; font-size: 10px; }
  .bakery-page .shell-main { gap: 12px; }
  .bakery-page .shell-hint { font-size: 12px; }
  .bakery-page .shell-card { padding: 18px; }
  .bakery-page .shell-start-heading { gap: 6px; }
  .bakery-page .shell-start-heading h1 { font-size: 30px; }
  .bakery-page .shell-game-icon { width: 95px; height: 85px; }
  .bakery-page .shell-modes { margin: 12px 0; }
}
@media (max-width: 359px) { .bakery-page .shell-brand > span:last-child { display: none; } }