#gardenWelcome { box-sizing: border-box; width: min(480px, calc(100% - 32px)); max-height: 90dvh; overflow: auto; padding: 24px; border: 1px solid #92ac9b; border-radius: 8px; background: #fff; color: #294838; }
#gardenWelcome::backdrop { background: #172b2280; }
#gardenWelcome h2 { font-size: 24px; margin: 0 0 16px; }
#gardenWelcome p { line-height: 1.6; }
#gardenWelcome label { display: block; margin-bottom: 8px; }
#gardenWelcome input { width: 100%; box-sizing: border-box; min-height: 48px; font: inherit; padding: 10px; }
#gardenWelcome form > div { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
#gardenWelcome button { flex: 1; min-height: 48px; padding: 10px; font: inherit; border: 1px solid #739781; background: #edf4ef; color: #294838; }
#gardenWelcome button[type=submit] { background: #32694d; color: #fff; }
#firstNotesHint:not([hidden]) { position: fixed; bottom: 88px; left: 16px; width: min(420px, calc(100% - 32px)); box-sizing: border-box; z-index: 180; padding: 16px; background: #fff; border: 1px solid #92ac9b; line-height: 1.5; }
#firstNotesHint button { min-height: 44px; margin-top: 8px; padding: 8px 16px; font: inherit; }
html.stall-scroll-locked { overflow: hidden; overscroll-behavior: none; }
#productWorkbench { overscroll-behavior: contain; touch-action: pan-y; }
@media (min-width: 700px) {
  .plot-card.selected { grid-column: auto; }
  .plot-card.selected > .context-bar {
    position: fixed; inset: auto 20px 80px auto; width: min(420px, calc(100vw - 40px));
    max-height: 60dvh; overflow: auto; overscroll-behavior: contain; z-index: 150;
    margin: 0; box-sizing: border-box; background: #fff; border: 1px solid #739781;
  }
}
@media (min-width: 700px) and (max-width: 1400px) {
  body :is(p, small, button, label, input, select, summary, li, .visitor-chip, .stage-badge, .machine-detail, .production-supplies strong) {
    font-size: 18.667px !important;
    line-height: 1.5;
  }
  body :is(button, input, select) { min-height: 44px; }
  .tool-card, .codex-entry { min-width: 0; }
  .tool-card { grid-template-columns: 72px minmax(0,1fr); }
  .tool-card p, .tool-card button, .context-actions button { overflow-wrap: anywhere; white-space: normal; }
  .plot-card.selected > .context-bar .context-actions { display: grid; grid-template-columns: minmax(0,1fr); overflow-x: hidden; }
  .plot-card.selected > .context-bar .context-actions > * { min-width: 0; max-width: 100%; }
  .plot-card.selected > .context-bar .harvest-decision { grid-template-columns: minmax(0,1fr); }
}
