/* =========================================================================
 * harm.css —— 和声学课程：章节写作台 / 规则表 / 学情推送 / 三维评价统计
 * 配色沿用站点（墨蓝 #0A1018 · 金 #C8952E · 青 #4FA691），内容区为浅底深字
 * ========================================================================= */

/* ---------- 章节 HERO 小改 ---------- */
.ch-hero{padding:64px 0 46px;}
/* 章节页用紧凑头部：写作台紧跟其后，打开页面就能开始写
   ★ 10-02 再压一档：把头部让给写作台（用户要"一打开就写作、视窗足够大"） */
.ch-hero.slim{padding:14px 0 12px;}
.ch-hero.slim h1{font-size:clamp(20px,2.4vw,28px);margin:5px 0 2px;}
.ch-hero.slim .en,.ch-hero.slim .pen{font-size:11px;letter-spacing:.18em;margin-bottom:2px;}
.ch-hero.slim .crumb{margin-bottom:7px;font-size:12px;}
.ch-hero.slim .chip{margin-bottom:2px;}
.ch-hero.slim .desc{margin-top:5px;font-size:13.2px;line-height:1.6;max-width:1180px;color:#9FAAC2;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ch-hero .crumb{font-size:12.5px;color:#8E9AB4;letter-spacing:.04em;margin-bottom:18px;}
.ch-hero .crumb a{color:#A5B0C8;transition:.2s;}
.ch-hero .crumb a:hover{color:#E8B755;}
.ch-hero .crumb i{font-style:normal;margin:0 9px;opacity:.45;}
.ch-hero h1{font-size:clamp(28px,3.6vw,44px);color:#fff;margin:14px 0 8px;}
.ch-hero .en{font-family:var(--mono,' ui-monospace, monospace');font-size:13px;color:#7CC5B2;letter-spacing:.2em;}
.ch-hero .desc{color:#AEBAD3;font-size:15.5px;line-height:1.92;max-width:760px;margin-top:16px;}
.ch-hero .chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px;}
.ch-hero .chips span{font-size:12.5px;color:#C0CADD;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);padding:5px 12px;border-radius:20px;}

/* ---------- 区块 ---------- */
.sec-head.plain{max-width:none;text-align:left;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.sec-head.plain h2{font-size:clamp(22px,2.4vw,30px);margin:0;}
.sec-head.plain .eyebrow{font-family:var(--mono,ui-monospace,monospace);font-size:11.5px;font-weight:700;
  letter-spacing:.2em;color:#C8952E;text-transform:uppercase;display:block;margin-bottom:8px;}

/* ---------- 规则 / 评分表 ---------- */
.hm-table{width:100%;border-collapse:collapse;font-size:14.6px;background:#fff;
  border:1px solid #E4E8F0;border-radius:12px;overflow:hidden;}
.hm-table thead th{background:#0A1018;color:#E7ECF6;padding:11px 12px;text-align:left;font-weight:600;font-size:13.5px;}
.hm-table tbody td{padding:11px 12px;border-bottom:1px solid #EEF1F6;color:#2A3446;vertical-align:top;}
.hm-table tbody tr:nth-child(even){background:#F8FAFC;}
.hm-table tbody tr.off{opacity:.5;}
.hm-table tbody tr.sum td{background:#F2F5F9;font-weight:700;}
.hm-table .hm-desc{color:#55627A;line-height:1.85;}
.hm-on{display:inline-block;font-size:12px;font-weight:700;color:#1F7A66;background:#E6F5F0;padding:2px 9px;border-radius:20px;white-space:nowrap;}
.hm-off{display:inline-block;font-size:12px;font-weight:700;color:#8A93A6;background:#F0F2F6;padding:2px 9px;border-radius:20px;white-space:nowrap;}
.hm-note{margin-top:14px;font-size:13.4px;color:#6A7488;line-height:1.9;}

/* ---------- 练习器 ---------- */
.hm-box{background:#fff;border:1px solid #E4E8F0;border-radius:14px;padding:26px 26px 22px;
  box-shadow:0 6px 22px rgba(16,24,40,.06);}
.hm-head-t{font-size:13px;font-weight:700;color:#0A1018;letter-spacing:.02em;margin-bottom:12px;}
.hm-row{display:flex;flex-wrap:wrap;gap:10px;}
.hm-cell{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:66px;
  background:#F7F9FC;border:1px solid #E4E8F0;border-radius:10px;padding:10px 8px;}
.hm-cell.cf{background:#F3F6FB;border-color:#DDE3EE;}
.hm-cell b{font-size:16px;color:#0A1018;}
.hm-cell i{font-style:normal;font-size:11px;color:#8994AB;}
.hm-cell.ans{background:#FFFDF7;border-color:#EBE2CC;}
.hm-sel{font:inherit;font-size:13.5px;padding:5px 6px;border-radius:7px;border:1px solid #D6DCE8;background:#fff;color:#0A1018;min-width:62px;}
.hm-tag{font-size:10.5px;color:#A1741C;background:#FDF3DF;border-radius:5px;padding:1px 6px;}
.hm-tag.w{color:#2D6FA8;background:#E7F1FA;}
.hm-body{margin-top:22px;padding-top:20px;border-top:1px dashed #E4E8F0;}
.hm-note{margin-top:12px;font-size:13.2px;color:#6A7488;line-height:1.85;}
.hm-entry{margin-top:16px;display:flex;align-items:center;gap:10px;font-size:14px;color:#2A3446;flex-wrap:wrap;}
.hm-hint{font-size:12.5px;color:#8994AB;}
.hm-acts{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap;}
.hm-acts .btn{cursor:pointer;}
/* 浅底页面上的次要按钮（.btn-outline 是给深色 HERO 用的，白底上会看不见） */
.hm-act{background:#F2F5F9;color:#2A3446;border:1px solid #D9DFEA;box-shadow:none;}
.hm-act:hover{background:#E8ECF3;color:#0A1018;transform:translateY(-1px);}
.hm-acts .btn-login{background:#fff;color:#2A3446;border:1px solid #D9DFEA;}
.hm-acts .btn-login:hover{color:#0A1018;border-color:#C8952E;background:#FFFBEF;}
.hm-done-acts .btn-outline{background:#F2F5F9;color:#2A3446;border-color:#D9DFEA;}
.hm-done-acts .btn-outline:hover{background:#E8ECF3;color:#0A1018;}
.hm-pop-btns .btn-outline{background:#F2F5F9;color:#2A3446;border-color:#D9DFEA;}
.hm-pop-btns .btn-outline:hover{background:#E8ECF3;color:#0A1018;}

/* ---------- 写作台（通栏满屏，打开即见） ---------- */
.hm-stage{background:linear-gradient(180deg,#F4F7FB,#EEF2F8);border-top:1px solid #E4E8F0;
  border-bottom:1px solid #E4E8F0;padding:10px 0 16px;}
.hm-stage-wrap{width:100%;max-width:1780px;margin:0 auto;padding:0 20px;}
.hm-stage-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px;}
.hm-stage-t{font-size:19px;font-weight:800;color:#0A1018;letter-spacing:-.01em;flex:0 0 auto;}
.hm-stage-t span{display:inline-block;font-size:12.5px;font-weight:600;color:#8994AB;margin-left:10px;
  background:#fff;border:1px solid #E4E8F0;border-radius:20px;padding:3px 11px;vertical-align:2px;}
.hm-cfpick{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#55627A;
  background:#fff;border:1px solid #D9DFEA;border-radius:10px;padding:5px 10px;flex:0 0 auto;}
.hm-cfsel{font:inherit;font-size:13.5px;font-weight:600;color:#0A1018;border:0;background:transparent;
  padding:2px 4px;cursor:pointer;outline:none;}
/* 纠错模式（实时纠错 / 评分模式） */
.hm-modepick{border-color:#E4D3AE;background:#FFFBF2;}
.hm-modepick>span{color:#8A5A00;}
.hm-res-hint{font-size:13.5px;line-height:1.9;color:#55627A;background:#FFFBF2;
  border:1px solid #EAD9AE;border-left:4px solid #C8952E;border-radius:10px;padding:12px 15px;}
.hm-res-hint b{color:#8A5A00;}
.hm-res-hint .hm-act{margin-top:9px;}

/* ---------- 内嵌写作工具 ---------- */
.hm-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:18px 0 12px;}
.hm-state{font-size:13.5px;padding:7px 13px;border-radius:9px;background:#F2F5F9;color:#55627A;flex:1;min-width:220px;}
.hm-state.ok{background:#E9F7F1;color:#1F7A66;font-weight:600;}
.hm-state.warn{background:#FDF3DF;color:#A1741C;}
.hm-state.wait{background:#EEF2F8;color:#6A7488;}
.hm-toolbar-acts{display:flex;gap:8px;flex-wrap:wrap;}
.hm-toolbar-acts .btn{cursor:pointer;text-decoration:none;display:inline-block;}
/* ---------- 视窗（可缩放 / 可拖动改高） ----------
   ★ 缩放：iframe 元素放大到 1/z，再 transform:scale(z) 缩回来 →
     工具那边的窗口真的变大了（重新排版），缩放后整屏可见，不必来回滑动 */
.hm-view{position:relative;width:100%;overflow:hidden;background:#fff;
  border:1px solid #DDE3EE;border-radius:12px 12px 0 0;border-bottom:0;
  height:var(--hm-h,min(1400px,calc(150vh - 200px)));min-height:780px;max-height:2400px;
  box-shadow:0 8px 26px rgba(16,24,40,.06);}
.hm-view iframe{position:absolute;left:0;top:0;display:block;border:0;background:#fff;
  width:calc(100% * var(--hm-zi,1));height:calc(100% * var(--hm-zi,1));
  transform:scale(var(--hm-z,1));transform-origin:0 0;}
.hm-grip{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  min-height:34px;padding:4px 10px 4px 12px;background:#F2F5F9;border:1px solid #DDE3EE;
  border-radius:0 0 12px 12px;cursor:ns-resize;user-select:none;}
.hm-grip-h{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:#8994AB;letter-spacing:.04em;}
.hm-grip-h::before{content:'';width:36px;height:3px;border-radius:2px;background:#C7CFDC;}
.hm-grip-acts{display:inline-flex;align-items:center;gap:8px;cursor:default;}
.hm-zoom{display:inline-flex;align-items:center;gap:4px;}
.hm-zoom-t{font-size:11.5px;color:#8994AB;margin-right:2px;}
.hm-zbtn{font:inherit;font-size:12.5px;line-height:1;color:#3A4356;background:#fff;border:1px solid #D9DFEA;
  border-radius:7px;min-width:26px;height:26px;padding:0 7px;cursor:pointer;transition:.18s;}
.hm-zbtn:hover{border-color:#C8952E;color:#0A1018;}
.hm-zbtn.wide{padding:0 11px;}
.hm-zval{font:inherit;font-size:12.5px;font-variant-numeric:tabular-nums;color:#0A1018;font-weight:700;
  background:#fff;border:1px solid #D9DFEA;border-radius:7px;height:26px;padding:0 9px;cursor:pointer;}
.hm-zval:hover{border-color:#C8952E;}
/* 满屏写作：整块写作台铺满窗口（工具能拿到最大可视高度） */
.hm-stage.hm-immersive{position:fixed;inset:0;z-index:300;overflow-y:auto;padding:10px 0 16px;
  background:linear-gradient(180deg,#F4F7FB,#EEF2F8);border-top:0;}
.hm-stage.hm-immersive .hm-stage-wrap{max-width:none;padding:0 16px;}
.hm-stage.hm-immersive .hm-res{margin-bottom:18px;}
body.hm-noscroll{overflow:hidden;}
@media(max-width:760px){
  .hm-stage-wrap{padding:0 14px;} .hm-stage-t{font-size:17px;}
  .hm-view{height:var(--hm-h,520px);min-height:380px;}
  .hm-grip{padding:4px 8px;}
}

/* ---------- 结果 ---------- */
.hm-res{margin-top:22px;}
.hm-score{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:#0A1018;color:#fff;
  border-radius:12px;padding:16px 20px;}
.hm-score-n{font-size:34px;font-weight:800;line-height:1;color:#E8B755;}
.hm-score-n em{font-style:normal;font-size:16px;color:#8E9AB4;font-weight:600;}
.hm-score-l{font-size:14px;color:#C6D0E4;}
.hm-bar{flex:1;min-width:160px;height:10px;border-radius:6px;background:rgba(255,255,255,.14);overflow:hidden;}
.hm-bar.small{height:8px;background:#E9EDF4;flex:0 0 120px;min-width:80px;}
.hm-bar i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,#4FA691,#6FC7B2);transition:width .5s;}
.hm-bar.small i{background:linear-gradient(90deg,#6C7CE0,#8E9BF0);}
.hm-dims{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;margin-top:16px;}
.hm-dim{display:flex;align-items:center;gap:10px;background:#F7F9FC;border:1px solid #E4E8F0;border-radius:10px;padding:9px 12px;font-size:13.5px;color:#2A3446;}
.hm-dim.weak{border-color:#F0CFC8;background:#FFF7F5;}
.hm-dim.good{border-color:#C9E7DC;background:#F4FBF8;}
.hm-dim-n{flex:0 0 96px;font-weight:600;}
.hm-dim-v{flex:0 0 auto;color:#6A7488;font-size:12.5px;}
.hm-vios{margin-top:18px;border:1px solid #E4E8F0;border-radius:12px;overflow:hidden;}
.hm-vios-t{background:#F2F5F9;padding:10px 14px;font-size:13.5px;font-weight:700;color:#0A1018;border-bottom:1px solid #E4E8F0;}
.hm-vio{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-bottom:1px solid #F0F3F8;font-size:13.6px;color:#2A3446;flex-wrap:wrap;}
.hm-vio:last-child{border-bottom:0;}
.hm-vio-tag{flex:0 0 auto;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:6px;background:#FDECEA;color:#B7392F;}
.hm-vio.warning .hm-vio-tag{background:#FDF3DF;color:#A1741C;}
.hm-vio-n{font-weight:700;}
.hm-vio-p{color:#8994AB;font-size:12.5px;}
.hm-vio-m{color:#55627A;}
.hm-ok{margin-top:16px;background:#E9F7F1;border-left:5px solid #4FA691;color:#1F7A66;
  padding:12px 16px;border-radius:0 10px 10px 0;font-size:14.5px;font-weight:600;}
.hm-warn{background:#FDECEA;border-left:5px solid #C0504D;color:#8F3229;padding:12px 16px;
  border-radius:0 10px 10px 0;font-size:14px;margin-top:14px;}
.hm-done{background:#FFFBEF;border:1px solid #E9D7A9;border-radius:12px;padding:18px 20px;margin-bottom:16px;}
.hm-done b{font-size:17px;color:#8A5B12;}
.hm-done p{margin:8px 0 0;font-size:13.6px;color:#6A7488;line-height:1.85;}
.hm-done-acts{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap;}
.hm-done-acts .btn{text-decoration:none;display:inline-block;}

/* ---------- 学情推送弹窗（复刻曲式 AnalysisPopup 框体） ---------- */
.hm-mask{position:fixed;inset:0;background:rgba(8,12,20,.55);backdrop-filter:blur(3px);z-index:300;
  display:flex;align-items:center;justify-content:center;padding:24px;animation:plfade .25s ease;}
@keyframes plfade{from{opacity:0}to{opacity:1}}
.hm-pop{width:min(760px,100%);max-height:86vh;overflow:auto;background:#fff;border-radius:16px;
  box-shadow:0 24px 70px rgba(8,14,26,.4);padding:26px 30px 20px;animation:plup .28s cubic-bezier(.2,.7,.3,1);}
@keyframes plup{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.hm-pop-h{display:flex;align-items:center;justify-content:space-between;border-bottom:3px solid #C8952E;padding-bottom:12px;margin-bottom:18px;}
.hm-pop-t{font-size:23px;font-weight:800;color:#0A1018;letter-spacing:.04em;}
.hm-x{border:0;background:#F2F5F9;width:32px;height:32px;border-radius:50%;font-size:20px;line-height:1;color:#6A7488;cursor:pointer;}
.hm-x:hover{background:#E8ECF3;color:#0A1018;}
.hm-info{background:#F7F9FC;border-left:6px solid #4FA691;border-radius:0 10px 10px 0;padding:14px 18px;font-size:15.4px;line-height:2.1;color:#2A3446;}
.hm-pop-score{color:#C8952E;font-size:22px;font-weight:800;}
.hm-notice{background:#EAF2FB;border-left:6px solid #4A86C8;border-radius:0 10px 10px 0;padding:14px 18px;font-size:15.2px;line-height:2.1;color:#2A3446;}
.hm-weak{background:#FFF5F3;border-left:6px solid #C0504D;border-radius:0 10px 10px 0;padding:13px 18px;margin-top:14px;font-size:15px;color:#8F3229;}
.hm-sum{background:#F4FBF8;border-left:6px solid #4FA691;border-radius:0 10px 10px 0;padding:15px 18px;margin-top:14px;font-size:15.6px;line-height:2;text-align:left;color:#1F5F4F;}
.hm-sum-t{font-size:17px;font-weight:800;color:#1F7A66;margin-bottom:6px;}
.hm-adv{background:#FFFBEF;border-left:6px solid #C8952E;border-radius:0 10px 10px 0;padding:15px 18px;margin-top:14px;text-align:left;}
.hm-adv-t{font-size:17px;font-weight:800;color:#8A5B12;margin-bottom:8px;}
.hm-adv ul{margin:0;padding-left:22px;line-height:2.15;font-size:15px;color:#3A4356;}
.hm-pop-f{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin-top:18px;padding-top:14px;border-top:1px solid #EEF1F6;}
.hm-nomore{font-size:13.5px;color:#6A7488;display:flex;align-items:center;gap:6px;cursor:pointer;}
.hm-pop-btns{display:flex;gap:10px;flex-wrap:wrap;}
.hm-pop-btns .btn{text-decoration:none;display:inline-block;cursor:pointer;}

/* ---------- 三维评价统计页（复刻曲式 evaluation_3d 板块结构） ---------- */
.ev3-hero{padding:70px 0 54px;position:relative;overflow:hidden;}
.ev3-hero .en{font-family:var(--mono,ui-monospace,monospace);font-size:13px;color:#7CC5B2;letter-spacing:.2em;}
.ev3-hero h1{font-size:clamp(28px,3.6vw,44px);color:#fff;margin:12px 0 10px;}
.ev3-hero p{color:#AEBAD3;font-size:15.5px;line-height:1.9;max-width:720px;}
.ev3-overall{background:linear-gradient(135deg,#12203A 0%,#0A1018 100%);border:1px solid rgba(200,149,46,.32);
  color:#fff;padding:28px 26px;text-align:center;border-radius:16px;box-shadow:0 18px 44px rgba(10,16,24,.34);margin-top:-8px;}
.ev3-overall .ev3-label{font-size:13px;letter-spacing:.3em;color:#9AA6C0;text-transform:uppercase;}
.ev3-overall .ev3-score{font-size:66px;font-weight:900;line-height:1.05;color:#E8B755;margin-top:6px;}
.ev3-overall .ev3-grade{display:inline-block;background:rgba(200,149,46,.18);border:1px solid rgba(200,149,46,.45);
  padding:5px 22px;border-radius:30px;font-size:17px;font-weight:700;margin-top:10px;color:#F0D9A6;}
.ev3-overall .ev3-formula{margin-top:14px;font-size:13px;color:#8E9AB4;line-height:1.9;}
.ev3-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:22px;}
.ev3-card{background:#fff;border:1px solid #E4E8F0;border-radius:14px;padding:20px 22px;box-shadow:0 6px 20px rgba(16,24,40,.05);}
.ev3-card h4{font-size:15.5px;color:#0A1018;margin:0 0 10px;display:flex;align-items:center;gap:8px;}
.ev3-card .ev3-big{font-size:30px;font-weight:800;line-height:1.1;}
.ev3-card .ev3-sub{font-size:13px;color:#6A7488;margin-top:6px;line-height:1.8;}
.ev3-chart{display:flex;justify-content:center;align-items:flex-end;gap:clamp(18px,5vw,64px);
  height:280px;padding:22px 26px;background:#F7F9FC;border:1px solid #E4E8F0;border-radius:14px;margin-top:16px;}
.ev3-g{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;}
.ev3-fill{width:74px;border-radius:8px 8px 0 0;display:flex;align-items:flex-start;justify-content:center;
  padding-top:8px;transition:height .6s cubic-bezier(.2,.7,.3,1);min-height:6px;}
.ev3-fill span{font-size:18px;font-weight:900;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25);}
.ev3-lab{margin-top:10px;font-size:14px;font-weight:700;color:#0A1018;text-align:center;}
.ev3-lab em{display:block;font-style:normal;font-size:12px;color:#8994AB;font-weight:400;margin-top:2px;}
.ev3-legend{display:flex;justify-content:center;gap:26px;margin-top:12px;font-size:13px;color:#55627A;flex-wrap:wrap;}
.ev3-legend i{display:inline-block;width:13px;height:13px;border-radius:3px;margin-right:6px;vertical-align:-1px;}
.ev3-empty{text-align:center;padding:44px 20px;color:#6A7488;font-size:15px;line-height:2;background:#fff;
  border:1px dashed #D6DCE8;border-radius:14px;}
.ev3-badge{display:inline-block;padding:3px 11px;border-radius:12px;font-size:12.5px;font-weight:700;color:#fff;}

/* ---------- 章节导航条 ---------- */
.ch-nav{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin-top:34px;padding-top:22px;border-top:1px solid #E4E8F0;}
.ch-nav a{font-size:14.5px;color:#2A3446;text-decoration:none;}
.ch-nav a:hover{color:#A1741C;}
.ch-nav .mid{font-size:13.5px;color:#8994AB;}

@media(max-width:760px){
  .hm-box{padding:18px 16px;}
  .hm-cell{min-width:58px;}
  .ev3-chart{height:220px;gap:14px;padding:16px 12px;}
  .ev3-fill{width:52px;}
  .ev3-overall .ev3-score{font-size:52px;}
  .hm-pop{padding:20px 18px 16px;}
}


/* =========================================================================
 * 和声学专用（在复调那套之上追加）
 * ========================================================================= */

/* ---------- 题面和弦标记条（每小节一格：标记 / 提示 / 空） ---------- */
.hm-chords{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;padding:9px 10px;margin:0 0 10px;
  background:#fff;border:1px solid #DDE3EE;border-radius:11px;}
.hm-chord{flex:0 0 auto;min-width:58px;text-align:center;background:#F7F9FC;border:1px solid #E4E8F0;
  border-radius:8px;padding:6px 9px 5px;}
.hm-chord em{display:block;font-style:normal;font-size:10.5px;color:#9AA5BA;letter-spacing:.04em;margin-bottom:2px;}
.hm-chord b{font-size:15.5px;font-weight:800;color:#17324F;letter-spacing:.02em;}
.hm-chord.given{background:#EEF4FF;border-color:#CBDCF7;}
.hm-chord.given b{color:#1F5FA8;}
.hm-chord.hide{background:#FBFCFE;border-style:dashed;}
.hm-chord.hide b{color:#C3CBD9;font-weight:600;}
.hm-chord.here{border-color:#C8952E;box-shadow:0 0 0 2px rgba(200,149,46,.18);}
/* 题面说明：和弦标记条已删除，此段直接接在顶栏之下 → 收紧行距与下边距，给写作台让出空间 */
.hm-chord-t{font-size:12.5px;color:#6A7488;margin:0 0 6px;line-height:1.7;}
.hm-chord-t b{color:#0A1018;}

/* ---------- 四声部状态（写到哪一声部 / 缺多少） ---------- */
.hm-voices{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.hm-v{flex:1 1 140px;background:#F7F9FC;border:1px solid #E4E8F0;border-radius:10px;padding:8px 11px;font-size:13px;color:#2A3446;}
.hm-v b{display:block;font-size:12px;color:#8994AB;font-weight:600;margin-bottom:3px;letter-spacing:.04em;}
.hm-v.ok{border-color:#C9E7DC;background:#F4FBF8;}
.hm-v.bad{border-color:#F0CFC8;background:#FFF7F5;}
.hm-v.fix{background:#EEF4FF;border-color:#CBDCF7;}


/* ---------- 课程主页：分学期章节卡 ---------- */
.hm-term{margin-top:24px;}
.hm-term-h{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:14px;
  padding-bottom:10px;border-bottom:2px solid #E4E8F0;}
.hm-term-t{font-size:19px;font-weight:800;color:#0A1018;letter-spacing:.02em;}
.hm-term-t::before{content:'';display:inline-block;width:6px;height:19px;border-radius:3px;
  background:#C97C8E;margin-right:9px;vertical-align:-3px;}
.hm-term-s{font-size:13px;color:#8994AB;line-height:1.7;}
a.unit{display:block;text-decoration:none;color:inherit;transition:.22s;}
a.unit:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(16,24,40,.10);border-color:#E8CCD4;}
a.unit:hover h4{color:#A8556A;}
a.unit h4{transition:.2s;}
.hm-term-ph{background:#fff;border:1px dashed #D6DCE8;border-radius:12px;padding:24px 20px;
  text-align:center;color:#8994AB;font-size:14.5px;line-height:1.9;}
.hm-entry{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;align-items:center;}

/* ---------- 排列法对比卡（密集 / 开放） ---------- */
.hm-cmp{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:8px;}
.hm-cmp-c{background:#fff;border:1px solid #E4E8F0;border-radius:12px;padding:16px 18px;}
.hm-cmp-c b{display:block;font-size:16.5px;font-weight:800;color:#17324F;letter-spacing:.02em;}
.hm-cmp-c span{display:inline-block;margin:6px 0 8px;font-size:12px;font-weight:700;color:#1F5FA8;
  background:#EEF4FF;border:1px solid #CBDCF7;border-radius:20px;padding:2px 10px;}
.hm-cmp-c p{margin:0;font-size:13.6px;color:#55627A;line-height:1.9;}
.hm-cmp-c p b{display:inline;font-size:inherit;color:#0A1018;font-weight:700;}

/* ---------- 和弦标记条：小节起点加分隔 ---------- */
.hm-chord.barstart{margin-left:12px;box-shadow:inset 3px 0 0 #C97C8E;}
.hm-chords{padding-bottom:11px;}

/* ---------- 和弦得分网格（按和弦计分） ---------- */
.hm-cgrid-t{margin-top:16px;font-size:13.6px;color:#55627A;line-height:1.9;}
.hm-cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:7px;margin-top:9px;}
.hm-cg{background:#fff;border:1px solid #E4E8F0;border-radius:9px;padding:6px 4px;text-align:center;cursor:default;}
.hm-cg em{display:block;font-style:normal;font-size:10.5px;color:#9AA5BA;letter-spacing:.03em;}
.hm-cg b{display:block;font-size:15px;font-weight:800;line-height:1.35;}
.hm-cg i{display:block;font-style:normal;font-size:10.5px;color:#8994AB;}
.hm-cg.ok{background:#F4FBF8;border-color:#C9E7DC;} .hm-cg.ok b{color:#1F7A66;}
.hm-cg.bad{background:#FFF7F5;border-color:#F0CFC8;} .hm-cg.bad b{color:#C0504D;}
.hm-cg.barstart{box-shadow:inset 3px 0 0 #C97C8E;}

/* ---------- 提示弹窗：左下角补充说明 ---------- */
.hm-pop-tip{font-size:12.8px;color:#8994AB;line-height:1.8;}