/* 2026-10-27 照飞象：最左侧是 85px 窄栏，只放当前大类的工具（图标在上、文字在下）；
   商品作图、短视频、竞品分析、GIF 制作这些大类放到「首页」里选。手机仍是抽屉导航。 */
@media (min-width: 761px) {
  :root { --wb-rail: 85px; }
  .app-sidebar { background: var(--color-navigation); border-right: 1px solid var(--color-border); box-sizing: border-box; }
  body { font-family: "PingFang SC", -apple-system, BlinkMacSystemFont, "Hiragino Sans GB", "Microsoft YaHei", sans-serif; }
  .wb-brand { height: 108px; justify-content: center; align-items: flex-start; gap: 0; padding: 28px 0 0; border-bottom: 0; }
  .wb-brand .brand { display: none; }
  /* 2026-10-27：点 Logo 打开「首页」选创作类型（商品作图、短视频、竞品分析、GIF 制作） */
  .wb-brand-mark { width: auto; height: auto; display: flex; flex-direction: column; align-items: center; gap: 6px; border-radius: 12px; cursor: pointer; transition: opacity .15s ease; }
  .wb-brand-mark img { width: 40px; height: 40px; }
  /* 2026-10-28：Logo 下写「主页」，点 Logo 或「主页」都回到选创作类型的页面。 */
  .wb-home-label { font-size: 12px; line-height: 1; color: var(--color-text-secondary); }
  .wb-brand-mark:hover .wb-home-label, .wb-brand-mark[aria-expanded="true"] .wb-home-label { color: var(--color-text); }
  .wb-brand-mark:hover, .wb-brand-mark[aria-expanded="true"] { opacity: .8; }
  .wb-brand-mark:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 4px; }
  #primaryNavigation { align-items: center; gap: 0; padding: 0 11px 14px; overflow-x: hidden; overflow-y: auto; scrollbar-width: none; }
  #primaryNavigation::-webkit-scrollbar { display: none; }
  #primaryNavigation .wb-nav-label, #primaryNavigation .production-recover { display: none; }
  #primaryNavigation > [data-workspace-navigation] { order: 2; flex: none; align-items: center; gap: 0; overflow: visible; padding-top: 6px; }
  #primaryNavigation .nav-library { order: 3; align-items: center; gap: 0; margin-top: auto; padding-top: 14px; border-top: 0; }
  /* 数值照飞象：项目 62×64、圆角 16px；图标 18px 距顶 12px；文字 12px 纯白、字重 300、行高 28px；悬停和选中字重 500、图标加粗，不加底色 */
  #primaryNavigation .nav:not([data-workspace]) {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 0;
    width: 62px; min-height: 64px; height: 64px; padding: 12px 0 0; border: 0; border-radius: 16px; background: transparent;
    color: var(--color-text); font: inherit; font-size: 12px; font-weight: 300; line-height: 28px; text-align: center; white-space: nowrap; overflow: visible; cursor: pointer;
  }
  #primaryNavigation .nav:not([data-workspace]):hover,
  #primaryNavigation .nav:not([data-workspace]).active { background: transparent; color: var(--color-text); font-weight: 500; }
  /* 2026-11-01 用户：选中「A+详情」看着像没选。悬停和选中原来一模一样；选中改为圆角浅底 + 强调色图标和文字，悬停只给更淡的底。 */
  #primaryNavigation .nav:not([data-workspace]):hover { background: rgb(var(--ink) / 5%); }
  #primaryNavigation .nav:not([data-workspace]).active { background: rgb(var(--ink) / 10%); color: var(--color-primary); }
  #primaryNavigation .nav:not([data-workspace])::before, #primaryNavigation .nav:not([data-workspace]).active::before {
    content: ""; position: static; inset: auto; display: block; flex: none; width: 18px; height: 18px; border-radius: 0;
    background: var(--color-text); -webkit-mask: var(--nav-icon) center / contain no-repeat; mask: var(--nav-icon) center / contain no-repeat;
  }
  #primaryNavigation .nav:not([data-workspace]):hover::before, #primaryNavigation .nav:not([data-workspace]).active::before {
    -webkit-mask-image: var(--nav-icon-on, var(--nav-icon)); mask-image: var(--nav-icon-on, var(--nav-icon));
  }
  #primaryNavigation .nav:not([data-workspace]).active::before { background: var(--color-primary); }
  #primaryNavigation [data-mode="image"] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='6' width='13' height='13' rx='2.5'/%3E%3Cpath d='M7.5 3.5h10a3 3 0 0 1 3 3v10'/%3E%3Cpath d='m6 16 3.5-3.5 2.5 2.5 2-2 2.5 2.5'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='6' width='13' height='13' rx='2.5'/%3E%3Cpath d='M7.5 3.5h10a3 3 0 0 1 3 3v10'/%3E%3Cpath d='m6 16 3.5-3.5 2.5 2.5 2-2 2.5 2.5'/%3E%3C/svg%3E"); }
  #primaryNavigation [data-creative="detail"] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5.5' y='3' width='13' height='18' rx='2.5'/%3E%3Cpath d='M8.5 7.5h7M8.5 11h7M8.5 14.5h4.5'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5.5' y='3' width='13' height='18' rx='2.5'/%3E%3Cpath d='M8.5 7.5h7M8.5 11h7M8.5 14.5h4.5'/%3E%3C/svg%3E"); }
  #primaryNavigation [data-creative="reference"] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='7' width='11' height='13.5' rx='2.5'/%3E%3Cpath d='M8 3.5h9.5a3 3 0 0 1 3 3V16'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='7' width='11' height='13.5' rx='2.5'/%3E%3Cpath d='M8 3.5h9.5a3 3 0 0 1 3 3V16'/%3E%3C/svg%3E"); }
  #primaryNavigation [data-creative="fashion"] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7.5' r='3.5'/%3E%3Cpath d='M5 20.5c.6-4 3.4-6.5 7-6.5s6.4 2.5 7 6.5'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7.5' r='3.5'/%3E%3Cpath d='M5 20.5c.6-4 3.4-6.5 7-6.5s6.4 2.5 7 6.5'/%3E%3C/svg%3E"); }
  #primaryNavigation [data-video-view] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='14' rx='3'/%3E%3Cpath d='m10 9.2 5 2.8-5 2.8z'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='14' rx='3'/%3E%3Cpath d='m10 9.2 5 2.8-5 2.8z'/%3E%3C/svg%3E"); }
  #primaryNavigation [data-analysis-type], #primaryNavigation [data-analysis-history] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 19.5h15'/%3E%3Cpath d='M7.5 16v-5M12 16V7M16.5 16v-7.5'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 19.5h15'/%3E%3Cpath d='M7.5 16v-5M12 16V7M16.5 16v-7.5'/%3E%3C/svg%3E"); }
  #primaryNavigation [data-gif-create] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='14' rx='3'/%3E%3Cpath d='M7.5 5v14M16.5 5v14M3.5 12h4M16.5 12h4'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='14' rx='3'/%3E%3Cpath d='M7.5 5v14M16.5 5v14M3.5 12h4M16.5 12h4'/%3E%3C/svg%3E"); }
  #primaryNavigation [data-gif-history], #works { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 7.5a2.5 2.5 0 0 1 2.5-2.5h3.6l2 2.2H18a2.5 2.5 0 0 1 2.5 2.5v7.8A2.5 2.5 0 0 1 18 20H6a2.5 2.5 0 0 1-2.5-2.5z'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 7.5a2.5 2.5 0 0 1 2.5-2.5h3.6l2 2.2H18a2.5 2.5 0 0 1 2.5 2.5v7.8A2.5 2.5 0 0 1 18 20H6a2.5 2.5 0 0 1-2.5-2.5z'/%3E%3C/svg%3E"); }
  #imageStatsEntry { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='16' rx='3'/%3E%3Cpath d='M8 15.5v-3M12 15.5v-7M16 15.5v-5'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='16' rx='3'/%3E%3Cpath d='M8 15.5v-3M12 15.5v-7M16 15.5v-5'/%3E%3C/svg%3E"); }
  #preferencesEntry { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 7h8M17 7h2M5 17h2M11 17h8'/%3E%3Ccircle cx='15' cy='7' r='2'/%3E%3Ccircle cx='9' cy='17' r='2'/%3E%3C/svg%3E"); --nav-icon-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 7h8M17 7h2M5 17h2M11 17h8'/%3E%3Ccircle cx='15' cy='7' r='2'/%3E%3Ccircle cx='9' cy='17' r='2'/%3E%3C/svg%3E"); }
  #primaryNavigation .top-navigation { display: none; }
  /* 首页：盖住右侧整块，四个大类卡片 */
  body[data-home="open"] #primaryNavigation .top-navigation {
    position: fixed; z-index: 150; inset: 0 0 0 var(--wb-rail); display: grid; grid-template-columns: repeat(2, minmax(0, 340px));
    align-content: center; justify-content: center; gap: 14px; margin: 0; padding: 40px; border: 0; background: var(--color-page); overflow: auto;
  }
  .wb-home-head { grid-column: 1 / -1; display: flex; align-items: flex-end; gap: 16px; margin-bottom: 10px; color: var(--color-text); }
  .wb-home-head div { flex: 1; min-width: 0; }
  .wb-home-head h2 { margin: 0; font-size: 24px; font-weight: 600; }
  .wb-home-head p { margin: 6px 0 0; font-size: 13px; color: rgb(var(--ink) / 50%); }
  body[data-home="open"] .top-navigation .nav {
    display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 8px; min-height: 132px; height: auto; padding: 24px;
    border: 1px solid var(--color-border); border-radius: 20px; background: var(--color-surface); color: var(--color-text); font-size: 18px; font-weight: 600; text-align: left;
  }
  body[data-home="open"] .top-navigation .nav::before { display: none; }
  body[data-home="open"] .top-navigation .nav::after { content: attr(data-desc); font-size: 13px; font-weight: 400; line-height: 1.6; color: rgb(var(--ink) / 55%); }
  body[data-home="open"] .top-navigation .nav:hover { border-color: var(--color-border-strong); background: var(--color-surface-muted); color: var(--color-text); }
  body[data-home="open"] .top-navigation .nav.active { border-color: rgb(var(--ink) / 60%); background: var(--color-surface-muted); color: var(--color-text); }
  /* 10-27：窄栏只有 85px，任务提示放左下会盖住表单输入框，改放右下角 */
  .creation-task-tray { left: auto; right: 24px; bottom: 24px; width: 260px; }
  /* 作品页左侧任务列表已显示每个任务的状态，右下提示会压住底部输入框，作品页里不显示 */
  body[data-task-view="open"] .creation-task-tray { display: none; }
}
/* 2026-10-27：短视频大类有 10 个工具，窗口不够高时（如 1440×900）压低每项和 Logo 区，底部「我的作品」等不用滚动也看得到；
   工具少的大类不受影响，仍是飞象的 64px。再矮的窗口仍可滚动。 */
