/* ============================================================
   me/subnav.css — 个人站子页面共享样式
   依赖 lnbo.css 的色彩变量与基础类(.tui/.lbl/.rv 等)
   ============================================================ */

/* ---------- 顶部子页导航条 ---------- */
#subnav{position:sticky;top:0;z-index:70;display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding:0 18px;min-height:44px;background:rgba(11,9,7,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);font-size:13px}
#subnav .crumb{color:var(--dim);margin-right:10px;white-space:nowrap}
#subnav .crumb b{color:var(--amber);font-weight:600}
#subnav a{color:var(--dim);padding:4px 11px;border-radius:6px;white-space:nowrap;transition:.18s}
#subnav a:hover{color:var(--hi);background:rgba(233,184,114,.08)}
#subnav a.on{color:var(--amber);background:rgba(233,184,114,.1);
  box-shadow:inset 0 -2px 0 var(--amber)}
#subnav .ext{margin-left:auto;display:flex;gap:4px}
@media (max-width:640px){#subnav{padding:0 10px;gap:2px}#subnav .crumb{display:none}
  #subnav a{padding:4px 8px;font-size:12px}}

/* ---------- 页头 ---------- */
.p-head{padding:64px 0 8px}
.p-cmd{color:var(--dim);font-size:13px;letter-spacing:.5px}
.p-title{font-size:clamp(1.9rem,5vw,2.6rem);font-weight:800;letter-spacing:.04em;margin:8px 0 6px;
  background:linear-gradient(165deg,#f8e2b6 0%,#e9b872 50%,#c08e52 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 14px rgba(233,184,114,.22))}
.p-desc{color:var(--muted);font-size:14px;max-width:70ch}
.p-meta{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap;font-size:12px}
.badge{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:99px;
  padding:2px 12px;color:var(--dim);background:var(--panel)}
.badge i{width:6px;height:6px;border-radius:50%;background:var(--ok);
  box-shadow:0 0 6px var(--ok);animation:pulse 2.4s infinite}

/* ---------- 分组小标题 ---------- */
.g-lbl{display:flex;align-items:center;gap:10px;color:var(--dim);font-size:13px;margin:26px 0 14px;letter-spacing:1px}
.g-lbl::after{content:"";flex:1;height:1px;background:var(--line)}
.g-lbl b{color:var(--amber);font-weight:600}

/* ---------- 项目明细卡片 ---------- */
.pcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.pcard{display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:10px;
  padding:18px 20px;background:linear-gradient(180deg,rgba(23,18,11,.7),rgba(14,11,7,.7));
  color:var(--text);transition:.24s;position:relative;overflow:hidden}
.pcard::after{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber);opacity:0;transition:.24s}
a.pcard:hover{transform:translateY(-3px);border-color:var(--dim);background:rgba(233,184,114,.05);
  box-shadow:0 12px 30px rgba(0,0,0,.4)}
a.pcard:hover::after{opacity:1}
.pcard .p-name{font-weight:700;color:var(--hi);font-size:15.5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pcard .p-status{font-size:11px;border:1px solid var(--line);border-radius:99px;padding:1px 9px;letter-spacing:1px}
.p-status.run{color:var(--ok);border-color:rgba(163,181,140,.4)}
.p-status.wip{color:var(--amber);border-color:rgba(233,184,114,.4)}
.p-status.lock{color:var(--dim);border-color:var(--line)}
.pcard .p-desc{color:var(--muted);font-size:13px;flex:1}
.pcard .p-stack{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.pcard .p-stack span{font-size:11px;color:var(--dim);border:1px solid var(--line);border-radius:5px;
  padding:1px 8px;background:rgba(233,184,114,.03)}
.pcard .p-go{color:var(--dim);font-size:11px;letter-spacing:1px;margin-top:8px;transition:.2s}
a.pcard:hover .p-go{color:var(--amber)}

/* ---------- 时间线 ---------- */
.tl{border-left:1px solid var(--line);margin-left:6px;padding-left:26px}
.tl-item{position:relative;padding:14px 0 20px;transition:.2s}
.tl-item::before{content:'';position:absolute;left:-31px;top:22px;width:9px;height:9px;border-radius:50%;
  background:var(--bg);border:2px solid var(--dim);transition:.2s}
.tl-item:hover::before{background:var(--amber);border-color:var(--amber);box-shadow:0 0 10px rgba(233,184,114,.5)}
.tl-time{color:var(--dim);font-size:12px;letter-spacing:.5px}
.tl-item .un{color:var(--hi);font-size:12.5px;margin-right:6px}
.tl-item .msg{color:var(--muted);font-size:14px;margin-top:4px;max-width:75ch}
.tl-item .msg .info{color:var(--str)}
.tl-item .msg b{color:var(--text)}

/* ---------- 明细键值表 ---------- */
.facts{border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:13px}
.facts .kf-row{display:grid;grid-template-columns:110px 1fr;border-top:1px solid var(--line);transition:.2s}
.facts .kf-row:first-child{border-top:none}
.facts .kf-row:hover{background:rgba(233,184,114,.05)}
.facts .k{background:rgba(233,184,114,.045);color:var(--dim);padding:9px 14px}
.facts .v{color:var(--text);padding:9px 14px}

/* ---------- 三列协作卡 ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.trio .card ul{list-style:none;margin-top:6px}
.trio .card li{color:var(--muted);font-size:12.5px;padding:3px 0 3px 16px;position:relative}
.trio .card li::before{content:'▸';position:absolute;left:0;color:var(--dim)}
@media (max-width:900px){.trio{grid-template-columns:1fr}}

/* ---------- 链接大卡 ---------- */
.lk-big{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.lk-big a{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:10px;
  padding:20px 22px;background:rgba(233,184,114,.025);color:var(--text);transition:.24s;position:relative;overflow:hidden}
.lk-big a::after{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber);opacity:0;transition:.24s}
.lk-big a:hover{transform:translateY(-4px);border-color:var(--dim);background:rgba(233,184,114,.06);
  box-shadow:0 12px 30px rgba(0,0,0,.4)}
.lk-big a:hover::after{opacity:1}
.lk-big .ic{font-size:1.7rem;color:var(--amber);text-shadow:0 0 14px rgba(233,184,114,.4)}
.lk-big .nm{font-weight:700;color:var(--hi);font-size:15px}
.lk-big .hd{color:var(--amber);font-size:12.5px}
.lk-big .ds{color:var(--muted);font-size:12.5px}

/* ---------- 页脚 ---------- */
.p-foot{padding:40px 0 84px;text-align:center;color:var(--dimmer);font-size:12.5px}
.p-foot a{color:var(--dim);margin:0 6px}
.p-foot a:hover{color:var(--amber)}
