.materials-album { margin-top: 24px; }
.materials-album-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 20px; margin-bottom:18px; }
.materials-album-count { margin:0; font-size:1rem; color:#52675e; }
.materials-album-filter { display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:#52675e; font-size:14px; }
.materials-album-select { max-width:100%; min-height:44px; padding:8px 30px 8px 10px; border:1px solid #cbd9ce; border-radius:8px; background:#fffefa; color:#194b40; font:inherit; }
.materials-album-item[hidden] { display:none; }
.materials-album-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 28px 24px; list-style: none; margin: 0; padding: 0; }
.materials-album-item { min-width: 0; }
.materials-album-link { display: flex; flex-direction: column; gap: 12px; color: var(--learn-ink,#194b40); text-decoration: none; min-height: 44px; }
.materials-album-cover { display: block; width: 100%; height: 252px; object-fit: contain; }
.materials-album-title { display:block; font-family:'Ttobak Learning','Noto Sans CJK KR','Malgun Gothic',sans-serif; font-size:17px; font-weight:700; line-height:24px; color:#194b40; word-break:keep-all; overflow-wrap:anywhere; }
.materials-album-category { display: block; margin-top: -6px; color: #52675e; font-size: .85rem; line-height: 1.5; }
.materials-album-link[href]:hover .materials-album-title { text-decoration: underline; text-underline-offset: 4px; }
.materials-album-link:focus-visible { outline: 3px solid #197c99; outline-offset: 5px; }
@media(max-width:1000px) { .materials-album-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px 18px; } .materials-album-cover { height: 224px; } }
@media(max-width:700px) { .materials-album-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 16px; } .materials-album-cover { height: 208px; } }
@media(max-width:380px) { .materials-album-grid { column-gap: 12px; } .materials-album-cover { height: 166px; } }
.materials-album-description {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  max-height: 48px;
  overflow: hidden;
  margin-top: 6px;
  color: #526550;
  font-family: 'Ttobak Learning', 'Noto Sans CJK KR', 'Malgun Gothic', sans-serif;
  font-size: 15px;
  font-weight: 400;
  font-synthesis: none;
  line-height: 1.6;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.materials-album-link-status { color: #526550; font-size: 14px; line-height: 1.6; }

/* Cover-led book gallery: original artwork, quiet paper edges, open page surface. */
body[data-ttobak-screen='materials'] .teacher-materials {margin-top:22px;}
body .teacher-materials .materials-heading {gap:16px;align-items:center;}
body .teacher-materials .materials-heading h2 {
  font-family:'Ttobak Learning','Noto Sans CJK KR','Malgun Gothic',sans-serif!important;
  font-size:28px;font-weight:900!important;line-height:1.4;letter-spacing:-.02em;color:#254c42;
}
.materials-album {margin-top:22px;}
.materials-album-toolbar {
  padding:14px 0 18px;margin-bottom:24px;border-bottom:1px solid #dce3d6;
}
.materials-album-count {font:500 15px/1.6 'Ttobak UI','Ttobak Learning',sans-serif;color:#586d61;}
.materials-album-filter {font:500 14px/1.5 'Ttobak UI','Ttobak Learning',sans-serif;gap:10px;}
.materials-album-select {min-width:174px;border-radius:12px;border-color:#d8dfd1;padding:10px 32px 10px 14px;background:#fffef8;}
.materials-album-grid {gap:40px 30px;align-items:start;}
.materials-album-link {
  height:100%;gap:0;padding:0 5px 4px 0;border:0;border-radius:3px;
  background:transparent;box-shadow:none;
}
.materials-album-book {
  position:relative;display:block;flex:0 0 auto;width:100%;box-sizing:border-box;
  /* Equal top/bottom breathing room; the paper edge remains below the artwork. */
  padding:5px 0 5px 5px;border-left:4px solid #e4e1d5;border-radius:3px 4px 4px 3px;
  background:#fffef8;
  box-shadow:1px 1px 0 #f2efe3,2px 2px 0 #dcded2,3px 3px 0 #f7f6ef,4px 4px 0 #dfe1d6,0 12px 17px -10px #3f574a52;
  transition:transform 160ms ease-out,box-shadow 160ms ease-out;
}
.materials-album-book::after {
  content:'';position:absolute;left:5px;right:0;bottom:2px;height:1px;background:#e2e0d5;pointer-events:none;
}
.materials-album-cover {
  aspect-ratio:1/1;height:auto;width:100%;object-fit:contain;object-position:center;
  box-sizing:border-box;
  padding:0;background:#fffef9;border-radius:1px 3px 2px 1px;border:0;
}
.materials-album-category {margin:14px 0 5px;color:#6f7564;font:500 14px/1.5 'Ttobak UI','Ttobak Learning',sans-serif;}
.materials-album-title {
  display:flex;align-items:center;min-height:2.9em;margin:0;font-family:'Ttobak UI','Ttobak Learning',sans-serif;
  font-size:17px;font-weight:600;line-height:1.45;color:#244e40;letter-spacing:-.01em;
  word-break:keep-all;overflow-wrap:anywhere;text-wrap:pretty;
}
.materials-album-description {margin-top:10px;min-height:48px;line-height:1.6;}
.materials-album-link[href]:hover {box-shadow:none;}
.materials-album-link[href]:hover .materials-album-book {transform:translateY(-2px);box-shadow:1px 1px 0 #f2efe3,2px 2px 0 #dcded2,3px 3px 0 #f7f6ef,4px 4px 0 #dfe1d6,0 15px 20px -10px #3f574a52;}
.materials-album-link[href]:hover .materials-album-title {text-decoration:none;color:#1f6654;}
.materials-album-link:focus-visible {outline:3px solid #197c99;outline-offset:3px;}
@media(max-width:1000px){.materials-album-grid{gap:34px 24px;}.materials-album-cover{height:auto;}}
@media(max-width:700px){
 .materials-album-grid{gap:28px 20px;}.materials-album-link{padding:0 4px 4px 0;border-radius:3px;}
 .materials-album-book{padding-left:3px;border-left-width:3px;}.materials-album-book::after{left:3px;}
 .materials-album-cover{height:auto;padding:0;}.materials-album-title{font-size:16px;min-height:4.35em;line-height:1.45;}
 .materials-album-category{font-size:14px;margin-top:12px;}.materials-album-description{font-size:14px;line-height:1.65;max-height:46.2px;min-height:46.2px;}
 .materials-album-toolbar{gap:12px;}.materials-album-filter{justify-content:space-between;flex:1 1 100%;}.materials-album-select{flex:1;}
}
@media(max-width:380px){.materials-album-grid{gap:26px 16px;}.materials-album-cover{height:auto;}}
@media(prefers-reduced-motion:reduce){.materials-album-book{transition:none;}.materials-album-link[href]:hover .materials-album-book{transform:none;}}
@media(forced-colors:active){.materials-album-link,.materials-album-cover{background:Canvas;border-color:CanvasText;box-shadow:none;}.materials-album-title,.materials-album-category{color:CanvasText;}}
@media(forced-colors:active){.materials-album-book,.materials-album-link[href]:hover .materials-album-book{background:Canvas;border:1px solid CanvasText;box-shadow:none;}.materials-album-book::after{display:none;}}
.materials-album-grid {align-items:stretch;}
.materials-album-item {display:flex;}
.materials-album-link {width:100%;}

/* Compact bookmark labels share one shape and a stable pastel per visible learning series. */
.materials-album-link .materials-album-category {
 --category-paper:#d0b6ef;--category-edge:#bd97e5;--category-highlight:#f7f3ff;--category-ink:#3d245d;
 display:flex;align-items:center;justify-content:center;align-self:flex-start;
 flex:0 0 auto;width:max-content;min-width:103px;height:26px;max-width:100%;box-sizing:border-box;
 margin:12px 0 8px;padding:0 16px 0 9px;border:0;border-radius:0;
 background:linear-gradient(var(--category-paper),var(--category-edge));box-shadow:inset 3px 0 0 var(--category-highlight);
 clip-path:polygon(0 0,100% 0,calc(100% - 7px) 50%,100% 100%,0 100%);
 color:var(--category-ink);font:500 13px/18px 'Ttobak UI','Ttobak Learning',sans-serif;
 text-align:center;white-space:nowrap;word-break:keep-all;
}
.materials-album-link .materials-album-category[data-series='사회성·화용'] {
 --category-paper:#d0b6ef;--category-edge:#bd97e5;--category-highlight:#f7f3ff;--category-ink:#3d245d;
}
.materials-album-link .materials-album-category[data-series='의문사'] {
 --category-paper:#a8dec3;--category-edge:#88cfac;--category-highlight:#f1faf4;--category-ink:#204c38;
}
.materials-album-link .materials-album-category[data-series='한자어'] {
 --category-paper:#abd3ee;--category-edge:#89bce2;--category-highlight:#f2f8fe;--category-ink:#234760;
}
.materials-album-link .materials-album-category[data-series='어휘·개념'] {
 --category-paper:#f2c2a0;--category-edge:#eaa77d;--category-highlight:#fff6ee;--category-ink:#60391e;
}
@media(max-width:700px){.materials-album-link .materials-album-category{min-width:96px;height:26px;font-size:12px;}}
@media(forced-colors:active){.materials-album-link .materials-album-category{clip-path:none;background:Canvas;border:1px solid CanvasText;color:CanvasText;box-shadow:none;}}