@media (min-width: 761px) and (max-height: 1063px) {
  .app-sidebar:has([data-workspace-navigation]:not(.hidden) > .nav:nth-child(8)) .wb-brand { height: 84px; padding-top: 20px; }
  .app-sidebar:has([data-workspace-navigation]:not(.hidden) > .nav:nth-child(8)) #primaryNavigation .nav:not([data-workspace]) { height: 52px; min-height: 52px; padding-top: 8px; line-height: 26px; }
}
@media (min-width: 761px) and (max-height: 871px) {
  .app-sidebar:has([data-workspace-navigation]:not(.hidden) > .nav:nth-child(8)) #primaryNavigation .nav:not([data-workspace]) { height: 46px; min-height: 46px; padding-top: 6px; line-height: 22px; }
}
/* 字体渲染照飞象用浏览器默认（不再细化抗锯齿），Mac 上字更清楚 */
body { -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; }
@media (max-width: 760px) {
  .wb-home-head { display: none; }
  .wb-brand-mark { cursor: default; }
  .wb-home-label { display: none; }
}
/* 2026-10-31：官网（senyao.xin）底部居中一行备案号；本机工作台不显示。
   2026-11-01 用户：只在点开「主页」时显示在下方，作图等页面不显示。 */
.wb-legal {
  position: fixed; z-index: 1; left: var(--wb-rail); right: 0; bottom: 0; display: none; justify-content: center; gap: 16px;
  padding: 5px 16px 6px; background: var(--color-page); font-size: 11px; line-height: 14px; pointer-events: none;
}
.wb-legal a { color: var(--color-text-muted); text-decoration: none; pointer-events: auto; }
.wb-legal a:hover { color: var(--color-text-secondary); text-decoration: underline; }
body[data-home="open"] .wb-legal { display: flex; z-index: 151; } /* 主页浮层 .top-navigation 是 150 */
body.wb-has-legal[data-home="open"] main { padding-bottom: 26px; }
@media (max-width: 760px) { .wb-legal { left: 0; gap: 10px; flex-wrap: wrap; } }
