  :root{
    /* DragonAI 烛龙智元 design tokens */
    --bg:#FAF7F2;--bg2:#F3EEE6;--bg3:#EAE3D8;--paper:#FFFFFF;
    --ink:#1A1A1A;--ink1:#2B2B2B;--ink2:#5C5C5C;--ink3:#8A8580;--ink4:#BFB9B0;
    --line:#E4DED3;--red:#A8201A;--red5:#C0241D;--red9:#5C0F0C;--red050:#FBEFEE;--red100:#F4DCDA;
    --orange:#E94E1B;--orange4:#F39200;
    --serif:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif;
    --sans:"Inter","Noto Sans SC","Source Han Sans SC",-apple-system,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
    --mono:"JetBrains Mono","SF Mono","Menlo",monospace;
    /* 兼容旧 JS 取色 */
    --txt:var(--ink1);--mut:var(--ink2);--panel:var(--paper);--panel2:var(--bg2);
    --accent:var(--red);--accent2:#3D6B9E;
    --c1:#2E7D4F;--c2:#7C9A3E;--c3:#C28B00;--c4:#C0241D;--c0:#BFB9B0;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;color:var(--ink1);font:15px/1.65 var(--sans);
    background:
      linear-gradient(to right, rgba(43,43,43,.045) 1px, transparent 1px) 0 0/32px 32px,
      linear-gradient(to bottom, rgba(43,43,43,.045) 1px, transparent 1px) 0 0/32px 32px,
      radial-gradient(1000px 520px at 88% -10%, rgba(168,32,26,.07), transparent 60%),
      var(--bg);
    min-height:100vh}
  ::selection{background:var(--red100)}
  .wrap{max-width:1400px;margin:0 auto;padding:0 24px 96px}

  /* ── PRD §1.1 工作台两栏:左侧评测配置区 / 右侧结果展示区 ── */
  .workbench{display:grid;grid-template-columns:440px minmax(0,1fr);gap:22px;align-items:start}
  .wb-left{min-width:0}.wb-right{min-width:0}
  @media (max-width:1080px){.workbench{grid-template-columns:1fr}}
  #resPh{background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:54px 40px 44px;text-align:center;color:var(--ink3);box-shadow:0 2px 4px rgba(43,43,43,.06),0 8px 24px -8px rgba(43,43,43,.10)}
  #resPh .ph-kicker{font:600 10px/1 var(--sans);letter-spacing:.22em;color:var(--ink4);text-transform:uppercase;margin-bottom:14px}
  #resPh .ph-title{font:700 24px/1.3 var(--serif);color:var(--ink);margin-bottom:10px}
  #resPh .ph-title::after{content:"";display:block;width:36px;height:2px;background:var(--red);margin:14px auto 0}
  #resPh .ph-sub{font-size:13px;color:var(--ink3);margin:14px 0 34px}
  #resPh .ph-steps{display:flex;align-items:flex-start;justify-content:center;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--ink2)}
  #resPh .ph-steps>div{width:168px}
  #resPh .ph-steps b{display:block;font:700 21px/1 var(--serif);color:var(--red);margin-bottom:9px}
  #resPh .ph-arrow{width:auto !important;color:var(--ink4);font-size:16px;padding-top:22px;user-select:none}
  @media (max-width:760px){#resPh .ph-arrow{display:none}}
  /* 全量评测生成中 · 动态进度 */
  #evalProg{display:none;background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:56px 40px 50px;text-align:center;box-shadow:0 2px 4px rgba(43,43,43,.06),0 8px 24px -8px rgba(43,43,43,.10)}
  #evalProg .ep-kicker{font:600 10px/1 var(--sans);letter-spacing:.22em;color:var(--ink4);text-transform:uppercase;margin-bottom:14px}
  #evalProg .ep-title{font:700 23px/1.3 var(--serif);color:var(--ink)}
  #evalProg .ep-bar{position:relative;height:4px;background:var(--bg3);border-radius:99px;overflow:hidden;max-width:320px;margin:24px auto 28px}
  #evalProg .ep-bar i{position:absolute;left:0;top:0;height:100%;width:38%;border-radius:99px;background:linear-gradient(90deg,transparent,var(--red5),var(--red),transparent);animation:ep-slide 1.35s cubic-bezier(.45,0,.25,1) infinite}
  #evalProg .ep-steps{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;margin-bottom:20px}
  #evalProg .ep-step{display:flex;align-items:center;gap:9px;font:600 13.5px/1 var(--sans);color:var(--ink4);transition:color .35s}
  #evalProg .ep-step .ep-dot{position:relative;flex:none;width:12px;height:12px;border-radius:50%;border:2px solid var(--ink4);box-sizing:border-box;transition:all .35s}
  #evalProg .ep-step.active{color:var(--red)}
  #evalProg .ep-step.active .ep-dot{border-color:var(--red);background:var(--red);animation:ep-pulse 1.15s ease-in-out infinite}
  #evalProg .ep-step.done{color:var(--ink2)}
  #evalProg .ep-step.done .ep-dot{border-color:var(--c1);background:var(--c1);animation:none}
  #evalProg .ep-step.done .ep-dot::after{content:"";position:absolute;left:2.5px;top:.5px;width:3px;height:6px;border:solid #fff;border-width:0 1.6px 1.6px 0;transform:rotate(45deg)}
  #evalProg .ep-hint{font:13px/1.5 var(--sans);color:var(--ink3);min-height:20px}
  @keyframes ep-slide{0%{transform:translateX(-130%)}100%{transform:translateX(360%)}}
  @keyframes ep-pulse{0%,100%{box-shadow:0 0 0 0 rgba(168,32,26,.4)}70%{box-shadow:0 0 0 7px rgba(168,32,26,0)}}
  /* 边读边识大舞台:录音时右侧大号朗读展示框(逐词高亮 + 跟读分/覆盖/语速) */
  #readStage{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:4px;padding:30px 34px 24px;box-shadow:0 2px 4px rgba(43,43,43,.06),0 8px 24px -8px rgba(43,43,43,.10)}
  #readStage .rs-head{display:flex;align-items:center;gap:9px;font:600 11px/1 var(--sans);letter-spacing:.16em;color:var(--orange);text-transform:uppercase}
  #readStage .rs-dot{width:9px;height:9px;border-radius:50%;background:var(--orange);animation:recpulse 1.6s infinite;flex:none}
  #readStage .rs-stats{margin-left:auto;color:var(--ink1);font:600 13px/1 var(--sans);letter-spacing:0;text-transform:none}
  #readStage .rs-text{font:500 30px/1.85 var(--serif);color:var(--ink1);margin-top:20px;min-height:140px;overflow-wrap:break-word;word-break:break-word}
  #readStage .rs-text b{font-weight:600;border-radius:3px;padding:0 1px}
  #readStage .rs-legend{margin-top:20px;padding-top:15px;border-top:1px solid var(--line);font-size:12.5px;color:var(--ink3)}
  @media (max-width:760px){#readStage{padding:18px 16px}#readStage .rs-text{font-size:21px;line-height:1.75;min-height:88px;margin-top:14px}#readStage .rs-stats{font-size:12px}}
  @media (max-width:760px){#evalProg{padding:40px 22px 36px}#evalProg .ep-steps{gap:16px 22px}}
  /* 朗读材料库 */
  .lib-btn{appearance:none;cursor:pointer;background:var(--red050);border:1px solid var(--red100);border-radius:999px;padding:5px 12px;font:600 12px/1 var(--sans);color:var(--red);transition:all .15s;white-space:nowrap;text-transform:none;letter-spacing:0}
  .lib-btn:hover{background:var(--red);color:#fff;border-color:var(--red)}
  #libModal[hidden]{display:none}
  #libModal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px}
  #libModal .lib-backdrop{position:absolute;inset:0;background:rgba(26,26,26,.46);animation:lib-fade .2s ease}
  #libModal .lib-card{position:relative;background:var(--paper);border-radius:8px;width:min(880px,100%);max-height:86vh;display:flex;flex-direction:column;box-shadow:0 24px 60px -12px rgba(26,26,26,.42);animation:lib-pop .22s cubic-bezier(.2,.8,.2,1);overflow:hidden}
  .lib-head{display:flex;align-items:flex-start;justify-content:space-between;padding:24px 26px 16px;border-bottom:1px solid var(--line)}
  .lib-kicker{font:600 10px/1 var(--sans);letter-spacing:.2em;color:var(--ink4);text-transform:uppercase;margin-bottom:8px}
  .lib-title{font:700 21px/1.2 var(--serif);color:var(--ink)}
  .lib-x{appearance:none;border:1px solid var(--line);background:var(--bg2);border-radius:6px;width:32px;height:32px;cursor:pointer;color:var(--ink2);font-size:14px;line-height:1;transition:all .15s;flex:none}
  .lib-x:hover{background:var(--red050);color:var(--red);border-color:var(--red100)}
  .lib-langs{display:flex;gap:4px;padding:14px 26px 0}
  .lib-lang{appearance:none;cursor:pointer;background:none;border:none;border-bottom:2.5px solid transparent;padding:6px 18px 11px;font:700 15px/1 var(--sans);color:var(--ink3);transition:all .15s}
  .lib-lang:hover{color:var(--ink)}
  .lib-lang.on{color:var(--red);border-bottom-color:var(--red)}
  .lib-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:12px 26px 14px;border-bottom:1px solid var(--line)}
  .lib-tab{appearance:none;cursor:pointer;background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:7px 15px;font:600 13px/1 var(--sans);color:var(--ink2);transition:all .15s}
  .lib-tab:hover{border-color:var(--ink4)}
  .lib-tab.on{background:var(--red);border-color:var(--red);color:#fff}
  .lib-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px 26px 26px;overflow-y:auto}
  .lib-item{text-align:left;cursor:pointer;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:14px 16px;transition:all .15s;font-family:var(--sans)}
  .lib-item:hover{border-color:var(--red);background:var(--red050);transform:translateY(-1px);box-shadow:0 4px 14px -6px rgba(168,32,26,.28)}
  .lib-item .li-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:7px}
  .lib-item .li-t{font:700 16px/1.2 var(--serif);color:var(--ink)}
  .lib-item .li-a{font:500 11px/1 var(--sans);color:var(--ink3);white-space:nowrap;flex:none}
  .lib-item .li-x{font:13px/1.55 var(--sans);color:var(--ink2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  @keyframes lib-fade{from{opacity:0}to{opacity:1}}
  @keyframes lib-pop{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
  @media (max-width:760px){#libModal{padding:0}#libModal .lib-card{max-height:100vh;height:100%;width:100%;border-radius:0}.lib-grid{grid-template-columns:1fr;padding:16px}}
  .qs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:34px}
  .qs-label{font:600 10px/1 var(--sans);letter-spacing:.18em;color:var(--ink4);text-transform:uppercase;margin-top:36px}
  .qs button{appearance:none;cursor:pointer;background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:9px 18px;font:600 13px/1 var(--sans);color:var(--ink1);transition:all .15s}
  .qs button:hover{border-color:var(--red);color:var(--red);background:var(--red050)}
  .qs button:active{transform:translateY(1px)}
  .ph-caps{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:30px;padding-top:22px;border-top:1px solid var(--line);font-size:12px;color:var(--ink3)}
  .ph-caps span::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--red);margin-right:7px;vertical-align:2px}

  /* ── 顶栏 ─────────────────────────── */
  header.site{border-bottom:1px solid var(--line);background:rgba(250,247,242,.85);backdrop-filter:blur(6px);position:sticky;top:0;z-index:20}
  .site-in{max-width:1400px;margin:0 auto;padding:14px 24px;display:flex;align-items:baseline;gap:14px}
  .wordmark{font:700 17px/1 var(--serif);color:var(--ink);letter-spacing:.02em;white-space:nowrap}
  .wordmark em{font-style:normal;color:var(--red)}
  .wordmark-en{font:500 10px/1 var(--sans);letter-spacing:.22em;color:var(--ink3);text-transform:uppercase}
  .nav{margin-left:auto;display:flex;gap:22px;font-size:13px;white-space:nowrap}
  .nav a{color:var(--ink2);text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent;transition:all .2s cubic-bezier(.2,0,0,1)}
  .nav a:hover{color:var(--red);border-bottom-color:var(--red)}

  /* ── 题头(产品页头) ─────────────────── */
  .hero{padding:44px 0 32px;display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap}
  .overline{font:600 11px/1 var(--sans);letter-spacing:.18em;color:var(--red);text-transform:uppercase}
  .hero h1{font:700 clamp(28px,3.4vw,40px)/1.12 var(--serif);color:var(--ink);margin:12px 0 0;letter-spacing:-.01em}
  .hero h1::after{content:"";display:block;width:52px;height:3px;background:var(--red);margin-top:16px}
  .hero .sub{margin:14px 0 0;max-width:58ch;color:var(--ink2);font-size:14px}
  .hero .sub b{color:var(--ink1);font-weight:600}
  .chips{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;align-content:flex-start;max-width:360px}
  .chip{display:inline-flex;align-items:center;gap:6px;font:600 11.5px/1 var(--sans);letter-spacing:.01em;color:var(--ink1);border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:7px 13px 7px 11px;white-space:nowrap;transition:border-color .15s,background .15s}
  .chip::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--red);flex:none}
  .chip:hover{border-color:var(--red100);background:var(--red050)}
  .chip b{color:var(--red);font-weight:700}
  @media (max-width:900px){.chips{justify-content:flex-start;max-width:none}}

  /* ── 卡片与表单 ───────────────────── */
  .card{background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:28px;margin-bottom:20px}
  .card.shadow{box-shadow:0 2px 4px rgba(43,43,43,.06),0 8px 24px -8px rgba(43,43,43,.10)}
  .sec{font:600 11px/1 var(--sans);letter-spacing:.18em;color:var(--red);text-transform:uppercase;margin:0 0 14px;display:flex;align-items:center;gap:10px}
  .sec::after{content:"";flex:1;height:1px;background:var(--line)}
  .sec .en{color:var(--ink4);letter-spacing:.14em}
  label{display:block;font:600 11px/1 var(--sans);letter-spacing:.1em;color:var(--ink3);margin:0 0 7px;text-transform:uppercase}
  select,textarea,input[type=text]{width:100%;background:var(--paper);border:1px solid var(--line);color:var(--ink1);border-radius:2px;padding:10px 12px;font:14px/1.5 var(--sans);outline:none;transition:border-color .12s}
  select:hover,textarea:hover,input[type=text]:hover{border-color:var(--ink4)}
  select:focus,textarea:focus,input[type=text]:focus{border-color:var(--ink1);outline:2px solid var(--orange);outline-offset:2px}
  textarea{resize:vertical;min-height:54px;font-size:15px}
  input[type=range]{width:100%;accent-color:var(--red)}
  .row{display:flex;gap:16px;flex-wrap:wrap}.row>div{flex:1;min-width:170px}
  details{margin-top:16px;border-top:1px dashed var(--line);padding-top:14px}
  summary{cursor:pointer;font:600 12px/1 var(--sans);letter-spacing:.06em;color:var(--ink2);list-style:none;display:flex;align-items:center;gap:8px}
  summary::before{content:"+";font:600 14px/1 var(--mono);color:var(--red);width:14px}
  details[open] summary::before{content:"−"}
  summary:hover{color:var(--red)}

  .actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
  .btn{appearance:none;border:none;border-radius:2px;padding:11px 26px;font:600 14px/1 var(--sans);letter-spacing:.04em;cursor:pointer;transition:all .12s cubic-bezier(.2,0,0,1)}
  .btn:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
  .btn.primary{background:var(--red);color:#FAF7F2;box-shadow:0 4px 14px rgba(168,32,26,.18)}
  .btn.primary:hover{background:var(--red5)}
  .btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
  .btn:not(:disabled):active{transform:translateY(1px)}
  .ghost{background:var(--bg2);color:var(--ink1);border:1px solid var(--line)}
  .ghost:hover{border-color:var(--red);color:var(--red);background:var(--red050)}
  .btn.rec{background:var(--paper);color:var(--ink1);border:1px solid var(--ink1)}
  .btn.rec.live,.btn.rec:active{background:var(--orange);border-color:var(--orange);color:#fff}
  .hint{color:var(--ink3);font-size:12px}.file{display:none}
  #status{margin-top:12px;font-size:13px;color:var(--ink2);min-height:18px}
  #status:not(:empty)::before{content:"— "}

  /* ── 结果区 ───────────────────────── */
  #res{display:none}
  .top{display:flex;gap:36px;align-items:center;flex-wrap:wrap}
  .ring{--p:0;width:132px;height:132px;border-radius:50%;flex:none;
    background:conic-gradient(var(--red) calc(var(--p)*1%),var(--bg3) 0);display:grid;place-items:center;transition:--p .4s}
  .ring i{width:104px;height:104px;border-radius:50%;background:var(--paper);display:grid;place-items:center;
    font:700 40px/1 var(--serif);font-style:normal;color:var(--ink)}
  .meta-k{font:600 10px/1 var(--sans);letter-spacing:.16em;color:var(--ink3);text-transform:uppercase}
  .meta-v{font:500 13px/1.5 var(--mono);color:var(--ink1);word-break:break-all}
  .legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ink2);margin-top:8px}
  .legend span{display:inline-flex;align-items:center;gap:6px}
  .dot{width:10px;height:10px;border-radius:1px;display:inline-block}
  .anno{font:400 30px/2 var(--serif);letter-spacing:3px;margin-top:8px;overflow-wrap:break-word;word-break:break-word}
  .anno b{font-weight:600;border-radius:2px;padding:1px 2px;transition:background .12s}
  .anno b:hover{background:var(--bg2)}
  .anno .anno-punc{color:var(--ink3);font-weight:400;letter-spacing:0;cursor:default;margin:0 -1px}
  .tip{position:fixed;background:var(--ink);color:#FAF7F2;border-radius:2px;padding:8px 11px;font-size:12px;pointer-events:none;display:none;z-index:9;box-shadow:0 8px 20px rgba(26,26,26,.25)}
  .players{display:flex;gap:20px;flex-wrap:wrap;margin-top:10px}.players>div{flex:1;min-width:260px}
  audio{width:100%;margin-top:8px;height:36px}
  .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px;margin-top:6px}
  .kpi{background:var(--bg2);border:1px solid var(--line);border-radius:2px;padding:10px 12px;font:600 10px/1.3 var(--sans);letter-spacing:.08em;color:var(--ink3);text-transform:uppercase}
  .kpi b{display:block;font:700 20px/1.2 var(--serif);color:var(--ink);margin-top:4px;letter-spacing:0}
  .asr{background:var(--bg2);border:1px solid var(--line);border-radius:2px;padding:14px 16px;font:400 17px/1.9 var(--serif);letter-spacing:1px;margin-top:6px;overflow-wrap:break-word;word-break:break-word}
  table.sent{width:100%;border-collapse:collapse;font-size:13px;margin-top:6px}
  table.sent td,table.sent th{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left;color:var(--ink2);font-weight:400}
  table.sent th{color:var(--ink1);font:600 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase}
  table.sent tr:hover td{background:var(--bg2)}
  .live{font:500 24px/1.8 var(--serif);min-height:40px;color:var(--red);letter-spacing:2px}
  #liveBox{margin-top:14px;border-left:3px solid var(--orange);padding-left:14px}
  #wdPanel{margin-top:12px;background:var(--bg2);border:1px solid var(--line);border-left:3px solid var(--red);border-radius:2px;padding:14px 16px;font-size:13px}
  #reportBox #repSummary{background:var(--bg2);border:1px solid var(--line);border-radius:2px;padding:16px 18px;white-space:pre-wrap;font:400 14.5px/1.8 var(--sans)}
  .tag{display:inline-block;font:600 10px/1 var(--sans);letter-spacing:.12em;color:var(--red);border:1px solid var(--red100);background:var(--red050);border-radius:2px;padding:4px 8px;text-transform:uppercase;vertical-align:middle}
  ol#repSug{margin:0;padding-left:22px;font-size:14px}
  ol#repSug li{margin:7px 0}
  ol#repSug li::marker{color:var(--red);font-weight:600}
  .footer{margin-top:48px;padding-top:18px;border-top:1px solid var(--line);display:flex;gap:14px;font-size:12px;color:var(--ink3)}
  .footer b{color:var(--ink2);font-weight:600}
  @keyframes recpulse{0%,100%{box-shadow:0 0 0 0 rgba(233,78,27,.35)}50%{box-shadow:0 0 0 8px rgba(233,78,27,0)}}
  .btn.rec.live{animation:recpulse 1.6s infinite}

  /* ── 移动端(≤760px):同一 DOM 响应式适配,桌面端零影响 ──
     维护守则:本页任何 UI 改动须同时核对桌面与移动两个断点(双端同步) */
  #radar{max-width:100%;height:auto}
  button,select,.qs button{touch-action:manipulation}
  *{-webkit-tap-highlight-color:transparent}

  /* ── 录音响度实时表(双端共用;推荐区间=避开 1002音量偏低 / 1003过载削波) ── */
  #vuMeter{margin-top:16px}
  .vu-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}
  .vu-head .vu-ttl{font:600 11px/1 var(--sans);letter-spacing:.16em;color:var(--ink3);text-transform:uppercase}
  .vu-head .vu-state{font:600 12px/1 var(--sans);letter-spacing:.02em;color:var(--ink3);display:inline-flex;align-items:center;gap:5px}
  .vu-head .vu-state::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;display:inline-block}
  .vu-track{position:relative;height:14px;border-radius:8px;background:var(--bg2);border:1px solid var(--line);overflow:hidden}
  .vu-band{position:absolute;top:0;bottom:0;left:44%;width:36%;background:rgba(47,125,79,.15);
    border-left:1px dashed rgba(47,125,79,.55);border-right:1px dashed rgba(47,125,79,.55)}
  .vu-fill{position:absolute;top:0;bottom:0;left:0;width:0%;background:#2F7D4F;border-radius:8px 0 0 8px;
    transition:width .05s linear,background .12s ease}
  .vu-mark{position:absolute;top:-2px;bottom:-2px;width:3px;border-radius:2px;background:var(--ink1);left:0%;
    box-shadow:0 0 0 1px var(--paper);transition:left .05s linear,background .12s ease}
  .vu-scale{display:flex;justify-content:space-between;margin-top:5px;font:500 10px/1 var(--sans);letter-spacing:.02em;color:var(--ink4)}
  .vu-scale .vu-rec{color:#2F7D4F;font-weight:600}
  #dock{display:contents}   /* 桌面:无包裹盒,布局与历史版本完全一致 */
  @media (max-width:760px){
    .card{padding:18px}.anno{font-size:22px;letter-spacing:2px}
    .wrap{padding:0 16px 190px}             /* 底部留出操作坞高度 */
    .site-in{padding:11px 14px;gap:10px}
    .wordmark-en{display:none}
    .nav{gap:14px;font-size:12.5px;overflow-x:auto;scrollbar-width:none}
    .nav::-webkit-scrollbar{display:none}
    .hero{padding:24px 0 16px}
    .hero .sub{font-size:13px}
    .chips{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;max-width:100%;padding-bottom:4px;scrollbar-width:none;
      -webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent)}  /* 右缘渐隐示意可横滑 */
    .chips::-webkit-scrollbar{display:none}
    select,textarea,input[type=text]{font-size:16px}  /* ≥16px 防 iOS 聚焦自动放大 */
    .qs button{padding:12px 18px}
    #resPh{padding:32px 18px 28px}
    .top{gap:18px;justify-content:center}
    #sentSec,#detailSec{overflow-x:auto;-webkit-overflow-scrolling:touch}
    .footer{flex-wrap:wrap;row-gap:6px}
    /* 底部固定操作坞:录音/停止(含倒计时)、上传、流式字幕与实时转写常驻拇指区 */
    #dock{display:flex;flex-direction:column;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:30;
      background:var(--paper);border-top:1px solid var(--line);
      box-shadow:0 -8px 24px rgba(43,43,43,.12);padding:10px 14px calc(12px + env(safe-area-inset-bottom))}
    /* 坞内层序:响度表在最上、流式字幕/实时转写居中、状态、按钮贴底(拇指区) */
    #dock #vuMeter{order:-4;margin:0}
    #dock #liveBox{order:-3}
    #dock #liveCap{order:-2}
    #dock #status{order:-1}
    #dock .actions{margin:0;padding:0;border-top:none;gap:10px}
    #dock .btn.rec{flex:1 1 auto;min-height:52px;font-size:16px;border-radius:4px}
    #dock .ghost{flex:0 0 auto;min-height:52px;border-radius:4px;white-space:nowrap;padding:11px 16px}
    #dock .actions>span:not(.hint){display:none}   /* 桌面布局用的弹性占位,坞内不需要 */
    #dock #ainfo{width:100%;order:5;text-align:center;margin:0}
    #dock #liveBox{margin:0;max-height:92px;overflow-y:auto;border-left-width:3px;padding-left:10px}
    #dock #liveBox label{margin-bottom:2px}
    #dock .live{font-size:17px;line-height:1.7;min-height:0;letter-spacing:1px}
    #dock #liveCap{margin:0;max-height:92px;overflow-y:auto}
    #dock #status{margin:0;text-align:center;font-size:12px;min-height:0}
    #radar{width:min(280px,80vw);height:auto;display:block;margin:2px auto 0}   /* 雷达图按屏宽收敛,窄屏不再过大 */
    audio{height:44px}                                                           /* 原生播放条加高,便于触摸拖动 */
    #libModal .lib-head{padding:18px 16px 12px}
    #libModal .lib-langs{padding:12px 16px 0}
    #libModal .lib-tabs{padding:10px 16px 12px}                                  /* 范文库头部在手机上收紧留白 */
  }
  @media (min-width:641px) and (max-width:1080px){.hero{padding:36px 0 24px}}

