/* ==========================================================================
   学员档案 —— 模块私有样式
   宣纸底 / 墨色骨架 / 朱砂点睛 / 鎏金细节 / 段位色编码
   ========================================================================== */

/* ---------------- KPI 与一句话解读 ---------------- */
.stu-kpis{margin-bottom:12px}
.stu-brief{
  display:flex;align-items:center;gap:8px;padding:9px 13px;margin-bottom:14px;
  background:linear-gradient(90deg,var(--gold-l),rgba(247,239,220,0) 78%);
  border-left:3px solid var(--gold);border-radius:0 var(--r-s) var(--r-s) 0;
  font-size:12.5px;color:var(--ink-2);
}
.stu-brief span:last-child{line-height:1.6}

/* ---------------- 筛选条 ---------------- */
.stu-filters{
  padding:10px 12px;margin-bottom:14px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);
  box-shadow:var(--sh-1);align-items:flex-end;
}
.stu-filters .field{gap:4px}
.stu-filters .field > label{font-size:11px;color:var(--ink-4);letter-spacing:.06em}
.stu-filters .select{height:30px;font-size:12px}
.stu-filters .input{height:30px}
.stu-filters .in-ico{top:7px}
.stu-beltsel{transition:border-color .15s,box-shadow .15s}
.stu-beltsel:focus{box-shadow:0 0 0 3px rgba(199,154,69,.15)}
.stu-count{font-size:11.5px;color:var(--ink-4);white-space:nowrap;padding-bottom:5px}
.stu-viewtoggle{display:flex;align-items:center;gap:7px;padding-bottom:3px}
.stu-clear{height:30px}

/* ---------------- 卡片视图 ---------------- */
.stu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:12px}

.stu-card{
  padding:13px 14px 12px;cursor:pointer;overflow:hidden;
  transition:transform .15s cubic-bezier(.22,.9,.3,1),box-shadow .15s,border-color .15s;
}
.stu-card::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--belt,var(--gold));opacity:.92;
}
.stu-card:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.stu-card:focus-visible{outline:2px solid var(--gold);outline-offset:1px}

.sc-top{display:flex;align-items:center;gap:10px}
.sc-av{flex:0 0 auto}
.sc-id{flex:1;min-width:0}
.sc-name{font-family:var(--f-serif);font-size:15px;font-weight:700;letter-spacing:.03em}
.sc-meta{font-size:11.5px;color:var(--ink-4);margin-top:1px}
.sc-belt{flex:0 0 auto}

.sc-remain{margin-top:11px;padding-top:10px;border-top:1px dashed var(--line)}
.sc-remain-top{display:flex;align-items:baseline;gap:6px;margin-bottom:6px}
.sc-remain-top b{font-size:21px;font-weight:700;color:var(--ink);line-height:1}
.sc-remain-top span{font-size:11px;color:var(--ink-4)}
.sc-remain-top .tag{margin-left:auto}
.sc-note{font-size:11px;color:var(--ink-4);margin-top:5px}

.sc-stats{display:flex;gap:14px;margin-top:10px}
.sc-stat{flex:1;min-width:0}
.sc-stat span{display:block;font-size:10.5px;color:var(--ink-4)}
.sc-stat b{display:block;font-size:12px;font-weight:600;color:var(--ink-2);margin-top:1px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.sc-foot{margin-top:11px;padding-top:9px;border-top:1px dashed var(--line)}
.sc-guardian{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-3)}
.sc-phone{margin-left:auto;color:var(--ink-4);font-family:var(--f-num);font-size:11px}
.sc-tip{font-size:11.5px;color:var(--cinnabar-d);margin-top:5px;line-height:1.55}

