/* ============================================================
   山河纪 v3 · 新增组件样式
   全局检索命令面板 / 学习打卡 / 排行榜 / 成就徽章 / UGC 专题 / 教师与管理后台
   ============================================================ */

/* ---------- 顶栏检索入口 ---------- */
.search-trigger{display:flex;align-items:center;gap:8px;background:rgba(var(--hlRGB),.04);
  border:1px solid var(--line2);color:var(--tx2);border-radius:9px;padding:7px 12px;font-size:0.8667rem;
  font-family:var(--sans);cursor:pointer;transition:.25s;white-space:nowrap}
.search-trigger:hover{border-color:var(--line);color:var(--accent2);background:rgba(var(--accentRGB),.08)}
.search-trigger kbd{font-size:0.7rem;padding:2px 6px;border:1px solid var(--line2);border-radius:5px;color:var(--tx3);font-family:var(--sans)}

/* ---------- 命令面板 ---------- */
.cmd-mask{position:fixed;inset:0;z-index:300;background:var(--mask);backdrop-filter:blur(6px);
  display:none;align-items:flex-start;justify-content:center;padding-top:11vh}
.cmd-mask.on{display:flex;animation:fadeUp .22s ease}
.cmd{width:min(680px,92vw);background:var(--panel);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 30px 80px rgba(var(--shRGB),.6);overflow:hidden}
.cmd-head{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line2)}
.cmd-head input{flex:1;background:transparent;border:0;outline:0;color:var(--tx);font-size:1.0667rem;font-family:var(--sans)}
.cmd-head input::placeholder{color:var(--tx3)}
.cmd-head kbd{font-size:0.7333rem;padding:3px 8px;border:1px solid var(--line2);border-radius:6px;color:var(--tx3)}
.cmd-body{max-height:52vh;overflow-y:auto;padding:8px}
.cmd-hint{padding:26px 18px;color:var(--tx3);font-size:0.8667rem;text-align:center}
.cmd-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;cursor:pointer;transition:.15s}
.cmd-item:hover,.cmd-item.sel{background:rgba(var(--accentRGB),.1)}
.cmd-item .ic{width:26px;height:26px;flex:0 0 26px;border-radius:7px;display:flex;align-items:center;justify-content:center;
  font-size:0.7333rem;font-family:var(--serif);background:rgba(var(--accentRGB),.14);color:var(--accent2)}
.cmd-item .tt{font-size:0.9333rem;color:var(--tx)}
.cmd-item .sb{font-size:0.7667rem;color:var(--tx3);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmd-item .tp{margin-left:auto;font-size:0.7rem;color:var(--tx3);flex:0 0 auto;letter-spacing:1px}
.cmd-foot{display:flex;gap:14px;align-items:center;padding:10px 18px;border-top:1px solid var(--line2);
  font-size:0.7667rem;color:var(--tx3);flex-wrap:wrap}
.cmd-sec{padding:10px 14px 4px;font-size:0.7333rem;letter-spacing:2px;color:var(--accent)}

/* ---------- 打卡热力图 ---------- */
.ck-grid{display:grid;grid-template-columns:repeat(15,1fr);gap:5px;margin-top:14px}
.ck-cell{aspect-ratio:1;border-radius:4px;background:rgba(var(--hlRGB),.05);border:1px solid var(--line2)}
.ck-cell.l1{background:rgba(var(--jadeRGB),.3);border-color:rgba(var(--jadeRGB),.4)}
.ck-cell.l2{background:rgba(var(--jadeRGB),.55);border-color:rgba(var(--jadeRGB),.6)}
.ck-cell.l3{background:rgba(var(--accentRGB),.6);border-color:rgba(var(--accentRGB),.7)}
.ck-cell.l4{background:linear-gradient(135deg,var(--accent),var(--red));border-color:rgba(var(--accent2RGB),.8)}

/* ---------- 排行榜 ---------- */
.lb-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line2)}
.lb-row:last-child{border-bottom:0}
.lb-row.me{background:rgba(var(--accentRGB),.08);border-radius:8px;padding:7px 8px}
.lb-rank{width:24px;height:24px;flex:0 0 24px;border-radius:7px;display:flex;align-items:center;justify-content:center;
  font-size:0.7667rem;background:rgba(var(--hlRGB),.06);color:var(--tx2)}
.lb-row:nth-child(1) .lb-rank{background:var(--btnGrad);color:var(--onAccent)}
.lb-row:nth-child(2) .lb-rank{background:rgba(var(--accentRGB),.4);color:var(--onAccent)}
.lb-row:nth-child(3) .lb-rank{background:rgba(var(--accentRGB),.25);color:var(--accent2)}
.lb-pts{margin-left:auto;color:var(--accent2);font-family:var(--serif);font-size:0.9333rem}

