html, body { margin: 0; padding: 0; background: var(--body-bg); }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
::selection { background: rgba(236, 48, 19, .18); }
a { color: #ec3013; text-decoration: none; }
a:hover { color: #b8240d; }

:root {
  --accent: #ec3013; --accent-rgb: 236, 48, 19; --select-blue: #3b7bf6;

  /* Токены темы: --ink-rgb — «чернильный» текст/линии, --glass-rgb —
     заливка стеклянных панелей, --text — базовый цвет текста. В тёмной
     теме просто переопределяются ниже, и всё, что на них завязано
     (десятки rgba(var(--ink-rgb), alpha) по всему файлу), меняется само. */
  --ink-rgb: 26, 28, 34;
  --glass-rgb: 255, 255, 255;
  --text: #1a1c22;
  --glass-hover: #fff;
  --body-bg: #e9eef7;
  --page-gradient: linear-gradient(160deg, #eaf0fb 0%, #f4eef8 45%, #eef4f2 100%);
  --overlay-bg: rgba(24, 28, 40, .28);
}

:root[data-theme="dark"] {
  --ink-rgb: 226, 230, 240;     /* текст светлеет */
  --glass-rgb: 36, 40, 54;      /* стеклянные панели темнеют */
  --text: #e7eaf3;
  --glass-hover: #383d52;
  --body-bg: #0f1220;
  --page-gradient: linear-gradient(160deg, #14172a 0%, #1a1830 45%, #101a22 100%);
  --overlay-bg: rgba(4, 6, 14, .55);
}

/* Тёмная тема по умолчанию, если пользователь ещё не выбирал вручную —
   ориентируемся на системную настройку. Явный выбор (data-theme на html)
   всегда побеждает за счёт более высокой специфичности выше по каскаду. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink-rgb: 226, 230, 240;
    --glass-rgb: 36, 40, 54;
    --text: #e7eaf3;
    --glass-hover: #383d52;
    --body-bg: #0f1220;
    --page-gradient: linear-gradient(160deg, #14172a 0%, #1a1830 45%, #101a22 100%);
    --overlay-bg: rgba(4, 6, 14, .55);
  }
}

@keyframes riseA { from { opacity: 0; transform: translateY(22px) scale(.985); filter: blur(6px); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes floatA { 0%, 100% { transform: translate3d(0, 0, 0) scale(1); } 50% { transform: translate3d(6vw, -4vh, 0) scale(1.15); } }
@keyframes floatB { 0%, 100% { transform: translate3d(0, 0, 0) scale(1.1); } 50% { transform: translate3d(-7vw, 5vh, 0) scale(.95); } }
@keyframes floatC { 0%, 100% { transform: translate3d(0, 0, 0) scale(1); } 50% { transform: translate3d(4vw, 6vh, 0) scale(1.2); } }
@keyframes sheen { from { transform: translateX(-100%); } to { transform: translateX(450%); } }
@keyframes fadeIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@keyframes backdropIn { from { opacity: 0; backdrop-filter: blur(0px); } to { opacity: 1; backdrop-filter: blur(18px); } }
@keyframes sheetIn { from { opacity: 0; transform: translateY(40px) scale(.94); filter: blur(10px); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes itemIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes weekSlideIn { from { opacity: 0; transform: translateX(var(--slide-x, 24px)); } to { opacity: 1; transform: translateX(0); } }
@keyframes weekLabelFade { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

.page {
  position: relative; min-height: 100vh; width: 100%; overflow: hidden;
  font-family: Archivo, system-ui, sans-serif; color: var(--text);
  background: var(--page-gradient);
  padding: 40px 32px 72px;
  transition: background .4s ease, color .4s ease;
}

.bg-blobs { position: fixed; inset: 0; z-index: 0; pointer-events: none; filter: blur(70px); opacity: .75; }
.blob { position: absolute; border-radius: 50%; }
.blob-a { top: -10vh; left: -6vw; width: 46vw; height: 46vw; background: radial-gradient(circle at 35% 35%, #7aa8ff, rgba(122,168,255,0)); animation: floatA 18s ease-in-out infinite; }
.blob-b { bottom: -16vh; right: -4vw; width: 42vw; height: 42vw; background: radial-gradient(circle at 50% 50%, #ff8f7a, rgba(255,143,122,0)); animation: floatB 22s ease-in-out infinite; }
.blob-c { top: 28vh; left: 38vw; width: 34vw; height: 34vw; background: radial-gradient(circle at 50% 50%, #9be7d0, rgba(155,231,208,0)); animation: floatC 26s ease-in-out infinite; }

.content { position: relative; z-index: 1; max-width: 1120px; margin: 0 auto; display: flex; flex-direction: column; gap: 22px; }

.header { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; animation: fadeIn .6s ease both; }
.titleblock { display: flex; flex-direction: column; gap: 6px; }
.eyebrow { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: rgba(var(--ink-rgb),.5); }
.title { margin: 0; font-size: 44px; font-weight: 800; letter-spacing: -.02em; }

.controls { display: flex; align-items: center; gap: 10px; }

.glass {
  border: 1px solid rgba(255,255,255,.7);
  background: rgba(var(--glass-rgb),.45);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  box-shadow: 0 8px 24px rgba(31,45,80,.12), inset 0 1px 0 rgba(255,255,255,.9);
}

.btn-pill {
  font-family: inherit; font-size: 14px; font-weight: 600; color: var(--text);
  padding: 12px 20px; border-radius: 999px; border: 1px solid rgba(255,255,255,.7);
  background: rgba(var(--glass-rgb),.45); backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  box-shadow: 0 8px 24px rgba(31,45,80,.12), inset 0 1px 0 rgba(255,255,255,.9);
  cursor: pointer; transition: transform .35s cubic-bezier(.2,.8,.25,1), background .35s ease, box-shadow .35s ease;
}
.btn-pill:hover { background: rgba(var(--glass-rgb),.72); transform: translateY(-2px); box-shadow: 0 14px 34px rgba(31,45,80,.18), inset 0 1px 0 rgba(255,255,255,1); }
.btn-pill:active { transform: translateY(0) scale(.97); }

.weeknav {
  display: flex; align-items: center; gap: 14px; padding: 8px 10px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.7); background: rgba(var(--glass-rgb),.45);
  backdrop-filter: blur(24px) saturate(180%); -webkit-backdrop-filter: blur(24px) saturate(180%);
  box-shadow: 0 8px 24px rgba(31,45,80,.12), inset 0 1px 0 rgba(255,255,255,.9);
}
.btn-round {
  font-family: inherit; width: 36px; height: 36px; border-radius: 50%; border: none;
  background: rgba(var(--glass-rgb),.55); color: var(--text); font-size: 17px; line-height: 1; cursor: pointer;
  transition: transform .3s cubic-bezier(.2,.8,.25,1), background .3s ease;
}
.btn-round:hover { background: var(--glass-hover); transform: scale(1.12); }
.btn-round:active { transform: scale(.9); }
.weekLabel { font-size: 14px; font-weight: 600; letter-spacing: .01em; min-width: 150px; text-align: center; }

/* Переключатель темы — солнце/луна крест-накрест, видна только нужная */
.theme-toggle { position: relative; flex-shrink: 0; }
.theme-toggle svg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(0deg) scale(1); transition: opacity .25s ease, transform .4s cubic-bezier(.2,.8,.25,1); }
.theme-toggle .icon-sun { opacity: 0; transform: translate(-50%, -50%) rotate(-60deg) scale(.5); }
.theme-toggle .icon-moon { opacity: 1; }
:root[data-theme="dark"] .theme-toggle .icon-sun { opacity: 1; transform: translate(-50%, -50%) rotate(0deg) scale(1); }
:root[data-theme="dark"] .theme-toggle .icon-moon { opacity: 0; transform: translate(-50%, -50%) rotate(60deg) scale(.5); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-toggle .icon-sun { opacity: 1; transform: translate(-50%, -50%) rotate(0deg) scale(1); }
  :root:not([data-theme="light"]) .theme-toggle .icon-moon { opacity: 0; transform: translate(-50%, -50%) rotate(60deg) scale(.5); }
}

/* Ряд «Сегодня» + «Календарь» под панелью выбора дня — кнопки одного размера */
.day-actions { display: flex; gap: 10px; }
.day-actions .btn-pill {
  flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}
.day-actions .btn-pill svg { flex-shrink: 0; opacity: .65; }

.holiday {
  position: relative; display: flex; align-items: center; gap: 16px; padding: 16px 20px; border-radius: 24px;
  border: 1px solid rgba(255,255,255,.75); background: linear-gradient(120deg, rgba(255,109,74,.32), rgba(255,190,90,.28));
  backdrop-filter: blur(26px) saturate(190%); -webkit-backdrop-filter: blur(26px) saturate(190%);
  box-shadow: 0 16px 40px rgba(200,70,30,.16), inset 0 1px 0 rgba(255,255,255,.9);
  animation: fadeIn .6s .1s ease both; overflow: hidden;
}
.sheen { position: absolute; top: 0; bottom: 0; width: 24%; background: linear-gradient(105deg, rgba(255,255,255,0), rgba(255,255,255,.55), rgba(255,255,255,0)); animation: sheen 6s ease-in-out infinite; pointer-events: none; }
.holiday-emoji { position: relative; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 16px; flex-shrink: 0; background: rgba(var(--glass-rgb),.55); box-shadow: inset 0 1px 0 #fff; font-size: 22px; }
.holiday-text { position: relative; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.holiday-title { font-size: 16px; font-weight: 800; letter-spacing: -.01em; }
.holiday-subtitle { font-size: 13px; font-weight: 500; color: rgba(var(--ink-rgb),.62); }
.btn-close {
  position: relative; margin-left: auto; width: 32px; height: 32px; flex-shrink: 0; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.8); background: rgba(var(--glass-rgb),.5); color: var(--text); font-family: inherit;
  font-size: 14px; line-height: 1; cursor: pointer; transition: transform .3s cubic-bezier(.2,.8,.25,1), background .3s ease;
}
.btn-close:hover { background: var(--glass-hover); transform: scale(1.1); }
.btn-close:active { transform: scale(.9); }

.week {
  position: relative; overflow: hidden; padding: 10px; border-radius: 30px; border: 1px solid rgba(255,255,255,.75);
  background: rgba(var(--glass-rgb),.38); backdrop-filter: blur(30px) saturate(190%); -webkit-backdrop-filter: blur(30px) saturate(190%);
  box-shadow: 0 20px 50px rgba(31,45,80,.16), inset 0 1px 0 rgba(255,255,255,.95); animation: fadeIn .7s .05s ease both;
  touch-action: pan-y; /* оставляем вертикальный скролл странице, горизонтальный жест перехватываем сами */
}
.week-inner { position: relative; }
/* Анимация при переключении недели — слайд+фейд содержимого полосы дней */
.week-inner.week-slide { animation: weekSlideIn .38s cubic-bezier(.2,.8,.25,1) both; }
.weekLabel.week-fade { animation: weekLabelFade .3s ease both; }

.days { position: relative; display: grid; grid-template-columns: repeat(7, 1fr); user-select: none; }
.day {
  font-family: inherit; margin: 0 4px; padding: 14px 4px 10px; border: none; background: transparent; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 10px; border-radius: 22px;
  transition: transform .35s cubic-bezier(.2,.8,.25,1);
}
.day:hover { transform: translateY(-3px); }
.day:active { transform: scale(.96); }
.day-short { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(var(--ink-rgb),.45); }

/* Число дня — круглый бейдж. Цвет фона зависит от типа события в этот день,
   синяя обводка/заливка — от выбора дня (не путать одно с другим). */
.day-num {
  width: 42px; height: 42px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 19px; font-weight: 700; line-height: 1; color: var(--text); background: transparent;
  transition: background .3s ease, color .3s ease, box-shadow .3s ease; box-shadow: 0 0 0 0 transparent;
}
.day-num.flag-important { background: #ff2d1a; color: #fff; }
.day-num.flag-sub { background: #ffb300; color: #3a2400; }
.day-num.flag-both { background: linear-gradient(90deg, #ff2d1a 50%, #ffb300 50%); color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.day-num.is-selected:not(.flag-important):not(.flag-sub):not(.flag-both) { background: var(--select-blue); color: #fff; }
/* inset, а не outer box-shadow — обводка не должна вылезать на соседний день */
.day-num.is-selected { box-shadow: inset 0 0 0 3px var(--select-blue); }

.day-meta { font-size: 11px; font-weight: 600; letter-spacing: .04em; color: rgba(var(--ink-rgb),.4); }

.heading-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 0 6px; }
.heading { margin: 0; font-size: 26px; font-weight: 700; letter-spacing: -.01em; }
.summary { font-size: 14px; font-weight: 500; color: rgba(var(--ink-rgb),.55); }

.lessons { display: flex; flex-direction: column; gap: 12px; }
.lesson {
  display: grid; grid-template-columns: 96px 1fr auto; gap: 22px; align-items: center; padding: 20px 24px;
  border-radius: 26px; cursor: pointer; border: 1px solid rgba(255,255,255,.7); background: rgba(var(--glass-rgb),.42);
  backdrop-filter: blur(26px) saturate(185%); -webkit-backdrop-filter: blur(26px) saturate(185%);
  box-shadow: 0 14px 36px rgba(31,45,80,.12), inset 0 1px 0 rgba(255,255,255,.9);
  transition: transform .4s cubic-bezier(.2,.8,.25,1), box-shadow .4s ease, background .4s ease;
  animation: riseA .6s cubic-bezier(.2,.8,.25,1) both;
}
.lesson:hover { transform: translateY(-4px) scale(1.006); background: rgba(var(--glass-rgb),.62); box-shadow: 0 24px 54px rgba(31,45,80,.2), inset 0 1px 0 #fff; }
.lesson-time { display: flex; flex-direction: column; gap: 4px; border-right: 1px solid rgba(var(--ink-rgb),.12); padding-right: 18px; }
.lesson-index { font-size: 11px; font-weight: 700; letter-spacing: .16em; color: rgba(var(--ink-rgb),.42); }
.lesson-start { font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
.lesson-end { font-size: 13px; font-weight: 500; color: rgba(var(--ink-rgb),.5); }
.lesson-main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.badge { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; padding: 4px 10px 4px 8px; border-radius: 8px; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.badge-important { background: #ff2d1a; color: #fff; box-shadow: 0 4px 14px rgba(255,45,26,.4); }
.badge-sub { background: #ffb300; color: #3a2400; box-shadow: 0 4px 14px rgba(255,179,0,.4); }
.lesson-nameline { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.lesson-name { font-size: 20px; font-weight: 700; letter-spacing: -.01em; }
.lesson-name.is-cancelled, .sheetTitle.is-cancelled { text-decoration: line-through; text-decoration-thickness: 2px; opacity: .55; }
.lesson-room { font-size: 14px; letter-spacing: .02em; }
.lesson-hw { font-size: 13px; font-weight: 500; color: rgba(var(--ink-rgb),.72); line-height: 1.5; }
.lesson-file {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; margin-top: 2px; padding: 9px 14px;
  border-radius: 14px; font-size: 13px; font-weight: 600; color: var(--text); border: 1px solid rgba(255,255,255,.85);
  background: rgba(var(--glass-rgb),.55); box-shadow: 0 6px 18px rgba(31,45,80,.1), inset 0 1px 0 #fff;
  transition: transform .35s cubic-bezier(.2,.8,.25,1), background .35s ease, box-shadow .35s ease;
}
.lesson-file:hover { background: var(--glass-hover); transform: translateY(-2px); box-shadow: 0 12px 26px rgba(31,45,80,.16), inset 0 1px 0 #fff; color: var(--text); }
.lesson-chev { font-size: 22px; font-weight: 400; color: rgba(var(--ink-rgb),.3); transition: transform .35s cubic-bezier(.2,.8,.25,1), color .35s ease; }

.empty {
  display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 72px 24px; border-radius: 30px;
  border: 1px solid rgba(255,255,255,.7); background: rgba(var(--glass-rgb),.36); backdrop-filter: blur(26px) saturate(180%);
  -webkit-backdrop-filter: blur(26px) saturate(180%); box-shadow: 0 16px 40px rgba(31,45,80,.12), inset 0 1px 0 rgba(255,255,255,.9);
  animation: riseA .6s cubic-bezier(.2,.8,.25,1) both;
}
.empty-title { font-size: 24px; font-weight: 700; }
.empty-sub { font-size: 15px; font-weight: 500; color: rgba(var(--ink-rgb),.55); }

.overlay {
  position: fixed; inset: 0; z-index: 20; display: flex; align-items: center; justify-content: center; padding: 24px;
  background: var(--overlay-bg); backdrop-filter: blur(18px) saturate(150%); -webkit-backdrop-filter: blur(18px) saturate(150%);
  animation: backdropIn .35s ease both;
}
.sheet {
  position: relative; width: 100%; max-width: 620px; max-height: 88vh; overflow: hidden;
  border-radius: 34px; border: 1px solid rgba(255,255,255,.8);
  background: linear-gradient(180deg, rgba(var(--glass-rgb),.78), rgba(var(--glass-rgb),.58));
  backdrop-filter: blur(40px) saturate(200%); -webkit-backdrop-filter: blur(40px) saturate(200%);
  box-shadow: 0 40px 90px rgba(20,30,60,.28), inset 0 1px 0 #fff; animation: sheetIn .5s cubic-bezier(.2,.9,.25,1) both;
  display: flex; flex-direction: column;
}
/* Крестик закрытия — фиксирован над областью контента, не уезжает при скролле */
.sheet-close {
  position: absolute; top: 18px; right: 18px; z-index: 3;
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 20px rgba(31,45,80,.16), inset 0 1px 0 rgba(255,255,255,.9);
}
.sheet-close:hover { transform: rotate(90deg) scale(1.08); background: var(--glass-hover); }
.sheet-close:active { transform: rotate(90deg) scale(.94); }
.sheet-close:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sheet-body { overflow-y: auto; padding: 34px 36px 36px; }
.sheet-head { display: flex; flex-direction: column; gap: 6px; padding-right: 46px; animation: itemIn .45s .05s ease both; }
.detail-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.kicker { font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.sheetTitle { margin: 0; font-size: 32px; font-weight: 800; letter-spacing: -.02em; }
.facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 24px; animation: itemIn .45s .12s ease both; }
.fact { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; border-radius: 20px; border: 1px solid rgba(255,255,255,.85); background: rgba(var(--glass-rgb),.5); box-shadow: inset 0 1px 0 #fff; }
.fact-label { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(var(--ink-rgb),.45); }
.fact-value { font-size: 19px; font-weight: 700; }
.fact-value.accent { font-size: 24px; font-weight: 800; letter-spacing: -.01em; }
.block { display: flex; flex-direction: column; gap: 8px; margin-top: 24px; animation: itemIn .45s .18s ease both; }
.block-label { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(var(--ink-rgb),.45); }
.block-value { font-size: 17px; font-weight: 600; line-height: 1.45; }
.block.boxed { padding: 18px 20px; border-radius: 22px; border: 1px solid rgba(255,255,255,.85); background: rgba(var(--glass-rgb),.45); box-shadow: inset 0 1px 0 #fff; animation-delay: .24s; }
.block.boxed .block-value { font-size: 15px; font-weight: 500; line-height: 1.55; color: rgba(var(--ink-rgb),.85); }

.filebox {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 22px;
  padding: 16px 18px; border-radius: 22px; border: 1px solid rgba(255,255,255,.85); background: rgba(var(--glass-rgb),.5);
  box-shadow: inset 0 1px 0 #fff; animation: itemIn .45s .3s ease both;
}
.filebox-left { display: flex; align-items: center; gap: 12px; min-width: 0; color: var(--text); border-radius: 14px; transition: opacity .2s ease; }
.filebox-left:hover { opacity: .75; }
.filebox-icon { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 14px; background: rgba(var(--glass-rgb),.75); box-shadow: inset 0 1px 0 #fff; font-size: 18px; }
.filebox-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.filebox-name { font-size: 15px; font-weight: 700; }
.filebox-size { font-size: 12px; font-weight: 500; color: rgba(var(--ink-rgb),.5); }
.btn-download {
  display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 16px; font-size: 14px;
  font-weight: 700; color: #fff; border: 1px solid rgba(255,255,255,.35); box-shadow: 0 10px 26px rgba(31,45,80,.22);
  transition: transform .35s cubic-bezier(.2,.8,.25,1), box-shadow .35s ease, filter .35s ease;
}
.btn-download:hover { transform: translateY(-2px); filter: brightness(1.06); color: #fff; box-shadow: 0 16px 34px rgba(31,45,80,.28); }
.btn-download:active { transform: scale(.97); }

/* ---------- Модалка выбора даты (календарь на месяц) ---------- */
.cal-overlay {
  position: fixed; inset: 0; z-index: 25; display: flex; align-items: center; justify-content: center; padding: 20px;
  background: var(--overlay-bg); backdrop-filter: blur(18px) saturate(150%); -webkit-backdrop-filter: blur(18px) saturate(150%);
  animation: backdropIn .35s ease both;
}
.cal-sheet {
  position: relative; width: 100%; max-width: 380px; max-height: 90vh; overflow-y: auto;
  padding: 22px 20px 24px; border-radius: 30px; border: 1px solid rgba(255,255,255,.8);
  background: linear-gradient(180deg, rgba(var(--glass-rgb),.82), rgba(var(--glass-rgb),.62));
  backdrop-filter: blur(40px) saturate(200%); -webkit-backdrop-filter: blur(40px) saturate(200%);
  box-shadow: 0 40px 90px rgba(20,30,60,.28), inset 0 1px 0 #fff;
  animation: sheetIn .4s cubic-bezier(.2,.9,.25,1) both;
  display: flex; flex-direction: column; gap: 16px;
}
.cal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cal-title { font-size: 15px; font-weight: 700; }
.cal-today-link {
  font-family: inherit; font-size: 13px; font-weight: 700; color: var(--accent); background: none; border: none;
  cursor: pointer; padding: 6px 4px; transition: opacity .2s ease;
}
.cal-today-link:hover { opacity: .7; }
.cal-monthnav {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.75); background: rgba(var(--glass-rgb),.5); box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.cal-monthlabel { font-size: 14px; font-weight: 700; text-transform: capitalize; }
.cal-weekdays { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; }
.cal-weekdays span { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(var(--ink-rgb),.42); }
.cal-days { display: grid; grid-template-columns: repeat(7, 1fr); row-gap: 6px; }
.cal-day {
  font-family: inherit; width: 100%; aspect-ratio: 1; margin: 0 auto; max-width: 40px; border: none; background: transparent;
  border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer;
  font-size: 14px; font-weight: 600; color: var(--text); transition: background .25s ease, color .25s ease, box-shadow .25s ease, transform .2s ease;
}
.cal-day:hover { transform: scale(1.08); }
.cal-day:active { transform: scale(.94); }
.cal-day.outside { color: rgba(var(--ink-rgb),.28); }
.cal-day.is-today-cell:not(.is-selected) { box-shadow: inset 0 0 0 1.5px rgba(var(--accent-rgb), .55); font-weight: 800; }
.cal-day.flag-important { background: #ff2d1a; color: #fff; }
.cal-day.flag-sub { background: #ffb300; color: #3a2400; }
.cal-day.flag-both { background: linear-gradient(90deg, #ff2d1a 50%, #ffb300 50%); color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.cal-day.is-selected:not(.flag-important):not(.flag-sub):not(.flag-both) { background: var(--select-blue); color: #fff; }
/* inset — иначе на тесной мобильной сетке обводка визуально задевает соседнюю ячейку */
.cal-day.is-selected { box-shadow: inset 0 0 0 3px var(--select-blue); }
.cal-apply {
  font-family: inherit; width: 100%; padding: 14px; border: none; border-radius: 16px; font-size: 15px; font-weight: 700;
  color: #fff; background: var(--select-blue); cursor: pointer; box-shadow: 0 10px 26px rgba(59,123,246,.35);
  transition: transform .3s cubic-bezier(.2,.8,.25,1), filter .3s ease;
}
.cal-apply:hover { filter: brightness(1.06); transform: translateY(-1px); }
.cal-apply:active { transform: translateY(0) scale(.98); }

@media (max-width: 700px) {
  .cal-sheet { padding: 18px 16px 20px; border-radius: 26px; }
}

@media (max-width: 700px) {
  .page { padding: 20px 14px 48px; }
  .header { align-items: stretch; gap: 10px; }
  .title { font-size: 30px; }
  .controls { width: 100%; }
  .weeknav { width: 100%; justify-content: space-between; }
  .weekLabel { font-size: 13px; min-width: 0; }
  .btn-round { width: 32px; height: 32px; font-size: 15px; }

  .week { border-radius: 24px; padding: 10px 6px; box-shadow: 0 14px 34px rgba(31,45,80,.18), inset 0 1px 0 rgba(255,255,255,.95); }
  .day { margin: 0 1px; padding: 10px 2px 8px; gap: 7px; border-radius: 18px; }
  .day-short { font-size: 10.5px; letter-spacing: .06em; }
  .day-num { width: 34px; height: 34px; font-size: 16px; }
  .day-meta { display: none; }

  .day-actions .btn-pill { padding: 10px 12px; font-size: 13px; }

  .heading { font-size: 21px; }
  .lesson { grid-template-columns: 1fr; gap: 12px; padding: 16px; border-radius: 20px; }
  .lesson-time { flex-direction: row; align-items: baseline; gap: 10px; border-right: none; border-bottom: 1px solid rgba(var(--ink-rgb),.12); padding: 0 0 10px; }
  .lesson-name { font-size: 18px; }
  .lesson-room { font-size: 13px; }
  .lesson-chev { display: none; }

  /* Карточка урока (детальная модалка) — на мобильном была сжата из-за
     двойного отступа: .sheet больше не имеет собственного padding (он
     теперь только на .sheet-body), здесь уменьшаем поля под маленький
     экран и даём модалке больше рабочей ширины. */
  .overlay { padding: 10px; }
  .sheet { border-radius: 26px; }
  .sheet-body { padding: 22px 18px 24px; }
  .sheet-head { padding-right: 40px; }
  .sheetTitle { font-size: 24px; }
  .facts { gap: 10px; }
  .fact { padding: 12px 14px; border-radius: 16px; }
  .fact-value.accent { font-size: 20px; }
}