/* Three layouts from the Studeika exploration. Loaded after component styles. */
html[data-design] {
  color-scheme:light;
  --bg:#f1f5fd;
  --paper:#fff;
  --ink:#18304f;
  --muted:#64738b;
  --accent:#2767ec;
  --accent-ink:#fff;
  --soft:#eaf1ff;
  --line:#e1e8f3;
  --green:#237852;
  --amber:#945515;
  --amber-bg:#fff3dd;
  --shadow:0 8px 25px #234b8b10;
  --radius:16px;
  --sidebar-width:216px;
  --timeline-time:62px;
  --timeline-marker:24px;
  font-family:'Onest','Segoe UI',sans-serif;
}
html[data-design][data-theme=dark] {
  color-scheme:dark;
  --bg:#101b2d;
  --paper:#19273c;
  --ink:#e7efff;
  --muted:#a8b7ce;
  --accent:#82aaff;
  --accent-ink:#14213a;
  --soft:#243b60;
  --line:#2a3c55;
  --green:#80d3ad;
  --amber:#f5c079;
  --amber-bg:#3c3023;
  --shadow:0 8px 25px #00000020;
}
html[data-design=focus] {
  --bg:#f5f8ff;
  --paper:#fff;
  --ink:#203a59;
  --muted:#566e8b;
  --accent:#2b69e9;
  --soft:#eaf2ff;
  --line:#e3ebf7;
  --radius:23px;
}
html[data-design=focus][data-theme=dark] {
  --bg:#122036;
  --paper:#1a2c45;
  --ink:#e6efff;
  --muted:#b1c1d8;
  --accent:#8eb5ff;
  --soft:#293f61;
  --line:#304561;
}
html[data-design=rhythm] {
  --bg:#f8faff;
  --paper:#fff;
  --ink:#19324f;
  --muted:#596d87;
  --accent:#255fce;
  --soft:#eaf1ff;
  --line:#dfe7f3;
  --radius:11px;
}
html[data-design=rhythm][data-theme=dark] {
  --bg:#101e30;
  --paper:#1a2a40;
  --ink:#e7f0ff;
  --muted:#b1c1d8;
  --accent:#91b6ff;
  --soft:#294263;
  --line:#30445c;
}
html[data-design] body {
  background:var(--bg);
  color:var(--ink);
  font:400 14px/1.55 'Onest','Segoe UI',sans-serif;
}
html[data-design] button,
html[data-design] input,
html[data-design] select { font-family:inherit; }
html[data-design] h1,
html[data-design] h2,
html[data-design] h3 {
  font-family:'Golos Text','Onest',sans-serif;
  color:var(--ink);
}
html[data-design] :is(button,a,input,select,summary):focus-visible {
  outline:3px solid var(--accent);
  outline-offset:3px;
}
html[data-design] svg { stroke-width:1.7; }
html[data-design] :is(.main-content,.schedule-content,.schedule-workspace,.teacher-view,#group-view,#teachers-view) { min-width:0; }
html[data-design] .app-layout {
  position:relative;
  max-width:1640px;
  grid-template-columns:var(--sidebar-width) minmax(0,1fr);
}
html[data-design] .sidebar {
  padding:32px 20px 26px;
  background:var(--paper);
  border-right:1px solid var(--line);
}
html[data-design] .brand {
  gap:8px;
  font:800 24px/1 'Manrope','Onest',sans-serif;
  letter-spacing:-1.15px;
  color:var(--ink);
  white-space:nowrap;
}
html[data-design] .brand .wordmark {
  font:inherit;
  letter-spacing:inherit;
}
html[data-design] .wordmark em {
  color:#2670fa;
  font-style:normal;
}
html[data-design][data-theme=dark] .wordmark em { color:var(--accent); }
html[data-design] .brand small {
  font-family:'Onest',sans-serif;
  font-size:11px;
  line-height:1.4;
  letter-spacing:0;
  font-weight:400;
  margin-top:7px;
}
html[data-design] .brand-mark.brand-logo {
  width:34px;
  height:31px;
  padding:0;
  background:transparent;
  border-radius:0;
}
html[data-design] .brand-logo img { object-fit:contain; }
html[data-design] .sidebar .brand { font-size:21px; gap:6px; }
html[data-design] .sidebar .brand-mark { width:29px; height:27px; }
html[data-design] .nav-caption {
  font-size:11px;
  font-weight:500;
  letter-spacing:.075em;
  margin:36px 11px 12px;
}
html[data-design] .side-nav {
  min-height:46px;
  gap:10px;
  padding:11px;
  margin:3px 0;
  border-radius:10px;
  font-size:13px;
  font-weight:400;
  line-height:1.5;
}
html[data-design] .side-nav svg { width:19px; height:19px; }
html[data-design] .side-nav.selected { color:var(--accent); background:var(--soft); font-weight:600; }
html[data-design] .nav-dot { display:none; }
html[data-design] .sidebar-group { padding:21px 10px 0; margin-top:24px; }
html[data-design] .sidebar-group strong { font:600 20px/1.4 'Golos Text',sans-serif; }
html[data-design] .sidebar-group :is(p,small,button) { font-size:11px; }
html[data-design] .sidebar-group button { min-height:42px; margin-top:5px; }
html[data-design] .sidebar-bottom { padding:24px 10px 0; font-size:11px; line-height:1.7; }
html[data-design] .sidebar-bottom .text-link { min-height:42px; font-size:11px; }
html[data-design] .main-content {
  max-width:1100px;
  padding:36px 38px 27px;
}
html[data-design] .topbar { margin-bottom:27px; gap:16px; }
html[data-design] .eyebrow {
  font-size:11px;
  font-weight:500;
  letter-spacing:.075em;
  margin-bottom:7px;
}
html[data-design] h1 {
  font-size:32px;
  line-height:1.2;
  letter-spacing:-1.1px;
  font-weight:700;
}
html[data-design] h2 { font-size:21px; line-height:1.35; font-weight:600; letter-spacing:-.45px; }
html[data-design] .title-dot { display:none; }
html[data-design] .header-actions { gap:8px; min-width:0; }
html[data-design] .today-label { font-size:11px; }
html[data-design] .icon-button {
  width:42px;
  height:42px;
  min-width:42px;
  min-height:42px;
  border-radius:11px;
  background:var(--paper);
  color:var(--ink);
}
html[data-design] .icon-button:hover { background:var(--soft); color:var(--accent); }
html[data-design] .icon-button svg { width:19px; height:19px; }
html[data-design] .appearance-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:auto;
  padding:0 12px;
  font-size:12px;
  color:var(--muted);
}
html[data-design] .appearance-button svg { width:18px; height:18px; }
html[data-design] .mobile-brand { display:none; }
html[data-design] .schedule-intro {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:15px;
}
html[data-design] .selected-date-line { min-width:0; }
html[data-design] #selected-date {
  display:block;
  font-family:'Golos Text',sans-serif;
  font-size:17px;
  line-height:1.4;
  font-weight:600;
  letter-spacing:-.25px;
  text-transform:capitalize;
}
html[data-design] #selected-profile {
  display:block;
  margin-top:4px;
  font-size:11px;
  color:var(--muted);
}
html[data-design] .schedule-intro .group-card {
  display:flex;
  align-items:center;
  flex:0 0 auto;
  gap:9px;
  min-height:44px;
  max-width:48%;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:11px;
  background:var(--paper);
  box-shadow:none;
}
html[data-design] .schedule-intro .group-card:hover { border-color:var(--accent); }
html[data-design] .schedule-intro .group-card :is(.group-card-icon,small,#group-description) { display:none; }
html[data-design] .schedule-intro .group-card strong {
  font:500 14px/1.4 'Onest',sans-serif;
  letter-spacing:0;
  margin:0;
  overflow-wrap:anywhere;
}
html[data-design] .schedule-intro .switch-icon { width:14px; height:14px; margin-left:0; }
html[data-design] .schedule-panel {
  border:0;
  border-radius:0;
  padding:0;
  background:transparent;
  margin-bottom:20px;
}
html[data-design] .calendar-toolbar {
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:12px;
  margin:0 0 8px;
}
html[data-design] .calendar-toolbar h2 { font-size:14px; font-weight:500; letter-spacing:0; }
html[data-design] .calendar-toolbar p { font-size:11px; margin-top:3px; }
html[data-design] .calendar-actions { display:flex; gap:6px; }
html[data-design] .week-arrows { gap:0; margin:0 0 0 auto; }
html[data-design] .week-arrows .icon-button { width:42px; height:42px; background:transparent; }
html[data-design] .today-button { min-height:42px; font-size:12px; padding:7px 5px; }
html[data-design] .week-strip { gap:6px; margin:0 0 16px; }
html[data-design] .day-button {
  min-height:70px;
  padding:8px 3px;
  gap:3px;
  border:1px solid transparent;
  border-radius:12px;
  color:var(--muted);
  background:transparent;
}
html[data-design] .day-button .weekday { font-size:11px; line-height:1.25; }
html[data-design] .day-button .day-number { font-size:20px; font-weight:500; letter-spacing:0; }
html[data-design] .day-button .day-dot { width:3px; height:3px; margin-top:1px; background:currentColor; }
html[data-design] .day-button .day-dot.empty { background:transparent; }
html[data-design] .day-button .day-dot.review { background:var(--amber); }
html[data-design] .day-button.weekend:not(.active):not(.today) { background:transparent; }
html[data-design] .day-button.today:not(.active) { background:var(--soft); color:var(--accent); }
html[data-design] .day-button.active {
  background:var(--accent);
  color:var(--accent-ink);
  box-shadow:none;
}
html[data-design] .day-button.active .day-dot { background:currentColor; }
html[data-design] .day-button:hover:not(.active) { border-color:var(--accent); }
html[data-design] .view-toggle {
  width:100%;
  display:flex;
  justify-content:stretch;
  padding:4px;
  gap:3px;
  margin:0;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:11px;
}
html[data-design] .view-toggle button {
  min-width:0;
  min-height:42px;
  flex:1 1 0;
  padding:8px;
  border-radius:7px;
  font-size:13px;
  color:var(--ink);
}
html[data-design] .view-toggle .active {
  background:var(--soft);
  color:var(--accent);
  font-weight:600;
  box-shadow:none;
}
html[data-design] .schedule-workspace { display:block; }
html[data-design] .schedule-content { min-width:0; }
html[data-design] :is(.lesson-countdown,.rhythm-headers) { display:none; }
html[data-design] .agenda { min-height:180px; }
html[data-design] .agenda-title { gap:12px; padding:0; margin-bottom:12px; }
html[data-design] .agenda-title h2 { font-size:17px; line-height:1.5; }
html[data-design] .agenda-title .count { font-size:11px; margin-left:8px; line-height:1.5; }
html[data-design] .pdf-link {
  min-height:42px;
  padding:5px 0;
  font-size:11px;
  gap:5px;
  color:var(--muted);
  text-underline-offset:3px;
}
html[data-design] .pdf-link svg { width:15px; height:15px; }
html[data-design] .pdf-link:hover { color:var(--accent); }
html[data-design] .original-unavailable { font-size:11px; }
html[data-design] .day-section+.day-section { margin-top:29px; }
html[data-design] .day-note {
  padding:10px 12px;
  border-radius:8px;
  gap:8px;
  font-size:12px;
  line-height:1.6;
  background:var(--soft);
  color:var(--accent);
}
html[data-design] .day-note.warning { background:var(--amber-bg); color:var(--amber); }
html[data-design] .lesson-list { gap:0; }
html[data-design] .lesson-row {
  display:grid;
  grid-template-columns:var(--timeline-time) minmax(0,1fr);
  gap:12px;
  position:relative;
  min-width:0;
}
html[data-design] .lesson-row::before { display:none; }
html[data-design] .lesson-time-rail {
  grid-column:1;
  grid-row:1;
  display:grid;
  align-content:start;
  gap:5px;
  padding-top:20px;
  color:var(--ink);
  font:400 13px/1.5 'IBM Plex Mono',Consolas,monospace;
  font-variant-numeric:tabular-nums;
}
html[data-design] .lesson-time-rail :is(time,strong) { font:inherit; color:var(--ink); }
html[data-design] .lesson-time-rail :is(small,time:last-child) { font:inherit; font-size:11px; color:var(--muted); }
html[data-design] .lesson-time-rail .lesson-pair-label { font:400 11px/1.5 'Onest',sans-serif; color:var(--muted); }
html[data-design] .pair-marker { display:none; }
html[data-design] .lesson-card {
  grid-column:2;
  min-width:0;
  padding:17px 0;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  overflow:visible;
  background:transparent;
  box-shadow:none;
}
html[data-design] .lesson-row:last-child .lesson-card { border-bottom:0; }
html[data-design] .lesson-row.current .lesson-card { border-color:var(--line); box-shadow:none; }
html[data-design] .lesson-row.current .lesson-card::before { display:none; }
html[data-design] .lesson-topline {
  gap:8px;
  flex-wrap:wrap;
  min-width:0;
  margin:0 0 6px;
  color:var(--muted);
  font-size:11px;
}
html[data-design] .lesson-topline .lesson-time { font-size:11px; }
html[data-design] .lesson-status {
  padding:0;
  border-radius:0;
  background:transparent;
  color:var(--accent);
  font-size:11px;
  font-weight:500;
  letter-spacing:0;
}
html[data-design] .lesson-status.finished { background:transparent; color:var(--muted); }
html[data-design] .lesson-variant {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  min-width:0;
  align-items:start;
}
html[data-design] .lesson-variant-main { min-width:0; }
html[data-design] .lesson-variant+.lesson-variant { padding-top:14px; margin-top:14px; border-top:1px solid var(--line); }
html[data-design] .lesson-subject {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:8px;
  margin:0;
  font-family:'Onest',sans-serif;
  font-size:15px;
  line-height:1.5;
  font-weight:500;
  letter-spacing:-.15px;
  overflow-wrap:anywhere;
}
html[data-design] .lesson-meta {
  display:block;
  font-size:11px;
  font-weight:400;
  line-height:1.65;
  color:var(--muted);
  margin-top:5px;
}
html[data-design] .lesson-details {
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:11px;
}
html[data-design] .room {
  background:transparent;
  padding:1px 0;
  border-radius:0;
  color:var(--ink);
  font:500 14px/1.5 'IBM Plex Mono',Consolas,monospace;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
html[data-design] .room svg { display:none; }
html[data-design] button.room { min-height:42px; padding:0 6px; margin-top:-8px; }
html[data-design] .subgroup {
  display:inline-grid;
  place-items:center;
  min-width:23px;
  height:23px;
  border-radius:6px;
  margin:0;
  padding:0 5px;
  color:var(--accent);
  background:var(--soft);
  font:500 11px/1 'Onest',sans-serif;
  flex-shrink:0;
}
html[data-design] .lesson-row.finished :is(.lesson-subject,.room,.lesson-time-rail time) { color:var(--muted); }
html[data-design] :is(.lesson-change,.room-change,.change-note) {
  display:flex;
  width:fit-content;
  max-width:100%;
  align-items:center;
  flex-wrap:wrap;
  gap:5px;
  background:var(--amber-bg);
  color:var(--amber);
  font-size:11px;
  line-height:1.5;
  padding:5px 7px;
  border-radius:6px;
  margin:6px 0 0;
}
html[data-design] :is(.lesson-change,.room-change,.change-note) svg { width:14px; height:14px; }
html[data-design] .schedule-section-label {
  font-size:12px;
  color:var(--muted);
  font-weight:400;
  margin:0 0 12px;
}
html[data-design] .completed-lessons { margin-top:13px; }
html[data-design] .completed-lessons summary {
  color:var(--muted);
  font-size:12px;
  min-height:42px;
  padding:12px 0;
  cursor:pointer;
}
html[data-design] .completed-lessons[open] summary { border-bottom:1px solid var(--line); }
html[data-design] .summary-card.timer-card {
  --timer-accent:var(--accent);
  display:block;
  min-width:0;
  min-height:0;
  margin:0 0 12px;
  padding:18px 20px;
  background:var(--paper);
  border:1.5px solid var(--accent);
  border-radius:var(--radius);
  box-shadow:none;
}
html[data-design] .timer-card :is(.timer-main,.timer-heading,.timer-body,.timer-foot) { display:flex; }
html[data-design] .timer-card .timer-heading {
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:12px;
}
html[data-design] :is(.timer-card,.teacher-timer) .timer-kicker {
  display:inline-flex;
  align-items:center;
  gap:6px;
  font:500 11px/1.5 'Onest',sans-serif;
  letter-spacing:0;
  color:var(--timer-accent);
}
html[data-design] .timer-dot { width:5px; height:5px; }
html[data-design] .timer-settings-button {
  width:42px;
  height:42px;
  margin:-10px -9px -9px 0;
  background:transparent;
}
html[data-design] .timer-lesson-line {
  color:var(--muted);
  font-size:11px;
  line-height:1.5;
  margin:0 0 10px;
}
html[data-design] .timer-card #timer-detail {
  color:var(--muted);
  font:400 11px/1.65 'Onest',sans-serif;
  margin:0;
  overflow-wrap:anywhere;
}
html[data-design] .timer-card .timer-main {
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
html[data-design] .timer-card .timer-context { display:block; min-width:0; flex:1 1 auto; }
html[data-design] .timer-card #timer-title {
  color:var(--ink);
  font:600 19px/1.4 'Golos Text',sans-serif;
  letter-spacing:-.35px;
  margin:0;
  overflow-wrap:anywhere;
}
html[data-design] .timer-card .timer-room {
  display:grid;
  justify-items:center;
  min-width:0;
  max-width:48%;
  flex:0 1 auto;
  padding-left:18px;
  border-left:1px solid var(--line);
}
html[data-design] .timer-card #timer-room-value {
  display:block;
  max-width:100%;
  overflow-wrap:anywhere;
  text-align:center;
  font:600 36px/1.1 'Golos Text',sans-serif;
  letter-spacing:-1.2px;
  color:var(--timer-accent);
  margin:0;
}
html[data-design] .timer-card .timer-room small {
  font-size:11px;
  font-weight:400;
  color:var(--muted);
  letter-spacing:0;
  margin-top:4px;
  text-align:center;
  overflow-wrap:anywhere;
}
html[data-design] .timer-card .timer-body {
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:nowrap;
  border-top:1px solid var(--line);
  padding-top:13px;
  margin-top:16px;
}
html[data-design] .timer-card .timer-numbers {
  display:flex;
  flex:1 1 auto;
  align-items:center;
  justify-content:space-between;
  flex-direction:row;
  gap:12px;
  min-width:0;
}
html[data-design] .timer-card #timer-value {
  display:block;
  color:var(--ink);
  font:500 20px/1.4 'IBM Plex Mono',Consolas,monospace;
  letter-spacing:-.6px;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  margin:0;
}
html[data-design] .timer-card #timer-label {
  display:block;
  color:var(--muted);
  font:400 11px/1.5 'Onest',sans-serif;
  letter-spacing:0;
  margin:0;
}
html[data-design] .timer-progress { height:3px; border-radius:4px; background:var(--soft); margin-top:11px; }
html[data-design] .timer-progress span { display:block; height:100%; background:var(--timer-accent); }
html[data-design] .timer-card .timer-foot { align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }
html[data-design] .timer-card #timer-source { font-size:11px; color:var(--muted); }
html[data-design] .timer-foot button { min-height:42px; font-size:11px; padding:4px 0; }
html[data-design] .timer-warning { font-size:11px; }
html[data-design] .summary-card:not(.timer-card) {
  min-height:100px;
  padding:19px;
  border:1px solid var(--line);
  background:var(--paper);
  margin-bottom:16px;
}
html[data-design] .summary-card:not(.timer-card) small { font-size:11px; letter-spacing:.05em; }
html[data-design] .summary-card:not(.timer-card) div>span { font-size:12px; }
html[data-design] .schedule-status {
  border-top:1px solid var(--line);
  padding-top:12px;
  margin:24px 0 0;
  font-size:11px;
  gap:12px;
}
html[data-design] .schedule-status .text-link { min-height:42px; font-size:11px; }
html[data-design] .schedule-status .live-dot { width:5px; height:5px; }
html[data-design] .text-link { font-size:12px; }
html[data-design] .page-footer {
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:3px 11px;
  border-top:1px solid var(--line);
  padding:18px 0 0;
  margin-top:20px;
  font-size:11px;
}
html[data-design] .footer-brand { display:contents; }
html[data-design] .footer-brand img {
  grid-row:1 / 3;
  grid-column:1;
  width:42px;
  height:42px;
  border-radius:10px;
}
html[data-design] .footer-brand>span { grid-column:2; font:600 13px/1.4 'Onest',sans-serif; letter-spacing:0; }
html[data-design] .page-footer p { grid-column:2; margin:0; max-width:none; font-size:11px; line-height:1.65; }

