/* /teams/start and /join (built by web-v2-tools/build_team_flows.py). v2 tokens; the seat stepper comes from teams-page.css. */
main.tf{display:block}
.tf-sec{padding:clamp(56px,9vw,104px) 0 clamp(80px,10vw,128px);text-align:center}
.tf-narrow{max-width:600px}
.tf-sec .v-sub{margin-left:auto;margin-right:auto;max-width:40ch}
.tf-card{display:grid;gap:18px;margin:36px auto 0;padding:32px 28px;border-radius:28px;text-align:left;background:var(--v-card);box-shadow:var(--v-cardline),var(--v-shadow)}
.tf-card[hidden]{display:none}
.tf-field{display:grid;gap:8px;font-size:14px;font-weight:600;color:var(--v-soft)}
.tf-field input:not([type=number]),.tf-field select{height:52px;padding:0 16px;border-radius:14px;border:1px solid rgba(20,24,32,.12);background:var(--v-paper);
  font:500 16px/1 var(--v-sans);color:var(--v-ink);transition:border-color .2s,box-shadow .2s}
.tf-field input:focus,.tf-field select:focus{outline:none;border-color:var(--v-vink);box-shadow:0 0 0 4px var(--v-vsoft)}
.tf-field .tp-stepper{justify-self:start}
.tf-total{display:flex;align-items:baseline;gap:8px;padding:16px 0 4px;border-top:1px solid var(--v-line)}
.tf-total span{flex:1;font-weight:600;color:var(--v-soft)}
.tf-total b{font-size:30px;font-weight:600;letter-spacing:-.03em}
.tf-total small{color:var(--v-mute)}
.tf-msg{margin:0;min-height:1.3em;font-size:15px;text-align:center;color:var(--v-mute)}
.tf-msg.is-err{color:#B4232C}
.tf-h{margin:0;font-size:clamp(1.6rem,5vw,2.2rem);font-weight:600;letter-spacing:-.03em;line-height:1.1}
.tf-lead{margin:0;color:var(--v-soft);font-size:17px}
.tf-points{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:11px}
.tf-points li{position:relative;padding-left:28px;font-size:15.5px;line-height:1.45;color:var(--v-soft)}
.tf-points li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:50%;background:var(--v-vsoft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237B5CC6' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
.tf-actions{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}
.tf-actions[hidden]{display:none}
.tf-state h2{margin:0;font-size:22px;font-weight:600;letter-spacing:-.02em}
.tf-state p{margin:0;color:var(--v-soft)}
.tf-state .v-btn{justify-self:start}