:root {
    --md-primary: #6750a4;
    --md-on-primary: #ffffff;
    --md-primary-container: #eadcff;
    --md-on-primary-container: #25005a;
    --md-secondary: #006a6a;
    --md-secondary-container: #9cf1ef;
    --md-tertiary: #8a4a00;
    --md-tertiary-container: #ffdcc2;
    --md-surface: #fbf8ff;
    --md-surface-container: #f3eff8;
    --md-surface-container-high: #ece6f0;
    --md-outline: #79747e;
    --md-outline-variant: #cac4d0;
    --md-error: #ba1a1a;
}

@keyframes studentFadeUp {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes studentPulse {
    0%, 100% { transform: scale(1); opacity: .8; }
    50% { transform: scale(1.08); opacity: 1; }
}

.student-material {
    background:
        radial-gradient(circle at 10% 0%, rgba(103,80,164,.08), transparent 28%),
        radial-gradient(circle at 100% 10%, rgba(0,106,106,.08), transparent 24%),
        var(--md-surface);
    color: #1d1b20;
}

.student-material .md-surface {
    background: rgba(255,255,255,.84);
    border: 1px solid rgba(202,196,208,.62);
    box-shadow: 0 8px 26px rgba(29,27,32,.07);
    backdrop-filter: blur(14px);
}

.student-material .md-card {
    border-radius: 28px;
    background: rgba(255,255,255,.9);
    border: 1px solid rgba(202,196,208,.62);
    box-shadow: 0 8px 28px rgba(29,27,32,.07);
    transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}

.student-material .md-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 38px rgba(29,27,32,.11);
    border-color: rgba(103,80,164,.35);
}

.student-material .md-tonal-button,
.student-material .md-filled-button,
.student-material .md-outlined-button {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    border-radius: 999px;
    padding: .7rem 1.1rem;
    font-size: .875rem;
    font-weight: 700;
    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.student-material .md-filled-button {
    background: var(--md-primary);
    color: var(--md-on-primary);
    box-shadow: 0 8px 20px rgba(103,80,164,.24);
}

.student-material .md-filled-button:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(103,80,164,.3); }
.student-material .md-tonal-button { background: var(--md-primary-container); color: var(--md-on-primary-container); }
.student-material .md-tonal-button:hover { transform: translateY(-2px); background: #dfcdfc; }
.student-material .md-outlined-button { border: 1px solid var(--md-outline-variant); background: rgba(255,255,255,.72); color: #49454f; }

.student-material .student-rail {
    background: linear-gradient(180deg, #1d1730 0%, #2b2242 52%, #173f3d 100%);
}

.student-material .student-rail a { color: rgba(255,255,255,.76); }
.student-material .student-rail a:hover { background: rgba(255,255,255,.09); color: #fff; }
.student-material .student-rail a.is-active { background: rgba(234,220,255,.18); color: #fff; box-shadow: inset 3px 0 0 #d0bcff; }

.student-material .student-appbar {
    background: rgba(251,248,255,.84);
    border-bottom: 1px solid rgba(202,196,208,.55);
    backdrop-filter: blur(18px);
}

.student-material .student-bottom-nav {
    background: rgba(255,255,255,.94);
    border-top: 1px solid rgba(202,196,208,.65);
    box-shadow: 0 -10px 30px rgba(29,27,32,.08);
    backdrop-filter: blur(18px);
}

.student-material .student-bottom-nav a { color: #625b71; }
.student-material .student-bottom-nav a .nav-pill { transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.student-material .student-bottom-nav a.is-active { color: #21005d; }
.student-material .student-bottom-nav a.is-active .nav-pill { background: var(--md-primary-container); transform: translateY(-2px); }

.student-material .student-section { animation: studentFadeUp .42s ease both; }
.student-material .student-section:nth-child(2) { animation-delay: .05s; }
.student-material .student-section:nth-child(3) { animation-delay: .1s; }
.student-material .student-section:nth-child(4) { animation-delay: .15s; }

.student-material .student-hero {
    position: relative;
    overflow: hidden;
    border-radius: 32px;
    color: white;
    background:
        radial-gradient(circle at 82% 20%, rgba(255,255,255,.22), transparent 26%),
        linear-gradient(135deg, #4f378b 0%, #6750a4 42%, #006a6a 100%);
    box-shadow: 0 24px 60px rgba(79,55,139,.24);
}

.student-material .student-hero::after {
    content: '';
    position: absolute;
    width: 220px;
    height: 220px;
    right: -70px;
    bottom: -100px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
}

.student-material .quick-action {
    border-radius: 24px;
    border: 1px solid rgba(202,196,208,.62);
    background: rgba(255,255,255,.88);
    box-shadow: 0 8px 24px rgba(29,27,32,.06);
    transition: transform .22s ease, box-shadow .22s ease;
}

.student-material .quick-action:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(29,27,32,.1); }
.student-material .quick-action .icon-wrap { animation: studentPulse 3.6s ease-in-out infinite; }

.student-material .metric-card {
    border-radius: 26px;
    border: 1px solid rgba(202,196,208,.55);
    background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(243,239,248,.88));
    box-shadow: 0 8px 24px rgba(29,27,32,.06);
}

.student-material .metric-card:nth-child(1) { background: linear-gradient(145deg,#f5efff,#eadcff); }
.student-material .metric-card:nth-child(2) { background: linear-gradient(145deg,#effcfb,#d1f6f3); }
.student-material .metric-card:nth-child(3) { background: linear-gradient(145deg,#fff7ed,#ffedd5); }
.student-material .metric-card:nth-child(4) { background: linear-gradient(145deg,#effaf4,#dcfce7); }

.student-material .status-chip {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    border-radius: 999px;
    padding: .25rem .7rem;
    font-size: .75rem;
    font-weight: 700;
}

@media (max-width: 767px) {
    .student-material main { padding-bottom: 6.5rem !important; }
    .student-material .student-hero { border-radius: 26px; }
}

@media (prefers-reduced-motion: reduce) {
    .student-material *,
    .student-material *::before,
    .student-material *::after {
        animation: none !important;
        transition-duration: .01ms !important;
    }
}