/* 销售录音上传网页：手机优先，单列。设计令牌和组件来自 tokens.css / components.css（素材库 computer-art 套件，原样搬入），
   报告与线条图形在 report.css；这里只写这个网页自己的外壳、登录、首页横幅、上传和录音列表。
   正文不小于 16px，可点的地方至少 44×44px；装饰只在横幅、总分卡、空状态和上传完成这几个时刻出现。 */

body{min-height:100svh;-webkit-text-size-adjust:100%}

/* ---------- 顶栏 ---------- */
.cr-top{position:sticky;top:0;z-index:10;min-height:calc(60px + env(safe-area-inset-top));display:flex;align-items:center;gap:var(--ca-space-3);padding:env(safe-area-inset-top) var(--ca-space-4) 0;background:var(--ca-surface);border-bottom:1px solid var(--ca-line)}
.cr-top .ca-brand{font-size:var(--ca-size-brand)}
.cr-top .ca-mark{width:28px;height:28px}
.cr-back{min-height:44px;display:inline-flex;align-items:center;gap:6px;margin-left:-6px;padding:0 10px 0 6px;border:0;border-radius:var(--ca-radius-control);background:none;color:var(--ca-accent);font-size:var(--ca-size-body)}
.cr-who{margin-left:auto;max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ca-size-small);color:var(--ca-muted)}
.cr-logout{min-width:44px;min-height:44px;margin-right:-8px;padding:0 8px;border:0;background:none;color:var(--ca-muted);font-size:var(--ca-size-small)}

.cr-main{max-width:640px;margin:0 auto;padding:var(--ca-space-4) var(--ca-space-4) calc(var(--ca-space-12) + env(safe-area-inset-bottom))}
.cr-hint{margin-top:var(--ca-space-2);font-size:var(--ca-size-small);color:var(--ca-muted)}
.cr-error{margin-top:var(--ca-space-2);font-size:var(--ca-size-small);color:var(--ca-danger)}
.cr-error:empty{display:none}

/* ---------- 登录 ---------- */
.cr-login{display:grid;gap:var(--ca-space-4);margin-top:var(--ca-space-6);padding:var(--ca-space-6) var(--ca-space-5)}
.cr-login h1{font-size:var(--ca-size-title-mobile)}
.cr-field{display:grid;gap:6px;font-size:var(--ca-size-small);color:var(--ca-muted)}
.cr-field input{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--ca-control-border);border-radius:var(--ca-radius-control);background:var(--ca-surface);color:var(--ca-text);font-size:var(--ca-size-body)}
.cr-field input:focus-visible{outline:2px solid var(--ca-accent);outline-offset:1px}
.cr-wide{width:100%;min-height:52px;font-size:var(--ca-size-body)}
.ca-button:disabled{opacity:.55}

/* ---------- 首页横幅（矮，不超过 170px） ---------- */
.cr-hero{display:grid;grid-template-columns:minmax(0,1fr) 42%;height:152px;overflow:hidden}
.cr-hero-copy{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:var(--ca-space-4) 0 var(--ca-space-4) var(--ca-space-5)}
.cr-hero-line{display:flex;align-items:baseline;gap:6px;font-size:var(--ca-size-body);white-space:nowrap}
.cr-hero-line .ca-number{font-size:var(--ca-size-number);color:var(--ca-accent)}
.cr-hero-sub{font-size:var(--ca-size-small);color:var(--ca-muted)}
.cr-hero-avg{font:var(--ca-weight-medium) var(--ca-size-body) var(--ca-font-mono);color:var(--ca-text)}
.cr-hero-art{position:relative;min-width:0;margin:var(--ca-space-5) var(--ca-space-4) var(--ca-space-5) 0}
.cr-hero-art::before,.cr-hero-art::after{content:"";position:absolute;top:-6px;bottom:-6px;width:1px;background:var(--ca-line)}
.cr-hero-art::before{left:0}.cr-hero-art::after{right:0}

