.translation-training-page{position:relative;isolation:isolate;--translation-training-bg:url('../assets/translation/backgrounds/translation-hsk-shenzhen.webp');--translation-training-overlay:linear-gradient(180deg,rgba(255,247,242,.90),rgba(255,250,246,.84) 34%,rgba(255,250,247,.90));background:var(--translation-training-overlay),var(--translation-training-bg);background-size:cover;background-position:center;background-attachment:fixed}
body.traditional .translation-training-page{--translation-training-bg:url('../assets/translation/backgrounds/translation-tocfl-palace.webp');--translation-training-overlay:linear-gradient(180deg,rgba(244,251,255,.90),rgba(244,250,255,.84) 34%,rgba(248,252,255,.90))}
.translation-training-page::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,.06) 35%,rgba(255,255,255,.14));pointer-events:none;z-index:0}
.translation-training-page>*{position:relative;z-index:1}
.translation-training-shell{display:grid;gap:14px}
.translation-training-hero{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:150px;padding:24px 30px;border:1px solid var(--panel-border);border-radius:24px;background:linear-gradient(105deg,rgba(255,250,244,.90),rgba(255,245,235,.72)),var(--translation-training-bg);background-size:cover;background-position:center 48%;box-shadow:var(--theme-shadow);overflow:hidden}
body.traditional .translation-training-hero{background:linear-gradient(105deg,rgba(248,253,255,.92),rgba(237,248,255,.76)),var(--translation-training-bg);background-size:cover;background-position:center 48%}
.translation-training-hero::after{content:'译';position:absolute;right:28%;top:-46px;font:900 180px/1 Georgia,'Noto Serif SC',serif;color:var(--theme-accent);opacity:.035;pointer-events:none}
.translation-training-hero h2{margin:0;color:var(--theme-deep);font:900 clamp(30px,3.6vw,48px)/1.05 Georgia,'Noto Serif SC',serif}.translation-training-hero p{max-width:760px;margin:8px 0 0;color:var(--theme-muted);font-size:13px;line-height:1.55}
.translation-training-hero-badge{position:relative;z-index:1;display:grid;grid-template-columns:52px auto;gap:2px 12px;align-items:center;min-width:230px;padding:13px 16px;border:1px solid var(--panel-border);border-radius:18px;background:rgba(255,255,255,.8);backdrop-filter:blur(10px);box-shadow:0 8px 22px rgba(0,0,0,.07)}
.translation-training-hero-badge>span{grid-row:1/3;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--theme-accent);color:#fff;font:900 27px/1 Georgia,'Noto Serif SC',serif}.translation-training-hero-badge strong{font-size:12px;color:var(--theme-deep)}.translation-training-hero-badge small{font-size:9px;color:var(--theme-muted)}
.translation-training-toolbar{padding:14px 16px!important;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center}
.translation-track-switch,.translation-level-tabs{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.translation-track-switch button,.translation-level-tabs button{border:1px solid var(--panel-border);border-radius:12px;padding:9px 12px;background:rgba(255,255,255,.78);color:var(--theme-muted);font-weight:850;font-size:10px;cursor:pointer}.translation-track-switch button.active,.translation-level-tabs button.active{background:var(--theme-accent);color:#fff;border-color:transparent;box-shadow:0 6px 15px rgba(128,26,18,.16)}
.translation-training-stats{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}.translation-training-stats span{padding:7px 9px;border-radius:10px;background:var(--theme-soft);color:var(--theme-muted);font-size:8px}.translation-training-stats strong{display:block;color:var(--theme-deep);font-size:13px}
.translation-training-layout{display:grid;grid-template-columns:minmax(220px,.34fr) minmax(0,1fr);gap:14px;align-items:start}.translation-task-list{padding:12px!important;position:sticky;top:14px;max-height:calc(100vh - 30px);overflow:auto}.translation-task-list>header{display:block!important;padding:6px 7px 12px!important;margin:0!important;border:0!important;background:none!important;box-shadow:none!important}.translation-task-list>header span{display:block;color:var(--theme-accent);font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.translation-task-list>header strong{display:block;margin-top:2px;color:var(--theme-deep);font-size:17px}.translation-task-list>div{display:grid;gap:7px}.translation-task-list button{display:grid;grid-template-columns:32px 1fr 12px;gap:9px;align-items:center;width:100%;padding:10px;border:1px solid transparent;border-radius:13px;background:rgba(255,255,255,.64);color:var(--theme-ink);text-align:left;cursor:pointer}.translation-task-list button:hover{border-color:var(--panel-border);background:#fff}.translation-task-list button.active{border-color:color-mix(in srgb,var(--theme-accent) 32%,transparent);background:var(--theme-soft)}.translation-task-index{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:rgba(0,0,0,.045);color:var(--theme-deep);font-weight:900}.translation-task-list button strong,.translation-task-list button small{display:block}.translation-task-list button strong{font-size:10px}.translation-task-list button small{margin-top:2px;color:var(--theme-muted);font-size:8px}.translation-task-list button i{width:9px;height:9px;border-radius:50%;background:rgba(0,0,0,.12)}.translation-task-list button i.started{background:#f3a52b}.translation-task-list button i.done{background:#43a568}
.translation-training-workspace{padding:20px!important;min-height:620px}.translation-source-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.translation-source-head h3{margin:1px 0 0;color:var(--theme-deep);font:900 25px/1.1 Georgia,'Noto Serif SC',serif}.translation-audio-button{border:1px solid var(--panel-border);border-radius:12px;padding:9px 12px;background:var(--theme-soft);color:var(--theme-deep);font-weight:850;cursor:pointer}.translation-source-card{position:relative;margin:15px 0 16px;padding:28px 58px 28px 28px;border:1px solid color-mix(in srgb,var(--theme-accent) 22%,var(--panel-border));border-radius:20px;background:linear-gradient(135deg,rgba(255,255,255,.96),var(--theme-soft));overflow:hidden}.translation-source-card p{position:relative;z-index:1;margin:0;color:var(--theme-deep);font:800 clamp(24px,2.4vw,34px)/1.55 Georgia,'Noto Serif SC',serif;letter-spacing:.015em}.translation-source-seal{position:absolute;right:20px;bottom:-22px;color:var(--theme-accent);opacity:.07;font:900 105px/1 Georgia,'Noto Serif SC',serif}
.translation-answer-field{display:grid;gap:7px}.translation-answer-field>span{color:var(--theme-deep);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.translation-answer-field textarea{width:100%;min-height:126px;resize:vertical;padding:15px 16px;border:1px solid var(--panel-border);border-radius:16px;background:rgba(255,255,255,.9);color:var(--theme-ink);font:500 15px/1.55 system-ui,sans-serif;outline:none}.translation-answer-field textarea:focus{border-color:var(--theme-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-accent) 12%,transparent)}.translation-answer-field small{color:var(--theme-muted);font-size:8px}.translation-training-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:12px}.translation-training-actions button{min-width:150px}
.translation-training-feedback{margin-top:16px}.translation-feedback-empty{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.56);border:1px dashed var(--panel-border)}.translation-feedback-empty>span{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--theme-soft);color:var(--theme-accent);font:900 22px/1 Georgia,'Noto Serif SC',serif}.translation-feedback-empty strong{display:block;color:var(--theme-deep);font-size:11px}.translation-feedback-empty p{margin:3px 0 0;color:var(--theme-muted);font-size:9px;line-height:1.45}
.translation-feedback-card{display:grid;grid-template-columns:112px 1fr;gap:18px;padding:16px;border:1px solid var(--panel-border);border-radius:18px;background:rgba(255,255,255,.8)}.translation-score-ring{--score:0;align-self:start;width:104px;height:104px;border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle closest-side,#fff 78%,transparent 79% 99%),conic-gradient(var(--theme-accent) calc(var(--score)*1%),rgba(0,0,0,.08) 0);box-shadow:0 6px 18px rgba(0,0,0,.06)}.translation-score-ring strong{font-size:31px;line-height:1;color:var(--theme-deep)}.translation-score-ring span{font-size:8px;color:var(--theme-muted)}.translation-feedback-main header{display:block!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}.translation-feedback-main header span{font-size:9px;font-weight:900;color:var(--theme-accent);text-transform:uppercase}.translation-feedback-main header h4{margin:3px 0 11px;color:var(--theme-deep);font-size:13px}.translation-score-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.translation-score-grid>div{padding:9px;border-radius:12px;background:var(--theme-soft)}.translation-score-grid span,.translation-score-grid strong{display:block}.translation-score-grid span{font-size:8px;color:var(--theme-muted)}.translation-score-grid strong{margin:2px 0 5px;color:var(--theme-deep);font-size:12px}.translation-score-grid i{display:block;height:5px;border-radius:999px;background:rgba(0,0,0,.09);overflow:hidden}.translation-score-grid b{display:block;height:100%;border-radius:inherit;background:var(--theme-accent)}
.translation-concepts{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:10px}.translation-concepts>span{margin-right:2px;font-size:8px;font-weight:900;text-transform:uppercase}.translation-concepts em{font-style:normal;padding:4px 7px;border-radius:999px;font-size:8px}.translation-concepts.good>span{color:#297748}.translation-concepts.good em{background:#e8f6ec;color:#24683e}.translation-concepts.missing>span{color:#b4641b}.translation-concepts.missing em{background:#fff0d9;color:#8a501a}.translation-perfect-note{margin-top:10px;padding:8px 10px;border-radius:10px;background:#e8f6ec;color:#24683e;font-size:9px;font-weight:800}.translation-warning{margin:8px 0 0;padding:7px 9px;border-radius:10px;background:#fff4df;color:#87581b;font-size:9px}.translation-model-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.translation-model-box{margin-top:10px;padding:12px 14px;border-left:3px solid var(--theme-accent);border-radius:10px;background:var(--theme-soft)}.translation-model-box>span{display:block;font-size:8px;color:var(--theme-muted);font-weight:900;text-transform:uppercase}.translation-model-box p{margin:5px 0 0;color:var(--theme-deep);font-size:12px;line-height:1.5}.translation-model-box details{margin-top:7px}.translation-model-box summary{cursor:pointer;color:var(--theme-accent);font-size:9px;font-weight:800}
body.traditional .translation-training-page .translation-source-card{background:linear-gradient(135deg,rgba(255,255,255,.96),#eef9ff)}
@media(max-width:1100px){.translation-training-page{background-attachment:scroll}.translation-training-toolbar{grid-template-columns:1fr}.translation-training-stats{justify-content:flex-start}.translation-training-layout{grid-template-columns:200px minmax(0,1fr)}.translation-source-card p{font-size:24px}}
@media(max-width:780px){.translation-training-hero{min-height:118px;padding:18px}.translation-training-hero-badge{display:none}.translation-training-layout{grid-template-columns:1fr}.translation-task-list{position:relative;top:auto;max-height:none}.translation-task-list>div{display:flex;overflow-x:auto;padding-bottom:4px}.translation-task-list button{min-width:165px}.translation-training-workspace{min-height:0;padding:15px!important}.translation-source-card{padding:20px}.translation-source-card p{font-size:22px}.translation-feedback-card{grid-template-columns:1fr}.translation-score-ring{width:86px;height:86px}.translation-score-grid{grid-template-columns:1fr 1fr 1fr}.translation-model-actions,.translation-training-actions{flex-direction:column}.translation-model-actions button,.translation-training-actions button{width:100%}}
@media(max-width:520px){.translation-level-tabs{display:grid;grid-template-columns:repeat(3,1fr)}.translation-level-tabs button{padding:8px}.translation-score-grid{grid-template-columns:1fr}.translation-source-card p{font-size:20px}}
.translation-quality-note{margin-top:10px;padding:11px 13px;border:1px solid color-mix(in srgb,var(--theme-accent) 18%,var(--panel-border));border-radius:12px;background:linear-gradient(135deg,rgba(255,255,255,.86),var(--theme-soft));color:var(--theme-muted)}
.translation-quality-note>span{display:block;margin-bottom:4px;color:var(--theme-accent);font-size:8px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.translation-quality-note p{margin:0;color:var(--theme-ink);font-size:9px;line-height:1.5}.translation-quality-note p+p{margin-top:5px}