/* ‘더 많은 이야기’의 분류판과 정렬에만 적용한다. 이 CSS 참조를 빼면 이전 모습으로 돌아간다. */
#v-home .subject-browser .subfilters{flex-direction:column;align-items:stretch;gap:12px;padding:0;border-bottom:0}
#v-home .subject-browser .subcats{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));
  gap:1px;width:100%;border:1px solid #34434F;background:#293640}
#v-home .subject-browser .subcats button{position:relative;display:flex;align-items:center;justify-content:center;
  min-width:0;min-height:48px;padding:10px 8px;gap:4px;border:0;
  background:#10161C;color:#ACBAC5;font-size:13px;font-weight:650;line-height:1.5;box-shadow:none;
  transition:background-color .16s,color .16s}
#v-home .subject-browser .subcats button[aria-pressed="true"]{
  background:#173246;color:#C7E8FF;font-weight:750;box-shadow:inset 0 -2px var(--sky)}
#v-home .subject-browser .subcats button[data-cat="별난"]{color:#DCC493}
#v-home .subject-browser .subcats button[data-cat="별난"][aria-pressed="true"]{
  background:#302819;color:#F4D98A;box-shadow:inset 0 -2px #DDB875}
#v-home .subject-browser .subcats button:focus-visible{z-index:1;outline:2px solid var(--sky);outline-offset:2px}
#v-home .subject-browser .subsorts{display:inline-flex;align-self:flex-end;align-items:stretch;flex-wrap:nowrap;
  gap:0;border:1px solid #2C3944;background:#0E1419}
#v-home .subject-browser .subsorts::before{content:'정렬';display:flex;align-items:center;padding:0 10px;
  border-right:1px solid #2C3944;color:#758591;font-size:10px;letter-spacing:.04em}
#v-home .subject-browser .subsorts button{min-height:32px;padding:6px 11px;font-size:11px;line-height:1.5;
  background:transparent;color:#99A8B4;box-shadow:none;transition:background-color .16s,color .16s}
#v-home .subject-browser .subsorts button+button{border-left:1px solid #2C3944}
#v-home .subject-browser .subsorts button[aria-pressed="true"]{background:#22333F;color:#C7E8FF;box-shadow:none}
@media(max-width:900px){
  #v-home .subject-browser .subcats{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(hover:hover){
  #v-home .subject-browser .subcats button:not([aria-pressed="true"]):hover,
  #v-home .subject-browser .subsorts button:not([aria-pressed="true"]):hover{background:#1B2832;color:#E3F0F9}
}
@media(prefers-reduced-motion:reduce){
  #v-home .subject-browser .subcats button,#v-home .subject-browser .subsorts button{transition:none}
}