:root {
  --acm-blue: #1595d1;
  --acm-blue-dark: #0b6f9e;
  --acm-blue-soft: #eaf6fc;
  --rhu-purple: #54217b;
  --ink: #102a3a;
  --text: #334b59;
  --muted: #667985;
  --line: #d9e3e8;
  --surface: #f5f8fa;
  --white: #ffffff;
  --content: 1180px;
  --shadow: 0 14px 36px rgba(16, 42, 58, 0.09);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 92px;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--white);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 1rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

button,
input,
select,
textarea {
  font: inherit;
}

a {
  color: inherit;
}

h1,
h2,
h3,
h4 {
  margin-top: 0;
  color: var(--ink);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.15;
}

h1 {
  font-size: clamp(2.6rem, 6vw, 5.4rem);
}

h2 {
  font-size: clamp(2rem, 3.6vw, 3.25rem);
}

h3 {
  font-size: 1.45rem;
}

p {
  margin-top: 0;
}

:focus-visible {
  outline: 3px solid rgba(21, 149, 209, 0.35);
  outline-offset: 4px;
}

.hidden {
  display: none !important;
}

header.fixed-top {
  max-width: 100vw;
  border-bottom: 1px solid rgba(217, 227, 232, 0.9);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 4px 18px rgba(16, 42, 58, 0.04);
  backdrop-filter: blur(12px);
}

.navbar {
  min-height: 82px;
  padding: 0;
  background: transparent;
}

.navbar .container-fluid {
  width: min(100% - 40px, var(--content));
  margin: 0 auto;
  padding: 0;
}

.branding-container {
  display: flex;
  align-items: center;
  gap: 14px;
}

.navbar-brand {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0;
}

.rhu-logo-img,
.rhu-logo-img-min,
.rhu-logo-img-max {
  width: 152px;
  height: 40px;
  object-fit: contain;
  object-position: left center;
  padding-right: 14px;
  border-right: 1px solid var(--line) !important;
}

.acm-logo-img,
.acm-logo-img-min,
.acm-logo-img-max {
  width: 52px;
  height: 52px;
  object-fit: contain;
}

.navbar-nav {
  align-items: center;
  gap: 8px;
}

.navbar-nav .nav-link {
  position: relative;
  padding: 28px 12px 24px !important;
  color: var(--ink);
  font-size: 0.95rem;
  font-weight: 600;
}

.navbar-nav .nav-link::after {
  position: absolute;
  right: 12px;
  bottom: 18px;
  left: 12px;
  height: 2px;
  background: var(--acm-blue);
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 180ms ease;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link.active {
  color: var(--acm-blue-dark) !important;
}

.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link:focus::after,
.navbar-nav .nav-link.active::after {
  transform: scaleX(1);
}

.navbar-toggler {
  min-width: 48px;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 8px;
}

.navbar-toggler:focus {
  box-shadow: 0 0 0 3px rgba(21, 149, 209, 0.18);
}

#progress-bar {
  height: 3px;
  background: transparent;
}

#progress-bar-fill {
  width: 100%;
  height: 100%;
  background: var(--rhu-purple);
  transform: scaleX(0);
  transform-origin: left;
}

