/* 犬舍统一导航壳 · 共享样式（Phase 3）
   壳子变量统一加 `k-` 前缀，避免与宿主页面（如深色主题的 index.html）的
   --text/--bg 等通用变量互相覆盖，保证顶栏在任何主题页都保持自身配色 */
:root{
  --k-bg:#f8f9f8; --k-bg2:#eef1ee; --k-card:#ffffff;
  --k-text:#23262b; --k-text2:#73787f; --k-border:#e8e8e4;
  --k-primary:#3f6f57; --k-primary2:#5e8d72;
  --k-primary-soft:rgba(63,111,87,.08); --k-primary-soft-2:rgba(63,111,87,.14);
  --k-gold:#c2904f; --k-gold-soft:rgba(194,144,79,.10);
  --k-ok:#4f9d77;
  --k-lock:#b8b3a5;
  --k-radius-sm:10px; --k-radius:16px; --k-radius-pill:999px;
  --k-shadow-xs:0 1px 2px rgba(24,28,24,.04);
  --k-shadow-sm:0 2px 8px rgba(24,28,24,.05);
  --k-shadow-md:0 6px 20px rgba(24,28,24,.06);
  --k-font-sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Noto Sans SC","Microsoft YaHei",sans-serif;
  --k-font-serif:"Songti SC","STSong","Source Han Serif SC","Noto Serif SC",serif;
}

/* ── 顶栏 ── */
.k-topbar{position:sticky;top:0;z-index:60;background:rgba(248,249,248,.92);
  backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--k-border);
  font-family:var(--k-font-sans);color:var(--k-text);line-height:1.6}
.k-topbar *{box-sizing:border-box}
.k-topbar .k-inner{max-width:1180px;margin:0 auto;padding:0 20px;height:60px;
  display:flex;align-items:center;gap:22px}
.k-brand{display:flex;align-items:center;gap:9px;font-family:var(--k-font-serif);
  font-size:19px;letter-spacing:.05em;color:var(--k-text);white-space:nowrap;text-decoration:none}
.k-brand b{color:var(--k-primary);font-weight:600}
.k-nav{display:flex;gap:2px;margin-left:4px;flex-wrap:wrap}
.k-nav a{padding:8px 14px;border-radius:var(--k-radius-pill);font-size:14px;
  color:var(--k-text2);transition:.16s;white-space:nowrap;text-decoration:none}
.k-nav a:hover{background:var(--k-primary-soft);color:var(--k-primary)}
.k-nav a.on{background:var(--k-primary);color:#fff;box-shadow:var(--k-shadow-sm)}
.k-right{margin-left:auto;display:flex;align-items:center;gap:12px}
.k-search{display:flex;align-items:center;gap:7px;background:var(--k-bg2);border:1px solid var(--k-border);
  border-radius:var(--k-radius-pill);padding:7px 13px;width:200px;color:var(--k-text2);font-size:13px}
.k-search input{border:none;background:transparent;outline:none;flex:1;font-size:13px;color:var(--k-text);min-width:0}
.k-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;
  font-size:13px;font-family:var(--k-font-serif);border:2px solid #fff;box-shadow:var(--k-shadow-xs);
  background:linear-gradient(140deg,var(--k-primary2),var(--k-primary));cursor:pointer}
.k-login{background:var(--k-primary);color:#fff;border-radius:var(--k-radius-pill);
  padding:8px 18px;font-size:13.5px;letter-spacing:.04em;cursor:pointer;border:none;text-decoration:none}
.k-login:hover{background:var(--k-primary2)}
.k-reg{background:transparent;color:var(--k-gold);border:1px solid var(--k-gold);
  border-radius:var(--k-radius-pill);padding:7px 16px;font-size:13.5px;letter-spacing:.04em;cursor:pointer;
  text-decoration:none;transition:.16s}
.k-reg:hover{background:var(--k-gold-soft);color:var(--k-gold)}
.k-userbox{display:flex;align-items:center;gap:8px;cursor:pointer;text-decoration:none;color:var(--k-text)}
.k-userbox .nm{font-size:13.5px;max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── 左侧导航 ── */
.k-rail{display:flex;flex-direction:column;gap:6px;font-family:var(--k-font-sans)}
.k-rail a{display:flex;align-items:center;gap:10px;padding:10px 13px;border-radius:var(--k-radius-sm);
  font-size:14px;color:var(--k-text2);transition:.16s;text-decoration:none}
.k-rail a:hover{background:var(--k-bg2);color:var(--k-text)}
.k-rail a.on{background:var(--k-primary-soft-2);color:var(--k-primary);font-weight:600}
.k-rail svg{flex:none;opacity:.85}
.k-rail-sep{height:1px;background:var(--k-border);margin:6px 4px}
.k-sign{margin-top:4px;background:var(--k-card);border:1px solid var(--k-border);border-radius:var(--k-radius);
  padding:15px;text-align:center;box-shadow:var(--k-shadow-xs)}
.k-sign .n{font-family:var(--k-font-serif);font-size:22px;color:var(--k-primary);line-height:1.2}
.k-sign .l{font-size:12px;color:var(--k-text2);margin-top:2px}
.k-sign button{margin-top:11px;width:100%;border:none;cursor:pointer;background:var(--k-primary);color:#fff;
  border-radius:var(--k-radius-pill);padding:9px;font-size:13.5px;letter-spacing:.08em;transition:.16s}
.k-sign button:hover{background:var(--k-primary2)}
.k-sign button[disabled]{background:var(--k-bg2);color:var(--k-text2);cursor:default;letter-spacing:.04em}

@media(max-width:760px){
  .k-topbar .k-inner{height:54px;gap:10px;padding:0 12px}
  .k-brand{font-size:16px}
  .k-brand b{display:none}
  /* 窄屏保留导航（横向可滑动），否则移动端整站失去入口 */
  .k-nav{display:flex;flex:1;margin-left:0;gap:0;overflow-x:auto;scrollbar-width:none}
  .k-nav::-webkit-scrollbar{display:none}
  .k-nav a{padding:7px 10px;font-size:13px}
  .k-search{display:none}
  .k-right{gap:8px}
}
@media(max-width:430px){.k-userbox .nm{display:none}}

/* ── 顶栏头像菜单（[unify 2026-09-22]）── */
.k-userwrap{position:relative}
.k-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.k-menu{display:none;position:absolute;right:0;top:calc(100% + 10px);min-width:170px;z-index:80;
  background:var(--k-card);border:1px solid var(--k-border);border-radius:var(--k-radius);
  box-shadow:var(--k-shadow-md);padding:6px;font-family:var(--k-font-sans)}
.k-menu.on{display:block}
.k-menu a{display:block;padding:9px 12px;border-radius:var(--k-radius-sm);font-size:13.5px;
  color:var(--k-text2);text-decoration:none;transition:.14s;white-space:nowrap}
.k-menu a:hover{background:var(--k-bg2);color:var(--k-primary)}
.k-menu a#kLogout{color:#a8756a}
.k-menu a#kLogout:hover{background:rgba(168,117,106,.10);color:#a8756a}

/* ── 兼容现有页面 ──
   统一顶栏出现后，页面整体下移了约一个顶栏的高度；index.html 内固定的
   #dogtagFab（z-index:9999 的「我的狗牌」浮动入口）需同步下移，否则会压住顶栏。
   shell.css 仅被引入壳子的页面加载，故该规则只影响这些页面。 */
#dogtagFab{top:126px !important}
@media(max-width:760px){#dogtagFab{top:121px !important}}
