/* 0.9.18 교재 매대(P70) — 고른 시안 A(종류별 줄 목록) 그대로 옮김. 마지막에 읽힘(시안도 맨 뒤에 끼움).
 * 매대 본문 색은 앱 토큰(var(--…))만, 새 hex 0(홈 입구 카드만 0.9.20 시안 hex). 그림자 · 그러데이션 0(P67 플랫). .card/.group 은 쓰지 않음(soft.css 그림자).
 * 바뀐 곳: 바로가기 칩 a → button(.sh-chip, 단추 기본 모양 지움) · 표지 그림 칸(.sh-img) 추가. 시안 B(격자) 규칙은 옮기지 않음. */
body.vk.shell .sh{display:flex;flex-direction:column;gap:18px}
body.vk.shell .sh-disc{display:flex;gap:6px;align-items:flex-start;margin:0;word-break:keep-all;font-size:12.5px;line-height:19px;color:var(--text-2)}
body.vk.shell .sh-disc svg{flex:none;width:15px;height:15px;margin-top:2px}
body.vk.shell .sh-disc.end{padding-top:14px;border-top:1px solid var(--border)}
body.vk.shell .sh-jump{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -2px;padding:0 2px}
body.vk.shell .sh-jump .sh-chip{flex:none;display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0 14px;border:1px solid var(--border);border-radius:999px;background:var(--card);color:var(--text);font:inherit;font-size:13.5px;font-weight:600;text-decoration:none;cursor:pointer;-webkit-appearance:none;appearance:none;margin:0}
body.vk.shell .sh-jump .sh-chip small{color:var(--text-2);font-weight:500;font-size:12px;font-variant-numeric:tabular-nums}
body.vk.shell .sh-jump .sh-chip:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
body.vk.shell .sh-sec{display:flex;flex-direction:column;gap:10px;scroll-margin-top:12px}
body.vk.shell .sh-sec-h{display:flex;align-items:baseline;gap:6px;margin:0;font-size:17px;line-height:25px;font-weight:700;color:var(--text)}
body.vk.shell .sh-sec-h small{font-size:13px;font-weight:500;color:var(--text-2);font-variant-numeric:tabular-nums}
body.vk.shell .sh-cover{display:flex;align-items:center;justify-content:center;background:var(--tint);border-radius:8px;color:var(--acc);font-size:12px;line-height:16px;font-weight:700;text-align:center}
body.vk.shell .sh-cover.sh-img{overflow:hidden}
body.vk.shell .sh-cover.sh-img img{display:block;width:100%;height:100%;object-fit:contain}
body.vk.shell .sh-t{margin:0;font-size:15px;line-height:22px;font-weight:700;color:var(--text);word-break:keep-all;overflow-wrap:anywhere}
body.vk.shell .sh-m{margin:0;font-size:13px;line-height:19px;color:var(--text-2)}
body.vk.shell .sh-go{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:40px;padding:0 14px;border-radius:999px;background:var(--tint);color:var(--acc);font-size:13.5px;font-weight:700;text-decoration:none;white-space:nowrap}
body.vk.shell .sh-go svg{width:15px;height:15px}
body.vk.shell .sh-go:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
/* 0.9.21 보기 단추(P72) — 앱에 있는 .seg(voca.css · flat.css · soft.css) 그대로, 매대 폭 안에서 두 칸 반반. 정렬 기준 줄은 수익 안내와 같은 작은 글색 */
body.vk.shell .sh-viewbar{display:flex;flex-direction:column;gap:8px}
body.vk.shell .sh-seg button{min-width:0}
body.vk.shell .sh-sort{margin:0;padding:0 4px;font-size:12.5px;line-height:19px;color:var(--text-2);word-break:keep-all}
/* 0.9.25 선생님별(P76 — 하린 11-13 시안 mock-css ①② 그대로). 클래스는 선생님별일 때만 붙음(shelf.js) — 종류별 모양 그대로.
 * ① 이름 바로가기: 가로 스크롤 대신 줄바꿈(이름이 한눈에 다 보이게) · ② 한 권 묶음: 여백만 좁게(제목↔목록 10→6, 한 권 묶음끼리 18→10). 표지 · 글 크기 그대로 */
