/* Portal adapters for the approved form and semantic-color components. */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:24px}.gallery>*{min-width:0}.brand-logo{max-width:100%;object-fit:contain}.contact-editor input,.contact-editor select,.contact-editor textarea{max-width:100%}.builder-grid form{margin:0;padding:0;border:0;background:transparent;min-width:0}.builder-grid aside{min-width:0}.builder-grid .check-label{display:flex;align-items:center;gap:8px;min-height:44px}.builder-grid .check-label input{width:24px;min-height:24px}.contact-editor .check input{width:24px;min-height:24px}.builder-grid input[type=checkbox],.order-type input[type=radio]{accent-color:var(--section-solid,var(--step1-solid))}.builder-grid button,.gallery .button,.contact-editor button,.generated-customer button{min-width:44px;min-height:44px}.builder-grid label{overflow-wrap:anywhere}.builder-grid iframe{display:block;max-width:100%}.generated-customer{width:100%;max-width:480px;margin:auto;padding:24px}.generated-customer #generated-form{display:flex;flex-direction:column;gap:16px;background:var(--surface);padding:16px}.small-bib-preview{text-align:center}.generated-customer textarea{width:100%}.form-design>summary{min-width:44px;min-height:44px;padding:10px 12px}.approved-customer:has(#builder-racer-root)>main{background:var(--step4-bg);border-radius:12px}.approved-customer h1{color:var(--step4-ink)}.approved-order .wf-step[data-step]{color:var(--step-ink);background:var(--step-bg);border-top:4px solid var(--step-ink)}.approved-order .wf-step[data-step] .circle{background:var(--step-bg);color:var(--step-ink);border-color:var(--step-ink)}.approved-order .wf-step[data-step][aria-current] .circle{border-color:var(--step-ink)}.approved-order .wf-step[data-step].wf-done .circle{background:var(--step-ink);color:var(--step-bg)}.approved-order .wf-lane[data-step]{background:var(--step-bg);border-left-color:var(--step-ink)}.approved-order .wf-lane[data-step]>summary{background:var(--section-solid);color:var(--band-ink)}.approved-order .wf-lane[data-step]>summary :is(strong,small){color:inherit}.approved-list-row[data-step]{border-left:5px solid var(--row-ink);padding-left:16px}.approved-sidebar .nav-icon{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;background:var(--step1-bg);color:var(--step1-ink)}.approved-sidebar a[href^="/forms"] .nav-icon{background:var(--step4-bg);color:var(--step4-ink)}.approved-sidebar a[href="/brands"] .nav-icon{background:var(--step3-bg);color:var(--step3-ink)}.approved-sidebar a[href="/customers"] .nav-icon{background:var(--step5-bg);color:var(--step5-ink)}.approved-topbar .legend-link{flex-shrink:0;min-width:44px}.stat-tiles .staff{background:var(--staff-bg);color:var(--staff)}.stat-tiles .waiting{background:var(--waiting-bg);color:var(--waiting)}.stat-tiles .done{background:var(--done-bg);color:var(--done)}.builder-grid .primary,.generated-customer .primary{background:var(--staff);color:var(--surface);border-color:var(--staff)}.form-customer-confirmation{background:var(--done-bg);color:var(--done)}
@media(max-width:650px){.builder-grid{grid-template-columns:minmax(0,1fr)}.generated-customer{padding:16px}.builder-grid .semantic-panel{padding:16px}.library-row{align-items:flex-start}.approved-order .wf-step[data-step]{padding:8px 12px}.contact-editor{padding:16px}.stat-tiles{grid-template-columns:1fr}}
/* Meaning and person colors stay independent of the customer brand. */
.wf-chip.wf-done{background:var(--done-bg);color:var(--done);border-color:var(--done)}.wf-chip.wf-waiting{background:var(--waiting-bg);color:var(--waiting);border-color:var(--waiting)}.wf-chip.wf-staff{background:var(--staff-bg);color:var(--staff);border-color:var(--staff)}.wf-chip.wf-problem{background:var(--problem-bg);color:var(--problem);border-color:var(--problem)}.wf-chip.wf-future{background:var(--idle-bg);color:var(--idle);border-color:var(--idle)}.approved-order .wf-lane>summary .wf-who{background:var(--step1-bg);color:var(--people-staff);border-color:var(--people-staff)}.approved-order .wf-lane>summary .wf-who[data-person=coach]{background:var(--step2-bg);color:var(--people-coach);border-color:var(--people-coach)}.approved-order .wf-lane>summary .wf-who[data-person=racer]{background:var(--step4-bg);color:var(--people-racer);border-color:var(--people-racer)}
body.approved-staff{background:var(--step7-bg)}.approved-sidebar nav a.active{background:var(--step1-solid);color:var(--band-ink)}.approved-sidebar nav a.active[href^="/forms"]{background:var(--step4-solid)}.approved-sidebar nav a.active[href="/customers"]{background:var(--step5-solid)}.approved-sidebar nav a.active[href="/brands"]{background:var(--step3-solid)}
.approved-staff .primary,.approved-customer .primary,.builder-grid .primary,.generated-customer .primary{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}.approved-staff button:disabled,.approved-customer button:disabled{opacity:1;background:var(--idle-bg);color:var(--idle);border-color:var(--line);cursor:not-allowed}
.approved-list-row[data-step] .wf-progress-strip .wf-complete,[data-order][data-step] .wf-progress-strip .wf-complete{background:var(--row-ink)}.approved-list-row[data-step] .wf-progress-strip [aria-current=step],[data-order][data-step] .wf-progress-strip [aria-current=step]{background:var(--row-ink);border-color:var(--row-ink)}
#list-upload>details>summary{min-height:44px;min-width:44px;padding:10px 12px}
.approved-customer .confirmation.form-customer-confirmation{background:var(--done-bg);color:var(--done)}
.form-brand{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.form-brand img.brand-logo{width:144px;height:48px;object-fit:contain}
.form-brand>span{overflow-wrap:anywhere}
.approved-customer>main.customer{background:var(--step4-bg);border-radius:12px}.approved-customer>header.customer-brand{background:var(--surface);border-top:4px solid var(--brand);padding:16px;margin:24px auto 0;border-radius:12px}.roster-chase.chase-section{background:var(--problem-bg);border-left:5px solid var(--problem)}.roster-chase.chase-section>h3{background:var(--problem);color:var(--problem-bg);padding:12px;border-radius:8px}
.generated-customer *{min-width:0;overflow-wrap:anywhere}.generated-customer .size-buttons label{max-width:100%}
/* Nine/ten-size stories keep native radios in a wrapping tap grid. */
#generated-form .size-wrap-grid .size-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,72px),1fr));gap:8px}#generated-form .size-wrap-grid .size-option{min-width:44px;min-height:44px}