/* 每日拷问 · 书卷版拷问台（ui308）。页面框架与按钮；词卡本体在 shadow DOM 里用单元学习页同一份样式（kw-card.css）。
   原则：纸色、细线、衬线标题；按钮一律浅底细边，不用整块深色；屏幕留给词卡。 */
@font-face { font-family: "SerifEN"; src: url("/_releases/learn304-e8ad79f381636d18/assets/learn/fonts/source-serif-4-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "SerifEN"; src: url("/_releases/learn304-e8ad79f381636d18/assets/learn/fonts/source-serif-4-latin-600-normal.woff2") format("woff2"); font-weight: 600 800; font-display: swap; }
@font-face { font-family: "SerifEN"; src: url("/_releases/learn304-e8ad79f381636d18/assets/learn/fonts/source-serif-4-latin-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "SerifEN"; src: url("/_releases/learn304-e8ad79f381636d18/assets/learn/fonts/source-serif-4-latin-ext-400-normal.woff2") format("woff2"); font-weight: 400; unicode-range: U+0100-024F, U+0250-02AF, U+1E00-1EFF; font-display: swap; }
@font-face { font-family: "Noto Serif SC GK"; src: url("/_releases/learn304-e8ad79f381636d18/assets/learn/fonts/noto-serif-sc-600-gk.woff2") format("woff2"); font-weight: 600; font-display: swap; }

body.kw-page, .kw {
  --kw-paper: #F6F2EA; --kw-sheet: #FFFDF9; --kw-tint: #EFE9DD; --kw-ink: #1B1A17; --kw-body: #3F3C35; --kw-sub: #5E5A50; --kw-muted: #6F695C;
  --kw-hair: #E4DCCD; --kw-line: #DCD4C5; --kw-uline: #BDB4A3; --kw-deco: #C9C0AE; --kw-accent: #8A9460; --kw-accent-ink: #50563A;
  --kw-known: #5C6E3E; --kw-vague: #86621F; --kw-unknown: #9A4F43; --kw-easy: #3D5F62;
  --kw-en: "SerifEN", "Source Serif 4", Georgia, "Times New Roman", serif;
  --kw-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  --kw-display: "Noto Serif SC GK", "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", serif;
}
html body.kw-page.ui301-home-page { background: var(--kw-paper); }

/* ---------- 页面框架 ---------- */
body.kw-page .review-page { width: min(1320px, calc(100% - 56px)); padding: 10px 0 16px; }
body.kw-page .quiz-shortcut-guide, body.kw-page #runnerControls, body.kw-page #targetDrawerToggle { display: none !important; }
body.kw-page .review-layout { display: block; }
body.kw-page .runner-shell { min-height: 0; }
body.kw-page #runnerHost.floating-card-host { max-width: none; border-radius: 3px; }

/* 概览并入顶部悬浮栏：回到主页 · 单元目录 │ 今日拷问 · 细进度条 · 达标数 · 同步 · 词表 │ 搜索。不再单独占一行，把高度留给词卡 */
body.kw-page nav.course-topbar .topbar-inner { width: min(1376px, 100%); min-height: 54px; padding: 7px 28px; gap: 14px; flex-wrap: nowrap; }
body.kw-page nav.course-topbar .course-home-link,
body.kw-page nav.course-topbar .course-directory-button { order: 0; flex: none; display: inline-flex; align-items: center; min-height: 34px !important; height: 34px; padding: 0 12px !important; min-width: 0 !important; border: 1px solid var(--kw-line) !important; border-radius: 2px !important; background: var(--kw-sheet) !important; box-shadow: none !important; font: 500 13.5px/1 var(--kw-ui) !important; letter-spacing: .04em; color: var(--kw-body) !important; text-decoration: none; }
body.kw-page nav.course-topbar .course-directory-button { order: 1; cursor: pointer; }
@media (hover: hover) { body.kw-page nav.course-topbar .course-home-link:hover, body.kw-page nav.course-topbar .course-directory-button:hover { border-color: var(--kw-ink) !important; color: var(--kw-ink) !important; } }
body.kw-page nav.course-topbar .course-breadcrumb { display: none !important; }
body.kw-page nav.course-topbar .gk-search-trigger { order: 3; flex: 0 1 200px; width: 200px; min-height: 34px; height: 34px; margin-left: 0; border-color: var(--kw-line); border-radius: 2px; background-color: var(--kw-sheet); font-family: var(--kw-ui); }
.kw-top { order: 2; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 14px; padding-left: 18px; border-left: 1px solid var(--kw-line); font-family: var(--kw-ui); }
body.kw-page .kw-page-title { flex: none; margin: 0; font: 600 16px/1.2 var(--kw-ui); letter-spacing: .06em; color: var(--kw-ink); white-space: nowrap; }
body.kw-page .kw-top .day-progress { flex: 1 1 auto; min-width: 48px; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; display: flex; align-items: center; gap: 10px; font: 600 12.5px/1 var(--kw-ui); color: var(--kw-ink); }
body.kw-page .kw-top .day-progress[hidden] { display: flex; visibility: hidden; }
body.kw-page .kw-top .day-progress-track { flex: 1 1 auto; height: 3px; border-radius: 0; background: var(--kw-line); }
body.kw-page .kw-top .day-progress-fill { border-radius: 0; background: var(--kw-accent-ink); transition: width .5s cubic-bezier(.2,.7,.2,1); }
body.kw-page .kw-top .day-progress-label { flex: none; font-variant-numeric: tabular-nums; }
.kw-head-count { flex: none; font: 400 15px/1 var(--kw-en); color: var(--kw-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.kw-head-count b { font-weight: 600; color: var(--kw-ink); }
.kw-head-count small { margin-left: 4px; font: 400 12px/1 var(--kw-ui); color: var(--kw-muted); }
.kw-head-sync { flex: none; font: 400 12px/1 var(--kw-ui); color: var(--kw-muted); white-space: nowrap; }
.kw-head-sync:empty { display: none; }
.kw-head-sync .review-sync-status { font: inherit !important; color: inherit !important; }
.kw-head-btn { position: relative; flex: none; display: inline-flex; align-items: center; justify-content: center; min-height: 32px; padding: 0 12px; border: 1px solid var(--kw-line); border-radius: 2px; background: var(--kw-sheet); color: var(--kw-body); font: 500 13px/1 var(--kw-ui); letter-spacing: .06em; cursor: pointer; -webkit-tap-highlight-color: transparent; }
@media (hover: hover) { .kw-head-btn:hover { border-color: var(--kw-ink); color: var(--kw-ink); } }
.kw-head-btn.has-note::after { content: ""; position: absolute; top: -3px; right: -3px; width: 7px; height: 7px; border-radius: 50%; background: var(--kw-unknown); box-shadow: 0 0 0 2px var(--kw-paper); }
/* 任务详情：收进今日词表抽屉的最上面 */
.kw-drawer-meta { flex: none; display: grid; gap: 8px; padding: 12px 14px 14px; border-bottom: 1px solid var(--kw-hair); font-family: var(--kw-ui); }
.kw-drawer-meta .mission-metrics { display: grid; gap: 3px; min-width: 0; }
body.kw-page .kw-drawer-meta .mission-line { font: 600 14px/1.5 var(--kw-ui); color: var(--kw-ink); white-space: normal; }
body.kw-page .kw-drawer-meta .workload-line { font: 400 12.5px/1.6 var(--kw-ui); color: var(--kw-muted); white-space: normal; }
body.kw-page .kw-drawer-meta .kw-plan-note { color: var(--kw-vague); }
body.kw-page .kw-drawer-meta .kw-plan-note[hidden] { display: none; }
body.kw-page .kw-drawer-meta .current-unit-line { max-width: none; overflow: visible; font: 500 12.5px/1.5 var(--kw-ui); color: var(--kw-sub); white-space: normal; }
/* 云端记录还没恢复：不生成任务，在页面上直接说明 */
.kw-notice { max-width: 640px; margin: 48px auto; padding: 18px 20px; display: grid; gap: 6px; border: 1px solid rgba(154,79,67,.35); border-radius: 2px; background: var(--kw-sheet); font: 400 14px/1.6 var(--kw-ui); color: var(--kw-muted); }
.kw-notice[hidden] { display: none; }
.kw-notice b { font-weight: 600; font-size: 16px; color: var(--kw-unknown); }
/* 页面状态提示（保存、发音等）：浮在评分条上方，几秒后自动清空 */
body.kw-page #statusLine { position: fixed; z-index: 66; left: 16px; right: 16px; bottom: 104px; width: fit-content; max-width: min(640px, calc(100vw - 32px)); margin: 0 auto; box-sizing: border-box; padding: 6px 12px; border: 1px solid var(--kw-line); border-radius: 2px; background: rgba(255,253,249,.97); box-shadow: 0 10px 24px -14px rgba(27,26,23,.35); font: 400 12.5px/1.4 var(--kw-ui); color: var(--kw-sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
body.kw-page #statusLine:empty { display: none; }
body.kw-page #statusLine.is-error { max-width: min(560px, calc(100vw - 32px)); padding: 8px 14px; white-space: normal; text-align: center; color: var(--kw-unknown); border-color: rgba(154,79,67,.45); }

/* 今日词表抽屉：同一套样式 */
body.kw-page .drawer { background: var(--kw-sheet); border-right-color: var(--kw-line); font-family: var(--kw-ui); }
body.kw-page .drawer-head h2 { font: 600 17px/1.2 var(--kw-ui); letter-spacing: .04em; color: var(--kw-ink); }
body.kw-page .drawer .ghost-btn { min-height: 32px; border-radius: 2px; border-color: var(--kw-line); background: transparent; color: var(--kw-body); font-weight: 500; }
body.kw-page .target-list { padding: 10px 12px 16px; gap: 6px; }
body.kw-page .target-row { border-radius: 2px; border-color: var(--kw-hair); background: var(--kw-sheet); padding: 8px 10px; gap: 5px; font-family: var(--kw-ui); }
body.kw-page .target-word { font: 400 18px/1.25 var(--kw-en); color: var(--kw-ink); }
body.kw-page .target-kind, body.kw-page .target-score { font-weight: 500; color: var(--kw-muted); }
body.kw-page .target-row .score-track { height: 3px; border-radius: 0; background: var(--kw-hair); }
body.kw-page .target-row .score-fill { border-radius: 0; background: var(--kw-vague); }
body.kw-page .target-row.done { border-color: var(--kw-hair); background: #F7F6EF; }
body.kw-page .target-row.done .score-fill { background: var(--kw-known); }
body.kw-page .target-row.low .score-fill { background: var(--kw-unknown); }
body.kw-page .target-row.danger { border-color: rgba(154,79,67,.3); background: #FBF4F1; }
body.kw-page .target-row :is(b, strong) { font-weight: 600; }
body.kw-page .target-metrics { display: flex; flex-wrap: wrap; gap: 2px 10px; font: 400 12px/1.5 var(--kw-ui); color: var(--kw-muted); }
body.kw-page .target-metrics strong { color: var(--kw-body); }

/* ---------- 拷问台 ---------- */
.kw { color: var(--kw-body); font: 16px/1.56 var(--kw-ui); letter-spacing: 0; }
.kw button { font-family: var(--kw-ui); }
.kw-stage { position: relative; display: flex; flex-direction: column; background: var(--kw-sheet); border: 1px solid #E6DFD2; border-radius: 3px; box-shadow: 0 24px 48px -40px rgba(27,26,23,.3); overflow: hidden; }
.kw-body { position: relative; flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 28px 36px 24px; scrollbar-width: thin; scrollbar-color: var(--kw-deco) transparent; }
.kw-body::-webkit-scrollbar { width: 8px; }
.kw-body::-webkit-scrollbar-thumb { background: var(--kw-deco); border-radius: 4px; }
.kw-more { position: sticky; z-index: 2; bottom: -24px; height: 0; margin: 0 -36px; pointer-events: none; }
.kw-more::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 56px; background: linear-gradient(rgba(255,253,249,0), rgba(255,253,249,.96)); opacity: 0; transition: opacity .2s; }
.kw-more span { position: absolute; right: 44px; bottom: 8px; font-size: 12.5px; letter-spacing: .08em; color: var(--kw-muted); opacity: 0; transition: opacity .2s; }
.kw-stage.has-more .kw-more::before, .kw-stage.has-more .kw-more span { opacity: 1; }

/* 第 0 步：只听读音 */
.kw-listen { display: none; box-sizing: border-box; min-height: 100%; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 16px; padding: 20px 0 8px; }
.kw-stage[data-stage="0"] .kw-listen { display: flex; }
.kw-play { position: relative; width: 72px; height: 72px; border-radius: 50%; border: 1px solid var(--kw-uline); background: var(--kw-sheet); color: var(--kw-ink); display: grid; place-items: center; padding: 0; cursor: pointer; transition: background-color .25s, border-color .25s, transform .15s; -webkit-tap-highlight-color: transparent; }
.kw-play svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.kw-play svg path:first-child { fill: currentColor; }
.kw-play::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; border: 1px solid var(--kw-hair); pointer-events: none; }
.kw-play.is-playing { background: var(--kw-tint); border-color: var(--kw-deco); }
.kw-play.is-playing::after { border-color: var(--kw-deco); animation: kw-ring 1.4s cubic-bezier(.2,.7,.2,1) infinite; }
@keyframes kw-ring { from { transform: scale(1); opacity: 1; } to { transform: scale(1.3); opacity: 0; } }
@media (hover: hover) { .kw-play:hover { border-color: var(--kw-ink); } }
.kw-play:active { transform: scale(.97); }
.kw-listen-title { margin: 10px 0 0; font: 600 22px/1.35 var(--kw-ui); letter-spacing: .04em; color: var(--kw-ink); }
.kw-listen-sub { margin: -6px 0 0; color: var(--kw-muted); font-size: 14px; }
.kw-listen-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 4px; }

/* 按钮：浅底细边；主按钮用墨色细边 + 墨色字，不用整块深色 */
.kw-btn { min-height: 44px; padding: 0 22px; border-radius: 2px; border: 1px solid var(--kw-line); background: var(--kw-sheet); color: var(--kw-body); font: 500 15px/1 var(--kw-ui); letter-spacing: .06em; display: inline-flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer; transition: border-color .2s, background-color .2s, color .2s, transform .15s; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.kw-btn:active { transform: translateY(1px); }
.kw-btn-ink { border-color: transparent; background: var(--kw-tint); color: var(--kw-ink); font-weight: 600; padding: 0 26px; }
@media (hover: hover) { .kw-btn-ink:hover { background: #E7DFD0; border-color: transparent; } }
.kw-next, .kw-recap-continue { color: var(--kw-ink); }
@media (hover: hover) { .kw-btn:hover { border-color: var(--kw-ink); color: var(--kw-ink); background: #FBF8F2; } }
.kw-key { display: none; min-width: 20px; height: 18px; padding: 0 4px; border-radius: 3px; border: 1px solid currentColor; font: 500 10.5px/16px var(--kw-ui); opacity: .45; text-align: center; letter-spacing: 0; }
@media (hover: hover) and (pointer: fine) { .kw-key { display: inline-block; } }

/* 第 1、2 步：看单词 / 例句提示 */
.kw-hints { display: none; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 26px 0 0; }
.kw-stage[data-stage="1"] .kw-hints, .kw-stage[data-stage="2"] .kw-hints { display: flex; }
.kw-stage[data-stage="2"] .kw-hint-examples { display: none; }
.kw-stage[data-stage="1"] .kw-body, .kw-stage[data-stage="2"] .kw-body { display: flex; flex-direction: column; justify-content: center; }

/* 词卡（shadow DOM）与退回旧版词卡时的内容 */
.kw-card-host { display: none; }
.kw-stage:not([data-stage="0"]) .kw-card-host { display: block; }
.kw-fallback:empty { display: none; }
.kw-fb-head { text-align: center; }
.kw-fb-word { margin: 0; font: 400 clamp(44px, 7vw, 76px)/1.05 var(--kw-en); color: var(--kw-ink); overflow-wrap: anywhere; }
.kw-fb-meta { margin: 8px 0 0; color: var(--kw-muted); font-size: 16px; }
.kw-stage[data-stage="3"] .kw-fb-head { text-align: left; margin-bottom: 14px; }
.kw-stage[data-stage="3"] .kw-fb-word { font-size: 52px; }
.kw-fb-cues { max-width: 760px; margin: 26px auto 0; text-align: left; }
.kw-cues-label { display: block; margin: 0 0 6px; font: 600 11.5px/1 var(--kw-ui); letter-spacing: .22em; color: #3D5F62; }
.kw-fb-cues .kw-cue { margin: 0 0 8px; padding: 10px 0 10px 16px; border-left: 2px solid var(--kw-hair); font: 400 19px/1.55 var(--kw-en); color: var(--kw-ink); }

/* ---------- 评分条：沿用学习页的书卷样式（纸底、细线、直角），用每档自己的颜色画图形、字和底边线来区分熟悉度 ---------- */
.kw-rate { flex: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 12px 20px 14px; border-top: 1px solid var(--kw-hair); background: #FBF8F2; }
.kw-r-easy { --c: #3D5F62; --t: rgba(61,95,98,.07); }
.kw-r-known { --c: #5C6E3E; --t: rgba(92,110,62,.08); }
.kw-r-vague { --c: #86621F; --t: rgba(134,98,31,.08); }
.kw-r-unfamiliar { --c: #9A4F43; --t: rgba(154,79,67,.08); }
.kw-r { position: relative; min-height: 56px; padding: 8px 14px; border-radius: 2px; border: 1px solid var(--kw-line); background: var(--kw-sheet); color: var(--kw-ink); display: flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer; transition: background-color .2s, border-color .2s, color .2s, transform .12s, opacity .2s; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.kw-r::after { content: ""; position: absolute; left: -1px; right: -1px; bottom: -1px; height: 2px; background: var(--c); }
.kw-r-icon { display: grid; place-items: center; width: 20px; height: 20px; flex: none; color: var(--c); }
.kw-r-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.kw-r-icon svg .fill { fill: currentColor; stroke: none; }
.kw-r-text { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; min-width: 0; }
.kw-r-text b { font: 600 15.5px/1.2 var(--kw-ui); letter-spacing: .12em; color: var(--c); }
.kw-r-text small { font: 400 12px/1.2 var(--kw-ui); letter-spacing: .02em; color: var(--kw-muted); white-space: nowrap; }
.kw-r .kw-key { position: absolute; top: 6px; right: 7px; color: var(--kw-muted); }
.kw-r:active { transform: translateY(1px); }
.kw-r[hidden] { display: none !important; }
@media (hover: hover) { .kw-r:not([disabled]):not(.is-picked):hover { background: var(--t); border-color: var(--c); } }
.kw-r.is-picked { background: var(--c); border-color: var(--c); color: #fff; }
.kw-r.is-picked .kw-r-icon, .kw-r.is-picked .kw-r-text b, .kw-r.is-picked .kw-r-text small, .kw-r.is-picked .kw-key { color: #fff; }
.kw-r[disabled] { opacity: .32; cursor: default; }
/* 选了半熟 / 陌生之后：四个缩小，右边出现“下一词” */
.kw-next { display: none; }
.kw-stage.is-pending .kw-rate { grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.5fr); }
.kw-stage.is-pending .kw-r small, .kw-stage.is-pending .kw-r .kw-key { display: none; }
.kw-stage.is-pending .kw-next { display: flex; min-height: 56px; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--kw-uline); border-radius: 2px; background: var(--kw-sheet); color: var(--kw-ink); font: 600 16px/1 var(--kw-ui); letter-spacing: .14em; cursor: pointer; touch-action: manipulation; transition: border-color .2s, background-color .2s; }
.kw-stage.is-pending .kw-next .kw-key { position: static; opacity: .45; }
@media (hover: hover) { .kw-stage.is-pending .kw-next:hover { border-color: var(--kw-ink); } }
.kw-stage:not(.has-easy) .kw-rate { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kw-stage.is-pending:not(.has-easy) .kw-rate { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.5fr); }

/* 刚提交的那个词：顶部浅色小条，几秒后淡出 */
.kw-toast { position: absolute; z-index: 3; top: 12px; left: 50%; transform: translate(-50%, -6px); max-width: calc(100% - 32px); display: flex; align-items: baseline; gap: 10px; padding: 7px 12px 7px 14px; border: 1px solid var(--kw-line); border-radius: 2px; background: rgba(255,253,249,.97); box-shadow: 0 12px 26px -16px rgba(27,26,23,.4); color: var(--kw-sub); font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s; }
.kw-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.kw-toast b { font: 400 17px/1 var(--kw-en); color: var(--kw-ink); }
.kw-toast .kw-toast-cn { overflow: hidden; text-overflow: ellipsis; }
.kw-toast .kw-toast-tag { flex: none; display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--c, #5C6E3E); font-weight: 600; }
.kw-toast .kw-toast-tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c, #5C6E3E); }

/* ---------- 本组回顾 ---------- */
.kw-recap, .kw-recap-bar, .kw-relearn-badge { display: none; }
.kw-stage[data-view="recap"] .kw-recap { display: block; }
.kw-stage[data-view="recap"] .kw-listen, .kw-stage[data-view="recap"] .kw-hints, .kw-stage[data-view="recap"] .kw-rate { display: none !important; }
.kw-stage[data-view="recap"]:not(.is-recap-detail) .kw-card-host { display: none; }
.kw-stage[data-view="recap"]:not(.is-recap-detail) .kw-body { display: flex; flex-direction: column; justify-content: center; }
.kw-stage[data-view="recap"] .kw-recap-bar { display: flex; flex: none; justify-content: flex-end; padding: 12px 20px 14px; border-top: 1px solid var(--kw-hair); background: #FBF8F2; }
.kw-recap-continue { min-height: 56px; min-width: 280px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--kw-uline); border-radius: 2px; background: var(--kw-sheet); font: 600 16px/1 var(--kw-ui); letter-spacing: .1em; cursor: pointer; touch-action: manipulation; }
@media (hover: hover) { .kw-recap-continue:hover { border-color: var(--kw-ink); background: #FBF8F2; } }
.kw-recap-head { text-align: center; margin: 0 0 22px; }
.kw-recap-kicker { margin: 0 0 8px; font: 500 12px/1 var(--kw-ui); letter-spacing: .22em; color: var(--kw-muted); }
.kw-recap-title { margin: 0; font: 600 22px/1.35 var(--kw-ui); letter-spacing: .04em; color: var(--kw-ink); }
.kw-recap-sub { margin: 8px 0 0; font-size: 14px; color: var(--kw-muted); }
.kw-recap-list { list-style: none; margin: 0 auto; padding: 0; width: 100%; max-width: 860px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; border-top: 1px solid var(--kw-hair); }
.kw-recap-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 64px; padding: 6px 2px; border-bottom: 1px solid var(--kw-hair); }
.kw-recap-row.is-forgot .kw-recap-word { color: var(--kw-unknown); }
.kw-recap-audio { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--kw-line); background: transparent; color: var(--kw-sub); display: grid; place-items: center; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kw-recap-audio svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.kw-recap-audio svg path:first-child { fill: currentColor; }
@media (hover: hover) { .kw-recap-audio:hover { border-color: var(--kw-ink); color: var(--kw-ink); } }
.kw .kw-recap-word { display: flex; align-items: baseline; gap: 10px; min-width: 0; padding: 6px 0; border: 0; background: transparent; text-align: left; font: 400 25px/1.2 var(--kw-en); color: var(--kw-ink); cursor: pointer; overflow-wrap: anywhere; -webkit-tap-highlight-color: transparent; }
.kw-recap-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--c); flex: none; transform: translateY(-4px); }
@media (hover: hover) { .kw .kw-recap-word:hover { text-decoration: underline 1px var(--kw-uline); text-underline-offset: 6px; } }
.kw-recap-forgot { min-height: 34px; padding: 0 12px; border-radius: 2px; border: 1px solid var(--kw-hair); color: var(--kw-muted); background: transparent; font: 500 13.5px/1 var(--kw-ui); letter-spacing: .06em; white-space: nowrap; cursor: pointer; touch-action: manipulation; }
.kw-recap-forgot::before { content: "↺ "; }
@media (hover: hover) { .kw-recap-forgot:not([aria-pressed="true"]):hover { background: rgba(154,79,67,.06); border-color: #9A4F43; color: #9A4F43; } }
.kw-recap-forgot[aria-pressed="true"] { border-color: #9A4F43; background: #9A4F43; color: #fff; }
.kw-recap-forgot[aria-pressed="true"]::before { content: "✓ "; }
.kw-recap-note { margin: 14px 0 0; min-height: 1.4em; text-align: center; font-size: 13px; color: var(--kw-unknown); }
.kw-recap-detail-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; margin: 0 0 18px; padding: 0 0 14px; border-bottom: 1px solid var(--kw-hair); }
.kw-recap-detail-bar .kw-recap-spacer { flex: 1; }
.kw-recap-detail-bar .kw-btn { min-height: 38px; padding: 0 14px; font-size: 14px; }
.kw-recap-detail-bar .kw-recap-forgot { min-height: 38px; }
/* “忘了”的已达标词：稍后再认一遍，不计分 */
.kw-stage.is-relearn .kw-relearn-badge { display: block; position: absolute; z-index: 2; top: 14px; left: 18px; margin: 0; padding: 5px 10px; border: 1px solid rgba(154,79,67,.35); border-radius: 2px; font: 500 12px/1 var(--kw-ui); letter-spacing: .12em; color: var(--kw-unknown); background: rgba(154,79,67,.06); }

/* 完成页：同一套书卷样式 */
body.kw-page .complete-panel { border-radius: 3px; background: var(--kw-sheet); border: 1px solid #E6DFD2; box-shadow: 0 24px 48px -40px rgba(27,26,23,.3); font-family: var(--kw-ui); }
body.kw-page .checkin-badge { width: 48px; height: 48px; background: transparent; border: 1px solid var(--kw-known); color: var(--kw-known); box-shadow: none; font-size: 22px; }
body.kw-page .checkin-title h2, body.kw-page #challengePanel h2 { font: 600 clamp(24px, 3.4vw, 34px)/1.25 var(--kw-ui); letter-spacing: .04em; color: var(--kw-ink); }
body.kw-page .checkin-title p, body.kw-page #challengeText { font-weight: 400; color: var(--kw-muted); }
body.kw-page .checkin-streak, body.kw-page .checkin-stat { border-radius: 2px; background: transparent; border-color: var(--kw-hair); }
body.kw-page .checkin-streak strong { font: 400 60px/1 var(--kw-en); color: var(--kw-ink); }
body.kw-page .checkin-stat strong { font: 400 30px/1.15 var(--kw-en); color: var(--kw-ink); }
body.kw-page .checkin-streak span, body.kw-page .checkin-stat span { font-weight: 500; color: var(--kw-muted); }
body.kw-page .complete-panel .ghost-btn { min-height: 44px; padding: 0 18px; border-radius: 2px; border-color: var(--kw-line); background: var(--kw-sheet); color: var(--kw-body); font: 500 15px/1 var(--kw-ui); letter-spacing: .04em; }
@media (hover: hover) { body.kw-page .complete-panel .ghost-btn:hover { border-color: var(--kw-ink); } }

@media (min-width: 761px) and (max-width: 1099.98px) {
  body.kw-page nav.course-topbar .topbar-inner { padding: 7px 20px; gap: 12px; }
  body.kw-page nav.course-topbar .gk-search-trigger { flex-basis: 150px; width: 150px; }
  .kw-top { gap: 12px; padding-left: 14px; }
  .kw-head-sync, .kw-head-count small { display: none; }
}

/* ---------- 电脑：拷问台占满窗口剩余高度，卡片里自己滚动 ---------- */
@media (min-width: 900px) and (min-height: 600px) {
  .kw-stage { height: calc(100vh - var(--kw-offset, 160px)); height: calc(100dvh - var(--kw-offset, 160px)); min-height: 520px; }
}
@media (min-width: 900px) and (max-height: 599.98px) {
  .kw-body { overflow: visible; }
  .kw-more { display: none; }
}

/* ---------- 手机顶栏：主页图标 · 今日拷问 · 细进度条 · 达标数 · 词表 · 搜索，一行 ---------- */
@media (max-width: 760px) {
  body.kw-page nav.course-topbar .topbar-inner { min-height: 50px; padding: 6px 12px !important; gap: 10px !important; }
  body.kw-page nav.course-topbar .course-home-link { width: 40px; height: 40px; min-height: 40px !important; min-width: 40px !important; padding: 0 !important; display: grid !important; place-items: center; border: 1px solid var(--kw-line) !important; border-radius: 2px !important; background: var(--kw-sheet) !important; box-shadow: none !important; }
  body.kw-page nav.course-topbar .course-home-link > span { display: none !important; }
  body.kw-page nav.course-topbar .course-home-link::before { content: ""; width: 17px; height: 17px; background: var(--kw-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 11 12 4l8.5 7'/%3E%3Cpath d='M6 9.5V20h12V9.5'/%3E%3Cpath d='M10 20v-5.5h4V20'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 11 12 4l8.5 7'/%3E%3Cpath d='M6 9.5V20h12V9.5'/%3E%3Cpath d='M10 20v-5.5h4V20'/%3E%3C/svg%3E") center / contain no-repeat; }
  body.kw-page nav.course-topbar .gk-search-trigger { flex: 0 0 40px !important; width: 40px !important; min-width: 40px !important; height: 40px; min-height: 0; border-radius: 2px !important; border-color: var(--kw-line) !important; margin-left: 0 !important; background-color: var(--kw-sheet) !important; background-size: 17px 17px !important; }
  .kw-top { gap: 10px; padding-left: 0; border-left: 0; }
  body.kw-page .kw-page-title { font-size: 15px; letter-spacing: .04em; }
  body.kw-page .kw-top .day-progress { min-width: 28px; }
  body.kw-page .kw-top .day-progress-label, .kw-head-count small, .kw-head-sync { display: none; }
  .kw-head-count { font-size: 14px; }
  .kw-head-btn { min-height: 40px; padding: 0 12px; font-size: 13.5px; letter-spacing: .04em; }
  body.kw-page nav.course-topbar .topbar-inner { min-height: 52px; }
}

/* ---------- 手机：词卡铺满屏宽，评分条贴底 ---------- */
@media (max-width: 899.98px) {
  body.kw-page .review-page { width: 100%; padding: 0 0 calc(92px + env(safe-area-inset-bottom)); }
  body.kw-page #statusLine { bottom: calc(92px + env(safe-area-inset-bottom)); }
  body.kw-page #gk3500SignOutButton { bottom: calc(94px + env(safe-area-inset-bottom)) !important; opacity: .7; }
  body.kw-page #runnerHost.floating-card-host { border-radius: 0; }
  .kw-stage { border-width: 0 0 1px; border-radius: 0; box-shadow: none; overflow: visible; min-height: calc(100svh - var(--kw-offset, 120px) - 92px); }
  .kw-body { padding: 16px 16px 22px; overflow: visible; }
  .kw-stage[data-stage="0"] .kw-body, .kw-stage[data-stage="1"] .kw-body, .kw-stage[data-stage="2"] .kw-body { min-height: inherit; display: flex; flex-direction: column; justify-content: center; }
  .kw-r .kw-key, .kw-btn .kw-key, .kw-next .kw-key, .kw-recap-continue .kw-key { display: none !important; }
  .kw-more { display: none; }
  .kw-listen-title { font-size: 22px; }
  .kw-listen-sub { font-size: 13.5px; }
  .kw-play { width: 64px; height: 64px; }
  .kw-play svg { width: 26px; height: 26px; }
  /* 评分条：一行四个；选了半熟/陌生后，四个缩成小签、右边“下一词”，仍是一行 */
  .kw-rate, .kw-stage[data-view="recap"] .kw-recap-bar { position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; padding: 8px calc(10px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(10px + env(safe-area-inset-left)); border-top: 1px solid var(--kw-line); background: rgba(251,248,242,.97); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
  .kw-rate { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  .kw-r { flex-direction: column; gap: 4px; min-height: 64px; padding: 8px 2px 7px; }
  .kw-r-icon, .kw-r-icon svg { width: 19px; height: 19px; }
  .kw-r-text { align-items: center; gap: 2px; }
  .kw-r-text b { font-size: 14.5px; letter-spacing: .08em; }
  .kw-r-text small { font-size: 10.5px; letter-spacing: 0; }
  .kw-stage.is-pending .kw-rate { grid-template-columns: repeat(4, 50px) minmax(0, 1fr); }
  .kw-stage.is-pending:not(.has-easy) .kw-rate { grid-template-columns: repeat(3, 50px) minmax(0, 1fr); }
  .kw-stage.is-pending .kw-r { min-height: 52px; padding: 6px 0 5px; gap: 3px; }
  .kw-stage.is-pending .kw-r-icon, .kw-stage.is-pending .kw-r-icon svg { width: 16px; height: 16px; }
  .kw-stage.is-pending .kw-r-text b { font-size: 12px; letter-spacing: .02em; }
  .kw-stage.is-pending .kw-next { min-height: 52px; font-size: 16px; }
  .kw-recap-continue { flex: 1; min-width: 0; min-height: 54px; }
  .kw-toast { top: 8px; font-size: 12.5px; }
  .kw-toast b { font-size: 16px; }
  .kw-recap-head { margin-bottom: 14px; }
  .kw-recap-title { font-size: 21px; }
  .kw-recap-sub { font-size: 13px; }
  .kw-recap-list { grid-template-columns: minmax(0, 1fr); }
  .kw-recap-row { min-height: 56px; }
  .kw .kw-recap-word { font-size: 23px; }
  .kw-recap-detail-bar { margin-bottom: 12px; padding-bottom: 10px; }
  .kw-recap-detail-bar .kw-btn, .kw-recap-detail-bar .kw-recap-forgot { min-height: 34px; padding: 0 10px; font-size: 13px; }
  .kw-stage.is-relearn .kw-relearn-badge { top: 10px; left: 12px; }
}
@media (max-width: 359.98px) {
  body.kw-page .kw-page-title { display: none; }
  .kw-stage.is-pending .kw-rate { grid-template-columns: repeat(4, 46px) minmax(0, 1fr); }
  .kw-r-text small { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .kw-play.is-playing::after { animation: none; }
  .kw-stage *, .kw-toast { transition: none !important; }
}
