/* Original, text-led invitation styles; only native fonts and fixed palettes. */
.bf-design-section { scroll-margin-top: 2rem; }
.bf-design-section > p { max-width: 45rem; }
.bf-design-editor { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 2.5rem); margin: 1.25rem 0; font-size: 1rem; line-height: 1.6; }
.bf-design-controls { display: grid; gap: 1rem; align-content: start; min-width: 0; }
.bf-design-controls label { display: block; font-weight: 600; margin-bottom: .4rem; }
.bf-design-controls select, .bf-design-controls textarea { display: block; box-sizing: border-box; width: 100%; padding: .75rem; border: 1px solid #c8ccd7; border-radius: .65rem; background: #fff; color: #242632; font: inherit; line-height: 1.5; }
.bf-design-controls textarea { resize: vertical; min-height: 6rem; }
.bf-design-controls .game-field-help { margin: .35rem 0; font-size: .875rem; color: #5d6471; }
.bf-design-actions { display: flex; gap: .65rem; flex-wrap: wrap; }
.bf-design-actions button, .bf-design-controls > button { min-height: 44px; white-space: normal; font: inherit; }
.bf-design-status { min-height: 1.6em; margin: 0; font-size: .875rem; }
.bf-design-preview { align-self: start; min-width: 0; }
.bf-design-preview-label { font-size: .875rem; font-weight: 600; color: #5d6471; margin: 0 0 .75rem; }
.bf-game-invitation { --invite-ink: #423478; --invite-paper: #f4f1fc; box-sizing: border-box; color: var(--invite-ink); background: var(--invite-paper); padding: clamp(1.5rem, 4vw, 2.75rem); border: 1px solid currentColor; border-radius: 1.25rem; min-width: 0; overflow-wrap: anywhere; text-align: left; font-family: system-ui, sans-serif; }
.bf-game-invitation[data-palette="ocean"] { --invite-ink: #164f70; --invite-paper: #eef7fc; }
.bf-game-invitation[data-palette="forest"] { --invite-ink: #225c46; --invite-paper: #f0f8f2; }
.bf-game-invitation[data-palette="rose"] { --invite-ink: #83394b; --invite-paper: #fff2f4; }
.bf-game-invitation .bf-invitation-brand { margin: 0 0 2rem; font-size: .875rem; font-weight: 650; }
.bf-game-invitation .bf-invitation-eyebrow { font-size: .875rem; margin: 0 0 .75rem; }
.bf-game-invitation h3 { margin: 0; color: inherit; font-size: clamp(1.6rem, 3vw, 2.3rem); font-weight: 650; line-height: 1.2; letter-spacing: -.035em; }
.bf-game-invitation .bf-invitation-message { margin: 1.5rem 0 2rem; font-size: 1rem; line-height: 1.7; white-space: pre-wrap; }
.bf-game-invitation .bf-invitation-footer { margin: 0; font-size: .875rem; line-height: 1.6; }
.bf-game-invitation[data-layout="frame"] { border: 5px double currentColor; border-radius: .5rem; text-align: center; }
.bf-game-invitation[data-layout="editorial"] { border-width: 4px 0 1px; border-radius: 0; }
.bf-game-invitation[data-layout="editorial"] h3 { font-family: ui-serif, Georgia, serif; font-weight: 500; font-size: clamp(1.8rem, 3vw, 2.5rem); letter-spacing: -.025em; }
.bf-design-details { border-top: 1px solid #dce0e8; padding-top: 1rem; margin: 1rem 0; }
.bf-design-details > summary { cursor: pointer; font-size: 1rem; font-weight: 600; }
.bf-guest-design { margin-bottom: 1.5rem; }
.bf-guest-design:not(:empty) + .guest-banner { padding: 0; background: none; }
.bf-guest-design:not(:empty) + .guest-banner > span, .bf-guest-design:not(:empty) + .guest-banner strong { display: none; }
.bf-design-editor :focus-visible, .bf-design-details > summary:focus-visible { outline: 3px solid #5145ad; outline-offset: 4px; }
@media (max-width: 760px) { .bf-design-editor { grid-template-columns: minmax(0, 1fr); } .bf-design-actions { flex-direction: column; } }
@media (forced-colors: active) { .bf-game-invitation { color: CanvasText; background: Canvas; border-color: CanvasText; } }
.bf-result-card .bf-result-value { font-size: clamp(1.25rem, 3vw, 1.7rem); font-weight: 650; }
.bf-result-card p { white-space: pre-wrap; overflow-wrap: anywhere; }
.bf-result-editor { margin-block: 1.25rem; }
.bf-result-editor form { display: grid; gap: 1rem; margin-block: 1rem; }
.bf-result-editor textarea { display: block; width: 100%; box-sizing: border-box; font: inherit; padding: .8rem; border: 1px solid #aeb8c8; border-radius: 8px; }
.bf-result-sharing { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.bf-result-sharing > * { min-height: 44px; font-size: 1rem; }
.result-confirmation { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); align-items: start; gap: .65rem; font-size: .95rem; line-height: 1.5; }
.result-confirmation input[type="checkbox"] { width: 1.1rem; height: 1.1rem; margin: .15rem 0 0; }
.bf-result-sharing > a { display: inline-flex; align-items: center; }
.bf-result-editor :focus-visible { outline: 3px solid #5145ad; outline-offset: 3px; }
.bf-recommendation { border-top: 1px solid #cbd0dc; margin-top: 1.5rem; padding-top: 1rem; font: 400 .875rem/1.6 system-ui, sans-serif; color: #505969; text-align: left; }
.bf-recommendation p { margin: .35rem 0 .5rem; }
.bf-recommendation a { display: inline-flex; align-items: center; min-height: 44px; color: #423478; text-decoration: underline; }
.bf-recommendation-page { max-width: 46rem; }
.bf-recommendation-share { font-size: 1rem; line-height: 1.6; }
.bf-recommendation-message { padding: 1rem; border: 1px solid #dce1e9; border-radius: .75rem; background: #f7f8fc; white-space: pre-wrap; overflow-wrap: anywhere; }
.bf-recommendation-actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.bf-recommendation-actions > * { min-height: 44px; display: inline-flex; align-items: center; font: inherit; }
.bf-recommendation-share :focus-visible, .bf-recommendation :focus-visible { outline: 3px solid #5145ad; outline-offset: 3px; }