/* Мягкий фокус: a quiet header and one prominent room card. */
html[data-design=focus] .app-layout { display:block; }
html[data-design=focus] .sidebar {
  position:static;
  height:auto;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:8px;
  min-height:90px;
  padding:22px 250px 22px 34px;
  border-right:0;
  border-bottom:1px solid var(--line);
}
html[data-design=focus] .sidebar .brand { margin-right:auto; font-size:26px; gap:9px; }
html[data-design=focus] .sidebar .brand-mark { width:36px; height:32px; }
html[data-design=focus] .sidebar .brand small { display:none; }
html[data-design=focus] .sidebar :is(.nav-caption,.sidebar-group,.sidebar-bottom) { display:none; }
html[data-design=focus] .sidebar .side-nav { flex:0 0 auto; width:auto; padding:10px 12px; margin:0; white-space:nowrap; }
html[data-design=focus] .main-content { padding:31px 38px 27px; }
html[data-design=focus] .topbar { position:absolute; right:30px; top:23px; margin:0; }
html[data-design=focus] .page-heading { display:none; }
html[data-design=focus] body[data-view=teachers] .page-heading { display:block; }
html[data-design=focus] body[data-view=teachers] .topbar { position:static; margin-bottom:24px; }
html[data-design=focus] body[data-view=teachers] .topbar .header-actions { position:absolute; right:30px; top:23px; }
html[data-design=focus] .today-label { display:none; }
html[data-design=focus] .schedule-intro { margin-bottom:17px; }
html[data-design=focus] #selected-date { font-size:27px; letter-spacing:-.7px; }
html[data-design=focus] .schedule-intro .group-card { border-radius:12px; padding:10px 12px; }
html[data-design=focus] .week-strip { gap:10px; margin-bottom:18px; }
html[data-design=focus] .day-button {
  min-height:78px;
  padding:11px 4px;
  border-radius:17px;
  background:var(--paper);
}
html[data-design=focus] .day-button.weekend:not(.active):not(.today) { background:var(--paper); }
html[data-design=focus] .day-button.active { background:var(--accent); }
html[data-design=focus] .view-toggle { border:0; border-radius:12px; padding:4px; box-shadow:0 1px 5px #213f6a08; }
html[data-design=focus] .view-toggle button { border-radius:9px; }
html[data-design=focus] .schedule-panel { margin-bottom:25px; }
html[data-design=focus] .schedule-workspace {
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.25fr);
  align-items:start;
  gap:26px;
}
html[data-design=focus] .schedule-workspace>#day-summary { grid-column:1; }
html[data-design=focus] .schedule-workspace>.schedule-content { grid-column:2; }
html[data-design=focus] body:is([data-mode=week],[data-mode=bells]) .schedule-workspace { display:block; }
html[data-design=focus] body:is([data-mode=week],[data-mode=bells]) .schedule-workspace>#day-summary { margin-bottom:22px; }
html[data-design=focus] body:is([data-mode=week],[data-mode=bells]) .timer-card .timer-main { display:flex; }
html[data-design=focus] body:is([data-mode=week],[data-mode=bells]) .timer-card .timer-room {
  display:grid;
  justify-items:center;
  margin:0;
  padding:10px 16px;
}
html[data-design=focus] body:is([data-mode=week],[data-mode=bells]) .timer-card #timer-room-value { font-size:36px; }
html[data-design=focus] body:is([data-mode=week],[data-mode=bells]) .timer-card .timer-numbers { display:flex; flex-direction:row; justify-content:space-between; }
html[data-design=focus] body:is([data-mode=week],[data-mode=bells]) .timer-card #timer-value,
html[data-design=focus] body:is([data-mode=week],[data-mode=bells]) .timer-card #timer-label { order:initial; }
html[data-design=focus] .summary-card.timer-card { border:0; border-radius:23px; padding:24px; box-shadow:var(--shadow); margin:0; }
html[data-design=focus] .timer-card .timer-heading { margin-bottom:22px; }
html[data-design=focus] .timer-card .timer-main { display:block; }
html[data-design=focus] .timer-card #timer-title { font-size:25px; line-height:1.3; letter-spacing:-.6px; }
html[data-design=focus] .timer-card .timer-room {
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:0;
  padding:16px;
  border-radius:16px;
  background:var(--soft);
  margin-top:21px;
  max-width:none;
}
html[data-design=focus] .timer-card #timer-room-value { font-size:48px; font-weight:500; letter-spacing:-1.6px; }
html[data-design=focus] .timer-card .timer-room small { margin:0; }
html[data-design=focus] .timer-card .timer-body { border:0; padding-top:18px; margin-top:0; }
html[data-design=focus] .timer-card .timer-numbers { display:grid; flex-direction:initial; justify-content:start; gap:7px; }
html[data-design=focus] .timer-card #timer-value { order:2; font-size:27px; }
html[data-design=focus] .timer-card #timer-label { order:1; }
html[data-design=focus] .timer-progress { margin-top:14px; }
html[data-design=focus] .lesson-time-rail { padding-top:17px; }
html[data-design=focus] .lesson-row:first-child .lesson-card { padding-top:12px; }
html[data-design=focus] .lesson-row:first-child .lesson-time-rail { padding-top:15px; }
html[data-design=focus] .lesson-subject { font-size:14px; line-height:1.55; }

