/* knit-tablet.css — 仅平板
 * 由 tools/split-knit-device-css.js 从 knit.css 拆出。共享样式仍在 knit.css。
 * 修改对应端布局时优先改本文件，避免三端规则混在一起。
 */
html[data-device="tablet"] .knit-grid,
html[data-device="tablet"] #knitGrid,
html[data-device="tablet"] #knitUserProfileGrid {
  --knit-grid-cols: 3;
  --knit-grid-gap: 10px;
  grid-template-columns: repeat(var(--knit-grid-cols), minmax(0, 1fr));
  grid-auto-rows: var(--knit-grid-masonry-unit);
  gap: var(--knit-grid-gap);
  min-width: 0 !important;
  width: 100% !important;
  align-items: start;
  align-content: start;
}

html[data-device="tablet"] .knit-grid[data-knit-cols="2"],
html[data-device="tablet"] #knitGrid[data-knit-cols="2"],
html[data-device="tablet"] #knitUserProfileGrid[data-knit-cols="2"] {
  --knit-grid-cols: 2;
}

html[data-device="tablet"] .knit-grid[data-knit-cols="3"],
html[data-device="tablet"] #knitGrid[data-knit-cols="3"],
html[data-device="tablet"] #knitUserProfileGrid[data-knit-cols="3"] {
  --knit-grid-cols: 3;
}

html[data-device="tablet"] .knit-grid[data-knit-cols="4"],
html[data-device="tablet"] #knitGrid[data-knit-cols="4"],
html[data-device="tablet"] #knitUserProfileGrid[data-knit-cols="4"] {
  --knit-grid-cols: 4;
}

html[data-device="tablet"] .knit-grid[data-knit-cols="5"],
html[data-device="tablet"] #knitGrid[data-knit-cols="5"],
html[data-device="tablet"] #knitUserProfileGrid[data-knit-cols="5"] {
  --knit-grid-cols: 5;
}

html[data-device="tablet"] .knit-settings-pick[data-knit-grid-cols="7"] {
  display: none;
}

html[data-device="tablet"] .knit-mobile-home-tab {
  font-size: 1rem;
}

html[data-device="tablet"] .knit-mobile-home-tab.is-active {
  font-size: 1.12rem;
}

html[data-device="tablet"] .knit-bottom-nav__btn {
  font-size: 0.68rem;
}

html[data-device="tablet"] .knit-mobile-more-grid {
  display: flex;
  flex-direction: column;
}

html[data-device="tablet"] #knitSettingsModal.knit-dup-modal {
  background: rgba(15, 23, 42, 0.18);
}

html[data-device="tablet"] .knit-settings-modal__panel,
html[data-device="tablet"] #knitMineEnterpriseModal .knit-mine-enterprise-panel {
  max-width: 36rem;
  margin: 0 auto;
  border-left: 1px solid var(--knit-divider);
  border-right: 1px solid var(--knit-divider);
}

/* 平板作品详情：与手机一样上图下文，整页一起滚动 */
html[data-device="tablet"] .knit-fullpage {
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  background: #000;
}

html[data-device="tablet"] .knit-fullpage-left {
  flex: 0 0 auto;
  width: 100%;
  height: min(56vh, 560px);
  min-height: 280px;
  max-height: 62vh;
  touch-action: none;
}

html[data-device="tablet"] .knit-fullpage-left-inner {
  position: relative;
  inset: auto;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

html[data-device="tablet"] #knitFullpageImg {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

html[data-device="tablet"] .knit-fp-nav-btn {
  display: none !important;
}

html[data-device="tablet"] .knit-fullpage-right {
  flex: 0 0 auto;
  width: 100%;
  min-height: 0;
  height: auto;
  overflow: visible;
  border-left: none;
  border-top: 1px solid var(--knit-panel-border, var(--knit-panel-border));
  background: var(--knit-view-bg, #fafafa);
  touch-action: pan-y;
}

html[data-device="tablet"] .knit-fp-side-scroll {
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible;
  padding: 1rem 1.15rem calc(3.55rem + env(safe-area-inset-bottom));
}

html[data-device="tablet"] .knit-fullpage-close--on-media {
  top: calc(0.65rem + env(safe-area-inset-top, 0px));
  left: 0.75rem;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
}

html[data-device="tablet"] .knit-fullpage-close--in-flow {
  display: none !important;
}

html[data-device="tablet"] #knitFullpage[data-knit-yarn-detail="1"] .knit-fullpage-close--in-flow,
html[data-device="tablet"] #knitFullpage:not([data-knit-yarn-detail="1"]) .knit-fp-author .knit-fullpage-close--in-flow {
  display: inline-flex !important;
  width: 2.65rem;
  height: 2.65rem;
  font-size: 2.05rem;
  font-weight: 800;
  line-height: 1;
  color: var(--knit-text-heading);
  -webkit-text-stroke: 0.55px currentColor;
}

html[data-device="tablet"] #knitFullpage:not([data-knit-yarn-detail="1"]) .knit-fullpage-close--on-media {
  display: none !important;
}

