/* /Pages/Join.razor.rz.scp.css */
.join-page[b-8utn1t7m0a] { max-width: 70rem; margin-inline: auto; }
.join-intro[b-8utn1t7m0a] { max-width: 46rem; }
.join-eyebrow[b-8utn1t7m0a] { margin: 0 0 .4rem; color: var(--color-accent); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.join-intro h1[b-8utn1t7m0a] { margin: 0; font-size: clamp(2rem, 6vw, 3.5rem); line-height: 1.05; }
.join-intro > p:last-child[b-8utn1t7m0a] { color: var(--color-muted); font-size: 1.125rem; line-height: 1.65; }
.join-workspace[b-8utn1t7m0a] { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(20rem, .85fr); align-items: start; gap: 2rem; margin-top: 2rem; }
.preset-fieldset[b-8utn1t7m0a] { min-width: 0; margin: 0; padding: 0; border: 0; }
.preset-fieldset legend[b-8utn1t7m0a] { margin-bottom: .75rem; font-size: 1.35rem; font-weight: 800; }
.preset-grid[b-8utn1t7m0a] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.preset-card[b-8utn1t7m0a] { position: relative; display: flex; min-width: 0; min-height: 10.5rem; cursor: pointer; overflow: hidden; border: 2px solid var(--color-line); border-radius: .75rem; background: white; box-shadow: 0 .2rem .8rem rgb(23 33 43 / .08); }
.preset-card:hover[b-8utn1t7m0a] { border-color: var(--color-brand); }
.preset-card:has(input:focus-visible)[b-8utn1t7m0a] { outline: .2rem solid var(--color-focus); outline-offset: .2rem; }
.preset-card--selected[b-8utn1t7m0a] { border: 4px solid var(--color-accent); box-shadow: 0 0 0 2px white, 0 0 0 5px var(--color-accent); }
.preset-card input[b-8utn1t7m0a] { position: absolute; z-index: 1; top: .75rem; left: .75rem; width: 1.25rem; height: 1.25rem; accent-color: var(--color-accent); }
.preset-card picture[b-8utn1t7m0a] { flex: 0 0 42%; background: var(--color-line); }
.preset-card img[b-8utn1t7m0a] { display: block; width: 100%; height: 100%; object-fit: cover; }
.preset-copy[b-8utn1t7m0a] { display: flex; min-width: 0; flex: 1; flex-direction: column; padding: .85rem; }
.preset-name[b-8utn1t7m0a] { font-size: 1.25rem; font-weight: 800; }
.preset-description[b-8utn1t7m0a] { margin-top: .35rem; color: var(--color-muted); line-height: 1.45; }
.preset-selected[b-8utn1t7m0a] { margin-top: auto; padding-top: .7rem; font-weight: 800; }
.preview-column[b-8utn1t7m0a] { min-width: 0; }
.profile-preview[b-8utn1t7m0a] { overflow: hidden; border: 1px solid var(--color-line); border-radius: .75rem; background: white; }
.profile-photo[b-8utn1t7m0a] { aspect-ratio: 2 / 1; background: var(--color-line); }
.profile-photo img[b-8utn1t7m0a] { display: block; width: 100%; height: 100%; object-fit: cover; }
.profile-details[b-8utn1t7m0a] { padding: 1.25rem 1.25rem .4rem; }
.profile-details h2[b-8utn1t7m0a] { margin: .25rem 0; font-size: 1.75rem; }
.profile-details p[b-8utn1t7m0a] { margin: .25rem 0; color: var(--color-muted); }
.profile-count[b-8utn1t7m0a] { font-size: .875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.profile-controls[b-8utn1t7m0a] { display: flex; flex-wrap: wrap; gap: .6rem; padding: .5rem 1.25rem 1.25rem; }
.profile-controls button[b-8utn1t7m0a] { min-height: 2.75rem; border: 1px solid var(--color-brand); border-radius: .35rem; background: white; padding: .5rem .85rem; color: var(--color-brand); font-weight: 750; }
.profile-controls button:focus-visible[b-8utn1t7m0a] { outline: .2rem solid var(--color-focus); outline-offset: .15rem; }
.profile-controls button:disabled[b-8utn1t7m0a] { border-color: var(--color-line); color: var(--color-muted); }
.join-action[b-8utn1t7m0a] { margin-top: 1.25rem; }
.start-simulation[b-8utn1t7m0a] { display: inline-flex; min-height: 3rem; align-items: center; border-radius: .4rem; background: var(--color-brand); padding: .65rem 1.25rem; color: white; font-size: 1.1rem; font-weight: 800; text-decoration: none; }
.join-action p[b-8utn1t7m0a] { max-width: 43rem; color: var(--color-muted); line-height: 1.5; }
@media (max-width: 63.99rem) { .join-workspace[b-8utn1t7m0a] { grid-template-columns: 1fr; } .preset-card[b-8utn1t7m0a] { min-height: 0; flex-direction: column; } .preset-card picture[b-8utn1t7m0a] { flex: none; aspect-ratio: 16 / 9; } .profile-preview[b-8utn1t7m0a] { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); } .profile-photo[b-8utn1t7m0a] { grid-row: span 2; aspect-ratio: 4 / 3; } }
@media (max-width: 39.99rem) { .preset-grid[b-8utn1t7m0a] { grid-template-columns: 1fr; } .profile-preview[b-8utn1t7m0a] { display: block; } .profile-photo[b-8utn1t7m0a] { aspect-ratio: 4 / 3; } }
@media (forced-colors: active) { .preset-card[b-8utn1t7m0a] { border: 2px solid CanvasText; } .preset-card--selected[b-8utn1t7m0a] { border: 5px double Highlight; box-shadow: none; } .preset-card input[b-8utn1t7m0a] { accent-color: Highlight; } .start-simulation[b-8utn1t7m0a] { border: 2px solid ButtonText; } }