.button-primary,
.button-secondary,
.button-transparent {
  max-width: 100%;
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 3px;
  padding: 11px 22px;
  font: inherit;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.button-primary {
  border-color: var(--acm-blue);
  background: var(--acm-blue);
  color: var(--white);
}

.button-primary:hover {
  border-color: var(--acm-blue-dark);
  background: var(--acm-blue-dark);
  color: var(--white);
  transform: translateY(-1px);
}

.button-secondary {
  border-color: var(--line);
  background: var(--white);
  color: var(--ink);
}

.button-secondary:hover {
  border-color: var(--ink);
  background: var(--white);
  color: var(--ink);
}

.button-transparent {
  border-color: rgba(255, 255, 255, 0.75);
  background: transparent;
  color: var(--white);
}

.button-transparent:hover {
  background: var(--white);
  color: var(--ink);
}

.button-primary a,
.button-secondary a,
.button-transparent a,
.read-more-link {
  color: inherit !important;
  text-decoration: none;
}

.read-more-link {
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: rgba(255, 255, 255, 0.55);
  text-underline-offset: 4px;
}

.read-more-link:hover {
  color: inherit;
  text-decoration-color: currentColor;
}

.card {
  overflow: hidden;
  border: 1px solid var(--line) !important;
  border-radius: 4px !important;
  background: var(--white);
  box-shadow: 0 8px 24px rgba(16, 42, 58, 0.07);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.card:hover {
  border-color: rgba(21, 149, 209, 0.6) !important;
  box-shadow: var(--shadow);
  cursor: pointer;
  transform: translateY(-4px);
}

.card-img-top {
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.card-body {
  padding: 20px;
}

.card-text {
  margin: 0;
  color: var(--ink);
  font-weight: 700;
  line-height: 1.4;
  text-align: left;
}

.image-container {
  position: relative;
  overflow: hidden;
  background: var(--surface);
}

.blue-circle {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 54px;
  min-height: 54px;
  border-radius: 2px;
  background: var(--white);
  box-shadow: 0 6px 16px rgba(16, 42, 58, 0.16);
}

.circle-number,
.circle-month {
  margin: 0 !important;
  color: var(--ink);
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
}

.circle-number {
  padding-top: 8px;
  font-size: 1.1rem;
}

.circle-month {
  color: var(--rhu-purple);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.card-type {
  position: absolute;
  bottom: 0;
  left: 0;
  min-width: 104px;
  padding: 7px 12px;
  background: var(--acm-blue);
}

.card-type-title {
  margin: 0;
  color: var(--white);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-align: center;
  text-transform: uppercase;
}

.section-template {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.6fr);
  gap: clamp(48px, 8vw, 110px);
  align-items: center;
  width: 100%;
  padding: 110px max(24px, calc((100vw - var(--content)) / 2));
}

.section-template:nth-of-type(even) {
  grid-template-columns: minmax(260px, 0.6fr) minmax(0, 1.4fr);
}

.section-template-words {
  min-width: 0;
  max-width: 720px;
}

.section-template-words > *:last-child {
  margin-bottom: 0;
}

.section-template h2 {
  margin-bottom: 28px;
}

.section-template p,
.section-template li {
  font-size: 1.05rem;
}

.section-template-illustration {
  min-width: 0;
  text-align: center;
}

.section-template-illustration img {
  max-height: 300px;
  object-fit: contain;
}

.section-template-blue {
  background: var(--acm-blue-dark);
  color: rgba(255, 255, 255, 0.9);
}

.section-template-blue h2,
.section-template-blue h3 {
  color: var(--white);
}

.bottom-to-top-button {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 1000;
  display: none;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--acm-blue-dark);
  border-radius: 3px;
  background: var(--acm-blue);
  box-shadow: 0 8px 22px rgba(16, 42, 58, 0.2);
  cursor: pointer;
}

.bottom-to-top-button:hover {
  background: var(--acm-blue-dark);
}

.bottom-to-top-button .arrow {
  width: 16px;
  fill: var(--white);
}

footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 64px 24px 30px;
  border-top: 5px solid var(--rhu-purple);
  background: var(--ink);
  color: rgba(255, 255, 255, 0.72);
  text-align: center;
}

footer > * {
  margin: 0 0 20px;
}

footer > a > img {
  width: 76px;
  height: 76px;
}

footer h3 {
  margin-bottom: 24px;
  color: var(--white);
  font-size: 1.25rem;
}

footer .navbar-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 24px;
}

footer .navbar-footer a {
  padding: 4px 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.94rem;
  font-weight: 600;
  text-decoration: none;
}

footer .navbar-footer a:hover,
footer .navbar-footer a.active {
  color: var(--white);
  text-decoration: underline;
  text-decoration-color: var(--acm-blue);
  text-underline-offset: 5px;
}

footer .image-footer-container {
  display: flex;
  justify-content: center;
  gap: 12px;
}

footer .image-footer-container a {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 3px;
}

footer .image-footer-container a:hover {
  border-color: var(--acm-blue);
  background: rgba(21, 149, 209, 0.14);
}

footer .image-footer-container img {
  width: 20px;
  height: 20px;
  margin: 0;
  object-fit: contain;
}

.instagram-image:hover,
.linkedin-image:hover {
  border-radius: 0 !important;
  background: none;
}

.footer-copyright {
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.52);
  font-size: 0.86rem;
}

