/* The sequence and result layer share the existing practice screen. */
.hanzi-training-modes{display:flex;gap:4px;padding:3px;background:var(--surface);border:1px solid var(--border);border-radius:12px;max-width:360px;margin:0 auto 8px}
.hanzi-training-modes button{flex:1;min-height:36px;border:0;border-radius:9px;background:transparent;color:var(--muted);font:inherit;font-size:13px;cursor:pointer}
.hanzi-training-modes button[aria-pressed=true]{background:var(--purple);color:#fff;box-shadow:0 2px 6px #30254918}
.hanzi-learning-progress{max-width:360px;margin:0 auto 8px;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:20px;color:var(--muted);font-size:12px}
.hanzi-stage-steps{display:flex;gap:4px;flex:none}
.hanzi-stage-steps i{width:12px;height:5px;border-radius:4px;background:var(--border)}
.hanzi-stage-steps .is-current{background:var(--purple)}
.hanzi-stage-steps .is-done{background:var(--success)}
.dictionary-view .hanzi-feedback{height:39px;min-height:39px;overflow:hidden;margin:6px 0;font-size:12px;line-height:1.5}
.dictionary-view .hanzi-pagination,.dictionary-view .is-complete .hanzi-pagination{margin-top:8px;border-radius:0;padding:10px 0 calc(10px + env(safe-area-inset-bottom));background:var(--paper)}
.hanzi-result-dialog{width:min(360px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:0;border:1px solid var(--border);border-radius:22px;background:var(--paper);color:var(--ink);box-shadow:0 24px 80px #15102240;overflow:visible}
.hanzi-result-dialog::backdrop{background:#1e193c55;backdrop-filter:blur(3px)}
.hanzi-result-dialog[open]{animation:hanzi-result-in .25s ease-out}
.hanzi-result-dialog .hanzi-results{position:relative;z-index:1;max-height:calc(100dvh - 26px);overflow:auto;overscroll-behavior:contain;border-radius:inherit;padding:20px;margin:0;border:0;background:var(--paper)}
.hanzi-result-dialog[open] .hanzi-results{animation:hanzi-card-pop .5s cubic-bezier(.16,1,.3,1)}
.hanzi-result-heading{position:relative;text-align:center;margin-bottom:18px}
.hanzi-result-heading>#hanzi-result-icon{position:relative;isolation:isolate;display:grid;place-items:center;width:54px;height:54px;margin:0 auto 10px;border-radius:50%;background:var(--lavender);color:var(--success);font-size:30px;line-height:1}
.hanzi-result-kicker{display:none}
.hanzi-result-heading>#hanzi-result-icon::before,.hanzi-result-heading>#hanzi-result-icon::after{content:'';position:absolute;inset:-8px;border:2px solid currentColor;border-radius:50%;opacity:0;pointer-events:none}
.hanzi-result-dialog[open] #hanzi-result-icon{animation:hanzi-success-pop .6s cubic-bezier(.2,1.6,.5,1) both}
.hanzi-result-dialog[open] #hanzi-result-icon::before{animation:hanzi-success-ring .8s ease-out both}
.hanzi-result-dialog[open] #hanzi-result-icon::after{animation:hanzi-success-ring .8s .16s ease-out both}
.hanzi-confetti{position:fixed;inset:0;width:100vw;height:100dvh;z-index:3;pointer-events:none}
.hanzi-result-heading h3{font-size:20px;line-height:1.3;margin:0 0 6px;color:var(--ink)}
.hanzi-result-heading p{font-size:12px;line-height:1.5;margin:0;color:var(--muted)}
.hanzi-result-dialog .hanzi-result-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.hanzi-result-dialog .hanzi-result-metrics dd{font-size:26px;margin-top:4px}
.hanzi-result-dialog .hanzi-record{grid-column:1/-1;border-top:1px solid var(--border);padding-top:12px}
.hanzi-result-dialog .hanzi-record dd{font-size:18px}
.hanzi-result-dialog .hanzi-result-explanation{font-size:12px;margin-top:6px}
.hanzi-result-dialog .hanzi-result-explanation summary{min-height:36px}
.hanzi-result-dialog .hanzi-result-explanation p{font-size:12px;line-height:1.5;margin:0 0 10px}
.hanzi-result-actions{display:grid;gap:4px;margin-top:6px}
.hanzi-result-actions .button{width:100%;min-height:42px;justify-content:center;font-size:14px}
.hanzi-result-dialog.is-record{border-color:#d5ab49;box-shadow:0 0 0 3px #e8bb4c28,0 24px 80px #15102240}
.hanzi-result-dialog.is-record[open]{animation:hanzi-result-in .25s ease-out,hanzi-record-glow 1.8s ease-out}
.hanzi-result-dialog.is-record .hanzi-result-heading{padding-top:18px}
.hanzi-result-dialog.is-record .hanzi-result-kicker{display:block;position:absolute;top:0;left:0;right:0;font-size:9px;font-weight:700;letter-spacing:.2em;color:#946511}
.hanzi-result-dialog.is-record #hanzi-result-icon{width:80px;height:80px;font-size:48px;color:#a47010;background:radial-gradient(circle at 35% 25%,#fffce9,#ffe9a1 65%,#f3cb65);box-shadow:inset 0 0 0 1px #fff9db,0 5px 24px #e4af3d55;animation:hanzi-star 1s cubic-bezier(.18,1.35,.35,1) both;text-shadow:0 2px 0 #fff6cf}
.hanzi-result-dialog.is-record #hanzi-result-icon::before{inset:-12px;border:1px solid #d8a83d;animation:hanzi-record-ring 1.3s .1s ease-out both}
.hanzi-result-dialog.is-record #hanzi-result-icon::after{inset:-24px;border:1px dashed #d8a83d;animation:hanzi-record-ring 1.5s .25s ease-out both}
.hanzi-result-dialog.is-record .hanzi-result-heading h3{color:#946511}
.hanzi-result-dialog.is-record[open] .hanzi-result-heading h3{animation:hanzi-title-shine 1.6s ease-out}
.hanzi-result-dialog.is-record[open] .hanzi-result-metrics{animation:hanzi-metrics-in .5s .2s ease-out both}
.hanzi-result-dialog.is-record .hanzi-result-actions>.primary{position:relative;overflow:hidden}
.hanzi-result-dialog.is-record[open] .hanzi-result-actions>.primary::after{content:'';position:absolute;inset:-100% -40%;background:linear-gradient(100deg,transparent 40%,#ffffff60 50%,transparent 60%);pointer-events:none;animation:hanzi-button-shine 1.1s .55s ease-out both}
:root[data-theme=dark] .hanzi-result-dialog.is-record .hanzi-result-heading h3{color:#f2cb72}
:root[data-theme=dark] .hanzi-result-dialog.is-record .hanzi-result-kicker{color:#f2cb72}
:root[data-theme=dark] .hanzi-result-dialog.is-record #hanzi-result-icon{background:radial-gradient(circle at 35% 25%,#79602a,#44341b);color:#ffdc7c;text-shadow:0 2px 0 #553a13;box-shadow:inset 0 0 0 1px #e8b94a66,0 5px 30px #e4af3d40}
.hanzi-celebration{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;display:grid;place-items:center;color:#418a73}
.hanzi-celebration>span{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#f2fff3e8;font-size:38px;box-shadow:0 0 0 12px #60b58a20}
.is-celebrating .hanzi-celebration{opacity:1;animation:hanzi-finish .8s ease-out both}
.hanzi-celebration i{position:absolute;left:50%;top:50%;width:8px;height:12px;border-radius:3px;background:currentColor;opacity:0;--ray:0deg}
.hanzi-celebration i:nth-of-type(2){--ray:45deg}.hanzi-celebration i:nth-of-type(3){--ray:90deg}.hanzi-celebration i:nth-of-type(4){--ray:135deg}.hanzi-celebration i:nth-of-type(5){--ray:180deg}.hanzi-celebration i:nth-of-type(6){--ray:225deg}.hanzi-celebration i:nth-of-type(7){--ray:270deg}.hanzi-celebration i:nth-of-type(8){--ray:315deg}
.is-celebrating .hanzi-celebration i{animation:hanzi-ray .8s ease-out both}
.is-celebrating.is-record .hanzi-celebration{color:#b18220}
.is-celebrating.is-record .hanzi-celebration>span{background:#fff4d6eb;box-shadow:0 0 0 12px #edc45130}
.is-celebrating #hanzi-target svg,.is-celebrating #hanzi-user-ink{animation:hanzi-ink-pulse .65s ease-out;transform-origin:center}
@keyframes hanzi-result-in{from{opacity:0}to{opacity:1}}
@keyframes hanzi-card-pop{from{opacity:0;transform:translateY(12px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes hanzi-success-pop{0%{opacity:0;transform:scale(.35) rotate(-15deg)}65%{opacity:1;transform:scale(1.15) rotate(5deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes hanzi-success-ring{0%{opacity:.6;transform:scale(.5)}100%{opacity:0;transform:scale(1.9)}}
@keyframes hanzi-star{0%{opacity:0;transform:perspective(400px) rotateY(-160deg) rotate(-30deg) scale(.25)}55%{opacity:1;transform:perspective(400px) rotateY(15deg) rotate(8deg) scale(1.2)}80%{transform:perspective(400px) rotateY(-5deg) rotate(-3deg) scale(.96)}100%{opacity:1;transform:perspective(400px) rotateY(0) rotate(0) scale(1)}}
@keyframes hanzi-record-ring{0%{opacity:.8;transform:scale(.4) rotate(-30deg)}100%{opacity:0;transform:scale(1.65) rotate(40deg)}}
@keyframes hanzi-record-glow{0%,100%{box-shadow:0 0 0 3px #e8bb4c28,0 24px 80px #15102240}35%{box-shadow:0 0 0 6px #e8bb4c38,0 0 100px #efbc4a80,0 24px 80px #15102240}}
@keyframes hanzi-title-shine{0%,100%{text-shadow:0 0 0 transparent}45%{text-shadow:0 0 22px #f8c65690}}
@keyframes hanzi-metrics-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes hanzi-button-shine{from{transform:translateX(-80%)}to{transform:translateX(80%)}}
@keyframes hanzi-ink-pulse{0%,100%{transform:scale(1)}45%{transform:scale(1.035)}}
@keyframes hanzi-finish{0%{opacity:0;transform:scale(.85)}20%,65%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.06)}}
@keyframes hanzi-ray{0%{opacity:0;transform:rotate(var(--ray)) translateY(-24px)}30%{opacity:1}100%{opacity:0;transform:rotate(var(--ray)) translateY(-110px) rotate(50deg)}}
@media(max-width:650px){
 .dictionary-view .hanzi-board{max-width:min(360px,calc(100dvh - 420px));min-width:140px}
 .dictionary-view .hanzi-actions,.dictionary-view .is-complete .hanzi-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
 .dictionary-view .is-complete .hanzi-actions>button:not([hidden]){display:inline-flex}
 .dictionary-view .hanzi-pagination,.dictionary-view .is-complete .hanzi-pagination{padding:10px 0 max(10px,env(safe-area-inset-bottom));background:var(--bg);margin-top:0}
}
@media(max-height:600px){
 .hanzi-result-dialog .hanzi-results{padding:12px 18px}
 .hanzi-result-heading{margin-bottom:10px}
 .hanzi-result-heading>#hanzi-result-icon{width:36px;height:36px;font-size:24px;margin-bottom:6px}
 .hanzi-result-dialog.is-record #hanzi-result-icon{width:58px;height:58px;font-size:36px}
 .hanzi-result-dialog.is-record .hanzi-result-heading{padding-top:14px}
 .hanzi-result-heading h3{font-size:18px}
 .hanzi-result-dialog .hanzi-result-metrics{gap:8px}
 .hanzi-result-dialog .hanzi-record{padding-top:8px}
}
@media(prefers-reduced-motion:reduce){
 .hanzi-result-dialog[open],.hanzi-result-dialog.is-record[open],.hanzi-result-dialog[open] .hanzi-results,.hanzi-result-dialog[open] #hanzi-result-icon,.hanzi-result-dialog[open] #hanzi-result-icon::before,.hanzi-result-dialog[open] #hanzi-result-icon::after,.hanzi-result-dialog.is-record[open] .hanzi-result-heading h3,.hanzi-result-dialog.is-record[open] .hanzi-result-metrics,.hanzi-result-dialog.is-record[open] .hanzi-result-actions>.primary::after,.is-celebrating .hanzi-celebration,.is-celebrating .hanzi-celebration i,.is-celebrating #hanzi-target svg,.is-celebrating #hanzi-user-ink{animation:none}
 .hanzi-result-dialog.is-record[open] .hanzi-result-actions>.primary::after{display:none}
 .is-celebrating .hanzi-celebration{opacity:0}
}