@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&family=IBM+Plex+Mono:wght@400;500;600&family=Noto+Sans+SC:wght@400;500;700&display=swap";:root{--bg-color: #0a1020;--bg-elevated: rgba(12, 20, 36, .88);--bg-panel: rgba(15, 24, 43, .9);--bg-soft: rgba(255, 255, 255, .03);--surface-2: rgba(255, 255, 255, .04);--surface-3: rgba(255, 255, 255, .06);--main-color: #69c9ff;--main-soft: rgba(105, 201, 255, .14);--main-color-strong: #091220;--success-color: #87d7a8;--success-soft: rgba(135, 215, 168, .12);--warning-color: #f4c56b;--warning-soft: rgba(244, 197, 107, .12);--error-color: #ff8698;--error-soft: rgba(255, 134, 152, .12);--text-color: #9fb0cf;--text-strong: #f6f8ff;--text-dim: #7283a2;--panel-stroke: rgba(162, 184, 222, .12);--shadow-soft: 0 18px 40px rgba(0, 0, 0, .2);--shadow-focus: 0 0 0 3px rgba(105, 201, 255, .18);--radius-sm: 14px;--radius-md: 20px;--radius-lg: 28px;--font-ui: "Noto Sans SC", "Segoe UI", "PingFang SC", sans-serif;--font-mono: "IBM Plex Mono", monospace;--font-display: "Space Grotesk", sans-serif;--font-size-base: 16px;--typing-size: clamp(1.75rem, 2.8vw, 2.4rem);--typing-line-height: 1.85;--typing-visible-lines: 3.4;--transition-fast: .16s ease;--transition-normal: .24s ease}body[data-theme=serika-light]{--bg-color: #f2f5fb;--bg-elevated: rgba(255, 255, 255, .86);--bg-panel: rgba(255, 255, 255, .94);--bg-soft: rgba(13, 29, 56, .03);--surface-2: rgba(23, 44, 81, .05);--surface-3: rgba(23, 44, 81, .08);--main-color: #1378c8;--main-soft: rgba(19, 120, 200, .12);--main-color-strong: #f7fbff;--success-color: #2d8a5f;--success-soft: rgba(45, 138, 95, .12);--warning-color: #a97400;--warning-soft: rgba(169, 116, 0, .12);--error-color: #bf4f67;--error-soft: rgba(191, 79, 103, .12);--text-color: #435575;--text-strong: #12233d;--text-dim: #71829d;--panel-stroke: rgba(78, 103, 143, .14);--shadow-soft: 0 16px 32px rgba(91, 110, 148, .12)}body[data-font=sm]{--font-size-base: 15px;--typing-size: clamp(1.6rem, 2.5vw, 2.15rem);--typing-visible-lines: 3.3}body[data-font=lg]{--font-size-base: 17px;--typing-size: clamp(1.9rem, 3vw, 2.6rem);--typing-visible-lines: 3.5}*,*:before,*:after{box-sizing:border-box}html{font-size:var(--font-size-base);scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(circle at top center,rgba(105,201,255,.08),transparent 26%),linear-gradient(180deg,rgba(255,255,255,.02),transparent 30%),var(--bg-color);color:var(--text-color);font-family:var(--font-ui);line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:120px 120px;opacity:.18;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.45),transparent 92%);mask-image:linear-gradient(180deg,rgba(0,0,0,.45),transparent 92%)}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:none;box-shadow:var(--shadow-focus)}#root,.app-shell{min-height:100vh}.app-shell{display:flex;flex-direction:column}.app-main{flex:1;padding:2rem 0 3rem}.container{width:min(1040px,calc(100vw - 2rem));margin:0 auto}.page-stack{display:grid;gap:1.5rem}.page-stack--home{gap:2rem}.app-header{position:sticky;top:0;z-index:30;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(180deg,rgba(8,13,24,.88),rgba(8,13,24,.55),transparent);border-bottom:1px solid rgba(255,255,255,.04)}body[data-theme=serika-light] .app-header{background:linear-gradient(180deg,rgba(247,250,255,.92),rgba(247,250,255,.64),transparent)}.app-header.is-compact{background:transparent;border-bottom-color:transparent}.app-header__inner,.app-footer__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0}.brand-block{display:flex;flex-direction:column;gap:.2rem}.logo{display:inline-flex;align-items:center;gap:.8rem;color:var(--text-strong)}.logo-mark{width:1.1rem;height:1.1rem;border-radius:999px;background:linear-gradient(135deg,#8dd7ff,#ffc48a)}.logo-word{font-family:var(--font-display);font-size:1.7rem;font-weight:700}.logo-word span{color:var(--main-color)}.hero-kicker,.panel-kicker,.summary-label,.result-label,.result-item-label,.live-stat-label,.control-label{margin:0;color:var(--text-dim);font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;font-family:var(--font-mono)}body[data-language=zh-CN] .hero-kicker,body[data-language=zh-CN] .panel-kicker,body[data-language=zh-CN] .summary-label,body[data-language=zh-CN] .result-label,body[data-language=zh-CN] .result-item-label,body[data-language=zh-CN] .live-stat-label,body[data-language=zh-CN] .control-label{letter-spacing:.06em;text-transform:none;font-family:var(--font-ui)}.nav-links,.nav-actions,.hero-actions,.results-actions,.history-metrics,.confirm-dialog__actions,.typing-stage__status,.workshop-actions{display:flex;align-items:center;gap:.75rem}.nav-link,.nav-icon,.ghost-btn,.action-btn,.toggle-btn,.segment-btn{border:1px solid transparent;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast),opacity var(--transition-fast)}.nav-link{padding:.7rem .95rem;border-radius:999px;color:var(--text-dim)}.nav-link[aria-current=page],.nav-link:hover{color:var(--text-strong);background:var(--surface-2);border-color:#ffffff0f}.nav-icon,.ghost-btn,.action-btn,.toggle-btn,.segment-btn{border-radius:999px}.nav-icon,.ghost-btn{padding:.72rem .95rem;background:var(--bg-soft);color:var(--text-strong);border-color:#ffffff0f}.ghost-btn--small{padding:.58rem .84rem}.nav-icon:hover,.ghost-btn:hover,.action-btn:hover,.toggle-btn:hover,.segment-btn:hover{transform:translateY(-1px)}.panel,.confirm-dialog,.settings-drawer,.metric-card,.result-item,.feedback-card,.status-card,.tag-pill,.mini-series__row,.sticky-action-bar,.banner{background:linear-gradient(180deg,var(--bg-elevated),var(--bg-panel));border:1px solid var(--panel-stroke);box-shadow:var(--shadow-soft)}.panel,.confirm-dialog,.settings-drawer{border-radius:var(--radius-lg)}.panel{padding:1.4rem}.home-launch{display:grid;gap:1rem;justify-items:center;text-align:center;max-width:760px;margin:1.4rem auto 0}.home-launch h1,.insights-header h1{margin:0;color:var(--text-strong);font-family:var(--font-ui);font-size:clamp(2.2rem,4.6vw,4rem);line-height:1.05;letter-spacing:-.04em}.hero-body,.lead-text,.muted-text,.typing-empty-state p,.feedback-card p,.banner p{margin:0}.hero-body,.muted-text{color:var(--text-dim)}.lead-text{color:var(--text-strong);font-size:1.08rem}.hero-actions{flex-wrap:wrap;justify-content:center}.home-stats-strip,.result-metrics-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem}.metric-card,.result-item,.status-card,.feedback-card,.tag-pill,.mini-series__row,.banner{border-radius:var(--radius-md);padding:1rem 1.05rem}.metric-card,.result-item{display:grid;gap:.35rem}.metric-card strong,.result-item-value,.history-row strong,.typing-stage__source strong,.status-card strong,.ai-custom-panel strong,.mini-series__row strong{color:var(--text-strong)}.metric-card strong,.result-item-value{font-family:var(--font-display);font-size:1.08rem}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.panel-head h2,.practice-toolbar h2,.result-copy h2,.result-advice-panel h2,.insights-latest-card h2{margin:.2rem 0 0;color:var(--text-strong);font-family:var(--font-ui);font-size:clamp(1.3rem,2.2vw,1.9rem);line-height:1.15;letter-spacing:-.02em}.panel-badge{display:inline-flex;align-items:center;white-space:nowrap;padding:.42rem .78rem;border-radius:999px;font-size:.82rem;border:1px solid transparent}.badge-idle,.badge-loading{color:var(--main-color);background:var(--main-soft);border-color:#69c9ff2e}.badge-ready,.badge-success{color:var(--success-color);background:var(--success-soft);border-color:#87d7a82e}.badge-stale,.badge-fallback{color:var(--warning-color);background:var(--warning-soft);border-color:#f4c56b2e}.badge-error{color:var(--error-color);background:var(--error-soft);border-color:#ff86982e}.practice-page{gap:1rem}.practice-toolbar,.typing-stage,.result-summary,.result-advice-panel,.insights-header{display:grid;gap:1rem}.practice-toolbar__row,.typing-stage__head,.history-row,.banner,.status-card__row,.confirm-dialog__actions{display:flex;align-items:center;justify-content:space-between;gap:1rem}.practice-toolbar__hint{margin:0}.config-strip{display:grid;gap:.9rem}.config-strip__main{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.config-strip__advanced{padding-top:.25rem}.config-strip__actions{display:flex;justify-content:flex-end}.control-group,.field,.toggle-field{display:grid;gap:.5rem}.control-label-row{display:flex;align-items:center;justify-content:space-between}.segmented-group{display:flex;flex-wrap:wrap;gap:.55rem}.segment-btn,.toggle-btn{padding:.62rem .94rem;background:var(--bg-soft);color:var(--text-color);border-color:#ffffff14}.segment-btn.active,.toggle-btn.active{background:var(--surface-3);color:var(--text-strong);border-color:#ffffff1f}.field span,.toggle-field span{color:var(--text-dim);font-size:.84rem}.field select{width:100%;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:var(--bg-soft);color:var(--text-strong);padding:.78rem .88rem}.field select option{color:#0f172a}.ai-custom-panel{display:grid;gap:.9rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.06)}.ai-custom-panel__head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.workshop-grid,.summary-stack,.tag-list,.settings-grid{display:grid;gap:.9rem}.workshop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-stack--compact{grid-template-columns:repeat(3,minmax(0,1fr))}.feedback-info{background:#69c9ff14;border-color:#69c9ff33}.feedback-error{background:#ff869814;border-color:#ff869833}.typing-stage__head{align-items:flex-start}.typing-stage__source,.history-row__meta{display:grid;gap:.25rem}.typing-stage__hint{font-size:.96rem}.typing-stage__footer{display:grid;gap:.9rem}.words-shell{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:#ffffff05;border:1px solid rgba(255,255,255,.08);padding:1.4rem;min-height:auto;scroll-margin-top:5.5rem;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:border-color var(--transition-fast),box-shadow var(--transition-fast),background-color var(--transition-fast)}.words-shell.is-focused{border-color:#69c9ff2e;box-shadow:inset 0 0 0 1px #69c9ff1a,var(--shadow-soft)}.words-shell.is-paused{border-color:#f4c56b29}.words-shell.is-locked{background:#ffffff04}.words-shell:before,.words-shell:after{content:"";position:absolute;left:0;right:0;height:1.75rem;z-index:2;pointer-events:none}.words-shell:before{top:0;background:linear-gradient(180deg,rgba(12,20,36,.92),transparent)}.words-shell:after{bottom:0;background:linear-gradient(0deg,rgba(12,20,36,.92),transparent)}body[data-theme=serika-light] .words-shell:before{background:linear-gradient(180deg,rgba(255,255,255,.96),transparent)}body[data-theme=serika-light] .words-shell:after{background:linear-gradient(0deg,rgba(255,255,255,.96),transparent)}.words-container{position:relative;z-index:1;height:calc(var(--typing-size) * var(--typing-line-height) * var(--typing-visible-lines));overflow:hidden;font-size:var(--typing-size);line-height:var(--typing-line-height);font-family:var(--font-mono)}.words-wrapper{position:relative;will-change:transform;transition:transform var(--transition-normal)}.words{display:flex;flex-wrap:wrap;align-items:flex-start;gap:.45rem .65rem}.word{display:flex;gap:0;margin-right:.2rem;border-bottom:2px solid transparent;opacity:1;transition:opacity var(--transition-fast),border-color var(--transition-fast)}.word[data-line-state=current]{opacity:1}.word[data-line-state=previous]{opacity:.72}.word[data-line-state=next]{opacity:.54}.word[data-line-state=past]{opacity:.38}.word[data-line-state=future]{opacity:.24}.word.current{border-bottom-color:var(--main-color)}.letter{color:#899ab942;transition:color var(--transition-fast),text-shadow var(--transition-fast)}.letter.correct{color:var(--text-strong);text-shadow:0 0 10px rgba(246,248,255,.05)}.letter.pending-current{color:#e0e9f87a}.letter.pending-future{color:#899ab93d}.letter.incorrect{color:var(--error-color);text-shadow:0 0 12px rgba(255,134,152,.08)}.letter.missed{color:var(--warning-color)}.letter.extra{color:#ffb07d;text-shadow:0 0 10px rgba(255,176,125,.08)}.word[data-line-state=current] .letter.pending-current{color:#e0e9f89e}.word[data-line-state=current] .letter.pending-future,.word[data-line-state=next] .letter.pending-future{color:#899ab957}.word[data-line-state=previous] .letter.correct,.word[data-line-state=past] .letter.correct{color:#f6f8ffe6}.word[data-line-state=future] .letter.correct,.word[data-line-state=future] .letter.incorrect,.word[data-line-state=future] .letter.extra,.word[data-line-state=future] .letter.missed{color:#899ab94d}.caret{position:absolute;border-radius:999px;background:var(--main-color);box-shadow:0 0 16px #69c9ff2e;transition:left .1s ease,height .15s ease,opacity .15s ease;animation:blink 1s ease-in-out infinite}.caret.active{animation:none}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.typing-empty-state,.focus-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;text-align:center;padding:1.5rem}.typing-empty-state{gap:.7rem}.focus-overlay{background:#090f1a9e;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:var(--text-dim);z-index:4}.typing-capture-input{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;opacity:0;border:0;background:transparent;color:transparent;caret-color:transparent;font-size:16px}.live-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}.live-stat{display:grid;gap:.22rem;padding:.95rem 1rem;border-radius:var(--radius-md);background:var(--surface-2);border:1px solid var(--panel-stroke)}.live-stat-value,.result-value{color:var(--text-strong);font-family:var(--font-mono);line-height:1}.live-stat-value{font-size:clamp(1.8rem,2.8vw,2.4rem)}.banner{background:#f4c56b14;border-color:#f4c56b2e}.action-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.8rem 1.08rem;background:var(--bg-soft);color:var(--text-strong);border-color:#ffffff14}.action-btn.primary{background:linear-gradient(135deg,var(--main-color),#53bfff);color:var(--main-color-strong);font-weight:700}.action-btn.primary.danger{background:linear-gradient(135deg,var(--error-color),#ff9aa8);color:#24131b}.action-btn:disabled,.toggle-btn:disabled{cursor:not-allowed;opacity:.56;transform:none}.result-summary{grid-template-columns:auto minmax(0,1fr);align-items:end}.result-summary__scores{display:flex;align-items:flex-end;gap:1.6rem}.result-big{display:grid;gap:.3rem}.result-value{font-family:var(--font-display);font-size:clamp(3rem,7vw,4.5rem)}.result-unit{font-size:1.15rem;color:var(--text-dim)}.result-copy{display:grid;gap:.5rem}.result-advice-panel{gap:1rem}.results-actions{flex-wrap:wrap}.insights-header{grid-template-columns:minmax(0,1fr) auto;align-items:center}.insights-overview-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.96fr);gap:1rem}.insights-latest-card,.mini-series{display:grid;gap:.7rem}.mini-series__row,.history-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.insights-hotspots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.tag-list{grid-template-columns:repeat(auto-fit,minmax(120px,max-content))}.tag-pill{display:inline-flex;align-items:center;justify-content:center}.history-table{border-radius:var(--radius-md);overflow:hidden;border:1px solid rgba(255,255,255,.06);background:#ffffff05}.history-row{padding:1rem 1.05rem}.history-row+.history-row{border-top:1px solid rgba(255,255,255,.06)}.history-metrics{color:var(--text-dim);flex-wrap:wrap}.chart-panel,.chart-empty{min-height:280px}.chart-panel{display:grid;gap:1.25rem}.replay-panel{gap:1rem}.replay-panel--merged{gap:1.1rem}.chart-panel__intro{display:grid;gap:.35rem}.chart-empty{display:grid;place-items:center;text-align:center}.chart-panel__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,auto);gap:1rem;align-items:end}.replay-header{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:1rem;align-items:start}.replay-header__left{display:grid;gap:.8rem}.replay-legend{display:flex;flex-wrap:wrap;gap:.6rem}.replay-legend__chip{display:inline-flex;align-items:center;gap:.5rem;padding:.56rem .88rem;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:var(--bg-soft);color:var(--text-color);transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),opacity var(--transition-fast),transform var(--transition-fast)}.replay-legend__chip:hover{transform:translateY(-1px)}.replay-legend__chip.is-active{background:var(--surface-3);color:var(--text-strong);border-color:#ffffff1f}.replay-legend__chip.is-active.replay-legend__chip--wpm{border-color:#69c9ff3d;box-shadow:inset 0 0 0 1px #69c9ff1f}.replay-legend__chip.is-active.replay-legend__chip--raw{border-color:#79a3d638;box-shadow:inset 0 0 0 1px #79a3d61a}.replay-legend__chip.is-active.replay-legend__chip--accuracy{border-color:#9de2b43d;box-shadow:inset 0 0 0 1px #9de2b41f}.replay-legend__chip.is-active.replay-legend__chip--burst{border-color:#ffb07d3d;box-shadow:inset 0 0 0 1px #ffb07d1f}.replay-legend__chip.is-muted{opacity:.5}.replay-legend__chip:disabled{cursor:not-allowed;opacity:.35}.replay-summary-card{display:grid;gap:.8rem;padding:1rem 1.05rem;border-radius:var(--radius-md);background:var(--surface-2);border:1px solid rgba(255,255,255,.06)}.replay-summary-card__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.72rem .9rem}.replay-summary-card__item{display:grid;gap:.18rem}.replay-summary-card__item span{color:var(--text-dim);font-size:.78rem}.replay-summary-card__item strong{color:var(--text-strong);font-family:var(--font-mono);font-size:1.04rem}.replay-summary-card__note{margin:0;color:var(--text-dim);font-size:.8rem}.replay-panel__head{grid-template-columns:minmax(0,1fr) minmax(300px,340px);align-items:stretch}.replay-mode-switch{display:inline-flex;gap:.55rem;flex-wrap:wrap}.replay-mode-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:.58rem .94rem;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:var(--bg-soft);color:var(--text-dim);transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),opacity var(--transition-fast),transform var(--transition-fast)}.replay-mode-btn.is-active{background:var(--surface-3);color:var(--text-strong);border-color:#ffffff1f}.replay-mode-btn:disabled{cursor:not-allowed;opacity:.42}.replay-inspect{display:grid;gap:.9rem;padding:1rem 1.05rem;border-radius:var(--radius-md);background:var(--surface-2);border:1px solid rgba(255,255,255,.06)}.replay-inspect__header{display:grid;gap:.22rem}.replay-inspect__header strong{color:var(--text-strong);font-family:var(--font-mono);font-size:1.45rem}.replay-inspect__state{color:var(--main-color);font-size:.85rem}.replay-inspect__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem .85rem}.replay-inspect__metric{display:grid;gap:.18rem}.replay-inspect__metric span{color:var(--text-dim);font-size:.78rem}.replay-inspect__metric strong{color:var(--text-strong);font-family:var(--font-mono);font-size:1.02rem}.chart-source-note,.chart-interaction-hint{max-width:48rem}.replay-canvas{border-radius:var(--radius-md);background:#ffffff04;border:1px solid rgba(255,255,255,.05);padding:.4rem}.replay-canvas--merged{padding:.6rem}.replay-floating-inspect{position:absolute;z-index:3;display:grid;gap:.18rem;min-width:124px;padding:.76rem .82rem;border-radius:16px;background:#0b121feb;border:1px solid rgba(255,255,255,.08);box-shadow:0 14px 28px #00000038;transform:translate(-50%,-100%);pointer-events:none}.replay-floating-inspect strong{color:var(--text-strong);font-family:var(--font-mono)}.replay-floating-inspect span{color:var(--text-dim);font-size:.8rem}.replay-chart{height:clamp(280px,37vw,360px)}.replay-chart--merged{height:clamp(300px,40vw,392px)}.replay-grid-line{stroke:#ffffff14;stroke-width:1}.replay-axis-label{fill:var(--text-dim);font-size:12px;font-family:var(--font-mono)}.replay-axis-label--x{font-family:var(--font-ui)}.replay-axis-label--accuracy{fill:#9de2b4}.replay-accuracy-band{fill:#9de2b40f}.replay-main-area{fill:url(#replayAreaGradient)}.replay-main-line,.replay-secondary-line,.replay-rhythm-line,.replay-accuracy-line{fill:none;stroke-linecap:round;stroke-linejoin:round}.replay-main-line{stroke:var(--main-color);stroke-width:3.2;filter:drop-shadow(0 6px 16px rgba(105,201,255,.18))}.replay-secondary-line{stroke:#79a3d685;stroke-width:2.2;stroke-dasharray:10 8}.replay-rhythm-line{stroke:#ffb07d;stroke-width:3}.replay-accuracy-line{stroke:#9de2b4;stroke-width:3;filter:drop-shadow(0 4px 12px rgba(157,226,180,.14))}.replay-burst-bar{stroke:#ffb07d5c;stroke-width:8;stroke-linecap:round}.replay-threshold-line{stroke:#9de2b459;stroke-width:1;stroke-dasharray:8 8}.replay-accuracy-threshold{stroke:#9de2b447;stroke-width:1;stroke-dasharray:7 7}.replay-guide-line{stroke:#ffffff1f;stroke-width:1;stroke-dasharray:5 7}.replay-focus-point{fill:var(--main-color);stroke:#080d18eb;stroke-width:3}.replay-focus-point--secondary{fill:#79a3d6eb}.replay-focus-point--accuracy{fill:#9de2b4}.replay-rail-line{stroke:#ffffff14;stroke-width:2;stroke-linecap:round}.replay-rail-tick{fill:#899ab980}.replay-rail-tick.is-active{fill:var(--main-color)}.replay-rail-error{stroke:var(--error-color);stroke-width:4;stroke-linecap:round}.replay-rail-pause{fill:#ffb07d24;stroke:#ffb07d;stroke-width:2}.replay-hit-area{fill:transparent;cursor:crosshair;pointer-events:all;touch-action:pan-y}.replay-empty-note{fill:var(--text-dim);font-size:13px;font-family:var(--font-ui)}.swatch-accuracy{background:#9de2b4}.chart-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.chart-summary__item{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:grid;gap:.28rem;padding:.92rem 1rem;border-radius:var(--radius-md);background:var(--surface-2);border:1px solid rgba(255,255,255,.06);text-align:left;cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast),opacity var(--transition-fast)}.chart-summary__item:hover{transform:translateY(-1px)}.chart-summary__item.is-active{background:#ffffff0f;border-color:#ffffff1f}.chart-summary__item.is-muted{opacity:.56}.chart-summary__caption,.chart-source-note,.chart-interaction-hint{color:var(--text-dim);font-size:.82rem}.chart-summary__caption{font-family:var(--font-mono)}.chart-summary__meta{display:inline-flex;align-items:center;gap:.45rem;color:var(--text-dim);font-size:.82rem}.chart-summary__value{color:var(--text-strong);font-family:var(--font-mono);font-size:1.2rem}.chart-canvas{position:relative}.chart-tooltip{position:absolute;z-index:3;display:grid;gap:.18rem;min-width:104px;padding:.72rem .78rem;border-radius:16px;background:#0b121feb;border:1px solid rgba(255,255,255,.08);box-shadow:0 14px 28px #00000038;transform:translate(-50%,-100%);pointer-events:none}.chart-tooltip strong{color:var(--text-strong);font-family:var(--font-mono)}.chart-tooltip span{color:var(--text-dim);font-size:.8rem}.result-chart{width:100%;height:clamp(250px,34vw,320px);overflow:visible}.chart-plot-bg{fill:#ffffff05;stroke:#ffffff0d;stroke-width:1}.chart-axis-label{fill:var(--text-dim);font-size:12px;font-family:var(--font-mono)}.chart-axis-label--x{font-family:var(--font-ui)}.chart-axis-label--burst{fill:#ffb07d}.grid-line{stroke:#ffffff14;stroke-width:1}body[data-theme=serika-light] .grid-line{stroke:#0d224214}.chart-area{fill:url(#chartAreaGradient)}.chart-bar{stroke:#ffb07d42;stroke-width:7;stroke-linecap:round}.chart-bar--active{stroke:#ffb07d80;stroke-width:8}.chart-line{fill:none;stroke-width:3.1;stroke-linejoin:round;stroke-linecap:round}.chart-line.wpm{stroke:var(--main-color);filter:drop-shadow(0 6px 16px rgba(105,201,255,.18))}.chart-line.raw{stroke:#69c9ff70;stroke-dasharray:10 8;stroke-width:2.4}.chart-guide-line{stroke:#ffffff1f;stroke-width:1;stroke-dasharray:5 7}.swatch{display:inline-block;width:18px;height:3px;border-radius:999px}.swatch-main{background:var(--main-color)}.swatch-raw{background:#69c9ff80}.swatch-burst{background:#ffb07d}.chart-point{stroke:#080d18e6;stroke-width:3}.chart-point--wpm{fill:var(--main-color)}.chart-point--raw{fill:#69c9ff70}.chart-hit-area{fill:transparent;cursor:crosshair;pointer-events:all;touch-action:pan-y}.chart-hit-area:focus-visible{outline:none}body[data-theme=serika-light] .chart-plot-bg{fill:#1378c808;stroke:#1378c814}body[data-theme=serika-light] .chart-point{stroke:#f7faffe6}body[data-theme=serika-light] .chart-tooltip{background:#fffffff0;border-color:#1378c81f}body[data-theme=serika-light] .replay-grid-line{stroke:#0d224214}body[data-theme=serika-light] .replay-focus-point{stroke:#f7faffeb}body[data-theme=serika-light] .replay-floating-inspect{background:#fffffff0;border-color:#1378c81f}body[data-theme=serika-light] .replay-summary-card{border-color:#1378c814}body[data-theme=serika-light] .replay-accuracy-band{fill:#2d8a5f0d}.settings-overlay,.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:#040a128f;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.settings-drawer{position:absolute;top:0;right:0;width:min(380px,100vw);height:100%;padding:1.4rem;border-radius:0}.settings-grid{margin-top:1.2rem}.disabled-card{padding:1rem;border-radius:var(--radius-md);background:var(--surface-2);border:1px dashed rgba(255,255,255,.1)}.confirm-dialog{width:min(440px,calc(100vw - 2rem));padding:1.5rem;margin:auto}.modal-overlay{display:grid;place-items:center}.confirm-dialog__actions{justify-content:flex-end;margin-top:1.2rem}.empty-panel{display:grid;gap:1rem;place-items:start}.sticky-action-bar{position:sticky;bottom:1rem;z-index:20;display:none;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1rem;padding:1rem 1.1rem;border-radius:var(--radius-lg)}.sticky-action-bar strong{color:var(--text-strong)}.app-footer{border-top:1px solid rgba(255,255,255,.05);color:var(--text-dim)}.app-shell.is-focus-layout .app-header{background:transparent;border-bottom-color:transparent}.app-shell.is-focus-layout .app-footer{opacity:.62}@media (max-width: 980px){.home-stats-strip,.result-metrics-strip,.config-strip__main,.workshop-grid,.summary-stack--compact,.insights-overview-grid,.insights-hotspots,.result-summary,.insights-header,.chart-panel__head,.chart-summary,.replay-panel__head,.replay-header{grid-template-columns:1fr}}@media (max-width: 720px){.app-main{padding-top:1.2rem;padding-bottom:6rem}.container{width:min(100vw - 1rem,100%)}.app-header__inner{flex-wrap:wrap}.nav-links{order:3;width:100%;justify-content:space-between}.panel{padding:1.15rem}.home-launch h1,.insights-header h1{font-size:clamp(1.9rem,11vw,2.8rem)}.typing-stage__head,.practice-toolbar__row,.results-actions,.history-row,.history-metrics,.confirm-dialog__actions,.banner,.typing-stage__status,.status-card__row{flex-direction:column;align-items:stretch}.live-stats,.home-stats-strip,.result-metrics-strip{grid-template-columns:1fr}.sticky-action-bar{display:grid}.words-shell{padding:1rem;scroll-margin-top:4.25rem}.words-container{height:calc(var(--typing-size) * var(--typing-line-height) * 3)}.chart-summary__item{padding:.82rem .9rem}.chart-tooltip{min-width:96px;padding:.64rem .7rem}.replay-floating-inspect{min-width:108px;padding:.64rem .72rem}.replay-summary-card__grid{grid-template-columns:1fr 1fr}.settings-drawer{width:100%}}