/* ============================================================
   专题页附加样式(模式子导航 / 说明卡 / 区块) — eval-kit 专用
   ============================================================ */
/* 四个评测专题的子导航(药丸切换) */
.modenav{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 0}
.modenav a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;background:var(--paper);border:1px solid var(--line);
  border-radius:999px;padding:8px 16px;font:600 13px/1 var(--sans);color:var(--ink2);transition:all .15s;white-space:nowrap}
.modenav a:hover{border-color:var(--red);color:var(--red);background:var(--red050)}
.modenav a.on{background:var(--red);border-color:var(--red);color:#FAF7F2;box-shadow:0 4px 14px rgba(168,32,26,.18)}
.modenav a .mn-em{font-size:15px;line-height:1}
.modenav a .mn-en{font:500 9px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.7}
@media(max-width:760px){.modenav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px;
  -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .modenav::-webkit-scrollbar{display:none}.modenav a{padding:9px 14px}.modenav a .mn-en{display:none}}

/* 模式说明卡片区(连读现象 / 评分维度 / 实时协议) */
.feat{margin-top:22px}
.feat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(208px,1fr));gap:12px}
.feat-card{background:var(--paper);border:1px solid var(--line);border-left:3px solid var(--red);border-radius:4px;padding:16px 18px;transition:all .15s}
.feat-card:hover{box-shadow:0 4px 16px -8px rgba(43,43,43,.18);transform:translateY(-1px)}
.feat-card .fc-k{font:600 10px/1 var(--sans);letter-spacing:.16em;color:var(--ink4);text-transform:uppercase;margin-bottom:8px}
.feat-card .fc-t{font:700 16px/1.3 var(--serif);color:var(--ink);margin-bottom:6px}
.feat-card .fc-t b{color:var(--red);font-weight:700}
.feat-card .fc-d{font:13px/1.6 var(--sans);color:var(--ink2)}
.feat-card .fc-eg{margin-top:9px;font:500 13px/1.5 var(--mono);color:var(--ink1);background:var(--bg2);border-radius:3px;padding:6px 9px;word-break:break-word}
.feat-card .fc-eg em{font-style:normal;color:var(--red);font-weight:700;border-bottom:2px solid var(--orange4);padding-bottom:1px}