body.vk.shell .sh-jump.sh-tj{flex-wrap:wrap;overflow:visible;row-gap:8px}
body.vk.shell .sh-sec.one{gap:6px}
body.vk.shell .sh-sec.one + .sh-sec.one{margin-top:-8px}
/* A — 종류별 줄 목록 */
body.vk.shell .sh-list{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden}
body.vk.shell .sh-row{display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px;padding:14px 16px;border-bottom:1px solid var(--border)}
body.vk.shell .sh-row:last-child{border-bottom:0}
body.vk.shell .sh-row .sh-cover{width:56px;height:76px;font-size:11px}
body.vk.shell .sh-row .sh-b{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
body.vk.shell .sh-row .sh-go{margin-top:6px}
html[data-layout="wide"] body.vk.shell .sh-list{display:grid;grid-template-columns:1fr 1fr}
html[data-layout="wide"] body.vk.shell .sh-list .sh-row:nth-child(odd){border-right:1px solid var(--border)}
html[data-layout="wide"] body.vk.shell .sh-list .sh-row:nth-last-child(2):nth-child(odd){border-bottom:0}
html[data-layout="wide"] body.vk.shell .sh-list.one{grid-template-columns:1fr}
html[data-layout="wide"] body.vk.shell .sh-list.one .sh-row{border-right:0}
/* 홈 입구 카드 — 0.9.20 11-12 고른 시안: 서점에 가는 「가게」 카드(민트). 색 hex 는 시안 값 그대로(이 칸에만 — 위 매대 본문은 토큰만).
 * 제목 글색 = 다른 홈 카드와 같은 var(--text)(테마 강조색 아님). 연녹색 테마(data-color="d")에서는 초록에 묻히지 않게 살구색.
 * 320px: 제목은 줄바꿈 허용(keep-all), .tm-row 의 nowrap/grow 는 쓰지 않음. */
body.vk.shell .row.sh-entry{min-height:74px;padding:14px 16px;gap:14px;border-radius:22px;background:#e6f7f1;border:1px solid #bfe9da;color:var(--text)}
body.vk.shell .sh-entry .sh-ei{flex:none;display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;background:#2fae86;color:#fff}
body.vk.shell .sh-entry .sh-ei svg{width:24px;height:24px}
body.vk.shell .sh-entry .sh-eb{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
body.vk.shell .sh-entry .sh-et{font-size:17px;line-height:24px;font-weight:700;color:var(--text);word-break:keep-all;overflow-wrap:anywhere}
body.vk.shell .sh-entry .sh-es{font-size:12px;line-height:17px;font-weight:500;color:#258a6b;word-break:keep-all}
body.vk.shell .sh-entry .chev{flex:none;display:inline-flex;color:#258a6b}
body.vk.shell .sh-entry .chev svg{width:18px;height:18px}
html[data-tone="dark"] body.vk.shell .row.sh-entry{background:#13342b;border-color:#215a49}
html[data-tone="dark"] body.vk.shell .sh-entry .sh-es,html[data-tone="dark"] body.vk.shell .sh-entry .chev{color:#6fd3b1}
/* 연녹색(D) — 살구색 */
html[data-color="d"] body.vk.shell .row.sh-entry{background:#fff1ea;border-color:#ffd9c7}
html[data-color="d"] body.vk.shell .sh-entry .sh-ei{background:#ff8a5c}
html[data-color="d"] body.vk.shell .sh-entry .sh-es,html[data-color="d"] body.vk.shell .sh-entry .chev{color:#c4643d}
html[data-color="d"][data-tone="dark"] body.vk.shell .row.sh-entry{background:#3a2419;border-color:#6b3c27}
html[data-color="d"][data-tone="dark"] body.vk.shell .sh-entry .sh-es,html[data-color="d"][data-tone="dark"] body.vk.shell .sh-entry .chev{color:#ffb08f}