html[data-device="tablet"] #knitFullpage[data-knit-yarn-detail="1"] .knit-fullpage-close--in-flow {
  display: inline-flex !important;
}

html[data-device="tablet"] #knitFullpage[data-knit-yarn-detail="1"] .knit-fullpage-close--on-media {
  display: none !important;
}

html[data-device="tablet"] #knitFullpage[data-knit-yarn-detail="1"] {
  background: var(--knit-main-bg, #fff);
  overflow: hidden;
  touch-action: auto;
}

html[data-device="tablet"] #knitFullpage[data-knit-yarn-detail="1"] .knit-fullpage-left {
  display: none !important;
}

html[data-device="tablet"] #knitFullpage[data-knit-yarn-detail="1"] .knit-fullpage-right {
  flex: 1 1 0%;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  overflow: hidden;
  border-left: none;
  background: var(--knit-view-bg, #fff);
  touch-action: auto;
}

html[data-device="tablet"] #knitFullpage[data-knit-yarn-detail="1"] .knit-fullpage-right .knit-fp-side-scroll,
html[data-device="tablet"] .knit-fullpage-right[data-knit-fp-channel="yarn"] .knit-fp-side-scroll {
  display: block;
  flex: 1 1 0%;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
}

html[data-device="tablet"] .knit-fullpage-right[data-knit-fp-channel="yarn"] .knit-fp-yarn-ecc-body {
  overflow: visible;
  flex: 0 0 auto;
  min-height: min-content;
}

html[data-device="tablet"] #knitFullpage[data-knit-yarn-detail="1"].is-work-turning {
  pointer-events: auto;
}

html[data-device="tablet"] #knitFullpage.is-work-turning[data-knit-yarn-detail="1"] .knit-fullpage-left {
  display: block !important;
  width: 100%;
  height: min(48vh, 420px);
  min-height: 220px;
}

/* 平板：分段按钮按下反馈 + 滑块可横向拖拽
 * 底栏必须保持 position:fixed，不能跟其它 seg-row 一起改成 relative，
 * 否则会挤进顶栏左侧（首页/消息/收藏/我的）。 */
html[data-device="tablet"] .knit-seg-row:not(.knit-bottom-nav) {
  position: relative;
  isolation: isolate;
  touch-action: pan-x;
  user-select: none;
  -webkit-user-select: none;
}

html[data-device="tablet"] .knit-bottom-nav,
html[data-device="tablet"] .knit-bottom-nav.knit-seg-row {
  display: flex;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 220;
  width: 100%;
  height: var(--knit-bottom-nav-h);
}