/* ---------- 成就徽章 ---------- */
.ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:12px}
.ach{text-align:center;padding:14px 8px;border-radius:12px;border:1px solid var(--line2);background:rgba(var(--hlRGB),.02);transition:.25s}
.ach.got{border-color:var(--line);background:rgba(var(--accentRGB),.09)}
.ach .ic{width:40px;height:40px;margin:0 auto 8px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:1.2rem;background:rgba(var(--hlRGB),.05);color:var(--tx3);border:1px solid var(--line2)}
.ach.got .ic{background:var(--btnGrad);color:var(--onAccent);border-color:transparent}
.ach .nm{font-size:0.8333rem;color:var(--tx2)}
.ach.got .nm{color:var(--accent2)}
.ach .ds{font-size:0.7rem;color:var(--tx3);margin-top:3px;line-height:1.5}

/* ---------- UGC 专题 ---------- */
.tp-card{padding:14px 16px;border-radius:12px;border:1px solid var(--line2);background:rgba(var(--hlRGB),.02);
  margin-bottom:10px;cursor:pointer;transition:.22s}
.tp-card:hover{border-color:var(--line);background:rgba(var(--accentRGB),.06);transform:translateX(3px)}
.tp-card .tt{font-size:1rem;color:var(--accent2);font-family:var(--serif)}
.tp-card .in{font-size:0.8333rem;color:var(--tx2);margin-top:3px}
.tp-card .mt{font-size:0.7333rem;color:var(--tx3);margin-top:6px;display:flex;gap:12px;flex-wrap:wrap}
.tp-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;background:rgba(var(--hlRGB),.03);
  border:1px solid var(--line2);margin-bottom:8px}
.tp-item .sq{width:22px;height:22px;flex:0 0 22px;border-radius:6px;background:rgba(var(--accentRGB),.16);color:var(--accent2);
  font-size:0.7333rem;display:flex;align-items:center;justify-content:center}
.tp-item .nt{font-size:0.7667rem;color:var(--tx3);margin-top:2px}

/* ---------- 管理后台 / 教师端 ---------- */
.console-wrap{max-width:1320px;margin:0 auto;padding:26px 24px 80px}
.kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px;margin-bottom:22px}
.kpi{background:var(--panel);border:1px solid var(--line2);border-radius:14px;padding:16px}
.kpi .n{font-family:var(--serif);font-size:1.7333rem;color:var(--accent2)}
.kpi .l{font-size:0.8rem;color:var(--tx3);letter-spacing:1px}
.tbl{width:100%;border-collapse:collapse;font-size:0.8667rem}
.tbl th{text-align:left;padding:9px 10px;color:var(--tx3);font-weight:400;font-size:0.7667rem;letter-spacing:1px;border-bottom:1px solid var(--line2)}
.tbl td{padding:9px 10px;border-bottom:1px solid var(--line2);color:var(--tx2)}
.tbl tr:hover td{background:rgba(var(--accentRGB),.05)}
.tbl .em{color:var(--tx);font-size:0.8667rem}
.bar{height:7px;border-radius:4px;background:rgba(var(--hlRGB),.07);overflow:hidden;min-width:70px}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--jade),var(--accent))}
.pill{display:inline-block;padding:2px 9px;border-radius:99px;font-size:0.7333rem;border:1px solid var(--line2);color:var(--tx3)}
.pill.g{color:var(--jadeTx);border-color:rgba(var(--jadeRGB),.45)}
.pill.y{color:var(--accent2);border-color:var(--line)}
.pill.r{color:var(--redTx);border-color:rgba(var(--redRGB),.45)}
.tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:18px;border-bottom:1px solid var(--line2);padding-bottom:10px}
.tabs span{padding:7px 14px;border-radius:9px;font-size:0.9rem;color:var(--tx2);cursor:pointer;transition:.2s}
.tabs span:hover{color:var(--accent2);background:rgba(var(--accentRGB),.07)}
.tabs span.on{color:var(--accent2);background:rgba(var(--accentRGB),.13)}

@media (max-width:1020px){
  .ck-grid{grid-template-columns:repeat(10,1fr)}
  .search-trigger span{display:none}
}

/* ---------- 管理后台专有样式 ----------
   原先这段内联写在 console.html 的 <head> 里，位置在样式表链接之后，
   于是同级选择器一律「后写的赢」——响应式规则根本盖不住 .frm。
   移到这里（responsive.css 之前）顺序才对。 */
.hd .back{margin-left:auto;text-decoration:none}
label.fl{display:block;font-size:0.8rem;color:var(--tx3);letter-spacing:1px;margin:12px 0 5px}
.frm{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.frm .full{grid-column:1/-1}
.empty{padding:40px 10px;text-align:center;color:var(--tx3);font-size:0.8667rem}