/* 实时评测·大字幕舒展台(边录边出) */
#rtStage{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:4px;padding:26px 30px 22px;box-shadow:0 2px 4px rgba(43,43,43,.06),0 8px 24px -8px rgba(43,43,43,.10)}
#rtStage .rt-head{display:flex;align-items:center;gap:9px;font:600 11px/1 var(--sans);letter-spacing:.16em;color:var(--orange);text-transform:uppercase}
#rtStage .rt-dot{width:9px;height:9px;border-radius:50%;background:var(--orange);animation:recpulse 1.6s infinite;flex:none}
#rtStage .rt-metrics{margin-left:auto;display:flex;gap:18px;text-transform:none;letter-spacing:0}
#rtStage .rt-m{text-align:right}
#rtStage .rt-m i{display:block;font:700 22px/1 var(--serif);font-style:normal;color:var(--ink)}
#rtStage .rt-m span{font:600 10px/1.4 var(--sans);letter-spacing:.04em;color:var(--ink3)}
#rtStage .rt-text{font:500 28px/1.85 var(--serif);color:var(--ink1);margin-top:18px;min-height:120px;letter-spacing:2px;overflow-wrap:break-word}
#rtStage .rt-text .ph{color:var(--ink4);font-size:18px;letter-spacing:0}
#rtStage .rt-foot{margin-top:16px;padding-top:13px;border-top:1px solid var(--line);font-size:12.5px;color:var(--ink3)}
@media(max-width:760px){#rtStage{padding:16px}#rtStage .rt-text{font-size:20px;line-height:1.7;min-height:80px}#rtStage .rt-metrics{gap:12px}#rtStage .rt-m i{font-size:18px}}

/* 开放题/连读 示例快选芯片 */
.egchips{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}
.egchips button{appearance:none;cursor:pointer;background:var(--bg2);border:1px solid var(--line);border-radius:999px;
  padding:7px 14px;font:600 12.5px/1 var(--sans);color:var(--ink1);transition:all .15s}
.egchips button:hover{border-color:var(--red);color:var(--red);background:var(--red050)}
.egchips button:active{transform:translateY(1px)}

/* 题目图片自定义文件选择器(看图说话) */
.filepick{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:7px}
.filepick-btn{display:inline-flex;align-items:center;gap:8px;cursor:pointer;background:var(--bg2);border:1px solid var(--line);border-radius:2px;padding:9px 16px;margin:0;font:600 12.5px/1 var(--sans);letter-spacing:.02em;color:var(--ink1);text-transform:none;transition:all .12s cubic-bezier(.2,0,0,1)}
.filepick-btn:hover{border-color:var(--red);color:var(--red);background:var(--red050)}
.filepick-btn:active{transform:translateY(1px)}
.filepick-btn svg{width:15px;height:15px;flex:none}
.filepick-name{font:13px/1.4 var(--sans);color:var(--ink3);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filepick-name.has{color:var(--ink1)}
.filepick-prev{margin-top:11px;max-width:170px;max-height:128px;border:1px solid var(--line);border-radius:4px;object-fit:cover;display:block}

/* 开放题任务类型卡选 */
.taskcards{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:7px}
.taskcards label{display:block;cursor:pointer;background:var(--bg);border:1px solid var(--line);border-radius:6px;
  padding:13px 14px;transition:all .15s;text-transform:none;letter-spacing:0;margin:0}
.taskcards label:hover{border-color:var(--red);background:var(--red050)}
.taskcards input{position:absolute;opacity:0;pointer-events:none}
.taskcards input:checked+.tc-in{color:var(--red)}
.taskcards label:has(input:checked){border-color:var(--red);background:var(--red050);box-shadow:0 4px 14px -6px rgba(168,32,26,.28)}
.taskcards .tc-t{font:700 15px/1.2 var(--serif);color:var(--ink);margin-bottom:5px}
.taskcards .tc-d{font:12px/1.45 var(--sans);color:var(--ink3)}
@media(max-width:560px){.taskcards{grid-template-columns:1fr}}

/* 语言锁定徽标(连读页 English 固定) */
.langlock{display:inline-flex;align-items:center;gap:7px;background:var(--bg2);border:1px solid var(--line);
  border-radius:2px;padding:9px 12px;font:600 13px/1.4 var(--sans);color:var(--ink2)}
.langlock b{color:var(--ink1)}
.langlock::before{content:"\1F512";font-size:12px}


/* ============================================================
   评测主入口 Hub(/eval 落地页:四模式卡片启动器)
   ============================================================ */
.hub-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:6px}
@media(max-width:760px){.hub-grid{grid-template-columns:1fr}}
.hub-card{position:relative;display:flex;flex-direction:column;text-decoration:none;background:var(--paper);
  border:1px solid var(--line);border-left:4px solid var(--red);border-radius:6px;padding:26px 28px;
  transition:all .18s cubic-bezier(.2,0,0,1);box-shadow:0 2px 4px rgba(43,43,43,.05)}
.hub-card:hover{transform:translateY(-2px);box-shadow:0 16px 36px -14px rgba(43,43,43,.24);border-left-color:var(--orange)}
.hub-card .hc-top{display:flex;align-items:center;gap:14px}
.hub-card .hc-em{font-size:30px;line-height:1;flex:none}
.hub-card .hc-k{font:600 10px/1 var(--sans);letter-spacing:.18em;color:var(--ink4);text-transform:uppercase;margin-bottom:5px}
.hub-card .hc-t{font:700 22px/1.15 var(--serif);color:var(--ink)}
.hub-card .hc-t b{color:var(--red);font-weight:700}
.hub-card .hc-d{font:14px/1.65 var(--sans);color:var(--ink2);margin:14px 0 16px}
.hub-card .hc-feat{display:flex;gap:7px;flex-wrap:wrap;margin-top:auto}
.hub-card .hc-feat span{font:600 11px/1 var(--sans);color:var(--ink2);background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:6px 11px}
.hub-card .hc-go{position:absolute;top:24px;right:26px;color:var(--ink4);font:600 18px/1 var(--sans);transition:all .18s}
.hub-card:hover .hc-go{color:var(--red);transform:translateX(3px)}
@media(max-width:760px){.hub-card{padding:20px}.hub-card .hc-t{font-size:20px}}


/* 双语分组 Hub:中文评测 / English Evaluation 两栏并列(移动堆叠) */
.hub-split{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:6px}
@media(max-width:860px){.hub-split{grid-template-columns:1fr;gap:30px}}
.hub-group{display:flex;flex-direction:column;gap:14px}
.hub-group .hg-head{display:flex;align-items:baseline;gap:10px;padding:0 2px 11px;border-bottom:2px solid var(--red)}
.hub-group .hg-em{font-size:17px;line-height:1}
.hub-group .hg-zh{font:700 20px/1 var(--serif);color:var(--ink)}
.hub-group .hg-en{font:600 10px/1 var(--sans);letter-spacing:.18em;color:var(--ink4);text-transform:uppercase}
.hub-group .hg-count{margin-left:auto;font:600 11px/1 var(--sans);color:var(--ink3)}
.hub-group .hub-card{border-left-width:4px}


/* 题型自动识别指示器(读取参考文本即时判定 word/sentence/passage/alpha) */
.autotype{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:2px}
.autotype .at-pill{font:600 12.5px/1 var(--sans);color:var(--ink3);background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:7px 13px;transition:all .15s;user-select:none}
.autotype .at-pill.on{color:#FAF7F2;background:var(--red);border-color:var(--red);box-shadow:0 3px 10px -4px rgba(168,32,26,.4)}
.autotype .at-tag{display:inline-flex;align-items:center;gap:5px;font:600 10px/1 var(--sans);letter-spacing:.12em;color:var(--ink4);text-transform:uppercase;margin-left:2px}
.autotype .at-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c1)}
