:root {
  --navy:#123d7a;
  --navy-dark:#0a2a58;
  --blue:#245fb9;
  --sky:#eff5ff;
  --ink:#172033;
  --muted:#60708a;
  --line:rgba(196,211,234,.72);
  --paper:rgba(255,255,255,.78);
  --background:#edf3fb;
  --success:#17835a;
  --warning:#a76400;
  --ease-spring:cubic-bezier(.2,.82,.25,1);
}
* { box-sizing:border-box; }
html { background:var(--background); }
body {
  min-width:320px;
  margin:0;
  color:var(--ink);
  font:16px/1.55 Poppins,system-ui,sans-serif;
  background:
    radial-gradient(circle at 87% 7%,rgba(97,162,255,.30),transparent 25rem),
    radial-gradient(circle at 12% 88%,rgba(71,122,209,.14),transparent 29rem),
    linear-gradient(135deg,#f7faff 0%,#eef4fc 48%,#e6eef9 100%);
}
a { color:inherit; }
.portal-shell { display:flex; min-height:100vh; }
.sidebar {
  position:fixed;
  inset:0 auto 0 0;
  z-index:2;
  width:250px;
  overflow-y:auto;
  padding:26px 18px;
  color:#fff;
  background:linear-gradient(165deg,rgba(22,73,143,.74),rgba(6,34,77,.82));
  border-right:1px solid rgba(255,255,255,.22);
  box-shadow:16px 0 42px rgba(10,37,80,.16),inset -1px 0 0 rgba(255,255,255,.09);
  -webkit-backdrop-filter:blur(28px) saturate(165%);
  backdrop-filter:blur(28px) saturate(165%);
}
.sidebar::before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:220px;
  pointer-events:none;
  background:radial-gradient(circle at 30% 0,rgba(166,207,255,.24),transparent 63%);
}
.sidebar > * { position:relative; }
.brand {
  display:block;
  margin:0 10px 28px;
  color:#fff;
  font-size:1.7rem;
  font-weight:700;
  letter-spacing:-.04em;
  text-decoration:none;
}
.brand-subtitle {
  margin:-23px 10px 24px;
  color:rgba(231,241,255,.80);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.nav-list { margin:0; padding:0; list-style:none; }
.nav-list li { margin:4px 0; }
.nav-list a,.logout {
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  min-height:42px;
  padding:10px 12px 10px 27px;
  border:1px solid transparent;
  border-radius:12px;
  background:transparent;
  color:#fff;
  font:500 .92rem/1.3 Poppins,system-ui,sans-serif;
  text-align:left;
  text-decoration:none;
  cursor:pointer;
  transform:translateZ(0);
  transition:transform .32s var(--ease-spring),background .28s ease,border-color .28s ease,box-shadow .32s var(--ease-spring);
}
.nav-list a::before,.logout::before {
  content:"";
  position:absolute;
  left:12px;
  width:5px;
  height:5px;
  border-radius:999px;
  background:rgba(231,241,255,.62);
  box-shadow:0 0 0 3px rgba(255,255,255,.06);
  transition:transform .32s var(--ease-spring),background .28s ease,box-shadow .28s ease;
}
.nav-list a:hover,.nav-list a:focus-visible,.logout:hover,.logout:focus-visible {
  outline:0;
  transform:translateX(4px) scale(1.015);
  border-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.13);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 10px 24px rgba(1,18,50,.15);
}
.nav-list a:active,.logout:active { transform:translateX(2px) scale(.985); }
.nav-list a[aria-current="page"] {
  border-color:rgba(255,255,255,.19);
  background:linear-gradient(110deg,rgba(255,255,255,.25),rgba(255,255,255,.13));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 12px 25px rgba(1,18,50,.17);
}
.nav-list a[aria-current="page"]::before {
  background:#fff;
  box-shadow:0 0 0 3px rgba(255,255,255,.16),0 0 15px rgba(223,241,255,.9);
  transform:scale(1.15);
}
.nav-list .nav-divider { height:1px; margin:14px 10px; background:rgba(255,255,255,.18); }
.main {
  width:calc(100% - 250px);
  margin-left:250px;
  padding:34px;
  animation:page-enter .6s var(--ease-spring) both;
}
@keyframes page-enter { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
.page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; max-width:1220px; margin:0 auto 26px; }
.eyebrow { margin:0 0 4px; color:var(--blue); font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
h1 { margin:0; color:var(--navy); font-size:clamp(1.8rem,3.5vw,2.35rem); line-height:1.15; }
h2 { margin:0; color:var(--navy); font-size:1.3rem; line-height:1.3; }
h3 { margin:0; color:var(--navy); font-size:1.03rem; line-height:1.4; }
.lead,.muted { margin:6px 0 0; color:var(--muted); }
.content { max-width:1220px; margin:0 auto; }
.card {
  padding:24px;
  border:1px solid rgba(207,220,239,.78);
  border-radius:16px;
  background:var(--paper);
  box-shadow:0 10px 28px rgba(20,50,90,.07),inset 0 1px 0 rgba(255,255,255,.75);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  transition:transform .32s var(--ease-spring),box-shadow .32s var(--ease-spring),border-color .28s ease;
}
.card:hover { transform:translateY(-3px); border-color:rgba(141,177,231,.9); box-shadow:0 17px 34px rgba(20,50,90,.11),inset 0 1px 0 rgba(255,255,255,.8); }
.current-card { display:grid; grid-template-columns:1.25fr .75fr; gap:24px; margin-bottom:24px; border-left:5px solid var(--blue); background:linear-gradient(120deg,rgba(255,255,255,.86),rgba(232,241,255,.72)); }
.badge { display:inline-flex; align-items:center; width:max-content; padding:5px 10px; border-radius:999px; font-size:.76rem; font-weight:700; }
.badge-live { color:#075c3e; background:#dff7eb; }
.badge-complete { color:#315b9f; background:#e8f0ff; }
.badge-upcoming { color:#8a5900; background:#fff2d9; }
.current-card h2 { margin:10px 0 4px; font-size:1.65rem; }
.current-card p { margin:0; color:var(--muted); }
.next-class { align-self:center; padding:16px; border:1px solid rgba(225,233,245,.7); border-radius:12px; background:rgba(255,255,255,.67); }
.next-class strong { display:block; color:var(--navy); font-size:1.1rem; }
.button-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.button {
  display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:9px 14px;
  border:1px solid transparent; border-radius:10px; background:var(--navy); color:#fff;
  font-size:.88rem; font-weight:600; text-decoration:none;
  transition:transform .25s var(--ease-spring),background .25s ease,box-shadow .25s ease;
}
.button:hover { transform:translateY(-2px) scale(1.01); background:var(--blue); box-shadow:0 10px 18px rgba(18,61,122,.18); }
.button:active { transform:scale(.98); }
.button-secondary { border-color:#b9ccec; background:rgba(255,255,255,.78); color:var(--navy); }
.button-secondary:hover { background:var(--sky); }
.section-title { display:flex; align-items:end; justify-content:space-between; gap:16px; margin:28px 0 14px; }
.part-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.part-card { display:flex; flex-direction:column; min-height:230px; }
.part-card p { color:var(--muted); font-size:.92rem; }
.part-card .button-row { margin-top:auto; }
.part-card.is-current { border-color:#88afe9; box-shadow:0 13px 30px rgba(36,95,185,.14),inset 0 1px 0 rgba(255,255,255,.8); }
.resource-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.resource-card { display:flex; flex-direction:column; gap:7px; }
.resource-card p { margin:0; color:var(--muted); font-size:.9rem; }
.resource-meta { color:#70809a; font-size:.8rem; }
.notice { margin-top:18px; padding:15px 17px; border-left:4px solid var(--blue); border-radius:0 10px 10px 0; background:rgba(237,245,255,.78); color:#314158; }
.notice p { margin:4px 0 0; }
.filters { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.filter { padding:8px 12px; border:1px solid #c9d8ee; border-radius:9px; background:rgba(255,255,255,.72); color:var(--navy); font:inherit; font-size:.86rem; font-weight:600; cursor:pointer; transition:transform .22s var(--ease-spring),background .22s ease,box-shadow .22s ease; }
.filter:hover,.filter.is-active { border-color:var(--navy); background:var(--navy); color:#fff; box-shadow:0 7px 15px rgba(18,61,122,.13); }
.filter:hover { transform:translateY(-1px); }
.list { display:grid; gap:12px; }
.list-item { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:17px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.72); }
.list-item p { margin:4px 0 0; color:var(--muted); font-size:.88rem; }
.empty { padding:28px; border:1px dashed #c6d5ea; border-radius:12px; color:var(--muted); text-align:center; }
.announcement { margin-top:12px; }
.announcement h3 { margin-bottom:5px; }
@media (max-width:900px) {
  .portal-shell { display:block; }
  .sidebar { position:static; width:100%; max-height:none; padding:18px; }
  .brand { margin:0 0 3px; }
  .brand-subtitle { margin:0 0 14px; }
  .nav-list { display:flex; flex-wrap:wrap; gap:5px; }
  .nav-list li { margin:0; }
  .nav-list a,.logout { width:auto; min-height:36px; padding:8px 10px 8px 23px; font-size:.8rem; }
  .nav-list a::before,.logout::before { left:10px; width:4px; height:4px; }
  .nav-list .nav-divider { display:none; }
  .main { width:100%; margin:0; padding:22px 16px; }
}
@media (max-width:680px) {
  .page-header,.current-card,.list-item { display:block; }
  .current-card { padding:20px; }
  .next-class { margin-top:16px; }
  .part-grid,.resource-grid { grid-template-columns:1fr; }
  .list-item .button { width:100%; margin-top:14px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}
.flash-menu summary{padding:12px 14px;cursor:pointer;border-radius:12px;font-weight:600;color:#fff;min-height:44px}.flash-menu summary:hover{background:rgba(255,255,255,.12)}.flash-menu a{padding-left:34px;font-size:.88rem}.flash-menu[open] summary{background:rgba(255,255,255,.08)}

/* Part-first student dashboard */
.portal-parts{align-items:stretch}
.portal-part{min-height:300px;position:relative;overflow:hidden}
.portal-part h2{margin:12px 0 4px;font-size:1.45rem}
.portal-part.is-enrolled{border-color:rgba(91,145,222,.72)}
.portal-part.is-locked{opacity:.72;background:rgba(246,248,252,.82);filter:saturate(.7)}
.portal-part.is-locked:hover{transform:none;box-shadow:0 10px 28px rgba(20,50,90,.07)}
.part-access-state{margin-top:auto;padding-top:16px}
.access-label{display:inline-flex;font-size:.72rem;font-weight:700;letter-spacing:.035em}
.access-open{color:var(--success)}
.access-locked{color:#7a8495}
.button-disabled{pointer-events:none;cursor:default;opacity:.7}
.compact-live{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px}
.compact-live h3{margin:8px 0 2px;font-size:1.15rem}.compact-live p{margin:0;color:var(--muted)}
[hidden]{display:none!important}
@media(max-width:680px){.compact-live{display:block}.compact-live .button{width:100%;margin-top:16px}}
