.setup-panel,
.setup-goal,
.setup-task {
    border: 1px solid var(--color-border, var(--color-primary));
    border-radius: var(--rr-corner-radius);
    padding: 1rem;
}
.setup-panel { margin-block-end: 1rem; }
.setup-panel h2,
.setup-task h2 { margin-block-start: 0; }
.getting-started-page { max-width: 48rem; }
.setup-recipient,
.setup-task-status { font-weight: 700; }
.setup-task-list { list-style: none; padding-inline-start: 0; }
.setup-task { margin-block: 1rem; }
.setup-goals { display: grid; gap: .75rem; min-width: 0; margin-block: 1rem; }
.setup-goal label { display: block; }
.setup-goal input[type="checkbox"] { width: 1.25rem; height: 1.25rem; vertical-align: middle; }
.setup-goal p { margin-block-end: 0; }
.setup-action-form { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0; }
.setup-action-form .setup-goals { flex-basis: 100%; }
.setup-action-form > p,
.setup-action-form > .form-actions { flex-basis: 100%; }
.setup-task .form-actions,
.setup-panel .form-actions { flex-wrap: wrap; }
.getting-started-page button,
.setup-panel button,
.getting-started-page .secondary-button { min-height: 2.75rem; }
.setup-action-form select { max-width: 100%; }
@media (max-width: 40rem) {
    .setup-task,
    .setup-panel,
    .setup-goal { padding: .75rem; }
    .setup-task-list { padding-inline-start: 0; }
}

.setup-choice-panel { display: flex; flex-direction: column; min-height: 0; margin-block-end: 1rem; padding: 1rem; border: 2px solid var(--rr-heading-color, var(--rr-main-color)); border-radius: var(--rr-corner-radius); background: #fff; color: var(--color-text, #222); }
.setup-choice-panel h2 { flex: none; margin-block-start: 0; }
.setup-choice-scroll { min-height: 0; max-height: min(60vh, 38rem); overflow-y: auto; overscroll-behavior: contain; padding-inline-end: .5rem; }
.setup-choice-scroll > p:first-child { margin-block-start: 0; }
.setup-choice-actions { display: flex; flex: none; justify-content: flex-end; gap: .5rem; margin-block-start: 1rem; padding-block-start: .75rem; border-top: 1px solid var(--color-border, #ccc); }
@media (max-width: 40rem) { .setup-choice-panel { padding: .75rem; } .setup-choice-scroll { max-height: 55vh; } }

body[data-page="getting-started"] .page-content { display: flex; flex-direction: column; overflow: hidden; }
body[data-page="getting-started"] .getting-started-page { display: flex; flex: 1 1 auto; flex-direction: column; width: 100%; max-width: 48rem; min-height: 0; margin-inline: auto; }
body[data-page="getting-started"] .setup-recipient { flex: none; }
body[data-page="getting-started"] .setup-goals-form { display: contents; }
body[data-page="getting-started"] .setup-choice-panel { flex: 1 1 auto; min-height: 0; overflow: hidden; margin-block-end: 0; }
body[data-page="getting-started"] .setup-choice-scroll { flex: 1 1 auto; max-height: none; min-height: 0; overflow-y: auto; }
body[data-page="getting-started"] .setup-choice-actions { flex: none; margin-block-start: .5rem; padding-block: .5rem; background: var(--rr-page-panel-background, #fff); }

.setup-none-goal { font-size: calc(1rem + 2 * var(--rr-font-size-step, 2px)); font-weight: 700; }

body[data-page="getting-started"] .setup-steps-panel { flex: 1 1 auto; }
body[data-page="getting-started"] .setup-steps-panel .setup-choice-scroll { width: 100%; }
body[data-page="getting-started"] .setup-steps-actions { width: 100%; }
body[data-page="getting-started"] .setup-task { background: #fff; color: var(--color-text, #222); }
body[data-page="getting-started"] .setup-task .form-actions { row-gap: .5rem; }

.setup-central-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0; }
.setup-central-actions p { margin: 0 0 0 24px; }
@media (max-width: 32rem) { .setup-central-actions p { margin-left: 24px; } }
.setup-central-panel { background: #fff; color: var(--color-text, #222); }

.preferences-page .preferences-theme-link { margin-left: 12px; }
body[data-page="getting-started"] .setup-task .form-actions > form:not(:first-of-type) { margin-left: 12px; }

body[data-page="getting-started"] .setup-return-choices { margin-left: 12px; }

body[data-page="getting-started"] .setup-save-choices { margin-left: 12px; }

.setup-task-context { background: #fff; color: var(--color-text, #222); border: 2px solid var(--rr-heading-color, var(--rr-main-color)); border-radius: var(--rr-corner-radius); }
.setup-task-context { box-sizing: border-box; width: min(760px, 100%); }

.setup-task-context .setup-task-eyebrow { margin: 0 0 .35rem; font-size: 1.25rem; font-weight: 700; }
.setup-task-context .setup-task-caption { margin: 0; font-size: 1.5rem; font-weight: 700; }

.setup-inline-add { display: inline-grid; place-items: center; width: 1.45em; height: 1.45em; margin-inline: .1em; border-radius: 50%; background: var(--rr-button-color, var(--rr-main-color)); color: var(--color-on-primary, #fff); box-shadow: 0 2px 3px rgba(0, 0, 0, .35); font-weight: 700; line-height: 1; vertical-align: middle; }

.setup-task-context { position: relative; padding-right: 3.75rem; }
.setup-task-return-icon { position: absolute; top: .75rem; right: .75rem; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: var(--rr-corner-radius); background: var(--rr-button-color, var(--rr-main-color)); color: var(--color-on-primary, #fff); }
.setup-task-return-icon svg { width: 1.5rem; height: 1.5rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.setup-task-return-icon:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; }