/* ---------------- 表格视图 ---------------- */
.stu-tablecard{overflow:hidden}
.stu-tablewrap{overflow-x:auto}
.stu-tablewrap table{min-width:880px}
.stu-tname{display:flex;align-items:center;gap:8px}
.stu-tnm{font-weight:600;font-size:12.5px}
.stu-tsub{font-size:10.5px;color:var(--ink-4);margin-top:1px}
.stu-tcls{font-size:12px;color:var(--ink-2);white-space:nowrap}
.stu-trem{display:flex;align-items:center;gap:7px;justify-content:flex-end}
.stu-trem b{font-size:14px;font-weight:700}
.stu-trem .mini-bar{width:52px;min-width:52px}
.stu-tguard{font-size:12px;color:var(--ink-2)}

/* ---------------- 抽屉头 ---------------- */
.stu-dhead{display:flex;align-items:center;gap:14px;width:100%}
.sd-av{flex:0 0 auto}
.sd-main{flex:1;min-width:0}
.sd-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sd-nm{font-family:var(--f-serif);font-size:20px;font-weight:700;letter-spacing:.04em}
.sd-sub{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:4px;font-size:12px;color:var(--ink-3)}
.sd-dot{width:3px;height:3px;border-radius:50%;background:var(--ink-5);display:inline-block}
.sd-guard{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:5px;font-size:12px;color:var(--ink-3)}
.sd-guard b{color:var(--ink-2);font-weight:600}
.sd-ico{display:inline-flex;color:var(--ink-4)}
.sd-tel{color:var(--cinnabar-d);border-bottom:1px dotted var(--cinnabar-b);font-family:var(--f-num)}
.sd-tel:hover{color:var(--cinnabar)}

.sd-right{flex:0 0 auto;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:4px;
  padding-left:14px;border-left:1px solid var(--line)}
.sd-remain{display:flex;align-items:baseline;gap:5px}
.sd-remain b{font-size:30px;font-weight:700;line-height:1;color:var(--ink)}
.sd-remain span{font-size:11px;color:var(--ink-4)}
.sd-tip{font-size:11.5px;color:var(--cinnabar-d);max-width:210px;line-height:1.5;text-align:right}
.sd-close{flex:0 0 auto;align-self:flex-start}

/* ---------------- 抽屉体 ---------------- */
.stu-dbody{display:flex;flex-direction:column;gap:0}
.stu-tabs{position:sticky;top:-16px;z-index:5;background:var(--paper);padding-top:2px}
.stu-panel{padding-top:14px}
.stu-pane{display:flex;flex-direction:column;gap:12px}

/* ---------------- 成长概览 ---------------- */
.stu-overview{display:grid;grid-template-columns:290px minmax(0,1fr);gap:12px;align-items:start}
.so-radar .card-b{display:flex;flex-direction:column;gap:12px}
.so-radarwrap{display:flex;justify-content:center;padding-top:2px}
.so-dims{display:grid;grid-template-columns:1fr 1fr;gap:7px 12px}
.so-dim{display:flex;align-items:center;gap:6px}
.so-dn{font-size:11px;color:var(--ink-3);width:26px;flex:0 0 26px}
.so-dim .bar{flex:1;min-width:24px}
.so-dim b{font-size:11px;color:var(--ink-2);width:20px;text-align:right;flex:0 0 20px}
.so-rest{display:flex;flex-direction:column;gap:12px;min-width:0}
.so-kpis{gap:10px}

.stu-metric{padding:10px 12px}
.sm-label{font-size:11px;color:var(--ink-4)}
.sm-val{display:flex;align-items:baseline;gap:4px;margin-top:3px}
.sm-val b{font-size:21px;font-weight:700;line-height:1.1}
.sm-val small{font-size:11px;color:var(--ink-4)}
.sm-foot{font-size:11px;color:var(--ink-3);margin-top:4px;line-height:1.5}

.stu-timeline{padding-top:2px}
.stu-tlby{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:11px;color:var(--ink-4)}

