/* 메인 도구 모음 · 상단 도구 메뉴
   넓은 화면: 4칸 × 2줄 (HWP·PDF·Word·PPT / 엑셀·이미지·파일 — 파일 칸은 2칸 너비)
   중간 화면: 2칸, 휴대폰: 탭 */

/* 칸 색 */
.homecats .bigcat { --tm-c: #6B8CFF; }
.homecats .bigcat.cat-hwp { --tm-c: #3B82F6; }
.homecats .bigcat.cat-pdf { --tm-c: #EF4444; }
.homecats .bigcat.cat-word { --tm-c: #6366F1; }
.homecats .bigcat.cat-ppt { --tm-c: #F97316; }
.homecats .bigcat.cat-excel { --tm-c: #22C55E; }
.homecats .bigcat.cat-img { --tm-c: #EAB308; }
.homecats .bigcat.cat-file { --tm-c: #A855F7; }

@media (min-width: 1000px) {
  .homecats .bigcats:not(#tmx) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 14px !important; align-items: stretch !important; }
  .homecats .bigcat.cat-file:not(#tmx) { grid-column: span 2; }
  .homecats .bigcat.cat-file .trows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 8px; align-content: start; }
}
@media (min-width: 721px) and (max-width: 999px) {
  .homecats .bigcats:not(#tmx) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; align-items: stretch !important; }
}
.homecats .bigcat:not(#tmx) { display: flex; flex-direction: column; position: relative; overflow: hidden; box-shadow: inset 0 3px 0 var(--tm-c); }
.homecats .bigcat .trows { flex: 1 1 auto; }

/* 머리말: 더 굵고 크게, 칸 색 아이콘 */
.homecats .bigcat .bigcat-top:not(#tmx) { padding: 18px 16px 14px !important; gap: 12px !important; align-items: center; }
.homecats .bigcat .bigcat-tt b:not(#tmx) { font-size: 18px !important; font-weight: 800 !important; letter-spacing: -.025em; line-height: 1.25; }
.homecats .bigcat .bigcat-tt small:not(#tmx) { font-size: 12.5px !important; font-weight: 500 !important; opacity: .78; margin-top: 3px; line-height: 1.35; }
.homecats .bigcat .bigcat-ic:not(#tmx) { flex: none; color: var(--tm-c) !important; background: color-mix(in srgb, var(--tm-c) 16%, transparent) !important; border: 1px solid color-mix(in srgb, var(--tm-c) 35%, transparent) !important; }
.homecats .bigcat .trow b { font-weight: 700; }

/* 6개만 보이기 */
@media (min-width: 721px) {
  .bigcats:not(.tm-search) .bigcat.tm-clip:not(.tm-open) .trows > li:nth-child(n+7) { display: none !important; }
}
.tm-more {
  display: block; width: calc(100% - 24px); margin: 4px 12px 12px; padding: 9px 12px;
  border: 1px dashed rgba(148, 163, 184, .35); border-radius: 12px; background: none;
  color: inherit; opacity: .85; font: 600 13px/1.2 inherit; cursor: pointer; text-align: center;
}
.tm-more:hover { opacity: 1; border-style: solid; border-color: var(--tm-c, #1E6FE8); }
.bigcats.tm-search .tm-more { display: none; }
.bigcat .new-badge { flex: none; }

/* 휴대폰: 칸을 탭으로 */
.tm-tabs { display: none; }
.homecats .hc-in { min-width: 0; }
@media (max-width: 720px) {
  .tm-tabs:not([hidden]) {
    display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: 0 -16px 12px; padding: 2px 16px 4px;
    width: calc(100% + 32px); max-width: calc(100vw); box-sizing: border-box; contain: inline-size;
    position: relative; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 calc(100% - 12px), transparent);
  }
  .tm-tabs::-webkit-scrollbar { display: none; }
  .tm-tabs button {
    flex: none; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(148, 163, 184, .3);
    background: rgba(15, 23, 42, .55); color: inherit; font: 700 13.5px/1 inherit; white-space: nowrap; cursor: pointer;
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  }
  .tm-tabs button[aria-selected="true"] { background: #1E6FE8; border-color: #1E6FE8; color: #fff; }
  .homecats .bigcats.tm-tabbed:not(.tm-search) .bigcat:not(.tm-on) { display: none !important; }
  .homecats .bigcats.tm-tabbed:not(#tmx) { grid-template-columns: 1fr !important; }
  .bigcats.tm-tabbed .tm-more { display: none; }
}
html[data-theme="light"] .tm-tabs button { background: rgba(255, 255, 255, .8); }

/* 상단 도구 메뉴: 4칸 */
@media (min-width: 821px) {
  .tools-menu ul.mega:not(#tmx) { grid-template-columns: repeat(4, minmax(150px, 1fr)); min-width: 760px; }
  .tools-menu ul.mega .mgrp > a.mh { font-size: 12.5px; font-weight: 800; letter-spacing: -.01em; }
}