/* Keep this component in px: legacy pages alter the root rem size at runtime. */
.mobile-account-slot { display: inline-flex; align-items: center; justify-content: center; min-width: 52px; }
.mobile-account-slot .mobile-login-button, .mobile-account-slot .mobile-account-name { box-sizing: border-box; display: block; width: 52px; height: 30px; padding: 0 5px; overflow: hidden; border: 1px solid #1769aa; border-radius: 15px; background: #fff; color: #1769aa; font-size: 13px; line-height: 28px; text-align: center; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.mobile-account-slot .mobile-account-name { border-color: #d9e1e8; color: #334e68; }
.mobile-auth-header-ready { padding-right: 72px !important; }
.mobile-auth-header-ready .mobile-account-slot { position: absolute; top: 50%; right: 12px; transform: translateY(-50%); }
.idx_top .head { justify-content: flex-start; }
.idx_top .head .logo { flex: none; }
.idx_top .head .fz { flex: 1; min-width: 0; margin-left: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.idx_top .head .mobile-account-slot { flex: none; margin-left: 10px; }
.lb_top .head .school-name { display: block; padding-right: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lb_top .head .mobile-account-slot { position: absolute; top: 50%; right: 46px; transform: translateY(-50%); }
.mobile-footer-account { padding: 18px 12px 4px; text-align: center; }
.mobile-footer-account .mobile-account-slot .mobile-login-button, .mobile-footer-account .mobile-account-slot .mobile-account-name { width: 96px; }
.mobile-auth-mask { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100; background: rgba(15, 23, 42, .48); }
.mobile-auth-dialog { box-sizing: border-box; position: fixed; z-index: 101; top: 50%; left: 16px; right: 16px; width: auto; max-width: 420px; max-height: calc(100vh - 32px); margin: 0 auto; padding: 24px 20px 18px; overflow-y: auto; transform: translateY(-50%); border-radius: 8px; background: #fff; box-shadow: 0 18px 50px rgba(15, 23, 42, .26); }
.mobile-auth-dialog h2 { margin: 0 0 20px; color: #173a5e; font-size: 20px; font-weight: 600; line-height: 28px; text-align: center; }
.mobile-auth-close { position: absolute; top: 6px; right: 8px; width: 38px; height: 38px; border: 0; background: transparent; color: #7b8794; font-size: 28px; line-height: 36px; }
.mobile-auth-tabs { display: flex; margin-bottom: 16px; border-bottom: 1px solid #e6eaf0; }
.mobile-auth-tabs button { flex: 1; height: 42px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #64748b; font-size: 15px; }
.mobile-auth-tabs button.active { border-bottom-color: #1f6fb2; color: #1f6fb2; font-weight: 600; }
.mobile-auth-dialog label { display: block; margin-top: 13px; color: #475569; font-size: 14px; line-height: 20px; }
.mobile-auth-dialog input { box-sizing: border-box; display: block; width: 100%; height: 42px; margin-top: 7px; padding: 0 11px; border: 1px solid #d9e1e8; border-radius: 5px; color: #1f2933; font-size: 16px; }
.mobile-auth-code { display: flex; gap: 8px; }
.mobile-auth-code input { min-width: 0; margin-top: 7px; }
.mobile-auth-code button { flex: none; width: 106px; height: 42px; margin-top: 7px; border: 1px solid #1f6fb2; border-radius: 5px; background: #fff; color: #1f6fb2; font-size: 13px; }
.mobile-auth-code button:disabled { border-color: #cbd5e1; color: #94a3b8; }
.mobile-auth-submit { width: 100%; height: 44px; margin-top: 20px; border: 0; border-radius: 5px; background: #1f6fb2; color: #fff; font-size: 16px; }
.mobile-auth-feedback { min-height: 19px; margin: 0; color: #b42318; font-size: 13px; line-height: 19px; }
.mobile-auth-feedback.success { color: #226842; }
.mobile-auth-links { display: flex; justify-content: space-between; margin-top: 16px; }
.mobile-auth-links a { color: #526f8d; font-size: 13px; text-decoration: none; }
.mobile-review-box { margin: 16px 12px; padding: 16px; border: 1px solid #e2e8f0; border-radius: 6px; background: #fff; }
.mobile-review-open { width: 100%; height: 42px; border: 1px solid #1f6fb2; border-radius: 5px; background: #fff; color: #1f6fb2; font-size: 15px; }
.mobile-review-form { margin-top: 14px; }
.mobile-review-form textarea { box-sizing: border-box; width: 100%; min-height: 106px; padding: 10px; border: 1px solid #d9e1e8; border-radius: 5px; font-size: 15px; line-height: 22px; }
.mobile-review-form .mobile-review-score { display: flex; gap: 8px; margin: 12px 0; }
.mobile-review-form .mobile-review-score label { flex: 1; color: #52606d; font-size: 12px; text-align: center; }
.mobile-review-form select { width: 100%; height: 36px; margin-top: 6px; border: 1px solid #d9e1e8; border-radius: 5px; background: #fff; font-size: 14px; }
.mobile-review-form button { width: 100%; height: 40px; border: 0; border-radius: 5px; background: #1f6fb2; color: #fff; font-size: 15px; }
@media (max-width: 350px) { .mobile-auth-dialog { left: 10px; right: 10px; padding-left: 16px; padding-right: 16px; } }