html[data-device="tablet"] #knitBottomNav[hidden],
html[data-device="tablet"] body.knit-page--notes-open #knitBottomNav,
html[data-device="tablet"] body:has(#knitNotesView:not([hidden])) #knitBottomNav,
html[data-device="tablet"] body:has(#knitCreatorView:not([hidden])) #knitBottomNav,
html[data-device="tablet"] body:has(#knitDeveloperView:not([hidden])) #knitBottomNav {
  display: none !important;
}

html[data-device="tablet"] .knit-seg-row:not(.knit-bottom-nav):not(.knit-seg-has-thumb)::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: var(--knit-seg-inset, 0.18rem);
  bottom: var(--knit-seg-inset, 0.18rem);
  left: var(--knit-seg-inset, 0.18rem);
  width: calc((100% - (var(--knit-seg-inset, 0.18rem) * 2)) / var(--knit-seg-n, 3));
  border-radius: 999px;
  background: var(--knit-seg-thumb, var(--knit-chrome-active));
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  transform: translateX(calc(var(--knit-seg-i, 0) * 100% + var(--knit-seg-drag, 0px)));
  transition: transform 0.2s ease, opacity 0.16s ease;
  pointer-events: none;
}

html[data-device="tablet"] .knit-seg-row.is-seg-dragging:not(.knit-bottom-nav):not(.knit-seg-has-thumb)::before {
  transition: none;
}

html[data-device="tablet"] .knit-seg-row.is-seg-empty:not(.knit-bottom-nav):not(.knit-seg-has-thumb)::before {
  opacity: 0;
}

html[data-device="tablet"] .knit-seg-row.is-seg-dragging > button:active {
  transform: none;
}

html[data-device="tablet"] .knit-seg-row > button {
  position: relative;
  z-index: 1;
  -webkit-tap-highlight-color: transparent;
  transition:
    transform 0.12s ease,
    color 0.16s ease,
    background 0.16s ease;
}

html[data-device="tablet"] .knit-seg-row:not(.knit-seg-has-thumb) > button:active {
  transform: scale(0.97);
}

html[data-device="tablet"] .knit-mobile-home-tabs.knit-seg-row {
  --knit-seg-inset: 0.22rem;
  --knit-seg-thumb: var(--knit-chrome-active);
}

html[data-device="tablet"] .knit-mobile-home-tabs.knit-seg-row > .knit-mobile-home-tab,
html[data-device="tablet"] .knit-mobile-home-tabs.knit-seg-row > .knit-mobile-home-tab.is-active {
  background: transparent;
}

html[data-device="tablet"] .knit-mine-option-row.knit-seg-row {
  --knit-seg-inset: 0.14rem;
  --knit-seg-thumb: var(--knit-chrome-active);
  gap: 0;
  padding: 0.14rem;
  background: transparent;
  border: 0;
  border-radius: 0;
}

html[data-device="tablet"] .knit-mine-option-row.knit-seg-row > .knit-mine-option-btn {
  border-color: transparent;
  background: transparent;
}

html[data-device="tablet"] .knit-mine-option-row.knit-seg-row > .knit-mine-option-btn:hover,
html[data-device="tablet"] .knit-mine-option-row.knit-seg-row > .knit-mine-option-btn:focus-visible {
  background: transparent;
  border-color: transparent;
}

html[data-device="tablet"] .knit-mine-option-row.knit-seg-row > .knit-mine-option-btn.is-active,
html[data-device="tablet"] .knit-mine-option-row.knit-seg-row > .knit-mine-option-btn[aria-expanded="true"],
html[data-device="tablet"] .knit-mine-option-row.knit-seg-row > .knit-mine-option-btn:active {
  background: transparent;
  border-color: transparent;
  color: var(--knit-chrome-active-text);
}

html[data-device="tablet"] .knit-mine-channel-switch.knit-seg-row,
html[data-device="tablet"] .knit-page-channel-switch.knit-seg-row {
  --knit-seg-inset: 0.14rem;
  --knit-seg-thumb: var(--knit-panel-bg, #fff);
  position: relative;
}

html[data-device="tablet"] .knit-mine-channel-switch.knit-seg-row > .knit-mine-channel-tab,
html[data-device="tablet"] .knit-mine-channel-switch.knit-seg-row > .knit-mine-channel-tab.is-active {
  background: transparent;
  box-shadow: none;
}

html[data-device="tablet"] .knit-msg-main-tabs.knit-seg-row {
  --knit-seg-inset: 0.12rem;
  --knit-seg-thumb: var(--knit-chrome-active);
  display: flex;
  width: 100%;
  padding: 0.12rem;
  border-radius: 999px;
  background: var(--knit-control-bg);
}

html[data-device="tablet"] .knit-msg-main-tabs.knit-seg-row > .knit-msg-main-tab {
  flex: 1 1 0;
  min-width: 0;
  background: transparent;
  font-size: 0.92rem;
  font-weight: 650;
}

html[data-device="tablet"] .knit-msg-main-tabs.knit-seg-row > .knit-msg-main-tab.is-active {
  background: transparent;
  font-size: 0.92rem;
  font-weight: 650;
}

html[data-device="tablet"] .knit-bottom-nav__btn:active,
html[data-device="tablet"] .knit-mobile-notes-btn:active,
html[data-device="tablet"] .knit-mobile-search-toggle:active {
  transform: scale(0.94);
}

html[data-device="tablet"] .knit-note-channel-pick__panel {
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  width: 100%;
  border-radius: 16px 16px 0 0;
  padding: 0.35rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
}

/* 全屏私信按手机宽度居中，横屏不再把气泡和工具栏拉满 */
html[data-device="tablet"] #knitDmModal .knit-dm-chat__panel--fullscreen .knit-dm-chat__header,
html[data-device="tablet"] #knitDmModal .knit-dm-chat__panel--fullscreen .knit-dm-chat__body {
  max-width: 26.5rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* 平板分屏 / 窄窗：按手机边距与两列排，避免边缘被顶栏底栏挡住 */
@media (max-width: 767px) {
  html[data-device="tablet"] .knit-grid,
  html[data-device="tablet"] #knitGrid,
  html[data-device="tablet"] #knitUserProfileGrid {
    --knit-grid-gap: 8px;
    grid-template-columns: repeat(var(--knit-grid-cols), minmax(0, 1fr));
  }

  html[data-device="tablet"] .knit-mobile-more-grid {
    display: flex;
    flex-direction: column;
  }

  html[data-device="tablet"] .knit-settings-modal__panel,
  html[data-device="tablet"] #knitMineEnterpriseModal .knit-mine-enterprise-panel {
    max-width: none;
    margin: 0;
    border-left: none;
    border-right: none;
  }

  html[data-device="tablet"] .knit-fp-side-scroll {
    padding-left: max(0.85rem, env(safe-area-inset-left, 0px));
    padding-right: max(0.85rem, env(safe-area-inset-right, 0px));
  }

  html[data-device="tablet"] .knit-fullpage-left {
    height: min(48vh, 420px);
    min-height: 220px;
    max-height: 52vh;
  }

  html[data-device="tablet"] .knit-mine-option-row.knit-seg-row,
  html[data-device="tablet"] .knit-msg-main-tabs.knit-seg-row {
    margin-left: 0;
    margin-right: 0;
  }
}

html[data-device="tablet"] .knit-mine-work-more,
html[data-device="tablet"] .knit-mine-col--more {
  display: inline-flex;
}

html[data-device="tablet"] .knit-mine-works-details .knit-mine-col--more {
  display: table-cell;
}