.onboarding { max-width: 34rem; margin: 2rem auto; padding: 0 .6rem; }
.onboarding h1 { letter-spacing: -.035em; }
.onboarding .join { max-width: none; margin: 1.5rem 0; }
.onboarding form { display: flex; flex-direction: column; gap: .65rem; }
.onboarding input, .onboarding select { width: 100%; min-height: 46px; font: inherit; }
.onboarding label { display: block; margin-top: .45rem; }
.auth-link { display: flex; justify-content: center; align-items: center; min-height: 48px; border: 1px solid var(--line); border-radius: .65rem; padding: .6rem; }
/* Entry pages use the same typography and quiet blue as the diary. */
.entry-eyebrow { font-size:10px;letter-spacing:.12em;color:var(--muted);margin:0 0 18px; }
.welcome-screen { display:grid;grid-template-columns:1fr 1.07fr;align-items:center;gap:70px;min-height:calc(100vh - 180px);padding:44px 0 70px; }
.welcome-intro { min-width:0; }
.welcome-intro h1 { font-size:clamp(36px,3.7vw,51px);line-height:1.13;letter-spacing:-2.3px;margin:0 0 22px;font-weight:600; }
.welcome-description { font-size:15px;line-height:1.8;color:var(--muted);margin:0 0 30px; }
.welcome-actions { display:grid;gap:10px;max-width:354px; }
.entry-primary,.entry-secondary { width:100%;min-height:50px;font-size:13px;font-weight:550;border-radius:9px;gap:10px; }
.entry-primary { background:var(--accent);color:#fff; }
.entry-secondary { color:var(--fg);background:#fff;border:1px solid var(--line); }
.entry-secondary:hover { color:var(--accent);background:#fff;border-color:var(--line-strong); }
.entry-secondary .icon { width:15px;height:15px;color:var(--muted); }
.esia-symbol { width:30px;height:30px;flex-shrink:0;object-fit:contain;background:#fff;border-radius:6px;padding:3px; }
.entry-caption { font-size:11px;line-height:1.7;color:var(--muted);margin:18px 0 0; }
.welcome-preview { background:#fff;border:1px solid var(--line);border-radius:16px;padding:27px 28px 16px;box-shadow:0 18px 50px #29385808;min-width:0; }
.preview-topline { display:flex;justify-content:space-between;color:var(--muted);font-size:9px;letter-spacing:.1em; }
.preview-topline span:last-child { color:var(--accent);font-weight:600; }
.welcome-preview h2 { font-size:21px;letter-spacing:-.7px;margin:19px 0 23px;line-height:1.35; }
.preview-week { display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin:0 0 25px; }
.preview-week span { display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 0 11px;font-size:9px;color:var(--muted);border-radius:8px; }
.preview-week b { font-size:20px;font-weight:550;color:var(--accent); }
.preview-week .selected { background:var(--accent-soft);color:var(--accent); }
.preview-week .weekend b { color:#a6afbb; }
.preview-lesson { display:flex;align-items:start;gap:19px;border-top:1px solid var(--line);padding:17px 0; }
.preview-lesson time { color:var(--muted);font-size:10px;padding-top:3px;font-variant-numeric:tabular-nums; }
.preview-lesson > div { flex:1; }
.preview-lesson h3 { margin:0 0 5px;font-size:12px;letter-spacing:0; }
.preview-lesson p { font-size:11px;color:var(--muted-strong);margin:0; }
.preview-lesson .preview-empty { color:#8b95a4; }
.preview-pencil { color:#9aa5b6;padding-top:2px; }
.preview-pencil .icon { width:13px;height:13px; }
.preview-caption { padding-top:10px;border-top:1px solid var(--line);color:var(--muted);font-size:9px;margin:0;text-align:center; }
.entry-back { display:inline-flex;align-items:center;gap:4px;min-height:44px;color:var(--muted);font-size:12px;margin:0 0 18px -6px; }
.entry-back .icon { width:16px;height:16px; }
.guest-onboarding { max-width:414px;margin:10px auto 40px; }
.guest-onboarding h1 { font-size:30px;letter-spacing:-1.1px;line-height:1.25;margin:0 0 12px; }
.entry-description { margin:0 0 27px;color:var(--muted);font-size:14px;line-height:1.7; }
#guest-form { display:flex;flex-direction:column;gap:19px; }
.entry-field { min-width:0; }
.entry-field label { display:flex;justify-content:space-between;gap:8px;margin:0 0 7px;color:var(--muted-strong);font-size:12px; }
.entry-field label span { color:#8a93a1;font-size:11px; }
.entry-field input,.entry-field select { width:100%;min-height:48px;border:1px solid var(--line-strong);border-radius:8px;background:#fff;padding:11px 13px;color:var(--fg);font-size:14px; }
.entry-field input::placeholder { color:#929ba8; }
.entry-field input[type=search]::-webkit-search-cancel-button { cursor:pointer; }
.entry-picker { position:relative; }
.entry-options { position:absolute;top:calc(100% + 5px);left:0;width:100%;max-height:252px;overflow:auto;z-index:10;border:1px solid var(--line);border-radius:9px;background:#fff;box-shadow:0 8px 24px #20273312;padding:5px; }
.entry-options [role=option] { min-height:44px;padding:10px;border-radius:5px;font-size:13px;cursor:pointer;overflow-wrap:anywhere; }
.entry-options [role=option].is-active,.entry-options [role=option]:hover { background:var(--accent-soft);color:var(--accent); }
.entry-options [aria-selected=true] { font-weight:600; }
.picker-empty { margin:8px;color:var(--muted);font-size:12px; }
#guest-groups { display:grid;gap:16px; }
#guest-groups:empty { display:none; }
#guest-status { margin:0;font-size:12px;color:var(--danger); }
#guest-status:empty { display:none; }
.guest-empty { padding-top:12px; }
.guest-empty > .icon { color:var(--accent);width:26px;height:26px; }
.guest-empty h2 { font-size:19px;margin:12px 0; }
.guest-empty p { font-size:13px;color:var(--muted);margin-bottom:24px; }
/* The provider form remains visibly inside Telos, with a persistent bridge disclosure. */
.auth-layout { width:100%;max-width:440px;margin:12px auto 24px; }
.auth-card { padding:32px 39px 28px;background:#fff;border:1px solid var(--line);border-radius:16px; }
.esia-wordmark { text-align:center;line-height:1; }
.esia-wordmark img { width:72px;height:80px;object-fit:contain; }
.auth-connection { text-align:center;font-size:10px;color:var(--muted);margin:8px 0 30px; }
#remote-controls h1 { font-size:24px;line-height:1.3;letter-spacing:-.7px;font-weight:600;margin:0 0 12px;text-align:center; }
.esia-form { display:flex;flex-direction:column;gap:20px; }
.esia-field label,.esia-form > label { display:block;font-size:12px;margin:0 0 8px;color:var(--fg); }
.esia-field input { width:100%;min-height:50px;border:1px solid transparent;background:#f5f6fa;border-radius:7px;font-size:15px;padding:12px; }
.esia-field input:focus { background:#fff; }
.esia-password { position:relative; }
.esia-password input { padding-right:80px; }
.password-reveal { position:absolute;right:2px;top:3px;min-height:44px;min-width:68px;padding:6px 8px;color:var(--muted);background:transparent;font-size:10px;font-weight:450; }
.password-reveal:hover { background:transparent;color:var(--accent); }
.esia-submit { width:100%;min-height:50px;margin-top:7px;background:#1752df;border-radius:7px;font-size:14px;font-weight:500; }
.esia-submit:hover { background:#1649c8; }
.esia-form .esia-prompt { font-size:13px;text-align:center;line-height:1.75;color:var(--muted-strong);margin:-12px 0 7px; }
.esia-prompt strong { color:var(--fg);font-weight:550; }
.esia-form:has(.otp-entry) { gap:0; }
.esia-form:has(.otp-entry) > label { margin-top:20px; }
.otp-entry { position:relative;width:100%;height:54px; }
.otp-entry input { position:absolute;inset:0;width:100%;height:100%;min-height:54px;opacity:0;cursor:text;font-size:20px; }
.otp-slots { display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:7px;height:54px; }
.otp-slots span { display:flex;justify-content:center;align-items:center;background:#f5f6fa;border:1px solid transparent;border-radius:7px;font-size:23px;font-weight:450;font-variant-numeric:tabular-nums; }
.otp-entry:focus-within .is-current { border-color:#1752df;box-shadow:0 0 0 2px #1752df12;background:#fff; }
.otp-hint { margin:12px 0 0;text-align:center;color:var(--muted);font-size:10px; }
.otp-countdown { margin:23px 0 0;text-align:center;color:var(--muted);font-size:12px; }
.otp-countdown:empty { display:none; }
.esia-text-button { margin:14px auto 0;min-height:44px;padding:8px;color:#1752df;background:transparent;font-size:12px;font-weight:450; }
.esia-text-button:hover { background:var(--accent-soft); }
.auth-layout #auth-status { margin:18px 0 0;text-align:center;color:var(--danger);font-size:12px;line-height:1.7; }
.auth-layout #auth-status:empty { display:none; }
.auth-layout.is-pending #auth-status { color:var(--muted); }
.auth-layout #auth-start { width:100%;margin-top:18px; }
.auth-layout .auth-cancel { display:flex;align-items:center;justify-content:center;gap:4px;margin:12px auto 14px;background:transparent;border:0;min-height:44px;padding:5px 12px;color:var(--muted);font-size:12px;font-weight:450; }
.auth-cancel .icon { width:15px;height:15px; }
.auth-disclosure { margin:9px auto;color:#788291;font-size:10px;line-height:1.75;text-align:center;max-width:392px; }
.auth-loading { min-height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center; }
.auth-loading .entry-spinner { width:26px;height:26px;margin:0 0 22px;color:var(--accent); }
.auth-loading h1 { font-size:21px;letter-spacing:-.55px;line-height:1.35;margin:0 0 10px; }
.auth-loading p { margin:0;font-size:12px;line-height:1.7;color:var(--muted); }
.pupil-choices { display:grid;gap:9px;margin-top:22px; }
.pupil-choice { display:flex;justify-content:space-between;width:100%;min-height:50px;padding:12px 15px;text-align:left;font-size:13px;background:var(--accent-soft);color:var(--accent); }
.pupil-choice:hover { background:#e3eafb; }
.pupil-choice::after { content:'›';font-size:21px;line-height:1; }
#remote-controls > p { text-align:center;font-size:13px;color:var(--muted); }
.entry-spinner { display:inline-block;width:16px;height:16px;flex:0 0 auto;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:entry-spin .7s linear infinite; }
@keyframes entry-spin { to { transform:rotate(360deg); } }
@media(max-width:900px) {
  .welcome-screen { gap:35px;grid-template-columns:1fr 1fr; }
  .welcome-intro h1 { font-size:39px;letter-spacing:-1.8px; }
  .welcome-description { font-size:13px; }
  .welcome-preview { padding:23px 20px 16px; }
  .welcome-preview h2 { font-size:19px; }
  .preview-week span { font-size:8px; }
}
@media(max-width:700px), (max-width:1000px) and (pointer:coarse) {
  .welcome-screen { display:block;min-height:auto;padding:54px 0 28px;max-width:420px;margin:auto; }
  .welcome-intro h1 { font-size:41px; }
  .welcome-description { font-size:14px; }
  .welcome-actions { max-width:none; }
  .welcome-preview { display:none; }
  .entry-eyebrow { font-size:9px;letter-spacing:.1em; }
  .guest-onboarding { margin:0 auto 24px; }
  .auth-layout { margin:12px auto 20px; }
  .auth-card { padding:30px 25px 24px;border-radius:13px; }
  .auth-disclosure { font-size:10px;padding:0 5px; }
  .entry-field input,.entry-field select { font-size:16px; }
  .esia-field input { font-size:16px; }
}
@media(prefers-reduced-motion:reduce){.entry-spinner{animation:none;border-style:dotted;}}

/* Grades: one quiet, aligned reading surface. */
.onboarding.grades-page { max-width:68rem; }
.grades-page h1 { margin:0;font-size:32px;letter-spacing:-.045em;line-height:1.2; }
.grades-heading { display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 26px; }
.grades-tools { display:flex;align-items:center;gap:6px; }
.grades-tools button,.grade-settings > summary { display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 10px;border:0;background:transparent;color:var(--muted-strong);font-size:12px; }
.grades-tools .icon { width:17px;height:17px; }
.grade-settings { position:relative; }
.grade-settings > summary { width:36px;list-style:none;cursor:pointer;border-radius:7px; }
.grade-settings > summary::-webkit-details-marker { display:none; }
.grade-settings-menu { position:absolute;right:0;top:44px;z-index:5;width:254px;padding:8px;border:1px solid var(--line);border-radius:10px;background:var(--paper);box-shadow:0 8px 28px #20273310; }
.grade-settings-menu p { margin:6px 8px;color:var(--muted);font-size:11px; }
.grade-settings-menu a,.grade-settings-menu button { display:flex;width:100%;justify-content:start;min-height:40px;padding:9px 8px;font-size:12px; }
.grade-settings-menu button { color:var(--danger); }
.grades-page .grade-filters { display:flex;flex-direction:row;align-items:end;flex-wrap:wrap;gap:10px;margin:0 0 24px; }
.grade-filters > div { width:206px;max-width:100%; }
.grades-page .grade-filters label { display:block;margin:0 0 5px;color:var(--muted);font-size:11px; }
.grades-page .grade-filters select { width:100%;min-height:38px;height:38px;padding:7px 30px 7px 11px;font-size:13px;border-color:var(--line);border-radius:7px;background-color:#fff; }
.grades-page .grade-filters button { min-height:38px;padding:7px 13px;font-size:12px;border-color:var(--line); }
.grades-page #diary-status:empty { display:none; }
.grades-page #diary-status,.grades-page #grade-history-upgrade { margin:0 0 16px;font-size:12px;color:var(--muted); }
.grades-table { width:100%;table-layout:fixed;border-collapse:collapse; }
.grades-subject-col { width:25%; }
.grades-average-col { width:112px; }
.grades-table th,.grades-table td { padding:16px 0;border-bottom:1px solid var(--line);vertical-align:middle; }
.grades-table thead th { padding:0 0 11px;color:var(--muted);font-size:10px;font-weight:450;letter-spacing:.065em;text-transform:uppercase;text-align:left; }
.grades-table thead .grade-average-heading { text-align:right;letter-spacing:0;text-transform:none;font-size:12px; }
.grade-average-heading small { display:block;margin-top:2px;font-size:10px;color:var(--muted);font-weight:400; }
.grades-table tbody th { padding-right:22px;text-align:left;font-size:14px;font-weight:550;overflow-wrap:anywhere; }
.grades-table td:nth-child(2) { padding-right:24px; }
.grades-table .grade-average { text-align:right;font-size:18px;font-weight:600;letter-spacing:-.025em;font-variant-numeric:tabular-nums; }
.grade-chips { display:flex;flex-wrap:wrap;gap:6px; }
.grade-chip { position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;min-width:36px;width:36px;height:36px;min-height:36px;padding:0;border:1px solid transparent;border-radius:7px;color:var(--muted-strong);background:#f0f2f5;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums; }
.grade-chip > span { max-width:100%;overflow-wrap:anywhere;line-height:1; }
.grade-chip:has(sup) > span { transform:translate(-3px,3px); }
.grade-chip sup { position:absolute;right:3px;top:4px;font-size:8px;line-height:1;font-weight:550; }
.grade-chip.grade-good { color:#3459c7;background:#edf1fd; }
.grade-chip.grade-middle { color:#926018;background:#fcf3df; }
.grade-chip.grade-low { color:#b44249;background:#fceced; }
.grade-chip:hover { border-color:currentColor;filter:brightness(.98); }
.grade-detail { width:min(320px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;padding:22px;border:1px solid var(--line);border-radius:12px;color:var(--fg);background:var(--paper);box-shadow:0 12px 60px #20273320;font-size:13px; }
.grade-detail::backdrop { background:#20273318; }
.grade-detail h2 { margin:0 0 4px;font-size:17px;line-height:1.4; }
.grade-detail p { margin:12px 0;white-space:pre-wrap;overflow-wrap:anywhere; }
.grade-detail .grade-detail-date { margin:0;color:var(--muted);font-size:12px; }
.grade-detail dl { display:flex;gap:36px;padding:14px 0;margin:14px 0;border-block:1px solid var(--line); }
.grade-detail dt { color:var(--muted);font-size:11px; }
.grade-detail dd { margin:3px 0 0;font-size:20px;font-weight:600; }
.grade-detail-work { font-weight:550; }
.grade-detail button { margin-top:6px;width:100%;min-height:36px;font-size:12px; }
.grades-empty { padding:42px 0 !important;color:var(--muted);font-size:14px;text-align:center; }
.grades-empty .auth-link { display:inline-flex;margin-top:8px;padding-inline:20px; }
@media(max-width:700px), (max-width:1000px) and (pointer:coarse) {
  .grades-page h1 { font-size:28px; }
  .grades-heading { margin-bottom:22px; }
  .grades-tools button,.grade-settings > summary { min-height:44px; }
  .grades-tools button span { display:none; }
  .grade-filters > div { flex:1;min-width:115px; }
  .grades-page .grade-filters select,.grades-page .grade-filters button { min-height:44px;height:44px; }
  .grades-subject-col { width:28%; }
  .grades-average-col { width:64px; }
  .grades-table tbody th { padding-right:12px;font-size:12px; }
  .grades-table td:nth-child(2) { padding-right:10px; }
  .grades-table .grade-average { font-size:16px; }
  .grades-table thead .grade-average-heading { font-size:11px; }
  .grade-chip { width:44px;min-width:44px;flex-basis:44px;height:44px;min-height:44px; }
  .grade-chips { gap:6px; }
}
.regular-timetable { margin: 1.5rem 0 2.5rem; }
.regular-week { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,19rem),1fr)); gap: 1rem; }
.regular-week > section { border: 1px solid var(--line); border-radius: .7rem; padding: 1rem; background: var(--paper); }
.regular-week h3 { margin-top: 0; }
.regular-week ol { margin: 0; padding-left: 1.4rem; }
.regular-week li { padding: .35rem 0; }
.regular-week time { color: var(--muted); font-variant-numeric: tabular-nums; margin-right: .4rem; }
.entry-picker:not(:focus-within)::after { content:'⌄';position:absolute;right:14px;top:9px;color:var(--muted);font-size:18px;pointer-events:none; }
.entry-picker input { padding-right:34px; }
.auth-layout.is-pending #auth-status:not(:empty)::before { content:'';display:inline-block;width:12px;height:12px;margin-right:7px;vertical-align:-2px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:entry-spin .7s linear infinite; }
@media(prefers-reduced-motion:reduce){.auth-layout.is-pending #auth-status::before{animation:none;border-style:dotted;}}
/* Phone entry and grades layouts; desktop table and entry composition are unchanged. */
.grade-filter-apply > .icon { display:none; }
@media(max-width:700px), (max-width:1000px) and (pointer:coarse) {
  .welcome-intro { text-align:center; }
  .welcome-screen { padding-top:26px; }
  .welcome-intro h1 { font-size:36px;line-height:1.15;letter-spacing:-1.5px; }
  .welcome-description { font-size:13px;line-height:1.7; }
  .auth-welcome main { padding:0 0 30px; }
  .auth-layout { max-width:none;margin:0 auto 20px; }
  .auth-card { padding:26px 20px 24px;border-left:0;border-right:0;border-radius:0; }
  .auth-disclosure { padding:0 20px;font-size:11px;max-width:440px; }
  .grades-page h1 { font-size:24px; }
  .grades-heading { margin-bottom:14px; }
  .grades-page .grade-filters { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px;gap:8px;align-items:end;margin-bottom:14px; }
  .grade-filters > div { width:auto;min-width:0;max-width:100%; }
  .grades-page .grade-filters select { padding:8px;font-size:12px; }
  .grades-page .grade-filters .grade-filter-apply { width:44px;min-width:44px;padding:10px; }
  .grade-filter-apply > span { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
  .grade-filter-apply > .icon { display:block;width:18px;height:18px; }
  .grades-table { display:block; }
  .grades-table colgroup { display:none; }
  .grades-table thead { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
  .grades-table tbody { display:block; }
  .grades-table tbody tr { display:grid;grid-template-columns:minmax(0,1fr) 90px;align-items:center;gap:10px 12px;padding:14px 0;border-bottom:1px solid var(--line); }
  .grades-table th,.grades-table td { border:0;padding:0; }
  .grades-table tbody th { grid-column:1;grid-row:1;padding:0;font-size:14px;font-weight:550; }
  .grades-table .grade-average { grid-column:2;grid-row:1;font-size:18px;line-height:1.2; }
  .grades-table .grade-average::before { content:'Средний балл';display:block;font-size:9px;font-weight:400;color:var(--muted);letter-spacing:0;margin-bottom:3px; }
  .grades-table td:nth-child(2) { grid-column:1/-1;grid-row:2;padding:0; }
  .grade-chips { gap:6px; }
  .grade-chip { width:44px;height:44px;min-height:44px;flex-basis:44px; }
  .grades-table .grades-empty { grid-column:1/-1; }
  .grade-detail { padding:20px; }
  .grade-detail button { min-height:44px; }
}
@media(max-width:700px), (max-width:1000px) and (pointer:coarse) {
  .grades-page .grade-filters select { font-size:16px; }
}
