:root {
  --sm-ink: #0b1d3a;
  --sm-muted: #71809b;
  --sm-page: #f3f6fa;
  --sm-card: rgba(255,255,255,.92);
  --sm-blue: #1677f2;
  --sm-line: rgba(101,126,164,.16);
  --sm-shadow: 0 18px 44px rgba(36,68,113,.10), 0 2px 8px rgba(36,68,113,.05);
}

* { box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  overflow-y: overlay;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}
html.is-scrolling { scrollbar-color: rgba(72,100,136,.42) transparent; }
html::-webkit-scrollbar { width: 7px; }
html::-webkit-scrollbar-track { background: transparent; }
html::-webkit-scrollbar-thumb { border-radius: 999px; background: transparent; }
html.is-scrolling::-webkit-scrollbar-thumb { background: rgba(72,100,136,.42); }
body {
  margin: 0;
  color: var(--sm-ink);
  background: var(--sm-page);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
button { color: inherit; }

.page.app-shell {
  width: min(1120px, calc(100% - 28px));
  margin: 14px auto 48px;
}

.app-header {
  position: sticky;
  top: 8px;
  z-index: 30;
  min-height: 92px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 16px 20px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 28px;
  background: rgba(231,241,253,.82);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.98), inset 0 -1px 0 rgba(123,171,228,.15), 0 16px 38px rgba(52,92,145,.12);
  backdrop-filter: blur(24px) saturate(145%);
  clip-path: inset(0 0 0 0 round 28px);
  transition: clip-path .22s ease, border-radius .22s ease, box-shadow .22s ease;
}
.app-header > * { transition: transform .22s ease; }
.app-header.is-compact {
  border-radius: 0 0 22px 22px;
  clip-path: inset(0 0 20px 0 round 0 0 22px 22px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.98), 0 10px 26px rgba(52,92,145,.10);
}
.app-header.is-compact > * { transform: translateY(-10px); }
.brand {
  width: max-content;
  color: var(--sm-ink);
  font-size: 27px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -.055em;
  text-decoration: none;
}
.brand span { color: var(--sm-blue); }
.app-header.is-compact .brand { font-size: 23px; }
.class-switch {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 14px;
  border: 0;
  border-radius: 16px;
  background: transparent;
  font-size: 26px;
  font-weight: 900;
  cursor: default;
}
.class-info { min-width: 0; display: grid; justify-items: center; align-content: center; }
.class-meta { max-height: 16px; margin-top: -4px; color: #536b8a; font-size: 12px; line-height: 1.2; font-weight: 750; white-space: nowrap; opacity: 1; transition: max-height .18s ease, margin .18s ease, opacity .14s ease, transform .18s ease; }
.app-header.is-compact .class-switch { min-height: 34px; font-size: 22px; }
.app-header.is-compact .class-meta { max-height: 0; margin-top: 0; opacity: 0; transform: translateY(-5px); }
.class-switch .lucide { width: 19px; height: 19px; }
.header-actions { justify-self: end; display: flex; gap: 10px; }
.round-action, .calendar-button, .week-arrow, .icon-close, .calendar-month-arrow {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.84);
  border-radius: 50%;
  background: rgba(255,255,255,.54);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96), 0 8px 18px rgba(36,68,113,.09);
  cursor: pointer;
}
.round-action .lucide { width: 24px; height: 24px; stroke-width: 2.2; }
.app-header.is-compact .round-action { width: 44px; height: 44px; }
.app-header.is-compact .round-action .lucide { width: 21px; height: 21px; }
.round-action:hover, .calendar-button:hover, .week-arrow:hover { background: rgba(255,255,255,.82); }

