/* Тема: вхід учня за кодом (/test/join, views/beta-theme/test/join.php) — картка по центру, як у входу (auth.css) */
.tb-join-page { max-width: none; padding-top: clamp(16px, 5vh, 56px); padding-bottom: 48px; }
.tb-join { display: grid; justify-items: center; gap: 16px; width: 100%; }
.tb-join-card { width: min(480px, 100%); box-sizing: border-box; min-width: 0; padding: clamp(20px, 4vw, 32px); border-radius: 22px; background: #fff; border: 2px solid var(--line); box-shadow: 0 6px 0 var(--line); }
.tb-join-ico { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%; background: #fff8e1; color: var(--orange-d); }
.tb-join-ico svg { width: 28px; height: 28px; }
body.tb-chrome .tb-join-h1, .tb-join-h1 { margin: 0 0 6px; text-align: center; font: 800 clamp(22px, 3vw, 28px)/1.2 var(--f-display); color: var(--ink); }
.tb-join-sub { margin: 0 0 22px; text-align: center; font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.tb-join-note { width: min(480px, 100%); box-sizing: border-box; margin: 0; }
.tb-join-card .tb-join-note { width: auto; }
.tb-join-form { margin: 0; }
.tb-join-card .tb-label { margin: 0 0 8px; }
/* поле коду — розміри .tb-input-code (нормалізація .tb-embedded input[type=text] інакше робить його 46px/15px);
   колір рамки й тла не чіпаємо — стани (hover/focus/помилка) лишаються системними */
.tb-join input.tb-join-code { min-height: 76px; margin: 0; padding: 8px 12px; text-align: center; font: 800 34px/1 var(--f-display); letter-spacing: .18em; border-radius: 20px; }
.tb-join-errors { margin: 0 0 16px; }
.tb-join-errors div + div { margin-top: 4px; }
.tb-join-submit { margin: 4px 0 0; }
.tb-join-submit .tb-btn { width: 100%; }
.tb-join-submit .cf-loader-text { justify-content: center; padding: 8px 0 0; }
/* невидимий Turnstile — контейнер прихований, як у класиці (.field-joinform-turnstile { display: none }) */
.tb-join .tb-join-turnstile { display: none; }
.tb-join-wait { display: grid; gap: 16px; text-align: center; }
.tb-join-wait-title { margin: 0; font: 800 20px/1.2 var(--f-display); color: var(--ink); }
.tb-join-wait-img { display: block; width: 100%; height: auto; border-radius: 12px; }
.tb-join-hint { max-width: 480px; margin: 0; text-align: center; font-size: 13.5px; line-height: 1.5; color: var(--ink-3); }

@media (max-width: 640px) {
    .tb-join-page { padding-top: 12px; }
    .tb-join-ico { width: 56px; height: 56px; }
    .tb-join input.tb-join-code { min-height: 64px; font-size: 28px; }
}

/* «Ви увійшли як … Не ви? Вийти» — учень у своєму акаунті на naurok.ua (також views/test-beta/join.php) */
.tb-join-who { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2px 6px; margin: 0 0 18px; padding: 10px 14px; border-radius: 14px; background: #fff8e1; font-size: 14.5px; line-height: 1.45; color: var(--ink-2); text-align: center; }
.tb-join-who b { color: var(--ink); }
.tb-join-who .tb-join-who-out { min-height: 32px; padding: 4px 6px; border: 0; background: none; font: inherit; font-weight: 700; color: var(--orange-d); text-decoration: underline; cursor: pointer; }
.tb-join-who small { flex-basis: 100%; font-size: 13px; color: var(--ink-3); }