.logout-button {
  position: absolute;
  top: 16px;
  right: 16px;
  padding: 9px 16px;
  border: 1px solid #b42318;
  border-radius: 3px;
  background: #b42318;
  color: var(--white);
  font-size: 0.95rem;
  cursor: pointer;
}

.logout-button:hover {
  background: #8f1b13;
}

@media (max-width: 991px) {
  header.fixed-top {
    max-height: 100dvh;
    overflow-y: auto;
  }

  .navbar {
    min-height: 72px;
  }

  .navbar .container-fluid {
    width: min(100% - 28px, var(--content));
    padding: 9px 0;
  }

  .navbar-collapse {
    margin-top: 10px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--white);
    box-shadow: 0 14px 24px rgba(16, 42, 58, 0.08);
  }

  .navbar-nav {
    align-items: stretch;
    gap: 0;
    padding: 8px 0 12px;
  }

  .navbar-nav .nav-link {
    display: flex;
    min-height: 48px;
    align-items: center;
    padding: 10px 4px !important;
  }

  .navbar-nav .nav-link::after {
    right: auto;
    bottom: 4px;
    left: 4px;
    width: 28px;
  }

  .section-template,
  .section-template:nth-of-type(even) {
    grid-template-columns: 1fr;
    gap: 42px;
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .section-template-illustration {
    order: 2;
  }

  .section-template-words {
    max-width: none;
  }
}

@media (max-width: 600px) {
  body {
    line-height: 1.65;
  }

  h1 {
    font-size: clamp(2.25rem, 11vw, 3.15rem);
  }

  h2 {
    font-size: 2rem;
  }

  .rhu-logo-img,
  .rhu-logo-img-min,
  .rhu-logo-img-max {
    width: 118px;
    height: 32px;
    padding-right: 10px;
  }

  .acm-logo-img,
  .acm-logo-img-min,
  .acm-logo-img-max {
    width: 44px;
    height: 44px;
  }

  .bottom-to-top-button {
    right: 14px;
    bottom: calc(14px + env(safe-area-inset-bottom));
  }

  .section-template,
  .section-template:nth-of-type(even) {
    gap: 32px;
    padding: 64px 16px;
  }

  .section-template p,
  .section-template li {
    font-size: 1rem;
  }

  .section-template-illustration img {
    max-height: 240px;
  }

  .section-template .button-primary,
  .section-template .button-secondary,
  .section-template .button-transparent {
    width: 100%;
  }

  footer {
    padding: 52px 18px 26px;
  }

  footer .navbar-footer {
    flex-direction: column;
    gap: 8px;
  }

  footer .navbar-footer a {
    min-height: 48px;
    padding: 8px 14px;
  }
}

@media (max-width: 360px) {
  .navbar .container-fluid {
    width: calc(100% - 20px);
  }

  .branding-container {
    gap: 8px;
  }

  .rhu-logo-img,
  .rhu-logo-img-min,
  .rhu-logo-img-max {
    width: 104px;
    padding-right: 8px;
  }

  .acm-logo-img,
  .acm-logo-img-min,
  .acm-logo-img-max {
    width: 40px;
    height: 40px;
  }
}

@media (hover: none) {
  .card:hover,
  .member:hover,
  .button-primary:hover {
    transform: none;
  }
}

.content-state {
  grid-column: 1 / -1;
  width: 100%;
  margin: 0;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--acm-blue);
  background: var(--surface);
  color: var(--muted);
  font-size: 1rem;
}

.content-state.is-error {
  border-left-color: #b42318;
  background: #fff7f6;
  color: #8f1b13;
}