/* ---------- 上传 ---------- */
.cr-upload{position:relative;width:100%;min-height:56px;margin-top:var(--ca-space-4);font-size:17px;overflow:hidden}
.cr-upload input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.cr-upload:focus-within{outline:2px solid var(--ca-accent);outline-offset:3px}
.cr-upload-card{margin-top:var(--ca-space-4);padding:var(--ca-space-2) var(--ca-space-5)}
.cr-done{margin:var(--ca-space-3) 0;padding:var(--ca-space-4)}
.cr-done svg{width:30px;height:30px}
.cr-done p{line-height:1.6}
.cr-uploads{list-style:none;margin:0;padding:0}
.cr-upload-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 12px;padding:var(--ca-space-3) 0}
.cr-upload-row+.cr-upload-row{border-top:1px solid var(--ca-line)}
.cr-upload-name{grid-column:1/-1;overflow-wrap:anywhere;line-height:1.45}
.cr-upload-row progress{width:100%;height:3px;border:0;border-radius:2px;background:var(--ca-line);-webkit-appearance:none;appearance:none}
.cr-upload-row progress::-webkit-progress-bar{background:var(--ca-line);border-radius:2px}
.cr-upload-row progress::-webkit-progress-value{background:var(--ca-accent);border-radius:2px}
.cr-upload-row progress::-moz-progress-bar{background:var(--ca-accent)}
.cr-upload-state{display:inline-flex;align-items:center;gap:4px;font-size:var(--ca-size-small);color:var(--ca-muted);text-align:right}
.cr-upload-row.is-done .cr-upload-state{color:var(--ca-success)}
.cr-upload-row.is-done progress::-webkit-progress-value{background:var(--ca-success)}
.cr-upload-row.is-failed .cr-upload-state{color:var(--ca-danger)}
.cr-upload-row.is-failed progress{display:none}
.cr-upload-row.is-failed .cr-upload-state{grid-column:1/-1;text-align:left}

/* ---------- 我的录音（列表保持干净：分隔线、文字、分数、5 格指纹） ---------- */
.cr-section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 12px;margin:var(--ca-space-8) 0 var(--ca-space-3)}
.cr-section-head h2{font-size:var(--ca-size-card-mobile)}
.cr-legend{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--ca-muted)}
.cr-legend .fp{width:60px}
.cr-recordings{list-style:none;margin:0;padding:0;overflow:hidden}
.cr-recordings:empty{display:none}
.cr-recordings>li+li{border-top:1px solid var(--ca-line)}
.cr-rec{width:100%;min-height:76px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--ca-space-3);padding:var(--ca-space-3) var(--ca-space-4);border:0;background:none;color:inherit;font:inherit;text-align:left}
.cr-rec:hover,.cr-rec:active{background:var(--ca-bg)}
.cr-rec-main{min-width:0}
.cr-rec-name{display:block;line-height:1.45;overflow-wrap:anywhere}
.cr-rec-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-top:6px;font-size:var(--ca-size-small);color:var(--ca-muted)}
.cr-rec-error{display:flex;align-items:flex-start;gap:4px;margin-top:6px;font-size:var(--ca-size-small);color:var(--ca-danger)}
.cr-rec-side{display:grid;justify-items:end;gap:8px}
.cr-rec-score{font:var(--ca-weight-medium) 26px/1 var(--ca-font-mono);letter-spacing:-.02em}
.cr-rec-score small{margin-left:2px;font:13px var(--ca-font-sans);color:var(--ca-muted)}
.cr-rec-score.is-none{font-size:var(--ca-size-body);color:var(--ca-muted)}
.cr-empty{display:flex;flex-direction:column;align-items:center;gap:var(--ca-space-2);padding:var(--ca-space-8) var(--ca-space-5);text-align:center;color:var(--ca-muted)}
.cr-empty .ea{margin-bottom:var(--ca-space-3)}
.cr-empty-title{color:var(--ca-text);font-size:var(--ca-size-brand)}

/* ---------- 报告页 ---------- */
.cr-detail-head{margin:var(--ca-space-2) 0 var(--ca-space-4)}
.cr-detail-head h1{margin-top:4px;font-size:var(--ca-size-card-mobile);line-height:1.45;overflow-wrap:anywhere}
.cr-detail-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin-top:var(--ca-space-2);font-size:var(--ca-size-small);color:var(--ca-muted)}
#detail>.ca-loading{min-height:160px}
#detail .rp-transcript-card{margin-top:var(--ca-space-4)}