.v-wrap { max-width: 860px; margin: 0 auto; padding: 40px 20px 80px; }
.v-h1 { font-size: clamp(22px, 4vw, 30px); font-weight: 700; margin-bottom: 6px; }
.v-lead { color: #667; font-size: 15px; line-height: 1.7; margin-bottom: 24px; }

.v-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 22px; }
.v-stat { background: #fff; border: 1px solid #dbe2ea; border-radius: 10px; padding: 12px 14px; }
.v-stat b { display: block; font-size: 22px; font-weight: 700; line-height: 1.2; }
.v-stat span { font-size: 12.5px; color: #667; }
.v-stat.due b { color: #C0392B; }

button { font: inherit; cursor: pointer; border-radius: 8px; padding: 9px 16px; font-size: 14px; }
.b-main { background: #2b6cb0; color: #fff; border: 1px solid #2b6cb0; font-weight: 600; }
.b-main:hover { background: #245a94; }
.b-ghost { background: #fff; color: #4a5568; border: 1px solid #cbd5e0; }
.b-good { background: #1E7B45; border: 1px solid #1E7B45; color: #fff; font-weight: 600; }
.b-bad  { background: #fff; border: 1px solid #C0392B; color: #C0392B; font-weight: 600; }
button[disabled] { opacity: .55; cursor: default; }

/* 复习卡。一次只给一个词 —— 一屏列十个词等于在读词表，那不是背 */
.card { background: #fff; border: 1px solid #dbe2ea; border-radius: 14px;
        padding: 30px 26px; text-align: center; margin-bottom: 14px; }
.card .w { font-size: 34px; font-weight: 700; letter-spacing: .4px; }
.card .ph { color: #718096; font-size: 14px; margin-top: 6px; }
.card .ctx { margin-top: 18px; font-size: 15px; line-height: 1.85; color: #2d3748;
             background: #F7FAFC; border-radius: 8px; padding: 12px 14px; text-align: left; }
.card .ctx u { text-decoration: none; border-bottom: 2px solid #2b6cb0; padding: 0 2px; font-weight: 600; }
.card .ctx i { font-style: normal; color: #a0aec0; letter-spacing: 2px; }
.card .cn { margin-top: 18px; font-size: 17px; line-height: 1.8; white-space: pre-line; text-align: left; }
.card .en { margin-top: 8px; font-size: 13px; color: #4a5568; font-style: italic; text-align: left; }
.card .acts { display: flex; gap: 10px; justify-content: center; margin-top: 22px; }
.card .acts button { min-width: 130px; }
.card .box { margin-top: 14px; font-size: 12.5px; color: #718096; }

.v-sec { font-size: 18px; font-weight: 700; margin: 30px 0 10px; }
.v-note { font-size: 13.5px; color: #667; line-height: 1.7; margin-bottom: 14px; }

.w-row { background: #fff; border: 1px solid #dbe2ea; border-radius: 10px;
         padding: 13px 16px; margin-bottom: 8px; }
.w-row .top { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.w-row .w { font-size: 16px; font-weight: 700; }
.w-row .ph { font-size: 12.5px; color: #718096; }
.w-row .sp { flex: 1 }
.w-row .box { font-size: 11.5px; font-weight: 600; color: #2b6cb0; background: #EEF3F9;
              border-radius: 999px; padding: 1px 9px; }
.w-row .box.done { color: #1E7B45; background: #E8F5EE; }
.w-row .cn { margin-top: 5px; font-size: 14px; color: #2d3748; white-space: pre-line; }
.w-row .ctx { margin-top: 6px; font-size: 12.5px; color: #718096; line-height: 1.6; }
.w-row .del { border: none; background: none; color: #a0aec0; font-size: 13px; padding: 2px 4px; }
.w-row .del:hover { color: #C0392B; }

.v-empty { background: #fff; border: 1px dashed #cbd5e0; border-radius: 10px;
           padding: 36px 24px; text-align: center; color: #667; line-height: 1.8; }
.v-empty a { color: #2b6cb0; }
.v-more { text-align: center; margin-top: 22px; font-size: 14px; }
.v-more a { color: #2b6cb0; }
.v-src { margin-top: 34px; font-size: 12px; color: #a0aec0; line-height: 1.7; }
.v-src a { color: #a0aec0; }
.v-msg { font-size: 13.5px; margin-bottom: 14px; padding: 9px 12px; border-radius: 6px; }
.v-msg.ok { background: #E8F5EE; color: #1E7B45; }
.v-msg.no { background: #FFF8F0; color: #7a5a2a; }
.v-search, .v-toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:12px 0; }
.v-search input { flex:1; min-width:160px; }
.v-toolbar input { max-width:100%; }
input, select { font:inherit; border:1px solid #cbd5e0; border-radius:7px; padding:9px; min-width:0; }
.source-label { color:#2b6cb0; font-size:12px; }
.card audio { max-width:100%; }
#exitReview { margin-top:18px; }
#lookupResult { margin-top:12px; }
.w-row .en { margin-top:6px; font-size:14px; color:#526173; }
.test-options {display:grid;gap:10px;}
.test-options button {text-align:left;min-height:48px;white-space:normal;overflow-wrap:anywhere;}
.test-options small {display:block;margin-top:5px;color:#526173;font-size:13px;}
.test-options [aria-pressed="true"] {border:2px solid #2b6cb0;background:#EEF3F9;}
.v-actions {display:flex;flex-wrap:wrap;gap:10px;margin:12px 0;}
a.b-main, a.b-ghost {display:inline-block;padding:10px 14px;border-radius:8px;text-decoration:none;font-size:14px;}
@media(max-width:420px) { .v-wrap {padding:20px 14px 50px;} .v-stat {padding:12px 8px;} .card {padding:24px 14px;} .card .acts {flex-wrap:wrap;} .card .acts button {min-width:110px;} }