.date-navigator {
  position: sticky;
  top: 116px;
  z-index: 24;
  margin: 14px 0 20px;
  height: 122px;
  padding: 9px 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.85);
  border-radius: 26px;
  background: rgba(255,255,255,.78);
  box-shadow: inset 0 1px 0 #fff, 0 13px 34px rgba(36,68,113,.08);
  backdrop-filter: blur(22px) saturate(145%);
  clip-path: inset(-28px -28px -28px -28px round 26px);
  transition: top .22s ease, border-radius .2s ease, box-shadow .2s ease, clip-path .2s ease;
}
.date-navigator-top, .week-strip { display: flex; align-items: center; }
.date-navigator-top { height: 43px; justify-content: space-between; gap: 18px; margin: 0 0 3px; opacity: 1; transform: translateY(0); transition: opacity .16s ease, transform .2s ease; }
.date-navigator.is-compact { top: 70px; overflow: visible; border-color: transparent; border-radius: 20px; background: transparent; box-shadow: none; backdrop-filter: none; clip-path: none; }
.date-navigator.is-compact .date-navigator-top { opacity: 0; transform: translateY(-12px); pointer-events: none; }
.date-navigator.is-compact .week-strip {
  min-height: 68px;
  padding-top: 6px;
  padding-bottom: 6px;
  transform: translateY(-43px);
  border: 1px solid rgba(255,255,255,.88);
  border-radius: 20px;
  background: rgba(255,255,255,.88);
  box-shadow: inset 0 1px 0 #fff, 0 10px 26px rgba(36,68,113,.10);
  backdrop-filter: blur(22px) saturate(145%);
}
#monthLabel { font-size: 21px; letter-spacing: -.03em; text-transform: capitalize; }
.date-actions { display: flex; align-items: center; gap: 10px; }
.today-button {
  min-height: 44px;
  padding: 0 12px;
  border: 0;
  border-radius: 14px;
  color: var(--sm-blue);
  background: transparent;
  font-weight: 800;
  cursor: pointer;
}
.calendar-button, .week-arrow { width: 40px; height: 40px; box-shadow: inset 0 1px 0 #fff, 0 7px 16px rgba(36,68,113,.07); }
.calendar-button .lucide, .week-arrow .lucide { width: 21px; height: 21px; }
.week-strip { position: relative; gap: 0; padding: 0 48px; transition: transform .2s ease; }
.week-arrow { position: absolute; z-index: 3; top: 50%; transform: translateY(-50%); }
#previousWeekBtn { left: 0; }
#nextWeekBtn { right: 0; }
.day-tabs {
  min-width: 0;
  flex: 1;
  display: grid !important;
  grid-template-columns: repeat(7, minmax(58px,1fr));
  gap: 8px;
  padding: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.day-tabs::-webkit-scrollbar { display: none; }
.day-tab {
  min-height: 56px;
  display: grid;
  place-items: center;
  gap: 1px;
  padding: 5px 6px;
  border: 1px solid transparent;
  border-radius: 18px;
  color: #667590;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
}
.day-tab .day-name { font-size: 12px; font-weight: 850; text-transform: uppercase; letter-spacing: .045em; }
.day-tab .day-number { color: var(--sm-ink); font-size: 22px; font-weight: 850; }
.day-tab .event-dot { width: 5px; height: 5px; border-radius: 50%; background: #8391a9; }
.day-tab.active {
  color: rgba(255,255,255,.82);
  background: var(--sm-blue);
  border-color: rgba(255,255,255,.75);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 10px 22px rgba(22,119,242,.25);
}
.day-tab.active .day-number { color: #fff; }
.day-tab.active .event-dot { background: #fff; }

.content-layout { width: min(820px, 100%); margin: 0 auto; }
.mobile-list { display: block !important; margin: 0; }
.schedule-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 4px 14px;
}
.schedule-title h1 { margin: 0; font-size: 26px; letter-spacing: -.035em; }
.schedule-title span { color: var(--sm-muted); font-size: 13px; font-weight: 750; }

.schedule-timeline { position: relative; padding: 0; background: transparent; border: 0; box-shadow: none; overflow: visible; }
.schedule-timeline::before {
  content: "";
  position: absolute;
  top: 32px;
  bottom: 32px;
  left: 73px;
  width: 2px;
  background: rgba(118,139,171,.24);
}
.timeline-entry { position: relative; display: grid; grid-template-columns: 64px 22px minmax(0,1fr); align-items: start; margin: 0 0 14px; }
.timeline-entry > .schedule-card, .timeline-entry > .activity-stack { grid-column: 3; }
.entry-time {
  position: static;
  grid-column: 1;
  grid-row: 1;
  width: auto;
  margin-top: 25px;
  padding-right: 10px;
  color: #536783;
  font-size: 14px;
  font-weight: 820;
  line-height: 1.42;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.entry-time span { display: block; }
.timeline-dot {
  position: absolute;
  z-index: 2;
  top: 34px;
  left: 68px;
  width: 12px;
  height: 12px;
  border: 3px solid var(--sm-page);
  border-radius: 50%;
  background: var(--tone, #8492aa);
  box-shadow: 0 0 0 2px rgba(92,112,144,.12);
}
.schedule-card {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 112px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 23px;
  background: var(--sm-card);
  box-shadow: inset 0 1px 0 #fff, inset 7px 0 0 var(--tone, #8a99b0), var(--sm-shadow);
  backdrop-filter: blur(12px) saturate(118%);
}
.schedule-card::after {
  content: "";
  position: absolute;
  pointer-events: none;
  inset: 0 0 auto;
  height: 34px;
  background: rgba(255,255,255,.24);
}
.card-toggle {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 112px;
  display: grid;
  grid-template-columns: 72px minmax(0,1fr) auto;
  align-items: center;
  gap: 15px;
  padding: 17px 18px 17px 23px;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.subject-app-icon {
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 17px;
  color: #fff;
  background: var(--tone, #72839d);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.68), inset 0 -12px 18px rgba(9,22,49,.08), 0 8px 18px color-mix(in srgb, var(--tone, #72839d) 26%, transparent);
}
.subject-app-icon .lucide { width: 34px; height: 34px; stroke-width: 2.15; }
.card-copy { min-width: 0; padding-right: 72px; }
.period-kicker { display: block; margin-bottom: 4px; color: var(--sm-blue); font-size: 12px; line-height: 1; font-weight: 850; letter-spacing: .035em; text-transform: uppercase; }
.card-copy strong { display: block; color: var(--sm-ink); font-size: 20px; line-height: 1.12; letter-spacing: -.02em; }
.teacher-line, .room-line { display: block; margin-top: 4px; color: var(--sm-muted); font-size: 13px; line-height: 1.25; }
.lesson-meta-row { min-height: 25px; display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 4px; }
.lesson-meta-row .room-line { margin-top: 0; }
.textbook-inline { width: 28px; height: 28px; display: grid; place-items: center; margin-left: 4px; border: 1px solid rgba(84,107,140,.12); border-radius: 9px; color: #aab5c4; background: rgba(245,248,252,.68); }
.textbook-inline .lucide { width: 16px; height: 16px; stroke-width: 2; }
.textbook-inline.active { color: var(--sm-blue); border-color: rgba(22,119,242,.22); background: rgba(232,242,255,.92); }
.room-line { color: #526985; font-weight: 720; }
.card-side { min-width: 24px; display: flex; align-items: center; justify-content: flex-end; }
.card-side .lucide { width: 21px; height: 21px; }
.state-badge {
  position: absolute;
  z-index: 5;
  top: -1px;
  right: 61px;
  min-width: 82px;
  min-height: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 9px;
  border-radius: 0 0 10px 10px;
  color: #61708a;
  background: rgba(105,124,153,.1);
  font-size: 11px;
  font-weight: 850;
}
.state-badge.current { color: #177b38; background: rgba(52,199,89,.16); }
.state-badge.next { color: #0b67c8; background: rgba(22,119,242,.13); }
.state-badge.cancelled { color: #c5243d; background: rgba(255,84,111,.12); }
.expanded-panel {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 18px 18px 23px;
  padding: 15px 0 0 87px;
  border-top: 1px solid var(--sm-line);
}
.detail-chip, .favorite-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid rgba(43,111,208,.16);
  border-radius: 13px;
  color: var(--sm-blue);
  background: rgba(235,244,255,.68);
  font-size: 13px;
  font-weight: 800;
}
.favorite-button { cursor: pointer; }
.favorite-button.active { color: #7150d9; background: rgba(239,233,255,.82); }
.favorite-button .lucide, .detail-chip .lucide { width: 17px; height: 17px; }

.lesson-tool { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(84,107,140,.12); border-radius: 12px; color: #9aa6b7; background: rgba(245,248,252,.76); box-shadow: inset 0 1px 0 rgba(255,255,255,.9); cursor: pointer; }
.lesson-tool .lucide { width: 19px; height: 19px; stroke-width: 2; }
.favorite-star { position: absolute; z-index: 6; top: 0; right: 0; margin: 0; }
.favorite-star.active { color: #f2a900; border-color: rgba(242,169,0,.24); background: rgba(255,246,216,.92); }
.favorite-star.active .lucide { fill: currentColor; }
.textbook-icon.active { color: var(--sm-blue); border-color: rgba(22,119,242,.22); background: rgba(232,242,255,.92); }
.textbook-icon:disabled { opacity: .52; cursor: default; }

.utility-card { width: min(68%, 430px); min-height: 74px; }
.utility-card .card-toggle { min-height: 74px; grid-template-columns: 50px minmax(0,1fr) auto; padding: 10px 14px 10px 18px; }
.utility-card .subject-app-icon { width: 44px; height: 44px; border-radius: 14px; }
.utility-card .subject-app-icon .lucide { width: 26px; height: 26px; }
.utility-card .card-copy strong { font-size: 18px; }
.cancelled-card { opacity: .72; }
.cancelled-card .card-copy strong { text-decoration: line-through; text-decoration-thickness: 1px; }

.clubs-section { margin: 28px 0 0; padding: 0; border: 0; background: transparent; }
.clubs-heading { margin: 0 4px 13px; }
.clubs-heading h3 { margin: 2px 0 0; font-size: 24px; }
.clubs-timeline::before { top: 30px; bottom: 30px; }
.activity-stack { display: grid; gap: 9px; min-width: 0; }
.activity-stack.shared-start { padding-left: 9px; border-left: 2px solid rgba(118,139,171,.25); }
.club-card {
  width: 100%;
  min-height: 84px;
  display: grid;
  grid-template-columns: 52px minmax(0,1fr) auto;
  align-items: center;
  gap: 13px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 20px;
  background: rgba(255,255,255,.77);
  box-shadow: inset 0 1px 0 #fff, 0 12px 26px rgba(36,68,113,.07);
  cursor: pointer;
}
.club-card.selected { box-shadow: inset 0 1px 0 #fff, inset 5px 0 0 var(--tone), 0 12px 28px rgba(36,68,113,.11); }
.club-icon { width: 52px; height: 52px; flex: 0 0 52px; display: grid; place-items: center; border-radius: 16px; color: #fff; background: var(--tone); }
.club-icon .lucide { width: 27px; height: 27px; }
.club-copy { min-width: 0; text-align: left; }
.club-copy strong { display: block; font-size: 16px; line-height: 1.2; }
.club-copy span { display: block; margin-top: 4px; color: var(--sm-muted); font-size: 12px; }
.club-end { min-height: 28px; display: inline-flex; align-items: center; padding: 0 9px; border-radius: 999px; color: #586b86; background: rgba(103,124,155,.09); font-size: 12px; font-weight: 800; }

.settings-scrim { position: fixed; z-index: 47; inset: 0; background: rgba(13,29,52,.10); backdrop-filter: blur(2px); animation: scrim-in .16s ease both; }
.settings-scrim[hidden] { display: none; }

.settings-popover {
  position: fixed;
  z-index: 50;
  top: 118px;
  right: max(18px, calc((100vw - 1120px)/2 + 18px));
  width: min(340px, calc(100vw - 28px));
  padding: 16px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 24px;
  background: rgba(249,252,255,.97);
  box-shadow: 0 24px 64px rgba(26,48,82,.19), inset 0 1px 0 #fff;
  backdrop-filter: blur(24px) saturate(140%);
  transform-origin: top right;
  animation: menu-in .2s cubic-bezier(.2,.8,.2,1) both;
}
.settings-popover[hidden] { display: none; }
.app-header.is-compact ~ .settings-popover { top: 90px; }
.popover-head { display: flex; justify-content: space-between; align-items: center; }
.icon-close { width: 38px; height: 38px; }
.profile-demo { display: flex; align-items: center; gap: 12px; margin: 14px 0; padding: 12px; border-radius: 17px; background: rgba(231,240,252,.65); }
.profile-avatar { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #735dd9; font-weight: 900; }
.profile-demo strong, .profile-demo span { display: block; }
.profile-demo span { margin-top: 2px; color: var(--sm-muted); font-size: 12px; }
.language-switcher { position: static; display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; margin-top: 14px; padding: 4px; border: 1px solid var(--sm-line); border-radius: 15px; background: rgba(229,237,248,.62); box-shadow: inset 0 1px 2px rgba(40,66,102,.05); }
.language-flag { width: 100%; height: 44px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 7px; border: 0; border-radius: 11px; color: #526580; background: transparent; cursor: pointer; }
.language-flag img { width: 26px; height: 18px; flex: 0 0 auto; display: block; object-fit: cover; border: 1px solid rgba(18,39,68,.1); border-radius: 5px; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 2px 5px rgba(26,48,82,.16); }
.language-flag strong { display: block; min-width: 0; overflow: hidden; font-size: 12px; line-height: 1; font-weight: 780; text-overflow: ellipsis; white-space: nowrap; }
.language-flag.active { color: var(--sm-blue); background: #fff; box-shadow: 0 4px 12px rgba(36,68,113,.10); }
.language-flag.active img { box-shadow: 0 0 0 2px rgba(22,119,242,.14), 0 3px 7px rgba(26,48,82,.18); }
.menu-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 14px 0 0; }
.menu-actions .action-btn { width: 100%; }
.menu-actions .print-btn { grid-column: 1 / -1; }
@keyframes menu-in { from { opacity: 0; transform: translateY(-8px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes scrim-in { from { opacity: 0; } to { opacity: 1; } }

.calendar-dialog, .install-dialog { width: min(420px, calc(100% - 28px)); padding: 0; border: 0; border-radius: 26px; color: var(--sm-ink); background: rgba(248,251,255,.97); box-shadow: 0 30px 90px rgba(20,40,75,.28); }
.calendar-dialog::backdrop, .install-dialog::backdrop { background: rgba(22,33,55,.28); backdrop-filter: blur(10px); }
.calendar-sheet { padding: 20px; }
.calendar-sheet-head { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; text-align: center; }
.calendar-month-arrow { width: 40px; height: 40px; }
.calendar-weekdays, .calendar-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 5px; }
.calendar-weekdays { margin: 18px 0 8px; color: var(--sm-muted); font-size: 11px; font-weight: 800; text-align: center; }
.calendar-day { aspect-ratio: 1; display: grid; place-items: center; border: 0; border-radius: 13px; background: transparent; font-weight: 750; cursor: pointer; }
.calendar-day:hover { background: rgba(22,119,242,.08); }
.calendar-day.selected { color: #fff; background: var(--sm-blue); }
.calendar-day.today:not(.selected) { color: var(--sm-blue); box-shadow: inset 0 0 0 1px rgba(22,119,242,.3); }
.calendar-day.empty { pointer-events: none; }
.calendar-close { width: 100%; min-height: 46px; margin-top: 14px; border: 0; border-radius: 14px; color: #fff; background: var(--sm-blue); font-weight: 850; }
.empty-day { padding: 48px 24px; border-radius: 24px; background: rgba(255,255,255,.75); text-align: center; box-shadow: var(--sm-shadow); }
.empty-day .lucide { width: 38px; height: 38px; color: #8796ad; }
.empty-day h2 { margin: 12px 0 6px; }
.empty-day p { margin: 0; color: var(--sm-muted); }

.legacy-meta { display: none; }
.legacy-print, .desktop-wrap { display: none; }
.footer-note { margin: 28px auto 0; color: var(--sm-muted); font-size: 12px; text-align: center; }

button:focus-visible { outline: 3px solid rgba(22,119,242,.25); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }

@media (max-width: 760px) {
  .page.app-shell { width: 100%; margin: 0 auto 34px; }
  .app-header { top: 0; min-height: 84px; padding: 11px 14px; border-radius: 0 0 27px 27px; clip-path: inset(0 0 0 0 round 0 0 27px 27px); }
  .app-header.is-compact { clip-path: inset(0 0 16px 0 round 0 0 21px 21px); }
  .app-header.is-compact > * { transform: translateY(-8px); }
  .brand { font-size: 24px; }
  .app-header.is-compact .brand { font-size: 21px; }
  .class-switch { min-height: 38px; font-size: 24px; padding: 0 8px; }
  .class-meta { margin-top: -5px; font-size: 11px; }
  .round-action { width: 46px; height: 46px; }
  .app-header.is-compact .round-action { width: 40px; height: 40px; }
  .date-navigator { top: 88px; height: 115px; margin: 10px 10px 8px; padding: 7px 9px; border-radius: 21px; }
  .date-navigator-top { height: 39px; margin-bottom: 2px; padding: 0 4px; }
  .date-navigator.is-compact .week-strip { transform: translateY(-39px); }
  .date-navigator.is-compact { top: 62px; clip-path: none; }
  #monthLabel { font-size: 19px; }
  .week-strip { gap: 0; padding: 0 34px; }
  .week-arrow { width: 34px; height: 42px; border: 0; background: rgba(255,255,255,.78); box-shadow: 0 5px 14px rgba(36,68,113,.08); }
  .day-tabs { display: flex !important; gap: 4px; }
  .day-tab { flex: 1 0 48px; min-width: 48px; min-height: 54px; border-radius: 15px; }
  .day-tab .day-name { font-size: 12px; }
  .day-tab .day-number { font-size: 21px; }
  .content-layout { padding: 0 12px; }
  .schedule-title h1 { font-size: 23px; }
  .timeline-entry { grid-template-columns: 52px 18px minmax(0,1fr); }
  .schedule-timeline::before { left: 60px; }
  .entry-time { width: auto; margin-top: 24px; padding-right: 8px; font-size: 13px; line-height: 1.32; }
  .timeline-dot { left: 55px; }
  .schedule-card { min-height: 108px; border-radius: 22px; }
  .card-toggle { min-height: 108px; grid-template-columns: 58px minmax(0,1fr) auto; gap: 12px; padding: 15px 13px 15px 18px; }
  .subject-app-icon { width: 54px; height: 54px; border-radius: 15px; }
  .subject-app-icon .lucide { width: 29px; height: 29px; }
  .card-copy { padding-right: 64px; }
  .card-copy strong { font-size: 17px; }
  .period-kicker { font-size: 11px; }
  .teacher-line, .room-line { font-size: 12px; }
  .card-side { min-width: 24px; }
  .expanded-panel { margin: 0 13px 15px 18px; padding: 13px 0 0 70px; }
  .state-badge { right: 58px; min-width: 73px; }
  .lesson-tool { width: 32px; height: 32px; border-radius: 10px; }
  .lesson-tool .lucide { width: 17px; height: 17px; }
  .favorite-star { top: 0; right: 0; }
  .utility-card { width: min(82%, 360px); min-height: 70px; }
  .utility-card .card-toggle { min-height: 70px; }
  .clubs-section { margin-left: 0; }
  .club-card { min-height: 78px; grid-template-columns: 46px minmax(0,1fr) auto; padding: 12px; border-radius: 18px; }
  .club-icon { width: 46px; height: 46px; flex-basis: 46px; border-radius: 14px; }
  .settings-popover { top: 90px; right: 10px; bottom: auto; left: auto; width: min(340px, calc(100vw - 20px)); border-radius: 23px; transform-origin: top right; animation-name: menu-in; transition: top .22s ease; }
  .app-header.is-compact ~ .settings-popover { top: 70px; }
}

@media (max-width: 430px) {
  .date-navigator-top { align-items: center; }
  .calendar-button { width: 40px; height: 40px; }
  .today-button { padding: 0 6px; font-size: 13px; }
  .timeline-entry { grid-template-columns: 49px 17px minmax(0,1fr); }
  .schedule-timeline::before { left: 56px; }
  .timeline-dot { left: 51px; }
  .card-toggle { grid-template-columns: 52px minmax(0,1fr) auto; gap: 10px; }
  .card-copy { padding-right: 60px; }
  .subject-app-icon { width: 50px; height: 50px; }
  .expanded-panel { padding-left: 62px; }
  .clubs-section { margin-left: 0; }
}

@keyframes menu-sheet-in { from { opacity: 0; transform: translateY(18px) scale(.98); } to { opacity: 1; transform: none; } }

@media print {
  body { background: #fff; }
  .app-header, .date-navigator, .content-layout, .settings-popover, .footer-note { display: none !important; }
  .legacy-print, .desktop-wrap { display: block !important; }
}
