/* Preparing a match: scoped presentation, canonical controls and API preserved. */
.prepare-host { --text-main:#111318; --text-muted:#566274; }
body.prepare-active .social-mobile-header, body.prepare-active .social-bottom-nav { display:none; }
body.prepare-active.social-authenticated .app-container.prepare-host { padding-top:max(14px,env(safe-area-inset-top)); padding-bottom:24px; }
.prepare-screen { color:#111318; font:400 1rem/1.45 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; width:100%; min-width:0; max-width:880px; margin:auto; padding-bottom:max(24px,env(safe-area-inset-bottom)); }
.prepare-screen *, .prepare-sheet * { box-sizing:border-box; }
.prepare-screen .prepare-header { position:relative; display:flex; justify-content:center; padding:12px 52px 22px; margin:0; border:0; background:transparent; }
.prepare-header .brand { flex-direction:column; gap:8px; text-align:center; }
.prepare-header .brand { min-width:0; max-width:100%; }
.prepare-header .brand-badge { width:112px; height:auto; max-height:none; border-radius:8px; object-fit:contain; }
.prepare-header h1 { font:750 1.75rem/1.15 Inter,sans-serif; letter-spacing:-.8px; margin:0; }
.prepare-header #btn-cancel-top { position:absolute; left:0; top:24px; min-width:48px; min-height:48px; padding:8px; font-size:1rem; border:1px solid #e0e2e5; border-radius:14px; background:white; box-shadow:0 2px 6px #17202d10; }
.prepare-screen .prepare-card { background:#fff; color:#111318; border:1px solid #eef0f2; border-radius:22px; box-shadow:0 3px 16px #17202d08; padding:20px; margin:0 0 16px; }
.prepare-section-head { display:flex; align-items:flex-start; gap:12px; margin-bottom:18px; }
.prepare-section-head > div, .prepare-summary > div { min-width:0; overflow-wrap:anywhere; }
.prepare-header h1, .prepare-section-head h2 { overflow-wrap:anywhere; }
.prepare-section-icon { display:grid; place-items:center; flex:0 0 46px; height:46px; border-radius:50%; background:linear-gradient(135deg,#ff892e,#f16b0a); color:#fff; }
.prepare-section-head h2 { margin:0 0 3px; font:750 1.25rem/1.25 Inter,sans-serif; letter-spacing:-.4px; }
.prepare-section-head p { margin:0; color:#566274; font-size:1rem; line-height:1.45; }
.prepare-screen .form-group { margin:0 0 16px; }
.prepare-screen .form-group:last-child { margin-bottom:0; }
.prepare-screen .form-label { display:block; font:650 1rem/1.4 Inter,sans-serif; color:#566274; text-transform:uppercase; margin:0 0 8px; }
.prepare-screen .form-hint { display:block; font:400 1rem/1.4 Inter,sans-serif; margin:8px 0 0; color:#566274; }
.prepare-screen .alert-box { font-size:1rem; line-height:1.5; color:#9b1c31; background:#fff0f3; }
.prepare-screen [hidden] { display:none !important; }
.prepare-screen .prepare-choice, .prepare-screen .cp-trigger { width:100%; display:flex; align-items:center; gap:12px; min-height:76px; padding:12px; border:1px solid #d9dde2; background:#fafafa; border-radius:14px; color:#111318; text-align:left; font:600 1.125rem/1.3 Inter,sans-serif; cursor:pointer; }
.prepare-choice strong { flex:1; }
.prepare-choice-icon { display:grid; place-items:center; flex:0 0 44px; height:44px; border-radius:50%; color:#d95700; background:#fff0e3; }
.prepare-screen .cp-trigger { background:#fff7ef; border-color:#f47921; }
.prepare-screen .cp-copy strong { font-size:1.125rem; }
.prepare-screen .cp-copy small { font-size:1rem; color:#566274; }
.prepare-screen .cp-logo { width:48px; height:48px; }
.prepare-teams { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,7.5rem),1fr)); gap:12px; }
.prepare-teams .team-section { min-width:0; padding:10px; border-radius:16px; }
.prepare-team-a { background:#eaf5ff; --team:#0064d9; --team-line:#8bc0ff; }
.prepare-team-b { background:#fff0f3; --team:#d9003c; --team-line:#f7a5b9; }
.prepare-teams .team-header { margin:0 0 10px; color:var(--team); font:750 1.125rem/1.3 Inter,sans-serif; text-transform:uppercase; }
.prepare-teams .slots-grid { display:grid; grid-template-columns:1fr; gap:10px; }
.prepare-screen .prepare-slot { width:100%; min-width:0; min-height:112px; padding:10px; margin:0; border:1px dashed var(--team-line); border-radius:14px; background:#ffffffd9; color:var(--team); text-align:left; cursor:pointer; }
.prepare-screen .prepare-slot.filled { border:1px solid #f47921; background:#fff8f1; }
.prepare-slot-top { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px; margin-bottom:8px; }
.prepare-slot .slot-label { color:var(--team); font:750 1rem/1.3 Inter,sans-serif; }
.prepare-slot-badge { color:#9A3412; background:#ffead6; font:700 1rem/1.2 Inter,sans-serif; padding:5px 8px; border-radius:7px; }
.prepare-slot-badge { min-width:0; max-width:100%; overflow-wrap:anywhere; }
.prepare-teams .team-header { overflow-wrap:anywhere; }
.prepare-slot-main { display:flex; align-items:center; gap:10px; }
.prepare-slot-copy { flex:1; min-width:0; overflow-wrap:anywhere; }
.prepare-slot-copy strong { display:block; font:700 1.125rem/1.25 Inter,sans-serif; }
.prepare-slot.filled .prepare-slot-copy strong { color:#111318; }
.prepare-slot-copy small { display:block; font:400 1rem/1.35 Inter,sans-serif; color:#374151; margin-top:3px; }
.prepare-slot .avatar, .prepare-empty-avatar { width:44px; height:44px; flex:0 0 44px; border-radius:50%; }
.prepare-empty-avatar { background:color-mix(in srgb,var(--team) 9%,white); display:grid; place-items:center; }
.prepare-summary { display:flex; align-items:center; gap:12px; border:1px solid #d9dde2; border-radius:14px; background:#fff; padding:14px; margin-bottom:12px; }
.prepare-summary > svg { color:#dc620d; flex-shrink:0; }
.prepare-summary span { display:block; text-transform:uppercase; color:#374151; font-size:1rem; font-weight:700; }
.prepare-summary strong { display:block; font-size:1.125rem; }
.prepare-summary small { display:block; color:#374151; font-size:1rem; }
.prepare-actions { display:grid; gap:10px; }
.prepare-actions .btn-primary, .prepare-sheet .btn-primary { min-height:56px; padding:14px; background:linear-gradient(110deg,#f36c0b,#ee741b); color:#111; border:0; border-radius:14px; font:750 1.125rem/1.35 Inter,sans-serif; text-transform:none; }
.prepare-actions .btn-primary:disabled { background:#e4e7eb; color:#59616e; opacity:1; cursor:not-allowed; }
.prepare-actions .btn-ghost { min-height:48px; border:1px solid #d9dde2; border-radius:12px; font:600 1rem/1.4 Inter,sans-serif; color:#566274; background:#fff; }
.prepare-sheet { position:fixed; inset:auto 0 0; width:min(100%,700px); max-width:100%; height:94dvh; max-height:100dvh; margin:0 auto; padding:0; border:0; border-radius:26px 26px 0 0; background:#fff; color:#111318; overflow:hidden; font:400 1rem/1.45 Inter,sans-serif; box-shadow:0 -10px 60px #0002; }
.prepare-sheet[open] { display:flex; flex-direction:column; }
.prepare-sheet::backdrop { background:#0009; }
.prepare-handle { width:52px; height:5px; border-radius:5px; background:#d3d5d9; margin:12px auto 0; flex-shrink:0; }
.prepare-sheet header { display:flex; align-items:center; gap:12px; padding:20px; flex-shrink:0; }
.prepare-sheet h2 { margin:0; flex:1; font:750 1.625rem/1.2 Inter,sans-serif; letter-spacing:-.7px; }
.prepare-close { flex:0 0 48px; width:48px; height:48px; border:1px solid #e0e2e5; border-radius:14px; background:#fff; color:#354052; display:grid; place-items:center; cursor:pointer; }
.prepare-tabs { display:flex; margin:0 20px 18px; padding:3px; background:#f0f2f4; border-radius:12px; flex-shrink:0; }
.prepare-tabs button { flex:1; min-height:52px; border:0; border-radius:10px; background:transparent; color:#4b5870; font:750 1.125rem/1.3 Inter,sans-serif; cursor:pointer; }
.prepare-tabs button[aria-selected="true"] { background:#f67515; color:#111; }
.prepare-sheet-scroll { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding:0 20px max(24px,env(safe-area-inset-bottom)); scroll-padding:16px; }
.prepare-sheet h3 { margin:22px 0 12px; font:750 1.25rem/1.3 Inter,sans-serif; color:#354052; }
.prepare-search { display:flex; align-items:center; gap:10px; padding:0 14px; min-height:60px; border:1px solid #d9dde2; border-radius:14px; background:#fafafa; color:#db620c; }
.prepare-search input { min-width:0; flex:1; width:100%; min-height:58px; border:0; outline:none; background:transparent; color:#111318; font:400 1rem/1.4 Inter,sans-serif; }
.prepare-search:focus-within { outline:3px solid #dc620d; outline-offset:2px; }
.prepare-sheet .prepare-result { display:flex; gap:12px; align-items:center; width:100%; min-height:80px; padding:12px; margin:0 0 10px; border:1px solid #e0e2e5; border-radius:14px; background:#fff; color:#111318; text-align:left; cursor:pointer; }
.prepare-result .avatar { flex:0 0 52px; width:52px; height:52px; }
.prepare-result-copy { flex:1; min-width:0; overflow-wrap:anywhere; }
.prepare-result strong { font:700 1.125rem/1.3 Inter,sans-serif; }
.prepare-result small { display:block; color:#566274; font:400 1rem/1.4 Inter,sans-serif; margin-top:3px; }
.prepare-result-mark { margin-left:auto; flex:0 0 32px; text-align:center; font-size:1.625rem; }
.prepare-sheet .prepare-result.selected { border-color:#f47921; background:#fff4e9; }
.prepare-result.selected .prepare-result-mark { background:#f47921; border-radius:50%; color:#111; }
.prepare-sheet p, .prepare-sheet label { font-size:1rem; color:#566274; }
.prepare-sheet #form-guest { display:grid; gap:16px; }
.prepare-sheet .form-input { font:400 1.125rem/1.4 Inter,sans-serif; min-height:56px; color:#111; background:#fafafa; border:1px solid #d9dde2; }
.prepare-retry { min-height:48px; font-size:1.125rem; padding:10px 20px; border:1px solid #d9dde2; border-radius:12px; background:#fff; color:#111; }
.prepare-screen button:focus-visible, .prepare-sheet button:focus-visible, .prepare-sheet input:focus-visible { outline:3px solid #b34700; outline-offset:3px; }
.cp-sheet.prepare-club-sheet { height:94dvh; font-size:1rem; }
.prepare-club-sheet .cp-header h2 { font-size:1.625rem; }
.prepare-club-sheet .cp-close { width:48px; height:48px; }
.prepare-club-sheet .cp-search input { min-height:60px; font-size:1rem; }
.prepare-club-sheet .cp-list h3 { font-size:1.25rem; }
.prepare-club-sheet .cp-copy strong { font-size:1.125rem; white-space:normal; }
.prepare-club-sheet .cp-copy small, .prepare-club-sheet .cp-message, .prepare-club-sheet .cp-all { font-size:1rem; }
.prepare-club-sheet .cp-star { min-width:48px; min-height:48px; }
.prepare-club-sheet .cp-row { min-height:88px; }
@media(max-width:540px) {
  .prepare-screen .prepare-card { padding:16px; }
  .prepare-teams { gap:10px; }
  .prepare-teams .team-section { padding:8px; }
  .prepare-slot-main { flex-wrap:wrap; gap:6px; }
  .prepare-slot-main > .prepare-slot-copy { flex-basis:calc(100% - 10px); }
  .prepare-slot-main > span:last-child:not(.prepare-slot-copy) { display:none; }
  .prepare-slot-copy strong { font-size:1.125rem; }
  .prepare-slot .avatar, .prepare-empty-avatar { width:40px; height:40px; flex-basis:40px; }
}
@media(prefers-reduced-motion:reduce) { .prepare-screen *, .prepare-sheet * { animation:none !important; transition:none !important; } }
.prepare-screen .form-input, .prepare-sheet .form-input, .prepare-search { border-color:#6B7280; }
.prepare-search input::placeholder { color:#5B6572; opacity:1; }
.prepare-tabs { flex-wrap:wrap; }
.prepare-tabs button { flex:1 1 8rem; min-width:0; height:auto; padding:12px 8px; white-space:normal; overflow-wrap:anywhere; }