:root{--skill-listening:#3b82f6;--skill-speaking:#c7522a;--skill-reading:#3f8f5a;--skill-writing:#8b5cf6;--color-wrong:#c2410c;--color-wrong-soft:#fdecea}.skill-listening{--skill:var(--skill-listening)}.skill-speaking{--skill:var(--skill-speaking)}.skill-reading{--skill:var(--skill-reading)}.skill-writing{--skill:var(--skill-writing)}.pr-games[hidden],.pr-stage[hidden],.pr-overview[hidden]{display:none}.pr-actions{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.pr-select{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font:500 .8125rem var(--font-ui);border-radius:6px;max-width:100%;padding:.5rem .625rem}.btn-primary:disabled,.btn-ghost:disabled{opacity:.45;cursor:not-allowed}.pr-skills{grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;display:grid}.pr-skill{border:1px solid var(--color-border);background:var(--color-surface);border-radius:10px;grid-template-columns:1fr auto;align-items:baseline;gap:.375rem .5rem;padding:.75rem .875rem;display:grid}.pr-skill .progress-track{grid-column:1/-1}.pr-skill .progress-fill{background:var(--color-accent)}.pr-skill.is-full{border-color:var(--color-done);background:var(--color-done-soft)}.pr-skill.is-full .progress-fill{background:var(--color-done)}.pr-skill.is-na{opacity:.5}.pr-skill-name{color:var(--color-text-muted);font-size:.75rem;font-weight:600}.pr-skill-value{font-family:var(--font-display);font-size:1.375rem;font-weight:700;line-height:1}.pr-pass{color:var(--color-text-muted);flex-wrap:wrap;align-items:center;gap:.375rem;margin:.75rem 0 0;font-size:.8125rem;display:flex}.pr-pass.is-passed{color:var(--color-done);font-weight:600}.pr-pass-link{color:var(--color-primary);margin-left:auto;font-weight:600;text-decoration:none}.pr-empty{text-align:center;color:var(--color-text-muted);padding:2rem}.pr-games{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:.625rem;margin-top:1.25rem;display:grid}.pr-game{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font-family:var(--font-ui);text-align:left;cursor:pointer;border-radius:10px;align-items:flex-start;gap:.75rem;padding:.875rem;transition:border-color .15s,box-shadow .15s,transform .15s;display:flex}.pr-game:hover:not(:disabled){border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 4px 14px #2d331914}.pr-game.is-recommended{border-color:var(--color-primary);background:var(--color-primary-soft)}.pr-game.is-disabled{opacity:.5;cursor:not-allowed}.pr-game-icon{width:2.5rem;height:2.5rem;color:var(--skill);background:color-mix(in srgb, var(--skill) 12%, white);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.pr-game-text{flex-direction:column;gap:.1875rem;min-width:0;display:flex}.pr-game-name{flex-wrap:wrap;align-items:center;gap:.375rem;font-size:.9375rem;font-weight:700;display:flex}.pr-tag{letter-spacing:.04em;text-transform:uppercase;background:var(--color-primary);color:#fff;border-radius:999px;padding:.125rem .4375rem;font-size:.625rem;font-weight:700}.pr-game-desc{color:var(--color-text-muted);font-size:.8125rem;line-height:1.4}.pr-game-meta{align-items:center;gap:.5rem;margin-top:.25rem;font-size:.6875rem;font-weight:600;display:flex}.pr-skill-tag{color:var(--skill)}.pr-best{color:var(--color-text-muted)}.pr-stage{border:1px solid var(--color-border);background:var(--color-surface);scroll-margin-top:calc(var(--header-h) + 1rem);border-radius:12px;padding:1rem 1.25rem 1.5rem}.pr-stage-head{align-items:center;gap:.75rem;display:flex}.pr-stage-title{font-family:var(--font-display);font-size:1.125rem}.pr-counter{color:var(--color-text-muted);margin-left:auto;font-size:.8125rem;font-weight:600}.pr-close{color:var(--color-text-muted);cursor:pointer;background:0 0;border:0;border-radius:6px;padding:.375rem;display:flex}.pr-close:hover{background:var(--color-surface-muted);color:var(--color-text)}.pr-stage-track{margin:.75rem 0 1.25rem}.pr-stage-track .progress-fill{background:var(--color-primary)}.pr-body{max-width:720px;margin:0 auto}.pr-prompt{letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-muted);margin:0 0 .75rem;font-size:.8125rem;font-weight:600}.pr-sentence{font-family:var(--font-reading);margin:0 0 .5rem;font-size:1.5rem;line-height:1.5}.pr-meaning{font-family:var(--font-reading);margin:0 0 1rem;font-size:1.375rem;line-height:1.45}.pr-hint{color:var(--color-text-muted);margin:0 0 1rem;font-size:.9375rem}.pr-blank{border-bottom:2px solid var(--color-primary);min-width:3em;color:var(--color-primary);text-align:center;margin:0 .125em;font-weight:600;display:inline-block}.pr-blank.is-correct{color:var(--color-done);border-color:var(--color-done)}.pr-blank.is-wrong{color:var(--color-wrong);border-color:var(--color-wrong)}.pr-audio-row{align-items:center;gap:.75rem;margin:.25rem 0 1.25rem;display:flex}.pr-audio{background:var(--color-primary);color:#fff;cursor:pointer;border:0;border-radius:50%;justify-content:center;align-items:center;width:3.25rem;height:3.25rem;display:inline-flex;box-shadow:0 4px 12px #c7522a40}.pr-audio:hover{background:var(--color-primary-light)}.pr-audio-slow{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-muted);font:600 .75rem var(--font-ui);cursor:pointer;border-radius:999px;align-items:center;gap:.3125rem;padding:.4375rem .75rem;display:inline-flex}.pr-audio-slow:hover{color:var(--color-primary);border-color:var(--color-primary)}.pr-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}.pr-choice{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font:500 .9375rem var(--font-ui);text-align:left;cursor:pointer;border-bottom-width:2px;border-radius:10px;align-items:center;gap:.625rem;padding:.75rem .875rem;display:flex}.pr-choice:hover:not(:disabled){border-color:var(--color-primary)}.pr-choice:disabled{cursor:default}.pr-choice-key{border:1px solid var(--color-border);width:1.375rem;height:1.375rem;color:var(--color-text-muted);border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;font-size:.6875rem;font-weight:700;display:flex}.pr-choice.is-correct{border-color:var(--color-done);background:var(--color-done-soft)}.pr-choice.is-wrong{border-color:var(--color-wrong);background:var(--color-wrong-soft)}.pr-feedback{background:var(--color-surface-muted);border-radius:10px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-top:1.25rem;padding:.875rem 1rem;animation:.2s pr-rise;display:flex}.pr-feedback.is-correct{background:var(--color-done-soft)}.pr-feedback.is-wrong{background:var(--color-wrong-soft)}.pr-feedback-body{flex-direction:column;flex:1;gap:.375rem;min-width:0;display:flex}.pr-feedback.is-correct strong{color:var(--color-done)}.pr-feedback.is-wrong strong{color:var(--color-wrong)}.pr-answer{flex-direction:column;display:flex}.pr-answer-text{font-family:var(--font-reading);font-size:1.0625rem;font-weight:600}.pr-answer-meaning{color:var(--color-text-muted);font-size:.8125rem}.pr-diff{font-family:var(--font-reading);flex-wrap:wrap;gap:.25rem .375rem;margin:0;font-size:1.125rem;display:flex}.pr-diff .hit{color:var(--color-done)}.pr-diff .miss{color:var(--color-wrong);text-underline-offset:3px;text-decoration:underline wavy}.pr-score-line{color:var(--color-text-muted);margin:0;font-size:.8125rem}.pr-build-line{border:2px dashed var(--color-border);border-radius:10px;flex-wrap:wrap;gap:.375rem;min-height:3.25rem;padding:.5rem;display:flex}.pr-build-line.is-correct{border-color:var(--color-done);background:var(--color-done-soft);border-style:solid}.pr-build-line.is-wrong{border-color:var(--color-wrong);background:var(--color-wrong-soft);border-style:solid}.pr-build-bank{flex-wrap:wrap;gap:.375rem;margin:1rem 0;display:flex}.pr-tile{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font:500 1rem var(--font-ui);cursor:pointer;border-bottom-width:2px;border-radius:8px;padding:.4375rem .75rem}.pr-tile:hover:not(:disabled){border-color:var(--color-primary)}.pr-tile.is-used{visibility:hidden}.pr-tile.is-placed{background:var(--color-primary-soft)}.pr-input-row{gap:.5rem;display:flex}.pr-input{border:1px solid var(--color-border);background:var(--color-surface);min-width:0;color:var(--color-text);font:1.125rem var(--font-reading);border-radius:8px;flex:1;padding:.75rem .875rem}.pr-input:focus{outline:2px solid color-mix(in srgb, var(--color-primary) 35%, transparent);border-color:var(--color-primary)}.pr-match{grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:.75rem;display:grid}.pr-match-col{flex-direction:column;gap:.5rem;display:flex}.pr-match-card{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font:.875rem/1.4 var(--font-ui);text-align:left;cursor:pointer;border-bottom-width:2px;border-radius:8px;flex:1;padding:.625rem .75rem}.pr-match-card.is-word{font-family:var(--font-display);font-size:1rem;font-weight:700}.pr-match-card:hover:not(:disabled){border-color:var(--color-primary)}.pr-match-card.is-selected{border-color:var(--color-primary);background:var(--color-primary-soft)}.pr-match-card.is-matched{border-color:var(--color-done);background:var(--color-done-soft);color:var(--color-done);opacity:.7;cursor:default}.pr-match-card.is-shake{border-color:var(--color-wrong);animation:.35s pr-shake}.pr-speak-text{font-weight:600}.pr-speak{margin-top:.5rem}.pr-record-row{align-items:center;gap:1rem;display:flex}.pr-record{background:var(--color-primary);color:#fff;font:700 .9375rem var(--font-ui);cursor:pointer;border:0;border-radius:999px;align-items:center;gap:.5rem;padding:.75rem 1.25rem;display:inline-flex;box-shadow:0 4px 12px #c7522a40}.pr-record:disabled{opacity:.5;cursor:wait}.pr-record.is-recording{background:var(--color-wrong);animation:1.2s ease-in-out infinite pr-pulse}.pr-meter{background:var(--color-border);border-radius:999px;flex:1;max-width:200px;height:6px;overflow:hidden}.pr-meter span{background:var(--color-done);width:0;height:100%;transition:width 80ms linear;display:block}.pr-speak-status{color:var(--color-text-muted);margin:.625rem 0;font-size:.875rem}.pr-speak-result{flex-direction:column;gap:.5rem;margin-bottom:1rem;display:flex}.pr-speak-score{color:var(--color-text-muted);font-size:.875rem}.pr-speak-score strong{font-family:var(--font-display);font-size:2rem}.pr-speak-score.is-correct strong{color:var(--color-done)}.pr-speak-score.is-wrong strong{color:var(--color-wrong)}.pr-heard{color:var(--color-text-muted);margin:0;font-size:.875rem}.pr-heard span{font-weight:600}.pr-error{color:var(--color-wrong);font-size:.875rem}.pr-model{border:1px solid var(--color-border);background:var(--color-surface-muted);border-radius:10px;flex-direction:column;gap:.625rem;margin-bottom:1rem;padding:1rem;display:flex}.pr-model-title{margin:0;font-weight:700}.pr-model-note,.pr-load-status{color:var(--color-text-muted);margin:0;font-size:.8125rem}.pr-load-track .progress-fill{background:var(--color-primary)}.pr-result{text-align:center;flex-direction:column;align-items:center;gap:.75rem;display:flex}.pr-passed-banner{background:var(--color-done);color:#fff;border-radius:999px;align-items:center;gap:.5rem;padding:.625rem 1rem;font-weight:700;animation:.3s pr-rise;display:inline-flex}.pr-result-score strong{font-family:var(--font-display);font-size:3.5rem;line-height:1}.pr-result-score span{color:var(--color-text-muted)}.pr-result-score.is-good strong{color:var(--color-done)}.pr-result-score.is-ok strong{color:var(--level-3)}.pr-result-score.is-low strong{color:var(--color-wrong)}.pr-result-line{color:var(--color-text-muted);margin:0}.pr-result-wrong{text-align:left;background:var(--color-surface-muted);border-radius:10px;width:100%;padding:.75rem 1rem}.pr-result-wrong-title{letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-muted);margin:0 0 .5rem;font-size:.75rem;font-weight:700}.pr-result-wrong ul{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.pr-result-wrong li{flex-direction:column;display:flex}.pr-result-actions{justify-content:center}@keyframes pr-rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes pr-shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@keyframes pr-pulse{0%,to{box-shadow:0 0 #c2410c66}50%{box-shadow:0 0 0 10px #c2410c00}}.pg-wrap{max-width:1080px;padding-top:1.5rem;padding-bottom:3rem}.pg-title{font-family:var(--font-display);margin:.5rem 0 0;font-size:clamp(1.625rem,3vw,2.125rem)}.pg-sub{color:var(--color-text-muted);margin:.25rem 0 1.25rem;font-size:.875rem}.pg-content{flex-direction:column;gap:1rem;display:flex}.pg-content[hidden]{display:none}.pg-stats{grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem;display:grid}.pg-stat{border:1px solid var(--color-border);background:var(--color-surface);border-radius:10px;flex-direction:column;gap:.25rem;padding:.875rem 1rem;display:flex}.pg-stat-label{color:var(--color-text-muted);font-size:.75rem;font-weight:600}.pg-stat-value{font-family:var(--font-display);font-size:1.625rem;line-height:1.1}.pg-stat-note{color:var(--color-text-muted);font-size:.75rem}.pg-goal{margin-top:.25rem;display:block}.pg-review{border:1px solid var(--color-primary);background:var(--color-primary-soft);border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.25rem;display:flex}.pg-review-text{flex-direction:column;gap:.125rem;display:flex}.pg-review-text strong{font-family:var(--font-display);font-size:1.25rem}.pg-review-text span{color:var(--color-text-muted);font-size:.875rem}.pg-two{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:1rem;display:grid}.pg-card{border:1px solid var(--color-border);background:var(--color-surface);border-radius:12px;padding:1rem 1.25rem}.pg-h2{font-family:var(--font-display);margin:0 0 .875rem;font-size:1.125rem}.pg-note{color:var(--color-text-muted);margin:.75rem 0 0;font-size:.8125rem;line-height:1.5}.pg-card .pr-skills{grid-template-columns:repeat(2,minmax(0,1fr))}.pg-bars{align-items:flex-end;gap:.25rem;height:140px;display:flex}.pg-bar{flex-direction:column;flex:1;align-items:center;gap:.25rem;min-width:0;height:100%;display:flex}.pg-bar-value{color:var(--color-text-muted);min-height:.75rem;font-size:.625rem;font-weight:600}.pg-bar-col{flex:1;align-items:flex-end;width:100%;max-width:28px;display:flex}.pg-bar-fill{background:var(--color-accent);border-radius:4px 4px 2px 2px;align-items:flex-end;width:100%;min-height:2px;display:flex;position:relative}.pg-bar-fill-2{border-radius:inherit;background:var(--color-done);width:100%}.pg-bar-label{color:var(--color-text-muted);white-space:nowrap;font-size:.6875rem}.pg-legend{color:var(--color-text-muted);align-items:center;gap:.375rem;margin:.625rem 0 0;font-size:.75rem;display:flex}.pg-legend .dot{background:var(--color-accent);border-radius:2px;width:8px;height:8px}.pg-legend .dot-2{background:var(--color-done);margin-left:.5rem}.pg-lessons{flex-direction:column;max-height:420px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.pg-lesson{color:inherit;border-radius:6px;align-items:center;gap:.75rem;padding:.5rem .375rem;text-decoration:none;display:flex}.pg-lesson:hover{background:var(--color-surface-muted)}.pg-lesson-text{flex-direction:column;flex:1;min-width:0;display:flex}.pg-lesson-title{white-space:nowrap;text-overflow:ellipsis;font-size:.875rem;font-weight:600;overflow:hidden}.pg-lesson-sub{color:var(--color-text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.75rem;overflow:hidden}.pg-lesson-skills{gap:.1875rem;display:flex}.pg-mini{text-align:center;min-width:1.75rem;color:var(--skill);background:color-mix(in srgb, var(--skill) 10%, white);border-radius:4px;padding:.125rem .25rem;font-size:.6875rem;font-weight:700}.pg-mini.is-full{color:#fff;background:var(--skill)}.pg-passed{color:var(--color-done);align-items:center;gap:.25rem;font-size:.6875rem;font-weight:700;display:inline-flex}.pg-lesson-go{color:var(--color-text-muted)}.pg-mistakes{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.pg-mistake{align-items:flex-start;gap:.75rem;padding:.625rem 0;display:flex}.pg-mistake+.pg-mistake{border-top:1px solid var(--color-border)}.pg-mistake-play.pr-audio{width:1.875rem;height:1.875rem;box-shadow:none;flex-shrink:0}.pg-mistake-body{flex:1;min-width:0}.pg-mistake-body p{margin:0}.pg-mistake-text{font-family:var(--font-reading);font-size:1.0625rem;font-weight:600}.pg-mistake-meaning,.pg-mistake-given{color:var(--color-text-muted);font-size:.8125rem}.pg-mistake-given span{color:var(--color-wrong);font-weight:600}.pg-mistake-meta{color:var(--color-text-muted);white-space:nowrap;flex-direction:column;flex-shrink:0;align-items:flex-end;gap:.125rem;font-size:.75rem;display:flex}.pg-field{flex-wrap:wrap;align-items:center;gap:.75rem;padding:.5rem 0;display:flex}.pg-field>span:first-child{width:8rem;font-size:.875rem;font-weight:600}.pg-danger:hover{color:var(--color-wrong);border-color:var(--color-wrong)}.pg-data-status{color:var(--color-text-muted);font-size:.8125rem}.pg-empty{text-align:center;color:var(--color-text-muted);border:1px dashed var(--color-border);border-radius:12px;flex-direction:column;align-items:center;gap:1rem;padding:3rem 1rem;display:flex}@media (width<=900px){.pg-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.pg-two{grid-template-columns:minmax(0,1fr)}}@media (width<=640px){.pr-skills{grid-template-columns:repeat(2,minmax(0,1fr))}.pr-choices{grid-template-columns:minmax(0,1fr)}.pr-match{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:.5rem}.pr-stage{padding:.875rem .875rem 1.25rem}.pr-sentence{font-size:1.25rem}.pg-mistake{flex-wrap:wrap}.pg-mistake-meta{flex-flow:wrap;gap:.75rem;width:100%;padding-left:2.625rem}}.pr-blank-hint{letter-spacing:.08em;white-space:pre}.pg-feedback-link{color:var(--color-primary);margin-left:.5rem;font-weight:600;text-decoration:none}.pg-feedback{scroll-margin-top:calc(var(--header-h) + 1rem)}.pg-feedback-intro{margin:0 0 .75rem}.pg-feedback-text{width:100%;font:.9375rem/1.5 var(--font-ui);resize:vertical;box-sizing:border-box;margin-top:.25rem;display:block}.pg-feedback-actions{margin-top:.75rem}.pg-feedback-status a{color:var(--color-primary);font-weight:600}.pg-copy{margin-left:.25rem;padding:.25rem .625rem;font-size:.75rem}.pr-passed-wrap{flex-direction:column;align-items:center;gap:.75rem;display:flex}.pr-share{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.pr-pass+.pr-share,.pr-speak-result .pr-share{margin-top:.5rem}.pr-share-label{color:var(--color-text-muted);font-size:.875rem;font-weight:600}.pr-share-btn{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);cursor:pointer;border-radius:999px;padding:.375rem .875rem;font-size:.8125rem;font-weight:600;transition:border-color .15s,color .15s}.pr-share-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.pg-milestone{border:1px solid var(--color-done);background:var(--color-done-soft);border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem 1rem;padding:1rem 1.25rem;display:flex}.pg-milestone-title{color:var(--color-done);align-items:center;gap:.5rem;margin:0;font-weight:700;display:flex}.sc-holder{pointer-events:none;position:fixed;top:0;left:-10000px}.sc-card{box-sizing:border-box;color:#2d3319;background:radial-gradient(circle at 100% 0,#e8b17e73 0,#e8b17e00 42%),#fdfbf7;flex-direction:column;height:675px;padding:40px 40px 36px;font-family:DM Sans,system-ui,sans-serif;display:flex;position:relative;overflow:hidden}.sc-brand{align-items:center;gap:10px;font-family:Fraunces,serif;font-size:20px;font-weight:700;display:flex}.sc-logo{color:#fff;background:#c7522a;border-radius:10px;justify-content:center;align-items:center;width:34px;height:34px;font-family:DM Sans,sans-serif;font-size:14px;font-weight:700;display:inline-flex}.sc-body{flex-direction:column;flex:1;justify-content:center;gap:14px;display:flex}.sc-kicker{color:#3f8f5a;background:#e6f2ea;border-radius:999px;align-self:flex-start;align-items:center;gap:6px;margin:0;padding:6px 14px;font-size:15px;font-weight:700;display:inline-flex}.sc-headline{overflow-wrap:anywhere;margin:0;font-family:Fraunces,serif;font-size:44px;font-weight:700;line-height:1.15}.sc-detail{color:#6b7456;margin:0;font-size:19px;line-height:1.45}.sc-stats{grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:10px;margin-top:10px;display:grid}.sc-stat{background:#fff;border:1px solid #e8e5dc;border-radius:12px;flex-direction:column;gap:2px;padding:12px 14px;display:flex}.sc-stat strong{color:#c7522a;font-family:Fraunces,serif;font-size:26px;line-height:1.1}.sc-stat span{color:#6b7456;font-size:13px}.sc-foot{border-top:1px solid #e8e5dc;justify-content:space-between;align-items:center;gap:20px;padding-top:22px;display:flex}.sc-foot-text{color:#6b7456;flex-direction:column;gap:4px;font-size:14px;display:flex}.sc-foot-text strong{color:#2d3319;font-size:18px}.sc-host{color:#c7522a;font-weight:700}.sc-qr{background:#fff;border-radius:10px;flex:none;width:104px;height:104px;padding:8px}.sc-qr svg{width:100%;height:100%;display:block}