

.mode-choice { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; min-width: 0; }
.mode-option { display: flex; align-items: flex-start; gap: 10px; padding: 12px; background: var(--raised); border: 1px solid var(--hairline); border-radius: var(--radius-control); cursor: pointer; }
.mode-option:has(input:checked) { border-color: var(--emerald-border); background: var(--emerald-tint); }
.mode-option:has(input:focus-visible) { outline: var(--focus-ring); outline-offset: 1px; }
.mode-option input { margin-top: 3px; flex: none; }
.mode-option span { display: grid; gap: 2px; min-width: 0; }
.mode-option b { font-size: 14px; font-weight: 600; }
.mode-option small { color: var(--muted); font-size: 12.5px; line-height: 1.4; }

.business-page { display: grid; gap: 14px; max-width: 640px; padding-bottom: 32px; }
.business-page[hidden], .business-page [hidden] { display: none; }
.business-card { display: grid; gap: 16px; padding: 16px; background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius-control); }
.business-heading { margin: 0; font-size: 13px; font-weight: 600; }
.business-note { margin: 0; padding: 10px 12px; color: var(--ink-2); font-size: 13px; line-height: 1.45; background: var(--raised); border: 1px solid var(--hairline); border-left: var(--edge-w) solid var(--edge-structure); border-radius: var(--radius-control); }
.business-field { display: grid; gap: 6px; min-width: 0; }
.business-field input[type="text"] { width: 100%; max-width: 420px; box-sizing: border-box; }
.business-label { color: var(--muted); font: 600 10px var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.business-logo { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; min-width: 0; }
.business-preview { width: 96px; height: 96px; font-size: 32px; }
.business-logo-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.business-preview canvas { display: block; width: 100%; height: 100%; }
.business-help { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.business-actions { display: flex; gap: 8px; }
