/* 晴课 · 晨光校园。视觉集中在首页，保留原有课程与数据交互。 */
:root {
  --ink: #183934;
  --muted: #687b74;
  --accent: #176c60;
  --accent-dark: #10554d;
  --paper: #fffefa;
  --line: #e4e9e2;
  --shadow: 0 16px 42px rgba(38, 75, 63, .07);
}
body { background: #f6f4ee; color: var(--ink); }
.ambient { background: radial-gradient(circle at 89% 2%, rgba(193, 229, 210, .72), transparent 30%), radial-gradient(circle at 3% 43%, rgba(246, 222, 195, .48), transparent 34%), #f6f4ee; }
.ambient span { opacity: .13; }
.app-shell { max-width: 1360px; }
.glass { background: rgba(255, 254, 250, .91); border: 1px solid rgba(225, 233, 224, .92); box-shadow: var(--shadow); backdrop-filter: none; -webkit-backdrop-filter: none; }
.glass::before,.glass::after { display: none; }
.topbar { background: rgba(255, 254, 250, .83); border-color: rgba(255, 255, 255, .95); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.brand-mark { background: #176c60; }
.primary-nav { background: #eff3ec; border: 1px solid #e6ebe2; border-radius: 16px; }
.nav-link { color: #697d74; }
.nav-link.active { color: #155f55; background: #fffefa; box-shadow: 0 3px 11px rgba(30, 79, 67, .08); }
.nav-link.active .nav-symbol { color: #176c60; }
.home-hero { align-items: stretch; grid-template-columns: minmax(0, 1fr) minmax(300px, 410px); gap: 20px; margin-bottom: 22px; }
.home-intro { display: flex; flex-direction: column; justify-content: center; padding: 20px 8px 14px; }
.home-intro .eyebrow { margin: 0 0 11px; color: #27766a; font-size: 12px; font-weight: 750; letter-spacing: .09em; }
.home-intro h1 { margin: 0; color: #173a35; font-size: clamp(36px, 4.3vw, 58px); font-weight: 750; letter-spacing: -.055em; line-height: 1.15; }
.hero-spark { display: inline-block; margin-left: 10px; color: #f0a667; font-size: .54em; vertical-align: .36em; }
.hero-summary { margin: 13px 0 0; color: #74847b; font-size: 14px; }
.home-next.next-card { display: flex; flex-direction: column; justify-content: center; min-height: 142px; padding: 22px 24px; border: 1px solid rgba(18, 93, 81, .8); border-radius: 24px; background: radial-gradient(circle at 100% 0%, rgba(91, 174, 147, .36), transparent 52%), linear-gradient(140deg, #164d47, #17695d); color: #fffefa; box-shadow: 0 20px 40px rgba(25, 91, 76, .18); backdrop-filter: none; -webkit-backdrop-filter: none; }
.home-next .section-kicker { color: #b9e6d3; font-size: 11px; font-weight: 700; letter-spacing: .08em; }
.home-next .next-compact { margin-top: 12px; }
.home-next .next-hour,.home-next .next-compact.is-live .next-hour { min-width: 66px; min-height: 47px; background: #fff2d9; color: #80592c; font-size: 14px; }
.home-next .next-copy strong { color: #fff; font-size: 16px; }
.home-next .next-copy small,.home-next .next-card p { color: rgba(255, 255, 255, .75); }
.home-next .next-progress { margin-top: 14px; background: rgba(255,255,255,.2); }
.home-next .next-progress span { background: #f7be80; }
.dashboard-grid { grid-template-columns: minmax(0, 1fr) 274px; gap: 16px; }
.schedule-panel { min-width: 0; padding: 28px; border-radius: 28px; }
#scheduleView[data-mode="day"] .schedule-panel { min-height: 0; }
.schedule-heading .section-kicker { color: #568177; font-size: 11px; }
.schedule-heading .calendar-picker select { color: #183934; font-size: 24px; font-weight: 750; }
.schedule-head .week-switch { background: #f1f5ef; border-color: #e3eae1; }
.schedule-head .week-switch button { background: #fffefa; border-color: #fffefa; box-shadow: none; }
.schedule-controls { margin-top: 21px; }
.mode-switch { background: #eff3ec; border: 1px solid #e5ebe2; }
.mode-switch button.active { color: #176c60; background: #fffefa; box-shadow: 0 3px 10px rgba(34, 80, 64, .09); }
.schedule-menu summary { background: #fffefa; border-color: #e3eae1; }
.schedule-menu-items { background: #fffefa; border-color: #e3eae1; }
.schedule-menu-items button { background: transparent; }
.week-strip { margin-top: 22px; }
.week-day { color: #71847a; }
.week-day.selected { background: #dceee4; color: #155e54; border-color: transparent; }
.week-day.today strong { background: #176c60; color: #fff; }
.agenda-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 20px 3px 13px; padding-top: 18px; border-top: 1px solid var(--line); }
.agenda-heading span { font-size: 16px; font-weight: 750; letter-spacing: -.02em; }
.agenda-heading small { color: #819087; font-size: 11px; }
.day-agenda { min-height: 0; gap: 12px; padding-bottom: 0; }
.agenda-course { position: relative; grid-template-columns: 79px minmax(0,1fr) 15px; gap: 17px; min-height: 116px; padding: 17px 18px; border: 1px solid #e8ede7; border-left: 5px solid #80b1a0; border-radius: 18px; background: #f5f9f4; box-shadow: none; }
.agenda-course:nth-of-type(3n+1) { border-left-color: #87a6c1; background: #f3f7fb; }
.agenda-course:nth-of-type(3n+2) { border-left-color: #dfaa79; background: #fff7ef; }
.agenda-course:nth-of-type(3n) { border-left-color: #8abda8; background: #f3f9f4; }
.agenda-course.is-past { filter: none; opacity: .54; }
.agenda-course.is-live { border-color: #4aab8c; border-left-color: #176c60; background: #edf8ef; box-shadow: 0 0 0 3px rgba(47, 149, 111, .11); }
.agenda-course.is-live::before { content: '正在上课'; position: absolute; top: -10px; right: 16px; padding: 3px 9px; border-radius: 99px; background: #176c60; color: white; font-size: 10px; font-weight: 700; }
.agenda-time { border-right-color: rgba(37, 83, 70, .14); }
.agenda-time strong { color: #1b403a; font-size: 19px; font-variant-numeric: tabular-nums; }
.agenda-time span { font-size: 12px; }
.agenda-time small { font-size: 11px; }
.agenda-copy > strong { color: #193b35; font-size: 17px; font-weight: 750; }
.agenda-copy > span { color: #2b7062; font-size: 13px; font-weight: 650; }
.agenda-copy small { color: #73857a; font-size: 11px; }
.agenda-chevron { color: #8b9f94; }
.side-stack .task-card,.side-stack .reminder-card { border-radius: 22px; background: #fffefa; }
.side-stack .reminder-card { border-top: 3px solid #e6ba88; }
.side-stack .task-card { border-top: 3px solid #91bca5; }
.reminder-card .reminder-top h3,.task-card h3 { color: #1b3d36; }
.reminder-card .reminder-status { background: #f4f7f2; border-color: #e8eee7; }
.page-title h1 { font-weight: 740; }
.upload-card,.review-card,.settings-card,.task-workspace,.task-overview { background: #fffefa; border-color: #e7ece5; }
.drop-zone { background: #f4f8f2; border-color: #cbdcd0; }
.task-workspace .task-form,.task-workspace .task-item,.import-scope,.course-row { background: #f8faf6; border-color: #e7ece5; }
@media(max-width:1050px) { .dashboard-grid { grid-template-columns: 1fr; } }
@media(max-width:760px) {
  .app-shell { padding: max(10px,env(safe-area-inset-top)) 12px calc(115px + env(safe-area-inset-bottom)); }
  .topbar { height: 54px; padding: 6px 9px 6px 11px; border-radius: 16px; }
  .topbar .brand-mark { border-radius: 10px; background: #176c60; }
  .primary-nav { left: 12px; right: 12px; min-height: 66px; padding: 5px; border: 1px solid rgba(226, 235, 226, .95); background: rgba(255, 254, 250, .96); box-shadow: 0 12px 32px rgba(32, 74, 61, .16); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
  .primary-nav .nav-link.active { background: #e4f2e9; color: #155e54; box-shadow: none; }
  main { padding-top: 24px; }
  .home-hero { display: grid; grid-template-columns: minmax(0,1fr); gap: 17px; margin: 0 0 19px; }
  .home-intro { padding: 3px 4px 0; }
  .home-intro .eyebrow { display: block; margin-bottom: 8px; font-size: 12px; }
  .home-intro h1 { font-size: clamp(33px, 9vw, 42px); }
  .hero-summary { margin-top: 8px; font-size: 12px; }
  .home-next.next-card { min-height: 118px; padding: 17px 19px; border-radius: 21px; }
  .home-next .next-compact { margin-top: 8px; }
  .home-next .next-copy strong { font-size: 15px; }
  .schedule-panel { min-height: 0; padding: 19px 15px 21px; border-radius: 24px; overflow: visible; }
  .schedule-heading .calendar-picker select { max-width: 42vw; font-size: 20px; }
  .schedule-head .week-switch { padding: 2px; }
  .schedule-head .week-switch button { width: 33px; height: 36px; }
  .schedule-head .week-switch strong { min-width: 52px; }
  .schedule-controls { margin-top: 16px; }
  .schedule-panel .week-strip { margin: 18px 0 9px; }
  #scheduleView[data-mode="day"] .week-strip { gap: 4px; }
  #scheduleView[data-mode="day"] .week-day { min-height: 58px; border-radius: 13px; font-size: 10px; }
  #scheduleView[data-mode="day"] .week-day strong { margin-top: 3px; font-size: 15px; }
  .agenda-heading { margin-top: 18px; padding-top: 18px; }
  .day-agenda { min-height: 0; gap: 10px; }
  .agenda-course { grid-template-columns: 69px minmax(0,1fr) 11px; gap: 11px; min-height: 105px; padding: 14px 13px; border-radius: 16px; }
  .agenda-time strong { font-size: 16px; }
  .agenda-time span { font-size: 11px; }
  .agenda-time small { font-size: 10px; }
  .agenda-copy > strong { font-size: 15px; }
  .agenda-copy > span { font-size: 12px; }
  .agenda-copy small { font-size: 10px; }
  .side-stack { margin-top: 14px; }
  .side-stack .task-card,.side-stack .reminder-card { padding: 18px; }
}
@media(max-width:380px) {
  .schedule-panel { padding-inline: 12px; }
  .schedule-heading .calendar-picker select { max-width: 38vw; font-size: 18px; }
  .agenda-course { grid-template-columns: 62px minmax(0,1fr) 9px; gap: 9px; padding-inline: 10px; }
  .agenda-time strong { font-size: 15px; }
}
@media(prefers-reduced-motion:reduce) { .agenda-course,.home-next { animation: none; transition: none; } }

/* Course focus card and motion. The seven-column week uses the original layout. */
.home-next.next-card {
  min-height: 0;
  padding: 20px 22px;
  overflow: hidden;
  border: 1px solid #dce8d9;
  border-radius: 25px;
  background: radial-gradient(circle at 99% 0%, #e3f3e3 0, transparent 38%), #fffefa;
  color: var(--ink);
  box-shadow: 0 16px 34px rgba(35, 78, 61, .08);
}
.home-next.next-card::after { content: ''; position: absolute; top: 0; left: 22px; width: 65px; height: 4px; border-radius: 0 0 9px 9px; background: #77ad92; }
.home-next .section-kicker { color: #4b8470; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.next-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 11px; }
.next-status { display: inline-flex; align-items: center; gap: 6px; color: #246c58; font-size: 11px; font-weight: 750; white-space: nowrap; }
.next-status i { width: 7px; height: 7px; border-radius: 50%; background: #54b28a; box-shadow: 0 0 0 4px #e2f4e8; }
.next-status.is-live i { background: #e59a5d; box-shadow: 0 0 0 4px #fff0df; }
.next-relative { color: #6d8273; font-size: 11px; font-weight: 650; text-align: right; }
.next-body { display: grid; grid-template-columns: 85px minmax(0, 1fr); align-items: center; gap: 17px; margin-top: 12px; }
.next-time { display: grid; place-content: center; min-height: 72px; border-radius: 16px; background: #f5efdf; color: #805e37; text-align: center; font-variant-numeric: tabular-nums; }
.next-time strong { font-size: 21px; line-height: 1.15; letter-spacing: -.04em; }
.next-time span { margin-top: 4px; font-size: 11px; font-weight: 650; }
.next-course-info { display: grid; gap: 5px; min-width: 0; }
.next-course-info strong { overflow: hidden; color: #1c4035; font-size: 18px; font-weight: 800; line-height: 1.28; text-overflow: ellipsis; white-space: nowrap; }
.next-course-info span { overflow: hidden; color: #587c6c; font-size: 12px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.next-footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 5px 12px; margin-top: 13px; padding-top: 11px; border-top: 1px solid #edf0e8; color: #819086; font-size: 10px; }
.home-next .next-progress { height: 4px; margin: 13px 0 0; background: #e5eee4; }
.home-next .next-progress span { background: #61ae86; }
.next-empty { display: flex; align-items: center; gap: 10px; margin-top: 12px; color: #547a67; }
.next-empty > span { font-size: 26px; }
.next-empty strong { font-size: 14px; }
.next-empty small { color: #8a978a; font-size: 11px; }
@media(max-width:760px) {
  .home-next.next-card { padding: 19px 18px 17px; border-radius: 21px; }
  .next-body { grid-template-columns: 80px minmax(0,1fr); gap: 13px; }
  .next-time { min-height: 68px; }
  .next-time strong { font-size: 19px; }
  .next-course-info strong { font-size: 16px; }
}

.view.active { animation: view-in .35s cubic-bezier(.18,.75,.25,1) both; }
.home-intro .eyebrow { animation: rise-in .42s .04s both; }
.home-intro h1 { animation: rise-in .5s .1s both; }
.home-intro .hero-summary { animation: rise-in .5s .16s both; }
.home-next.next-card { animation: focus-in .6s .14s cubic-bezier(.16,.84,.24,1) both; }
.next-topline { animation: rise-in .4s .2s both; }
.next-time { animation: time-in .5s .26s cubic-bezier(.2,.9,.25,1.15) both; }
.next-course-info { animation: rise-in .45s .3s both; }
.next-status.is-live i { animation: live-dot 2.4s ease-in-out infinite; }
.next-progress span { transition: width .55s cubic-bezier(.2,.8,.25,1); }
.week-day { transition: background .24s ease, color .24s ease, transform .24s cubic-bezier(.2,.8,.2,1), box-shadow .24s ease; }
.week-strip .week-day { animation: rise-in .32s both; }
.week-strip .week-day:nth-child(2) { animation-delay: 25ms; }
.week-strip .week-day:nth-child(3) { animation-delay: 50ms; }
.week-strip .week-day:nth-child(4) { animation-delay: 75ms; }
.week-strip .week-day:nth-child(5) { animation-delay: 100ms; }
.week-strip .week-day:nth-child(6) { animation-delay: 125ms; }
.week-strip .week-day:nth-child(7) { animation-delay: 150ms; }
.week-strip .week-day:nth-child(8) { animation-delay: 175ms; }
.week-strip .week-day.selected { animation: day-pop .34s cubic-bezier(.16,.85,.25,1.2) both; }
.schedule-grid .course-block { animation: course-rise .46s cubic-bezier(.16,.83,.25,1) both; animation-delay: var(--course-delay,0ms); }
.schedule-grid .course-block.is-live { animation: course-rise .46s cubic-bezier(.16,.83,.25,1) both, live-course-glow 2.8s 1s ease-in-out infinite; animation-delay: var(--course-delay,0ms), 1s; }
.day-agenda .agenda-course { animation: course-rise .46s cubic-bezier(.16,.83,.25,1) both; animation-delay: var(--course-delay,0ms); }
.primary-nav .nav-link.active .nav-symbol { animation: icon-lift .32s cubic-bezier(.2,.8,.2,1.2) both; }
@keyframes view-in { from { opacity: .65; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes rise-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes focus-in { from { opacity: 0; transform: translateY(12px) scale(.975); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes time-in { from { opacity: 0; transform: translateY(7px) scale(.9); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes day-pop { from { transform: scale(.85); } to { transform: scale(1); } }
@keyframes course-rise { from { opacity: 0; transform: translateY(12px) scale(.965); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes icon-lift { from { transform: translateY(4px) scale(.8); } to { transform: translateY(0) scale(1); } }
@keyframes live-dot { 50% { box-shadow: 0 0 0 7px rgba(255, 231, 205, .45); } }
@media(prefers-reduced-motion:reduce) {
  .view.active,.home-intro .eyebrow,.home-intro h1,.home-intro .hero-summary,.home-next.next-card,.next-topline,.next-time,.next-course-info,.next-status.is-live i,.week-day.selected,.week-strip .week-day,.schedule-grid .course-block,.schedule-grid .course-block.is-live,.day-agenda .agenda-course,.primary-nav .nav-link.active .nav-symbol { animation: none!important; }
  .next-progress span,.week-day { transition: none!important; }
}