/* ---------------- 课程出勤 ---------------- */
.stu-cardpad{padding:12px 14px}
.as-blocks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.as-block{
  display:flex;align-items:baseline;gap:5px;padding:7px 9px;border-radius:var(--r-s);
  background:var(--card-2);border:1px solid var(--line);
}
.as-block b{font-size:19px;font-weight:700;line-height:1}
.as-block span{font-size:11px;color:var(--ink-4)}
.as-bar{display:flex;height:9px;border-radius:9px;overflow:hidden;background:var(--paper-2);margin-top:11px}
.as-bar > span{display:block;height:100%;transition:width .35s cubic-bezier(.22,.9,.3,1)}
.as-legend{margin-top:9px;font-size:11px;color:var(--ink-3)}
.as-trend-head{display:flex;align-items:baseline;gap:9px;margin-bottom:9px}
.as-trend-head .b{font-size:13px;font-family:var(--f-serif);letter-spacing:.03em}
.stu-tblwrap{overflow-x:auto}
.stu-tblwrap table{min-width:520px}
.stu-tnote{font-size:11.5px;color:var(--ink-3)}

/* ---------------- 考级 ---------------- */
.stu-advice{
  padding:12px 14px;border-left:3px solid var(--cinnabar);
  background:linear-gradient(90deg,var(--cinnabar-l),rgba(248,231,228,0) 82%);
}
.sa-head{display:flex;align-items:center;gap:7px;font-size:13px}
.sa-text{font-size:12.5px;color:var(--ink-2);line-height:1.75;margin-top:6px}

/* ---------------- 课时账单 ---------------- */
.stu-ledger .so-kpis{margin-bottom:0}

/* ---------------- 家长沟通 ---------------- */
.stu-info{display:flex;flex-direction:column}
.info-row{display:flex;gap:12px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:12.5px}
.info-row:last-child{border-bottom:0;padding-bottom:0}
.info-l{flex:0 0 68px;color:var(--ink-4);font-size:11.5px}
.info-v{flex:1;min-width:0;color:var(--ink-2);line-height:1.6}
.stu-write .stu-ta{margin-top:2px}
.stu-write-foot{display:flex;align-items:center;gap:8px;margin-top:9px;flex-wrap:wrap}
.stu-write-foot .t-xs{max-width:420px;line-height:1.55}

/* ---------------- 弹窗内容 ---------------- */
.stu-modal-note{
  font-size:12px;color:var(--ink-3);line-height:1.65;padding:9px 11px;margin-bottom:13px;
  background:var(--card-2);border-left:3px solid var(--gold);border-radius:0 var(--r-s) var(--r-s) 0;
}
.stu-pkgs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.stu-pkg{
  text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--card);
  transition:border-color .14s,background .14s,transform .1s;
}
.stu-pkg:hover{border-color:var(--gold);background:var(--card-2);transform:translateY(-1px)}
.sp-top{display:flex;align-items:baseline;gap:8px}
.sp-top b{font-family:var(--f-serif);font-size:13.5px}
.sp-price{margin-left:auto;font-size:13px;font-weight:700;color:var(--cinnabar-d)}
.sp-meta{font-size:11px;color:var(--ink-4);margin-top:3px}
.sp-desc{font-size:11.5px;color:var(--ink-3);margin-top:4px;line-height:1.55}

/* ---------------- 窄屏 ---------------- */
@media (max-width:980px){
  .stu-overview{grid-template-columns:1fr}
  .stu-dhead{flex-wrap:wrap;row-gap:10px}
  .sd-main{flex:1 1 240px}
  .sd-right{flex:1 1 100%;order:3;text-align:left;align-items:flex-start;
    padding-left:0;border-left:0;border-top:1px solid var(--line);padding-top:9px}
  .sd-tip{text-align:left;max-width:none}
  .sd-right .btn{margin-top:2px}
  .stu-filters{align-items:stretch}
  .stu-filters .field{flex:1 1 140px}
  .stu-filters .select,.stu-filters .input{width:100%}
  .stu-count{order:9}
  .stu-viewtoggle{order:10;margin-left:auto}
  .as-blocks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stu-pkgs{grid-template-columns:1fr}
  .so-dims{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .stu-grid{grid-template-columns:1fr}
  .sc-stats{flex-direction:column;gap:6px}
  .stu-kpis .kpi{padding:10px 11px}
}