.content-state[hidden] {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Reuse main.css and Home's Bootstrap navbar; library content stays framework-free. */
[hidden]{display:none!important}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:-80px;z-index:1040;background:var(--white);padding:12px 20px}.skip-link:focus{top:10px}
.materials-page{padding-top:85px}
.library-width{width:min(100% - 40px,var(--content));margin-inline:auto}
.library-hero{position:relative;overflow:hidden;background:#dceff8 url('/images/hero-sky.webp') center / cover no-repeat;border-bottom:1px solid var(--line)}
.library-hero::before{position:absolute;inset:0;background:rgba(234,246,252,.3);content:""}
.hero-content{position:relative;display:flex;flex-direction:column;align-items:center;padding-block:64px 52px;z-index:1;text-align:center}
.eyebrow{font-size:.7rem;letter-spacing:.14em;font-weight:750;color:var(--acm-blue-dark);margin-bottom:18px;line-height:1.6}
.eyebrow>span{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:8px;background:var(--acm-blue)}
.library-hero h1{font-size:clamp(2.7rem,5.2vw,4.7rem);line-height:1.05;letter-spacing:-.055em;margin-bottom:22px;max-width:1000px;color:var(--ink)}
.library-hero p{color:var(--text);font-size:1.05rem;line-height:1.7;margin-bottom:26px}
.library-hero .library-credits{display:flex;flex-wrap:wrap;justify-content:center;column-gap:6px;row-gap:2px;margin:0 0 24px;font-size:.83rem;line-height:1.7;color:var(--text)}
.library-credits strong{font-weight:700;color:var(--rhu-purple)}
.library-stats{display:flex;flex-wrap:wrap;align-items:center;gap:24px;font-size:.82rem;color:var(--muted)}
.library-stats>span+span{border-left:1px solid #bdcfda;padding-left:24px}.library-stats strong{color:var(--ink);font-weight:750}
.library-layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:38px;padding-block:44px 56px;align-items:start;scroll-margin-top:100px}
.sidebar-heading .eyebrow{margin-bottom:8px}.sidebar-heading h2{font-size:1.45rem;margin-bottom:22px}
.course-controls{display:grid;gap:10px}.search-field{position:relative}.search-field>span{position:absolute;top:4px;left:14px;font-size:1.7rem;color:var(--muted)}
.materials-page input,.materials-page select{min-height:48px;width:100%;min-width:0;border:1px solid #c9d9e2;background:white;border-radius:5px;color:var(--ink);font-size:.9rem;padding:11px 14px;line-height:1.4}
.search-field input{padding-left:42px}.materials-page input::placeholder{color:#667985}.materials-page select{cursor:pointer}
.course-count{font-size:.77rem;color:var(--muted);margin:16px 0 10px}.course-list{display:grid;gap:5px;max-height:710px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c9d9e2 transparent;padding:3px}
.course-link{display:flex;align-items:center;gap:12px;min-height:76px;text-decoration:none;padding:12px;border:1px solid transparent;border-radius:6px;transition:background-color .15s}
.course-link:hover{background:var(--surface)}.course-link[aria-current]{border-color:#a3d3e9;background:var(--acm-blue-soft)}
.course-symbol{display:grid;place-items:center;flex-shrink:0;width:37px;height:40px;background:var(--surface);border:1px solid var(--line);border-radius:5px;color:var(--acm-blue-dark);font-size:.8rem;font-weight:750}
.course-link[aria-current] .course-symbol{background:white;border-color:#bddfee}.course-label{flex:1;min-width:0}.course-label strong{display:block;font-size:.86rem;line-height:1.45;color:var(--ink);font-weight:650}.course-label small{display:block;color:var(--muted);font-size:.7rem;margin-top:3px}.course-arrow{color:var(--muted)}
.resource-panel{border:1px solid var(--line);border-radius:9px;padding:28px;min-height:610px;background:white;box-shadow:0 6px 24px #102a3a04;scroll-margin-top:110px}
.panel-heading{display:flex;gap:20px;justify-content:space-between;align-items:start}.panel-heading .eyebrow{margin-bottom:9px}.panel-heading h2{font-size:clamp(1.55rem,2.5vw,2rem);margin:0;overflow-wrap:anywhere}.panel-badge{display:grid;place-items:center;color:var(--acm-blue-dark);background:var(--acm-blue-soft);border-radius:50%;width:40px;height:40px;flex-shrink:0;font-size:1.3rem}
.resource-status{margin:14px 0 24px;color:var(--muted);font-size:.88rem;min-height:1.5em}.file-controls{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:10px;margin-bottom:16px}
.welcome-state{display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:55px 16px 60px;border-top:1px solid var(--line)}
.welcome-state>span{display:grid;place-items:center;width:76px;height:86px;border:1px solid #cce3ef;border-radius:9px;background:linear-gradient(145deg,#f5fbfe,#eaf6fc);font-size:2rem;color:var(--acm-blue-dark);margin-bottom:24px}
.welcome-state h3{font-size:1.25rem;margin-bottom:12px}.welcome-state p{font-size:.92rem;max-width:350px;color:var(--muted);line-height:1.8}.welcome-tags{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:12px}.welcome-tags span{border:1px solid var(--line);border-radius:4px;padding:5px 9px;font-size:.7rem;color:var(--muted)}
.file-row{display:flex;gap:13px;align-items:center;padding:18px 0;border-top:1px solid var(--line)}
.file-icon-sprite{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.file-icon{width:42px;min-height:48px;flex-shrink:0;display:grid;place-items:center;border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:5px}
.file-icon svg{display:block;width:26px;height:30px}
.file-icon--pdf{color:#b63636;border-color:#f0d6d6;background:#fff4f3}
.file-icon--document{color:var(--acm-blue-dark);border-color:#cce3ef;background:#f2f9fc}
.file-icon--sheet{color:#287347;border-color:#cfe6d7;background:#f0f8f3}
.file-icon--slides,.file-icon--archive{color:#9a5c19;border-color:#efdfc6;background:#fff8ee}
.file-icon--video{color:var(--rhu-purple);border-color:#e1d5eb;background:#f8f3fc}
.file-icon--audio{color:#9e4774;border-color:#eed6e4;background:#fdf3f8}
.file-icon--image{color:#237a83;border-color:#cbe3e6;background:#eff9fa}
.file-icon--code{color:#445c85;border-color:#d6deec;background:#f3f6fc}
.file-description{flex:1;min-width:0}.file-description h3{font-size:.9rem;line-height:1.5;overflow-wrap:anywhere;margin:0}.file-description p{font-size:.72rem;margin:5px 0 0;color:var(--muted);overflow-wrap:anywhere}.file-actions{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end}.file-actions a{min-height:48px;min-width:48px;display:flex;align-items:center;padding:9px;color:var(--acm-blue-dark);font-size:.78rem;font-weight:650;text-decoration:none;border-radius:4px}.file-actions a:hover{background:var(--acm-blue-soft);text-decoration:underline}
.empty-search{padding:22px 8px;font-size:.9rem;color:var(--muted)}.course-source{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line);margin-top:20px;padding-top:12px;font-size:.75rem;color:var(--muted)}.course-source a{display:flex;align-items:center;min-height:48px;color:var(--acm-blue-dark);font-weight:650}
#load-more{margin-top:18px;min-height:48px}.library-help{border-top:1px solid var(--line);padding-block:30px;display:flex;justify-content:space-between;gap:24px;align-items:center}.library-help h2{font-size:1.3rem;margin-bottom:7px}.library-help p{font-size:.9rem;color:var(--muted);margin:0}.library-help>a{flex-shrink:0;min-height:48px}.source-note{font-size:.75rem;color:var(--muted);padding-bottom:26px}.materials-page footer{margin-top:0}.materials-page footer a{min-height:48px;display:inline-flex;align-items:center}
@media(max-width:1050px){.library-layout{grid-template-columns:290px minmax(0,1fr);gap:24px}.resource-panel{padding:22px}.file-row{flex-wrap:wrap}.file-actions{margin-left:55px}}
@media(max-width:760px){.library-width{width:calc(100% - 32px)}.hero-content{padding-block:38px 32px}.library-hero h1{font-size:clamp(2rem,6.7vw,2.65rem)}.library-hero p{font-size:.94rem}.library-stats{gap:12px;font-size:.74rem}.library-stats>span+span{padding-left:12px}.library-layout{display:block;padding-block:28px}.sidebar-heading h2{font-size:1.3rem}.course-controls{grid-template-columns:minmax(0,1fr) 140px}.course-list{max-height:310px;margin-bottom:26px;border-bottom:1px solid var(--line);padding-bottom:10px}.course-link{min-height:72px}.resource-panel{min-height:450px;padding:20px}.file-controls{grid-template-columns:1fr}.welcome-state{padding:38px 0}.library-help{align-items:start;flex-direction:column;gap:16px}.desktop-break{display:none}.file-actions a{padding-inline:10px}.file-description h3{font-size:.86rem}.eyebrow{font-size:.65rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

@media(max-width:991px){.materials-page{padding-top:75px}}

/* RHU purple accents complement the blue actions and format-specific icons. */
.materials-page { --rhu-purple-soft: #f4eef9; }
.library-hero { border-bottom-color: #d9c7e6; }
.sidebar-heading .eyebrow,
.panel-heading .eyebrow { color: var(--rhu-purple); }
.course-link[aria-current] {
  background: var(--rhu-purple-soft);
  border-color: #d9c7e6;
  box-shadow: inset 3px 0 0 var(--rhu-purple);
}
.course-link[aria-current] .course-symbol {
  color: var(--rhu-purple);
  border-color: #d9c7e6;
}
.course-link[aria-current] .course-arrow,
.panel-badge { color: var(--rhu-purple); }
.panel-badge { background: var(--rhu-purple-soft); }
.resource-panel { border-top: 3px solid var(--rhu-purple); }
.welcome-state > span {
  color: var(--rhu-purple);
  background: var(--rhu-purple-soft);
  border-color: #e6d9ee;
}
.materials-page :is(input, select):focus-visible {
  outline-color: rgba(84, 33, 123, .35);
  border-color: var(--rhu-purple);
}

.courses-back { display:none; }
.course-folder-icon { display:block; width:26px; height:26px; }
.course-symbol { color:var(--rhu-purple); }
.file-controls { grid-template-columns:1fr; }
.library-course-open .courses-back { display:grid; place-items:center; width:48px; height:48px; flex-shrink:0; border-radius:50%; color:var(--rhu-purple); }
.courses-back svg { width:24px; height:24px; }
.courses-back:hover { background:var(--rhu-purple-soft); }
.library-course-open .panel-heading { justify-content:flex-start; align-items:center; }
.library-course-open .panel-heading > div { min-width:0; flex:1; }
.library-course-open:not(.library-folder-open) .resource-panel { min-height:0; }
.category-folders { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.category-folder { display:flex; align-items:center; gap:12px; padding:18px 14px; min-height:100px; border:1px solid var(--line); border-radius:8px; color:var(--ink); text-decoration:none; }
.category-folder:hover { border-color:#c5a9db; background:var(--rhu-purple-soft); text-decoration:none; }
.category-folder-icon { display:block; width:28px; height:28px; flex-shrink:0; color:var(--rhu-purple); }
.category-folder > span:not(.folder-arrow) { min-width:0; }
.category-folder strong { display:block; font-size:.9rem; font-weight:650; overflow-wrap:anywhere; }
.category-folder small { display:block; font-size:.75rem; margin-top:4px; color:var(--muted); }
.folder-arrow { margin-left:auto; color:var(--rhu-purple); }
.folder-breadcrumb { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px; font-size:.9rem; color:var(--muted); }
.folder-breadcrumb a { display:inline-flex; align-items:center; min-height:48px; color:var(--acm-blue-dark); }
.folder-breadcrumb strong { color:var(--rhu-purple); }
.category-folder:focus-visible,.courses-back:focus-visible { outline:2px solid var(--rhu-purple); outline-offset:2px; }
@media(max-width:760px) { .category-folders { grid-template-columns:1fr; } .category-folder { min-height:88px; padding:16px; } }
.course-code { display:block; margin-top:3px; color:var(--rhu-purple); font-size:.8rem; font-weight:600; line-height:1.45; }
.panel-course-code { margin:8px 0 0; color:var(--rhu-purple); font-size:.88em; font-weight:600; line-height:1.4; }
.panel-heading > div { font-size:clamp(1.55rem,2.5vw,2rem); }
@media(min-width:761px) and (max-width:1023px) {
  .course-code { font-size:.88rem; }
  .panel-heading > div { font-size:1.85rem; }
}
@media(max-width:760px) {
  .course-code { font-size:.85rem; }
  .panel-heading > div { font-size:1.4rem; }
}

/* Tablets have room for course cards, then a full-width resource list. */
@media(min-width:761px) and (max-width:1023px) {
  .library-width { width:calc(100% - 48px); }
  .hero-content { padding-block:40px 32px; }
  .library-hero h1 { font-size:2.8rem; }
  .library-layout { display:block; padding-block:32px 40px; }
  .course-controls { grid-template-columns:minmax(0,1fr) 200px; }
  .course-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; max-height:none; overflow:visible; padding:3px; }
  .course-link { min-height:104px; padding:16px; border:1px solid var(--line); background:white; border-radius:9px; }
  .course-symbol { width:40px; height:44px; color:var(--rhu-purple); background:var(--rhu-purple-soft); border-color:#e6d9ee; }
  .course-folder-icon { display:block; width:24px; height:24px; }
  .course-label strong { font-size:.95rem; }
  .course-label small { font-size:.75rem; }
  .materials-page:not(.library-course-open) .resource-panel { display:none; }
  .library-course-open .course-sidebar,.library-course-open .library-hero { display:none; }
  .library-course-open .resource-panel { min-height:0; padding:24px; }
  .panel-heading { align-items:center; justify-content:start; gap:14px; }
  .panel-heading > div { min-width:0; }
  .panel-heading h2 { font-size:1.85rem; }
  .panel-heading .eyebrow { margin-bottom:4px; }
  .panel-badge { display:none; }
  .courses-back { display:grid; place-items:center; width:48px; height:48px; flex-shrink:0; border-radius:50%; color:var(--rhu-purple); }
  .courses-back:hover { background:var(--rhu-purple-soft); }
  .courses-back svg { width:24px; height:24px; }
  .file-row { flex-wrap:nowrap; padding-block:20px; }
  .file-description h3 { font-size:.95rem; }
  .file-description p { font-size:.78rem; line-height:1.6; }
  .file-actions { margin:0 0 0 8px; flex-shrink:0; flex-wrap:nowrap; }
  .courses-back:focus-visible,.course-link:focus-visible { outline:2px solid var(--rhu-purple); outline-offset:2px; }
}

/* Phone browsing follows a folder list: courses first, then one course's files. */
@media(max-width:760px) {
  .hero-content { padding-block:26px 24px; }
  .library-hero h1 { margin-bottom:14px; }
  .library-hero .library-credits { margin-bottom:16px; font-size:.75rem; }
  .library-hero p { margin-bottom:16px; }
  .library-layout { padding-block:24px 32px; }
  .course-controls { grid-template-columns:1fr; }
  .course-list { max-height:none; overflow:visible; margin-bottom:0; padding:0; gap:0; border:0; }
  .course-link { min-height:76px; padding:12px 0; border:0; border-bottom:1px solid var(--line); border-radius:0; gap:14px; }
  .course-symbol { width:38px; height:40px; border:0; background:transparent; color:var(--rhu-purple); }
  .course-folder-icon { display:block; width:26px; height:26px; }
  .course-label strong { font-size:.92rem; }
  .course-label small { font-size:.75rem; }
  .course-arrow { font-size:1.15rem; padding-right:6px; }
  .materials-page:not(.library-course-open) .resource-panel { display:none; }
  .library-course-open .course-sidebar,.library-course-open .library-hero { display:none; }
  .library-course-open .resource-panel { min-height:0; padding:0; border:0; border-radius:0; box-shadow:none; }
  .panel-heading { align-items:center; justify-content:start; gap:10px; margin-left:-8px; }
  .panel-heading > div { min-width:0; }
  .panel-heading .eyebrow { margin-bottom:3px; font-size:.65rem; }
  .panel-heading h2 { font-size:1.4rem; line-height:1.3; }
  .panel-badge { display:none; }
  .courses-back { display:grid; place-items:center; width:48px; height:48px; flex-shrink:0; border-radius:50%; color:var(--rhu-purple); }
  .courses-back:hover { background:var(--rhu-purple-soft); }
  .courses-back svg { width:24px; height:24px; }
  .resource-status { margin:16px 0; }
  .file-controls { gap:10px; margin-bottom:16px; }
  .file-row { display:grid; grid-template-columns:38px minmax(0,1fr); gap:4px 12px; padding:16px 0 8px; align-items:start; }
  .file-icon { width:38px; min-height:44px; grid-row:1 / 3; }
  .file-description h3 { font-size:.92rem; }
  .file-description p { font-size:.75rem; line-height:1.6; }
  .file-actions { grid-column:2; margin:0; justify-content:start; gap:12px; }
  .file-actions a { padding-inline:0; font-size:.8rem; }
  .courses-back:focus-visible,.course-link:focus-visible { outline:2px solid var(--rhu-purple); outline-offset:2px; }
}