/* Чёткий ритм: pair numbers sit on a continuous chronological rail. */
html[data-design=rhythm] .sidebar { background:#2258bd; color:#fff; border:0; }
html[data-design=rhythm] .sidebar .brand { color:#fff; font-size:21px; }
html[data-design=rhythm] .sidebar .wordmark em { color:#b9d5ff; }
html[data-design=rhythm] .sidebar .brand-mark.brand-logo {
  background:#fff;
  width:38px;
  height:35px;
  padding:5px;
  border-radius:9px;
}
html[data-design=rhythm] .sidebar :is(.brand small,.nav-caption,.sidebar-bottom,.sidebar-group small,.sidebar-group p) { color:#c5d9fc; }
html[data-design=rhythm] .sidebar :is(.side-nav,.sidebar-group button,.sidebar-bottom .text-link) { color:#dce9ff; }
html[data-design=rhythm] .sidebar .side-nav.selected { background:#fff; color:#2258bd; }
html[data-design=rhythm] .sidebar-group { border-color:#ffffff30; }
html[data-design=rhythm] .sidebar-group strong { color:#fff; }
html[data-design=rhythm] .main-content { background:var(--paper); min-height:100dvh; }
html[data-design=rhythm] .topbar { margin-bottom:25px; }
html[data-design=rhythm] h1 { font-weight:600; }
html[data-design=rhythm] .week-strip { border-bottom:1px solid var(--line); padding-bottom:16px; margin-bottom:16px; }
html[data-design=rhythm] .day-button { min-height:66px; border-radius:10px; }
html[data-design=rhythm] .day-button.active {
  background:var(--soft);
  color:var(--accent);
  box-shadow:inset 0 -2px var(--accent);
}
html[data-design=rhythm] .view-toggle { border:0; background:var(--bg); }
html[data-design=rhythm] .view-toggle .active { background:var(--paper); color:var(--accent); box-shadow:0 1px 3px #213f6a12; }
html[data-design=rhythm] .schedule-workspace[data-inline-timer=true]>#day-summary { display:none; }
html[data-design=rhythm] .teacher-view[data-inline-timer=true] .teacher-timer { display:none; }
html[data-design=rhythm] .teacher-view[data-inline-timer=true] .teacher-overview { grid-template-columns:minmax(0,1fr); }
html[data-design=rhythm] .lesson-row { grid-template-columns:var(--timeline-time) var(--timeline-marker) minmax(0,1fr); gap:12px; }
html[data-design=rhythm] .lesson-row::before {
  content:'';
  display:block;
  position:absolute;
  top:0;
  bottom:0;
  left:calc(var(--timeline-time) + 12px + var(--timeline-marker) / 2);
  width:1px;
  background:var(--line);
}
html[data-design=rhythm] .lesson-row:last-child::before { bottom:calc(100% - 41px); }
html[data-design=rhythm] .lesson-row.current::before { background:var(--accent); width:2px; }
html[data-design=rhythm] .pair-marker {
  grid-column:2;
  grid-row:1;
  display:grid;
  width:var(--timeline-marker);
  height:var(--timeline-marker);
  margin-top:19px;
  font:400 11px/1 'IBM Plex Mono',monospace;
  border:1px solid var(--line);
  background:var(--paper);
  color:var(--muted);
  box-shadow:none;
}
html[data-design=rhythm] .lesson-row.current .pair-marker { border-color:var(--accent); background:var(--accent); color:var(--accent-ink); box-shadow:none; }
html[data-design=rhythm] .lesson-card { grid-column:3; padding:19px 0; }
html[data-design=rhythm] .lesson-row.current .lesson-card {
  background:var(--soft);
  border:0;
  border-radius:11px;
  padding:16px;
  margin:8px 0;
}
html[data-design=rhythm] .lesson-row.current .lesson-subject { font-size:17px; font-weight:600; }
html[data-design=rhythm] .lesson-row.current .room { font-size:26px; color:var(--accent); line-height:1.2; }
html[data-design=rhythm] .lesson-status { display:inline-flex; align-items:center; gap:6px; }
html[data-design=rhythm] .lesson-row.current .lesson-status::before { content:''; height:5px; width:5px; border-radius:50%; background:currentColor; }
html[data-design=rhythm] :is(.schedule-workspace,.teacher-view)[data-inline-timer=true] .lesson-row.current .lesson-countdown {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  border-top:1px solid var(--line);
  padding-top:11px;
  margin-top:13px;
  color:var(--muted);
  font-size:11px;
}
html[data-design] .inline-timer-settings { flex:0 0 32px; width:32px; min-width:32px; height:32px; padding:6px; color:var(--accent); }
html[data-design] .inline-timer-settings svg { width:17px; height:17px; }
html[data-design=rhythm] .lesson-countdown strong { color:var(--accent); font:500 17px/1.5 'IBM Plex Mono',monospace; white-space:nowrap; }
html[data-design=rhythm] .rhythm-headers {
  display:grid;
  grid-template-columns:var(--timeline-time) var(--timeline-marker) minmax(0,1fr) auto;
  gap:12px;
  color:var(--muted);
  font-size:11px;
  border-bottom:1px solid var(--line);
  padding-bottom:11px;
}
html[data-design=rhythm] .rhythm-headers>span:last-child { text-align:right; }

/* Shared controls, secondary routes and sheets use the active palette. */
html[data-design] :is(.empty-state,.loading-state) {
  background:var(--paper);
  border-color:var(--line);
  border-radius:var(--radius);
  padding:38px 22px;
}
html[data-design] .empty-state h3 { font-size:19px; }
html[data-design] :is(.empty-state p,.loading-state,.nearest-schedule p) { font-size:14px; }
html[data-design] .nearest-schedule small { font-size:11px; }
html[data-design] .primary-button {
  min-height:44px;
  background:var(--accent);
  color:var(--accent-ink);
  font-size:14px;
  border-radius:10px;
}
html[data-design] .error-banner { font-size:13px; background:var(--amber-bg); color:var(--amber); flex-wrap:wrap; }
html[data-design] .error-banner button { min-height:42px; }
html[data-design] dialog {
  background:var(--paper);
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:21px;
  box-shadow:0 24px 100px #14243f29;
  max-width:calc(100vw - 32px);
  padding:26px;
}
html[data-design] dialog::backdrop { background:#14243f77; backdrop-filter:blur(4px); }
html[data-design][data-theme=dark] dialog::backdrop { background:#030914b8; }
html[data-design] .dialog-header { gap:14px; margin-bottom:19px; }
html[data-design] .dialog-header h2 { font-size:25px; line-height:1.3; letter-spacing:-.6px; }
html[data-design] .search-input { min-height:48px; background:var(--bg); border-color:var(--line); border-radius:11px; }
html[data-design] .search-input input { color:var(--ink); font-size:16px; }
html[data-design] .filter-chips button { min-height:42px; font-size:12px; padding:8px 12px; border-color:var(--line); }
html[data-design] .filter-chips button.active { background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
html[data-design] .profile-filters { gap:12px; }
html[data-design] .profile-filters button { min-height:42px; font-size:12px; }
html[data-design] .result-count { font-size:11px; }
html[data-design] .group-results { gap:8px; }
html[data-design] .group-result { min-height:64px; background:var(--bg); border-color:var(--line); border-radius:10px; padding:12px; }
html[data-design] .group-result strong { font-size:15px; }
html[data-design] .group-result :is(small,span) { font-size:11px; }
html[data-design] .info-dialog>h2 { font-size:31px; }
html[data-design] .info-dialog>p:not(.eyebrow) { font-size:14px; }
html[data-design] .info-note { background:var(--soft); color:var(--muted); }
html[data-design] .info-note p { font-size:12px; }
html[data-design] .timer-settings-intro { font-size:14px; }
html[data-design] .timer-field strong { font-size:14px; }
html[data-design] .timer-field small { font-size:11px; line-height:1.65; }
html[data-design] .timer-number-field { font-size:12px; }
html[data-design] .timer-number-field input { min-height:44px; width:67px; background:var(--bg); border-color:var(--line); font-family:'IBM Plex Mono',monospace; }
html[data-design] :is(.timer-duration-preview,.timer-form-error) { font-size:12px; }
html[data-design] .timer-form-actions .text-link { min-height:42px; }
html[data-design] .sheet-dialog { width:min(800px,calc(100vw - 32px)); }
html[data-design] .sheet-dialog .dialog-header h2 { font-size:25px; }
html[data-design] :is(.sheet-date,.sheet-loading,.sheet-error p) { font-size:14px; }
html[data-design] :is(.sheet-caption,.sheet-missing) { font-size:12px; }
html[data-design] .sheet-actions { flex-wrap:wrap; }
html[data-design] .sheet-actions :is(button,a) { display:inline-flex; align-items:center; min-height:42px; font-size:13px; }
html[data-design] .bells-caption { font-size:14px; }
html[data-design] .bell-list { border-radius:var(--radius); border-color:var(--line); }
html[data-design] .bell-row { padding:19px 21px; }
html[data-design] .bell-row-heading strong { font-size:15px; }
html[data-design] .bell-row-heading>span { font:400 12px/1.6 'IBM Plex Mono',monospace; }
html[data-design] .bell-parts { font:500 15px/1.75 'IBM Plex Mono',monospace; }
html[data-design] :is(.bell-break,.bells-note,.bells-footnote p) { font-size:12px; }
html[data-design] .bells-footnote .text-link { min-height:42px; }
html[data-design] :is(.teacher-picker-intro,.teacher-detail-head,.teacher-timer,.teacher-list,.teacher-week-day,.teacher-bell) { border-color:var(--line); border-radius:var(--radius); }
html[data-design] :is(.teacher-picker-intro,.teacher-detail-head) { padding:23px; }
html[data-design] :is(.teacher-picker-intro,.teacher-detail-head) h2 { font-size:27px; }
html[data-design] :is(.teacher-picker-count,.teacher-detail-summary,.teacher-consent,.teacher-demo-note,.teacher-row-summary) { font-size:12px; }
html[data-design] .teacher-row { min-height:72px; padding:17px 21px; gap:14px; }
html[data-design] .teacher-row-main strong { font-size:15px; }
html[data-design] .teacher-row-main>span { font-size:11px; }
html[data-design] .teacher-demo-badge { font-size:11px; }
html[data-design] .teacher-return { min-height:42px; margin-bottom:16px; }
html[data-design] .teacher-detail-name { font-size:18px; }
html[data-design] .teacher-group-badge { font-size:11px; padding:4px 7px; }
html[data-design] .teacher-head-actions .text-link { min-height:42px; }
html[data-design] :is(.teacher-notice,.teacher-copy-box small,.teacher-copy-box label,.teacher-time-note) { font-size:11px; }
html[data-design] .teacher-copy-box input { font-size:14px; }
html[data-design] .teacher-overview { gap:20px; margin-bottom:22px; }
html[data-design] .teacher-timer { padding:22px; }
html[data-design] .teacher-timer-value { color:var(--timer-accent); font:500 29px/1.3 'IBM Plex Mono',monospace; letter-spacing:-1px; }
html[data-design] :is(.teacher-timer-label,.teacher-timer-source,.teacher-timer-context span) { font-size:11px; }
html[data-design] .teacher-timer-context strong { font-size:14px; }
html[data-design] .teacher-coverage { border-color:var(--line); }
html[data-design] .teacher-coverage strong { font-size:14px; }
html[data-design] .teacher-coverage p { font-size:12px; }
html[data-design] .teacher-coverage .text-link { min-height:42px; }
html[data-design] .teacher-view .teacher-calendar .calendar-toolbar h2 { font-size:14px; }
html[data-design] .teacher-lesson-group { font-size:12px; margin-bottom:7px; }
html[data-design] .teacher-week-day { padding:20px 22px; }
html[data-design] .teacher-week-subject>strong { font-size:14px; }
html[data-design] .teacher-week-pair small { font:400 11px/1.5 'IBM Plex Mono',monospace; }
html[data-design] .teacher-week-rooms .room { font-size:13px; }
html[data-design] .teacher-day-empty { font-size:14px; }
html[data-design] .teacher-bell strong { font-size:14px; }
html[data-design] .teacher-bell span { font:500 16px/1.5 'IBM Plex Mono',monospace; }
html[data-design] :is(.teacher-bell small,.teacher-bell p) { font-size:11px; }
html[data-design] .teacher-bottom-source { min-height:42px; }

/* The preview is drawn with CSS so each choice immediately reflects its layout. */
html[data-design] .appearance-dialog { width:640px; }
html[data-design] .appearance-intro { margin:-5px 0 20px; font-size:14px; color:var(--muted); }
html[data-design] .appearance-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
html[data-design] .appearance-options button {
  min-width:0;
  padding:8px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:7px;
  text-align:left;
  border:1px solid var(--line);
  border-radius:13px;
  background:var(--bg);
}
html[data-design] .appearance-options button:hover { border-color:var(--accent); }
html[data-design] .appearance-options button[aria-pressed=true] { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
html[data-design] .appearance-options strong { font-size:14px; font-weight:600; line-height:1.4; }
html[data-design] .appearance-options button>span { font-size:11px; line-height:1.6; color:var(--muted); }
html[data-design] .appearance-preview {
  --preview-bg:#f1f5fd;
  --preview-paper:#fff;
  --preview-soft:#eaf1ff;
  --preview-blue:#2767ec;
  position:relative;
  display:block;
  width:100%;
  height:105px;
  overflow:hidden;
  border-radius:7px;
  border:1px solid #dfe7f3;
  background:var(--preview-bg);
}
html[data-design] .appearance-preview::before,
html[data-design] .appearance-preview::after { content:''; position:absolute; }
html[data-design] .appearance-preview[data-preview=clear]::before {
  inset:0 auto 0 0;
  width:23%;
  background:linear-gradient(var(--preview-blue),var(--preview-blue)) 35% 12px/60% 4px no-repeat,linear-gradient(var(--preview-soft),var(--preview-soft)) center 31px/80% 11px no-repeat,var(--preview-paper);
  border-right:1px solid #e1e8f3;
}
html[data-design] .appearance-preview[data-preview=clear]::after {
  top:44px;
  left:29%;
  right:7%;
  height:30px;
  border:1px solid var(--preview-blue);
  border-radius:5px;
  background:linear-gradient(var(--preview-blue),var(--preview-blue)) 10% 9px/45% 3px no-repeat,linear-gradient(var(--preview-soft),var(--preview-soft)) 12% 22px/77% 2px no-repeat,var(--preview-paper);
  box-shadow:0 10px 0 -9px #cddbee,0 20px 0 -9px #cddbee;
}
html[data-design] .appearance-preview[data-preview=focus] { background:#f5f8ff; }
html[data-design] .appearance-preview[data-preview=focus]::before {
  inset:0 0 auto;
  height:22px;
  border-bottom:1px solid #e3ebf7;
  background:linear-gradient(var(--preview-blue),var(--preview-blue)) 12px 9px/31% 4px no-repeat,var(--preview-paper);
}
html[data-design] .appearance-preview[data-preview=focus]::after {
  top:38px;
  left:8%;
  width:37%;
  height:55px;
  border-radius:9px;
  background:linear-gradient(var(--preview-blue),var(--preview-blue)) 10px 10px/51% 3px no-repeat,linear-gradient(var(--preview-soft),var(--preview-soft)) center 23px/78% 20px no-repeat,var(--preview-paper);
  box-shadow:62px -7px 0 -22px #d6e1f2,62px 11px 0 -22px #d6e1f2,62px 29px 0 -22px #d6e1f2;
}
html[data-design] .appearance-preview[data-preview=rhythm] { background:#fff; }
html[data-design] .appearance-preview[data-preview=rhythm]::before { inset:0 auto 0 0; width:23%; background:#2258bd; }
html[data-design] .appearance-preview[data-preview=rhythm]::after {
  inset:29px 8% 10px 31%;
  background:radial-gradient(circle at 14px 10px,#255fce 0 3px,transparent 3.5px),radial-gradient(circle at 14px 33px,#255fce 0 3px,transparent 3.5px),radial-gradient(circle at 14px 56px,#255fce 0 3px,transparent 3.5px),linear-gradient(#c6d8f4,#c6d8f4) 14px 10px/1px 47px no-repeat,linear-gradient(#eaf1ff,#eaf1ff) 26px 23px/calc(100% - 26px) 21px no-repeat;
}
html[data-design] .appearance-themes { margin-top:24px; }
html[data-design] .appearance-themes h3 { font-size:15px; font-weight:500; margin:0 0 11px; }
html[data-design] .theme-options { display:flex; flex-wrap:wrap; gap:8px; }
html[data-design] [data-theme-choice] { flex:1; min-height:44px; padding:9px 13px; border:1px solid var(--line); border-radius:9px; font-size:13px; }
html[data-design] [data-theme-choice][aria-pressed=true] { color:var(--accent); background:var(--soft); border-color:var(--accent); font-weight:600; }

@media (max-width:1200px) and (min-width:801px) {
  html[data-design] { --sidebar-width:198px; }
  html[data-design] .main-content { padding:30px 28px 26px; }
  html[data-design] .sidebar { padding:28px 14px; }
  html[data-design] .sidebar .brand { font-size:20px; }
  html[data-design] .side-nav { font-size:12px; gap:8px; padding:11px 9px; }
  html[data-design=focus] .sidebar { padding:22px 240px 22px 28px; gap:4px; }
  html[data-design=focus] .sidebar .brand { font-size:24px; }
  html[data-design=focus] .sidebar .side-nav { padding:10px; }
  html[data-design=focus] .schedule-workspace { gap:22px; }
  html[data-design=focus] .summary-card.timer-card { padding:20px; }
}
@media (max-width:1050px) {
  html[data-design] .appearance-label { display:none; }
  html[data-design] .appearance-button { width:42px; padding:0; }
  html[data-design=focus] .sidebar { padding-right:130px; }
  html[data-design=focus] .timer-card #timer-title { font-size:22px; }
}
@media (max-width:800px) {
  html[data-design] .app-layout { display:block; }
  html[data-design] .sidebar,
  html[data-design=focus] .sidebar { display:none; }
  html[data-design] .main-content,
  html[data-design=focus] .main-content {
    max-width:720px;
    padding:24px 24px calc(102px + var(--safe-bottom));
  }
  html[data-design] .topbar,
  html[data-design=focus] .topbar,
  html[data-design=focus] body[data-view=teachers] .topbar {
    position:static;
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    gap:14px;
    margin-bottom:23px;
  }
  html[data-design] .mobile-brand { display:flex; }
  html[data-design] .page-heading,
  html[data-design=focus] body[data-view=teachers] .page-heading { display:none; }
  html[data-design] .header-actions,
  html[data-design=focus] body[data-view=teachers] .topbar .header-actions { position:static; gap:5px; margin-left:auto; }
  html[data-design] .today-label { display:none; }
  html[data-design] .mobile-brand .brand { font-size:25px; }
  html[data-design] .mobile-brand small { display:none; }
  html[data-design] .schedule-intro { gap:12px; margin-bottom:11px; }
  html[data-design] #selected-date,
  html[data-design=focus] #selected-date { font-size:19px; line-height:1.4; letter-spacing:-.35px; }
  html[data-design] .schedule-intro .group-card { max-width:43%; padding:8px 10px; border-radius:10px; }
  html[data-design] .calendar-toolbar { margin-bottom:5px; }
  html[data-design] .calendar-toolbar h2 { font-size:13px; }
  html[data-design] .calendar-toolbar p { font-size:11px; }
  html[data-design] .week-strip { gap:4px; margin-bottom:13px; }
  html[data-design] .day-button { min-height:65px; border-radius:11px; padding:7px 2px; }
  html[data-design] .day-button .day-number { font-size:20px; }
  html[data-design=focus] .week-strip { gap:6px; }
  html[data-design=focus] .day-button { min-height:68px; border-radius:14px; padding:8px 2px; }
  html[data-design] .schedule-panel,
  html[data-design=focus] .schedule-panel { margin-bottom:20px; }
  html[data-design=focus] .schedule-workspace { grid-template-columns:minmax(0,1fr); gap:20px; }
  html[data-design=focus] .schedule-workspace>.schedule-content { grid-column:1; }
  html[data-design=focus] .summary-card.timer-card { padding:22px; }
  html[data-design=focus] .timer-card .timer-main { display:flex; gap:15px; }
  html[data-design=focus] .timer-card .timer-room { display:grid; justify-items:center; gap:2px; margin:0; padding:12px; max-width:48%; flex:0 1 auto; }
  html[data-design=focus] .timer-card #timer-room-value { font-size:36px; }
  html[data-design=focus] .timer-card #timer-title { font-size:23px; }
  html[data-design=focus] .timer-card .timer-heading { margin-bottom:17px; }
  html[data-design=focus] .timer-card .timer-numbers { display:flex; flex-direction:row; justify-content:space-between; gap:12px; }
  html[data-design=focus] .timer-card #timer-value { order:initial; font-size:22px; }
  html[data-design=focus] .timer-card #timer-label { order:initial; }
  html[data-design] .agenda-title { margin-bottom:10px; }
  html[data-design] .agenda-title h2 { font-size:17px; }
  html[data-design] .mobile-nav {
    display:flex;
    position:fixed;
    z-index:20;
    bottom:0;
    left:0;
    right:0;
    justify-content:space-around;
    align-items:stretch;
    gap:3px;
    padding:8px 10px calc(7px + var(--safe-bottom));
    border-top:1px solid var(--line);
    background:var(--paper);
  }
  html[data-design] .mobile-nav button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:auto; flex:1 1 0; min-width:0; min-height:50px; padding:3px 1px; color:var(--muted); font-size:11px; line-height:1.3; }
  html[data-design] .mobile-nav button svg { width:20px; height:20px; }
  html[data-design] .mobile-nav .selected { color:var(--accent); }
  html[data-design] .mobile-nav .selected svg { box-sizing:border-box; padding:0; margin:0; background:transparent; border-radius:0; }
  html[data-design] .teacher-overview { grid-template-columns:minmax(0,1fr); gap:15px; }
  html[data-design] .teacher-timer .timer-body { flex-wrap:wrap; }
  html[data-design] .teacher-row { gap:12px; }
  html[data-design] .teacher-row-summary { font-size:11px; }
  html[data-design] .teacher-bell-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:520px) {
  html[data-design] { --timeline-time:49px; --timeline-marker:22px; }
  html[data-design] .main-content,
  html[data-design=focus] .main-content {
    padding:20px 16px calc(96px + var(--safe-bottom));
    padding-top:max(20px,var(--tg-content-safe-area-inset-top,0px));
  }
  html[data-design] .topbar,
  html[data-design=focus] .topbar { gap:7px; margin-bottom:20px; }
  html[data-design] .mobile-brand .brand { gap:7px; font-size:24px; letter-spacing:-1.1px; }
  html[data-design] .brand-mark.brand-logo { width:32px; height:28px; }
  html[data-design] .header-actions { gap:3px; }
  html[data-design] .icon-button { border-radius:10px; }
  html[data-design] .schedule-intro { gap:9px; }
  html[data-design] #selected-date,
  html[data-design=focus] #selected-date { font-size:16px; letter-spacing:-.25px; }
  html[data-design] #selected-profile { font-size:11px; line-height:1.6; margin-top:3px; }
  html[data-design] .schedule-intro .group-card { min-height:42px; max-width:40%; padding:7px 8px; gap:6px; }
  html[data-design] .schedule-intro .group-card strong { font-size:12px; }
  html[data-design] .schedule-intro .switch-icon { width:12px; height:12px; }
  html[data-design] .calendar-toolbar { align-items:center; gap:5px; }
  html[data-design] .calendar-toolbar h2 { font-size:12px; }
  html[data-design] .calendar-toolbar p { font-size:11px; max-width:175px; }
  html[data-design] .week-arrows .icon-button { min-width:35px; width:35px; }
  html[data-design] .today-button { font-size:11px; padding:6px 3px; }
  html[data-design] .week-strip { gap:3px; margin-bottom:12px; }
  html[data-design] .day-button { min-height:61px; padding:6px 1px; gap:3px; border-radius:10px; }
  html[data-design] .day-button .weekday { font-size:11px; }
  html[data-design] .day-button .day-number { font-size:18px; }
  html[data-design=focus] .week-strip { gap:4px; }
  html[data-design=focus] .day-button { min-height:63px; padding:7px 1px; border-radius:12px; }
  html[data-design] .view-toggle { gap:2px; padding:4px; border-radius:10px; }
  html[data-design] .view-toggle button { min-height:42px; font-size:12px; padding:7px 4px; }
  html[data-design] .summary-card.timer-card { padding:15px; border-radius:17px; margin:0 0 10px; min-height:0; }
  html[data-design] .timer-card .timer-heading { gap:6px; margin-bottom:12px; }
  html[data-design] .timer-card .timer-main { gap:10px; }
  html[data-design] .timer-card #timer-title { font-size:18px; }
  html[data-design] .timer-card .timer-room { padding-left:11px; }
  html[data-design] .timer-card #timer-room-value { font-size:33px; }
  html[data-design] .timer-card .timer-room small { font-size:11px; }
  html[data-design] .timer-card .timer-body { gap:10px; padding-top:12px; margin-top:13px; }
  html[data-design] .timer-card .timer-numbers { display:flex; flex-direction:row; justify-content:space-between; align-items:center; gap:10px; }
  html[data-design] .timer-card #timer-value { font-size:20px; }
  html[data-design] .timer-card #timer-label { font-size:11px; }
  html[data-design] .timer-card #timer-source { font-size:11px; line-height:1.5; }
  html[data-design] .timer-card .timer-foot { display:flex; flex-wrap:wrap; gap:3px 12px; }
  html[data-design] .timer-foot button { margin-left:auto; }
  html[data-design=focus] .summary-card.timer-card { padding:20px 18px; border:0; border-radius:23px; margin:0; }
  html[data-design=focus] .timer-card .timer-heading { margin-bottom:16px; }
  html[data-design=focus] .timer-card .timer-main { display:flex; }
  html[data-design=focus] .timer-card #timer-title { font-size:21px; }
  html[data-design=focus] .timer-card .timer-room { padding:11px; border:0; border-radius:14px; }
  html[data-design=focus] .timer-card #timer-room-value { font-size:clamp(26px,8vw,35px); }
  html[data-design=focus] .timer-card .timer-body { border:0; padding-top:16px; margin-top:0; }
  html[data-design=focus] .timer-card #timer-value { font-size:21px; }
  html[data-design] .lesson-row { gap:9px; }
  html[data-design] .lesson-time-rail { gap:5px; padding-top:18px; font-size:12px; }
  html[data-design] .lesson-time-rail :is(small,time:last-child) { font-size:11px; }
  html[data-design] .lesson-card { padding:15px 0; }
  html[data-design] .lesson-topline { margin-bottom:5px; }
  html[data-design] .lesson-variant { gap:9px; }
  html[data-design] .lesson-subject,
  html[data-design=focus] .lesson-subject { font-size:14px; line-height:1.5; gap:6px; }
  html[data-design] .lesson-meta { font-size:11px; margin-top:5px; }
  html[data-design] .room { font-size:12px; }
  html[data-design] .subgroup { min-width:22px; height:22px; padding:0 5px; font-size:11px; }
  html[data-design] .lesson-variant+.lesson-variant { padding-top:13px; margin-top:13px; }
  html[data-design] .agenda-title { align-items:flex-start; gap:9px; }
  html[data-design] .agenda-title h2 { font-size:16px; }
  html[data-design] .agenda-title .count { font-size:11px; margin-left:5px; }
  html[data-design] .pdf-link { font-size:11px; white-space:normal; flex-shrink:0; }
  html[data-design] .week-original { max-width:115px; }
  html[data-design] .schedule-status { margin-top:20px; gap:8px; font-size:11px; }
  html[data-design] .schedule-status>span { gap:5px; }
  html[data-design] .schedule-status .text-link { font-size:11px; }
  html[data-design] .page-footer { margin-top:18px; padding-top:17px; grid-template-columns:38px minmax(0,1fr); gap:3px 10px; }
  html[data-design] .footer-brand img { width:38px; height:38px; border-radius:9px; }
  html[data-design] .footer-brand>span { font-size:12px; }
  html[data-design] .page-footer p { font-size:11px; }
  html[data-design] .mobile-nav { padding-left:7px; padding-right:7px; }
  html[data-design] .mobile-nav button { font-size:11px; letter-spacing:-.2px; }
  html[data-design=rhythm] .lesson-row { gap:8px; }
  html[data-design=rhythm] .lesson-row::before { left:calc(var(--timeline-time) + 8px + var(--timeline-marker) / 2); }
  html[data-design=rhythm] .lesson-row:last-child::before { bottom:calc(100% - 39px); }
  html[data-design=rhythm] .pair-marker { margin-top:18px; }
  html[data-design=rhythm] .lesson-card { padding:16px 0; }
  html[data-design=rhythm] .lesson-row.current .lesson-card { margin:7px 0; padding:12px 10px; }
  html[data-design=rhythm] .lesson-row.current .lesson-subject { font-size:15px; }
  html[data-design=rhythm] .lesson-row.current .room { font-size:22px; }
  html[data-design=rhythm] .lesson-row.current .lesson-variant { gap:8px; }
  html[data-design=rhythm] .lesson-countdown { flex-wrap:wrap; gap:5px 10px; padding-top:10px; margin-top:12px; }
  html[data-design=rhythm] .lesson-countdown strong { margin-left:auto; font-size:16px; }
  html[data-design=rhythm] .rhythm-headers { gap:8px; }
  html[data-design=rhythm] .week-strip { padding-bottom:14px; margin-bottom:15px; }
  html[data-design=rhythm] .day-button { min-height:61px; }
  html[data-design] :is(.group-dialog,.timer-dialog,.appearance-dialog) {
    position:fixed;
    inset:auto 0 0;
    width:100%;
    max-width:none;
    max-height:90dvh;
    margin:0;
    padding:24px 19px calc(22px + var(--safe-bottom));
    border-radius:24px 24px 0 0;
    border-bottom:0;
  }
  html[data-design] .dialog-header h2,
  html[data-design] .timer-dialog .dialog-header h2 { font-size:23px; }
  html[data-design] .group-results { max-height:42dvh; }
  html[data-design] .info-dialog { width:calc(100% - 30px); padding:23px; }
  html[data-design] .info-dialog>h2 { font-size:29px; }
  html[data-design] .timer-field { gap:14px; }
  html[data-design] .timer-form-actions { gap:12px; }
  html[data-design] .timer-form-actions .primary-button { min-width:115px; }
  html[data-design] .sheet-dialog { padding:20px 16px; }
  html[data-design] .sheet-dialog .dialog-header h2 { font-size:22px; }
  html[data-design] .appearance-options { gap:7px; }
  html[data-design] .appearance-options button { padding:7px; gap:7px; border-radius:10px; }
  html[data-design] .appearance-options strong { font-size:13px; }
  html[data-design] .appearance-preview { height:82px; }
  html[data-design] .appearance-options button>span { font-size:11px; }
  html[data-design] .appearance-preview[data-preview=focus]::after { top:34px; height:40px; }
  html[data-design] .appearance-preview[data-preview=clear]::after { top:35px; height:26px; }
  html[data-design] :is(.teacher-picker-intro,.teacher-detail-head,.teacher-timer) { padding:19px 17px; }
  html[data-design] :is(.teacher-picker-intro,.teacher-detail-head) h2 { font-size:24px; }
  html[data-design] .teacher-row { grid-template-columns:minmax(0,1fr) minmax(88px,36%); gap:10px; padding:16px 14px; }
  html[data-design] .teacher-row-main strong { font-size:14px; }
  html[data-design] .teacher-row-main>span { font-size:11px; white-space:normal; }
  html[data-design] .teacher-row-summary { font-size:11px; }
  html[data-design] .teacher-row>svg { display:none; }
  html[data-design] .teacher-timer-value { font-size:26px; }
  html[data-design] .teacher-timer .timer-body { flex-wrap:wrap; gap:14px; }
  html[data-design] .teacher-week-day { padding:18px 14px; }
  html[data-design] .teacher-week-row { grid-template-columns:34px minmax(0,1fr); gap:10px; }
  html[data-design] .teacher-week-rooms { grid-column:2; flex-direction:row; flex-wrap:wrap; align-items:center; margin-top:-4px; }
  html[data-design] .teacher-bell-list { grid-template-columns:minmax(0,1fr); }
  html[data-design] .bell-row { padding:17px; }
  html[data-design] .bell-parts { font-size:14px; }
}
@media (max-width:360px) {
  html[data-design] { --timeline-time:45px; --timeline-marker:21px; }
  html[data-design] .main-content,
  html[data-design=focus] .main-content { padding-left:13px; padding-right:13px; }
  html[data-design] .mobile-brand .brand { font-size:22px; gap:5px; }
  html[data-design] .brand-mark.brand-logo { width:28px; height:26px; }
  html[data-design] .topbar { gap:4px; }
  html[data-design] .header-actions { gap:0; }
  html[data-design] .calendar-toolbar { flex-wrap:wrap; }
  html[data-design] .calendar-toolbar>div:first-child { flex:1 1 130px; }
  html[data-design] .calendar-toolbar p { max-width:none; }
  html[data-design] .week-arrows { margin-left:auto; }
  html[data-design] .mobile-nav button { font-size:11px; }
  html[data-design] .mobile-nav button:nth-child(2) { flex-grow:1.5; }
  html[data-design] .timer-card .timer-main { gap:9px; }
  html[data-design] .timer-card #timer-room-value { font-size:30px; }
  html[data-design=focus] .timer-card .timer-main { display:block; }
  html[data-design=focus] .timer-card .timer-room { display:flex; justify-content:space-between; align-items:center; max-width:none; margin-top:13px; padding:12px; gap:10px; }
  html[data-design=focus] .timer-card .timer-room small { max-width:85px; text-align:right; }
  html[data-design=focus] .timer-card #timer-title { font-size:19px; }
  html[data-design] .timer-card #timer-value { font-size:18px; }
  html[data-design] .appearance-options { grid-template-columns:minmax(0,1fr); }
  html[data-design] .appearance-options button { display:grid; grid-template-columns:78px minmax(0,1fr); gap:4px 11px; padding:8px; }
  html[data-design] .appearance-preview { grid-row:1 / 3; height:65px; }
  html[data-design] .appearance-options strong { align-self:end; }
  html[data-design] .appearance-options button>span { align-self:start; }
}
@media (prefers-reduced-motion:reduce) {
  html[data-design] *,html[data-design] *::before,html[data-design] *::after {
    transition:none;
    animation-duration:.01ms;
    scroll-behavior:auto;
  }
}
