.cs-discover-categories{display:flex;align-items:center;gap:12px;margin:0 0 32px;min-width:0}
.cs-discover .cs-category-swiper{flex:1;min-width:0;margin:0;overflow-x:auto;padding:7px 4px 10px;scrollbar-width:none;touch-action:pan-x pan-y}
.cs-category-swiper::-webkit-scrollbar{display:none}
.cs-category-swiper .swiper-wrapper{display:flex;gap:10px;width:max-content}
.cs-category-swiper.swiper-container-horizontal{overflow:hidden;touch-action:pan-y}
.cs-category-swiper.swiper-container-horizontal .swiper-wrapper{width:100%;gap:0}
.cs-discover .cs-category-swiper .swiper-slide{--category-bg:#e8f1f4;--category-color:#507381;display:inline-flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:12px;width:98px;flex-shrink:0;white-space:nowrap;border:0;background:transparent;border-radius:12px;padding:0;font-size:14px;line-height:1.4;color:#37515e;text-decoration:none;text-align:center}
.cs-category-icon{display:flex;align-items:center;justify-content:center;flex:none;width:70px;height:70px;border-radius:50%;background:var(--category-bg);color:var(--category-color);transition:background .18s,color .18s,transform .18s,box-shadow .18s}
.cs-category-icon svg{display:block;width:43px;height:43px}
.cs-category-label{font-weight:500;letter-spacing:-.4px}
.cs-discover .cs-category-swiper [data-category-id="20"]{--category-bg:#edf4de;--category-color:#689238}
.cs-discover .cs-category-swiper [data-category-id="30"]{--category-bg:#e3f4ed;--category-color:#2c8b78}
.cs-discover .cs-category-swiper [data-category-id="50"]{--category-bg:#fff0d9;--category-color:#ba8530}
.cs-discover .cs-category-swiper [data-category-id="60"]{--category-bg:#f0e9f7;--category-color:#9473b3}
.cs-discover .cs-category-swiper [data-category-id="70"]{--category-bg:#e3f2fc;--category-color:#388cbb}
.cs-discover .cs-category-swiper [data-category-id="80"]{--category-bg:#fce9e9;--category-color:#c77373}
.cs-discover .cs-category-swiper [data-category-id="90"]{--category-bg:#f8ebdf;--category-color:#aa7c54}
.cs-discover .cs-category-swiper [data-category-id="a0"]{--category-bg:#e8edf9;--category-color:#6f83b7}
.cs-discover .cs-category-swiper [data-category-id="b0"]{--category-bg:#e4f3e6;--category-color:#589369}
.cs-discover .cs-category-swiper .is-active{background:transparent;color:#173c49}
.cs-category-swiper .is-active .cs-category-icon{background:#173c49;color:#fff;box-shadow:0 0 0 3px #d1e9ec,0 5px 13px #173c4914}
.cs-category-swiper .is-active .cs-category-label{font-weight:700}
@media(hover:hover){.cs-category-swiper a:hover .cs-category-icon{transform:translateY(-3px);box-shadow:0 5px 13px #173c4912}.cs-category-swiper a.is-active:hover .cs-category-icon{box-shadow:0 0 0 3px #d1e9ec,0 5px 13px #173c4914}}
.cs-category-swiper a:focus-visible,.cs-category-arrow:focus-visible,.cs-user-links .cs-admin-link:focus-visible{outline:2px solid #13a8ca;outline-offset:3px}
.cs-category-arrow{display:flex;align-items:center;justify-content:center;align-self:flex-start;margin-top:24px;flex:0 0 36px;width:36px;height:36px;background:#fff;border:1px solid #d7e5ec;border-radius:50%;color:#18323e;cursor:pointer}
.cs-category-arrow[hidden]{display:none}
.cs-category-arrow:disabled{opacity:.3;cursor:default}
.cs-category-arrow svg{width:18px;height:18px}
.cs-category-prev svg{transform:rotate(180deg)}
.cs-discover [aria-busy="true"]{opacity:.45;pointer-events:none;transition:opacity .15s}
.cs-discover-empty{grid-column:1/-1;padding:50px 0;text-align:center;color:#657a85}
.cs-discover-status.is-error{position:static!important;width:auto!important;height:auto!important;margin:0 0 18px!important;clip:auto!important;font-size:13px;color:#a54428}
.cs-user-links .cs-admin-link{display:inline-flex!important;align-items:center;justify-content:center;padding:7px 11px;border:1px solid #bcdfe7;border-radius:6px;background:#f0fafc;color:#087e98;white-space:nowrap;font-size:12px;font-weight:600}
@media(max-width:760px){
    .cs-discover-categories{gap:0;margin-bottom:22px}
    .cs-discover .cs-category-arrow{display:none!important}
    .cs-discover .cs-category-swiper{width:100%;overflow:visible;touch-action:auto}
    .cs-discover .cs-category-swiper .swiper-wrapper{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px 8px;width:100%!important;transform:none!important}
    .cs-discover .cs-category-swiper .swiper-slide{width:auto!important;min-width:0;font-size:12px;gap:8px;padding:0;min-height:0;white-space:normal}
    .cs-category-icon{width:min(52px,100%);height:auto;aspect-ratio:1}
    .cs-category-icon svg{width:32px;height:32px;max-width:80%;max-height:80%}
    .cs-category-label{display:block;width:100%;line-height:1.4;word-break:keep-all;overflow-wrap:anywhere}
    .cs-user-links .cs-admin-link{padding:6px 8px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){.cs-category-icon{transition:none}.cs-category-swiper a:hover .cs-category-icon{transform:none}}
/* 넓은 화면은 10개 카테고리를 균등 배치한다. 2px 여유로 Swiper 화살표 반올림 오차를 피한다. */
@media(min-width:1100px){
    .cs-discover .cs-category-swiper .swiper-wrapper{width:100%}
    .cs-discover .cs-category-swiper .swiper-slide{width:calc(10% - 9.2px)}
}