/* nav-shell.css — 全屏工具页（专业修图 miniPaint / 手绘白板 Excalidraw）共用的轻量站点导航
 * 独立样式，不引 theme.css / archive.css（那两个会把 miniPaint 深色 UI 染坏）。
 * 只做三件事：① 顶部站点导航（品牌 + 主菜单 + CTA + 语言）；② 九大分类横条；
 * ③ 把 miniPaint 的 .main_menu / .wrapper 整体下移，让出导航高度。
 * 版本：与 ASSET_VER 同步（由 _sync-assetver.js 统一盖写）。
 */

/* ---------- 顶部导航 ---------- */
#av-nav{
  position:fixed; top:0; left:0; right:0; z-index:1000000;
  background:#FDF6EE; color:#33271D;
  border-bottom:1px solid #EAD9C8;
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased;
  box-shadow:0 1px 2px rgba(51,39,29,.05);
}
#av-nav a{text-decoration:none}
#av-nav .avn-row{
  display:flex; align-items:center; gap:14px;
  max-width:1400px; margin:0 auto; padding:0 18px; height:54px;
}
#av-nav .avn-brand{display:flex; align-items:center; gap:9px; flex-shrink:0; color:#33271D}
#av-nav .avn-brand .mark{width:28px; height:28px; display:block; border-radius:7px; overflow:hidden}
#av-nav .avn-brand .mark svg{display:block; width:100%; height:100%}
#av-nav .avn-brand .nm{font-weight:700; font-size:17px; letter-spacing:.2px; line-height:1}
#av-nav .avn-brand .nm i{color:#C08A2E; font-style:normal}
#av-nav .avn-brand .cn{font-weight:600; font-size:12px; color:#8A7A66; letter-spacing:1px; margin-left:1px}
#av-nav .avn-links{display:flex; align-items:center; gap:2px; margin-left:6px}
#av-nav .avn-links a{
  padding:8px 11px; border-radius:8px; color:#5C4B3B;
  font-size:14px; font-weight:500; line-height:1; transition:background .15s,color .15s;
}
#av-nav .avn-links a:hover{background:#F6EBDC; color:#33271D}
#av-nav .avn-right{margin-left:auto; display:flex; align-items:center; gap:10px}
#av-nav .avn-cta{
  background:#101826; color:#FFF7E8; padding:9px 16px; border-radius:9px;
  font-size:13px; font-weight:700; line-height:1; white-space:nowrap; transition:background .15s;
}
#av-nav .avn-cta:hover{background:#1C2A42}
#av-nav .avn-lang select{
  border:1px solid #EAD9C8; background:#FFFDFA; color:#33271D; border-radius:8px;
  padding:7px 9px; font-size:13px; font-weight:600; cursor:pointer; max-width:118px;
}

/* ---------- 九大分类横条 ---------- */
#av-nav .avn-cats{
  max-width:1400px; margin:0 auto; padding:0 18px 8px;
  display:flex; gap:2px; overflow-x:auto; scrollbar-width:none;
}
#av-nav .avn-cats::-webkit-scrollbar{display:none}
#av-nav .avn-cats a{
  display:inline-flex; align-items:center; gap:6px; flex-shrink:0;
  padding:7px 11px; border-radius:8px; border:1px solid transparent;
  color:#4A3B2E; font-size:13px; font-weight:600; line-height:1.2; white-space:nowrap;
  transition:background .15s,border-color .15s,color .15s;
}
#av-nav .avn-cats a:hover{background:#F6EBDC; border-color:#EAD9C8; color:#33271D}
#av-nav .avn-cats a.cur{background:#F0C674; border-color:#E0AA4A}
#av-nav .avn-ic{font-size:15px; line-height:1}

/* ---------- 让出顶部：miniPaint 原本 .main_menu top:0(30px) + .wrapper top:30px ---------- */
.main_menu{top:var(--av-nav-h, 0px) !important}
.wrapper{top:calc(var(--av-nav-h, 0px) + 30px) !important}

@media (max-width:900px){
  #av-nav .avn-row{height:50px; padding:0 12px; gap:8px}
  #av-nav .avn-brand .cn{display:none}
  #av-nav .avn-links{display:none}
  #av-nav .avn-cats{padding:0 12px 6px}
  #av-nav .avn-cta{padding:8px 12px; font-size:12px}
  #av-nav .avn-lang select{padding:6px 7px; font-size:12px; max-width:96px}
}
