.practice-success,.practice-reveal{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.home-tile__tooltip,.feedback-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hint-svg-overlay,.stroke-intro-overlay,.practice-success__char,.practice-reveal__char{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.hint-svg-overlay,.stroke-intro-overlay{display:flex;align-items:center;justify-content:center}.ds-section__subtitle,.ds-scale-row__label,.ds-type-meta,.ds-contrast-row__label,.ds-contrast-row__context,.ds-spacing-label,.ds-btn-table__type-label,.ds-btn-table__size-label,.ds-btn-row__label,.ds-state-label,.streak-instruction,.home-header__brand,.grid-page-label{font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:gray}*{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{font-family:JetBrains Mono,monospace;background:transparent;color:#ccc;margin:0;min-height:100vh;overflow-x:clip}.app-content{overscroll-behavior:none}button,a,input,textarea,select,[role=button]{-webkit-tap-highlight-color:transparent}.drawing-canvas{-webkit-touch-callout:none}.app-loading{height:100%;background:#090909}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}body.page-practice{display:flex;flex-direction:column}@keyframes successIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes successOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.08)}}@keyframes revealIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.app-layout{display:flex;height:100vh;height:100dvh;overflow:hidden;padding-top:env(safe-area-inset-top,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.app-content{flex:1;min-width:0;height:100%;overflow-y:auto}@media(max-width:767px){.app-content{padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))}}@keyframes viewFadeIn{0%{opacity:0}to{opacity:1}}.view-fade{animation:viewFadeIn .15s ease-in;height:100%}.page-wrapper{min-height:100%;overflow-x:clip;color:#ccc;font-family:JetBrains Mono,monospace;display:flex;flex-direction:column;width:100%;flex:1;min-width:0}@media(max-width:767px){.page-wrapper:not(.practice-view):not(.recall-view){padding-bottom:20px}}.page-wrapper.practice-view,.page-wrapper.recall-view{height:100%;overflow:hidden}.page-header{width:100%}.page-header__inner{position:relative;width:100%;box-sizing:border-box;padding-inline:8px;padding-block:20px;display:flex;align-items:center;justify-content:space-between}@media(min-width:768px){.page-header__inner{padding-inline:60px;padding-block:40px}}@media(min-width:1024px){.page-header__inner{max-width:1360px;margin-inline:auto}}.grid-page-label{margin-bottom:8px}.grid-page-title{font-family:Special Gothic Expanded One,sans-serif;font-size:16px;margin:0;padding-top:12px;color:#fff}.grid-stats{display:flex;gap:20px;margin-top:10px;flex-wrap:wrap}.grid-stat{font-size:12px;color:gray}.page-body{flex:1;display:flex;flex-direction:column;width:100%;box-sizing:border-box;padding-inline:24px;padding-block:40px}@media(min-width:768px){.page-body{padding:80px}}@media(min-width:1024px){.page-body{max-width:1360px;margin:0 auto}}@media(min-width:1024px){.practice-view .page-body,.recall-view .page-body{min-height:0}}@media(min-width:1024px){.practice-view .page-body,.practice-view .page-header__inner,.recall-view .page-body,.recall-view .page-header__inner,.quiz-view .page-body,.quiz-view .page-header__inner,.grid-view .page-body,.grid-view .page-header__inner{max-width:1024px}}.grid-progress-section{padding-bottom:8px}.grid-body{display:flex;flex-direction:column;gap:40px}.gojuon-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;overflow:hidden}@media(min-width:768px){.gojuon-grid{gap:20px}}.col-header{text-align:center;font-size:14px;color:gray;letter-spacing:.1em;padding-bottom:4px}.char-set-nav{border-bottom:1px solid rgba(255,255,255,.08)}.char-set-nav__inner{margin:20px auto 0;width:100%;display:flex;justify-content:center;padding-inline:20px;gap:16px}@media(min-width:768px){.char-set-nav__inner{padding-inline:40px}}.char-set-nav__item{font-family:JetBrains Mono,monospace;text-transform:uppercase;padding:16px 4px;font-size:13px;color:gray;background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .15s;margin-bottom:-1px}.char-set-nav__item.active{color:#fff;border-bottom-color:#00cfcf}.char-set-nav__item:active:not(:disabled){color:#fff}.char-set-nav__item:focus-visible{outline:2px solid rgb(0,207,207);outline-offset:-2px}.char-set-nav__item:disabled{color:#a6a6a6;cursor:default}.reset-wrapper{text-align:center;padding:1.5rem 1rem 2rem}.header-left{display:flex;align-items:center;gap:12px;flex:1}.header-back-btn{gap:4px;margin-right:8px}.header-back-btn__icon{width:14px;height:14px}.header-center{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:12px}.header-view-title{margin:0;font-family:JetBrains Mono,monospace;font-size:18px;font-weight:400;text-transform:uppercase;color:#fff;position:absolute;left:50%;transform:translate(-50%);max-width:60%;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}@media(min-width:768px){.header-view-title{max-width:70%}}.logo-btn,.logo-char{font-size:2.4rem;color:#00cfcf;border:none;line-height:1;font-family:JetBrains Mono,monospace;background-color:#090909;transition:font-size .2s ease,padding .2s ease,color .2s ease}.logo-btn{background:none;cursor:pointer}@media(hover:hover){.logo-btn:hover{color:#fff}}.header-char{font-family:Special Gothic Expanded One,sans-serif;font-size:16px;color:#fff;text-align:left;transition:font-size .2s ease}@media(min-width:768px){.header-char{font-size:24px;text-align:center}}.header-right{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:flex-end;flex:1;gap:20px}.quiz-view .page-header{position:sticky;top:0;z-index:100;background-color:transparent;transition:background-color .2s ease}body.scrolled .quiz-view .page-header{background-color:#090909}body.scrolled .quiz-view .header-center{padding-inline:12px}@media(min-width:768px){body.scrolled .quiz-view .header-center{padding-inline:20px}}body.scrolled .quiz-view .header-view-title{font-size:13px}@media(min-width:768px){body.scrolled .quiz-view .header-view-title{font-size:16px}}body.scrolled .quiz-view .header-right{padding-right:12px;gap:12px}@media(min-width:768px){body.scrolled .quiz-view .header-right{padding-right:20px}}.header-streak{font-family:JetBrains Mono,monospace;font-size:11px;font-weight:600;letter-spacing:.05em;color:gray;border:1px solid rgba(255,255,255,.08);padding:4px 8px}.header-streak__count{color:#00cfcf;font-weight:700}.header-pos{font-family:JetBrains Mono,monospace;font-size:11px;color:gray;letter-spacing:.1em}.header-progress{font-family:JetBrains Mono,monospace;font-size:11px;color:gray}.header-progress.complete{color:#cf0}.char-display{display:flex;flex-direction:row;align-items:center;gap:16px;padding:28px}.char-display__main{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1}.char-display__row{display:flex;align-items:center;justify-content:space-between;width:100%}.mastery-dots{display:flex;align-items:center;gap:8px}.mastery-dots .activity-grid__cell{width:16px;height:16px}.mastery-dots .mastery-dots__cell--filled{background:#00cfcf}.mastery-dots .mastery-dots__cell--active{border:2px solid rgb(0,207,207)}.mastery-dots .mastery-dots__cell--active.mastery-dots__cell--correct{border-color:#cf0}.mastery-dots .mastery-dots__cell--active.mastery-dots__cell--incorrect{border-color:#f92a82}.char-rom{font-family:Special Gothic Expanded One,sans-serif;font-size:60px;color:#fff;line-height:1;text-align:center;pointer-events:none}@media(min-width:1024px){.settings-view .page-header{display:none}}.animated-background{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;z-index:-1}.animated-background__canvas,.animated-background__fx,.animated-background__blur,.animated-background__dark-overlay,.animated-background__vignette,.animated-background__grid{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.animated-background__blur{backdrop-filter:blur(var(--bg-blur, 50px));-webkit-backdrop-filter:blur(var(--bg-blur, 50px))}.animated-background__dark-overlay{background:rgba(0,0,0,var(--bg-dark-overlay, .7))}.animated-background__vignette{background:radial-gradient(ellipse at center,transparent 30%,rgba(0,0,0,.8) 100%)}.animated-background__grid{background-image:linear-gradient(rgba(0,0,0,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.15) 1px,transparent 1px);background-size:5px 5px;pointer-events:none;opacity:0}@keyframes tealPulse{0%,to{box-shadow:0 0 8px #00cfcf1a}50%{box-shadow:0 0 24px #00cfcf80}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:0;cursor:pointer;font-family:JetBrains Mono,monospace;font-weight:500;text-transform:uppercase;transition:all .15s}.btn:focus-visible{outline:2px solid rgb(0,207,207);outline-offset:2px}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled,.btn.disabled{background:#131313;color:gray;border-color:transparent;cursor:not-allowed;pointer-events:none}.btn--sm{padding:8px 12px;font-size:11px;letter-spacing:.55px;position:relative}.btn--sm:after{content:"";position:absolute;top:50%;left:50%;width:max(44px,100%);height:max(44px,100%);transform:translate(-50%,-50%)}.btn--md{padding:12px;font-size:14px;letter-spacing:.7px;min-height:44px;min-width:44px}.btn--lg{padding:16px 24px;font-size:20px;letter-spacing:1px;min-height:44px;min-width:44px}@media(min-width:768px){.btn--lg{padding:20px 28px}}.btn--primary{background:linear-gradient(135deg,#3cdd92,#1ed6b0 37.5%,#0fd3c0,#00cfcf 75%,#61e66c);color:#001414;animation:tealPulse 2.5s ease-in-out infinite}@media(hover:hover){.btn--primary:hover:not(:disabled){animation-play-state:paused;box-shadow:0 0 24px #00cfcf80;filter:brightness(1.2)}}.btn--primary:active:not(:disabled){animation-play-state:paused;box-shadow:none;filter:brightness(1)}.btn--primary.btn--activated{animation-play-state:paused;box-shadow:0 0 24px #00cfcf66;filter:brightness(1.1)}.btn--primary:disabled,.btn--primary.disabled{animation:none;background:linear-gradient(135deg,#3cdd9259,#1ed6b059 37.5%,#0fd3c059,#00cfcf59 75%,#61e66c59);color:#00141499}.btn--secondary{background:#ffffff0d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:2px solid transparent;color:#ccc}@media(hover:hover){.btn--secondary:hover:not(:disabled){background:#ffffff1a;color:#fff}}.btn--secondary:active:not(:disabled){background:#ffffff08}.btn--secondary.btn--activated{border-color:#00cfcf;background:#ffffff1a;color:#fff}.btn--tertiary{background:transparent;border:2px solid transparent;color:#fff}@media(hover:hover){.btn--tertiary:hover:not(:disabled){background:#ffffff0f;color:#fff}}.btn--tertiary:active:not(:disabled){background:#ffffff08}.btn--tertiary.btn--activated{color:#00cfcf;background:#00cfcf14}.btn--danger{background:transparent;border:2px solid rgba(255,255,255,.08);color:#f92a82}@media(hover:hover){.btn--danger:hover:not(:disabled){border-color:#f92a82;background:#f92a8214}}.btn--danger:active:not(:disabled){background:#f92a8229}.btn--danger:focus-visible{outline-color:#f92a82}.btn--danger.btn--activated{border-color:#f92a82;background:#f92a8214}.btn--flex{flex:1}.btn--hidden{opacity:0;pointer-events:none}.input{width:100%;height:42px;padding:12px;border:1px solid rgba(255,255,255,.08);background:transparent;color:#fff;font-family:JetBrains Mono,monospace;font-size:12px;letter-spacing:.6px;outline:none}@media(max-width:767px){.input{font-size:16px}}.input::placeholder{color:gray}.input:focus{border-color:#00cfcf}.badge{display:inline-block;font-family:JetBrains Mono,monospace;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:2px 8px;border:1px solid transparent}.badge--lime{color:#cf0;background:#ccff001a;border-color:#ccff004d}.badge--teal{color:#00cfcf;background:#00cfcf1a;border-color:#00cfcf4d}.badge--grey{color:#ffffffb3;background:#131313;border-color:#ffffff14}.badge--magenta{color:#f92a82;background:#f92a821a;border-color:#f92a824d}.action-card{position:relative;width:100%;min-width:0;min-height:44px;padding:24px;background:#ffffff0d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:2px solid transparent;clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);color:#ccc;font-family:JetBrains Mono,monospace;font-size:14px;cursor:pointer;text-align:left;transition:all .15s;overflow:hidden;display:flex;flex-direction:column;gap:20px}.action-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.02) 45%,transparent 65%);transform:translate(-100%);opacity:1;pointer-events:none}@media(hover:hover){.action-card:hover{color:#fff;background:#ffffff1a;border-color:#00cfcf;clip-path:none}.action-card:hover:after{transform:translate(100%);opacity:0;transition:transform 1s ease,opacity .6s ease .3s}}.action-card:focus-visible{outline:2px solid rgb(0,207,207);outline-offset:2px}.action-card--primary{color:#fff}.action-card--primary .action-card__status{color:#00cfcf;border-color:#00cfcf}@media(hover:hover){.action-card--primary:hover{color:#00cfcf}}.action-card--disabled,.action-card:disabled{color:#a6a6a6;cursor:not-allowed;background:#00000040}@media(hover:hover){.action-card--disabled:hover,.action-card:disabled:hover{color:#a6a6a6;background:#00000040;border-color:transparent}.action-card--disabled:hover:after,.action-card:disabled:hover:after{transform:translate(-100%);transition:none}}.action-card--disabled .action-card__progress-count,.action-card:disabled .action-card__progress-count{color:gray}.action-card--disabled .action-card__progress-cap,.action-card:disabled .action-card__progress-cap{background:gray}.action-card--disabled .action-card__desc,.action-card:disabled .action-card__desc{color:#a6a6a6}.action-card--disabled .action-card__kana-chip,.action-card:disabled .action-card__kana-chip{color:#a6a6a6}.action-card__header{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.action-card__title{display:flex;align-items:center;gap:12px;min-width:0}.action-card__label{font-family:Special Gothic Expanded One,sans-serif;font-size:24px;text-transform:uppercase}@media(min-width:768px){.action-card__label{font-size:28px}}.action-card__corner-icon{position:absolute;top:12px;right:14px;width:13px;height:13px;color:#a6a6a6}.action-card__kana-chip{flex-shrink:0;background:#ffffff0d;padding:4px 8px;font-family:JetBrains Mono,monospace;font-size:12px;font-weight:700;color:#fff}.action-card__status{flex-shrink:0;border:1px solid rgba(255,255,255,.08);padding:4px 8px;font-family:JetBrains Mono,monospace;font-size:8px;color:gray;text-transform:uppercase}.action-card__body{display:flex;flex-direction:column;gap:12px;width:100%}.action-card__desc{font-size:11px;color:#fff;font-weight:400;text-transform:uppercase}.action-card__progress{display:flex;flex-direction:column;gap:8px;width:100%}.action-card__progress-labels{display:flex;justify-content:space-between;align-items:baseline}.action-card__progress-count{font-family:JetBrains Mono,monospace;font-size:11px;font-weight:700;color:#fff}.action-card__progress-total{color:gray;font-weight:400}.action-card__progress-pct{font-family:JetBrains Mono,monospace;font-size:11px;font-weight:700;color:gray}.action-card__progress-bar{display:flex;align-items:stretch;height:4px;width:100%}.action-card__progress-cap{flex-shrink:0;width:2px;background:#fff}.action-card__progress-active{min-width:0;background:#00cfcf;box-shadow:0 0 8px #00ffff4d;transition:width .3s ease}.action-card__progress-inactive{min-width:0;background:#fff3}.action-card__actions{display:flex;align-items:stretch;gap:20px;margin-top:16px;margin-bottom:12px}.action-card__actions .btn--primary{border:2px solid transparent}.action-card__action{width:100%}@media(min-width:768px){.action-card__action{width:50%;margin-left:auto}}.session-body{display:flex;flex-direction:column;gap:0}.session-body--setup{justify-content:center;align-items:center;flex:1}.session-body--setup .action-card{max-width:400px;cursor:default}@media(hover:hover){.session-body--setup .action-card:hover{border-color:transparent}}.session-progress{font-family:JetBrains Mono,monospace;font-size:13px;color:gray;font-variant-numeric:tabular-nums;letter-spacing:.05em;text-align:center;padding-top:16px}.session-prompt__large{line-height:1;color:#00cfcf;-webkit-user-select:none;user-select:none}.session-prompt__large--char{font-family:JetBrains Mono,monospace;font-size:80px}@media(min-width:768px){.session-prompt__large--char{font-size:100px}}.session-prompt__large--rom{font-family:Special Gothic Expanded One,sans-serif;font-size:48px;letter-spacing:.08em}@media(min-width:768px){.session-prompt__large--rom{font-size:64px}}.session-prompt__label{font-size:11px;letter-spacing:.35em;text-transform:uppercase;color:gray}.recall-prompt{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 0 16px;text-align:center}.session-actions{display:flex;justify-content:center;padding-block:20px}@media(min-width:768px){.session-actions{padding-block:40px}}.session-actions .btn{min-width:160px}.session-actions .btn--primary:disabled{opacity:1;background:#262626;color:gray}.session-actions--stacked{flex-direction:column;align-items:center;gap:12px}.session-phase-intro{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;padding:48px 0 24px;flex:1}.session-phase-badge{font-family:JetBrains Mono,monospace;font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:#00cfcf}.session-phase-title{font-family:Special Gothic Expanded One,sans-serif;font-size:28px;color:#cf0;line-height:1}.session-phase-subtitle{font-family:JetBrains Mono,monospace;font-size:13px;color:#ccc}.session-option-selector{display:flex;gap:8px;margin-top:4px}.session-option-btn{flex:1}.session-progress-bar{width:100%;max-width:min(400px,55vh);margin-inline:auto;padding-inline:24px}.session-end-score{display:flex;align-items:baseline;gap:6px}.session-end-score__value{font-family:Special Gothic Expanded One,sans-serif;font-size:64px;line-height:1;color:#ebff99}.session-end-score__sep,.session-end-score__total{font-family:Special Gothic Expanded One,sans-serif;font-size:32px;color:gray}.section-header{display:flex;align-items:center;gap:12px}.section-header__label{font-family:JetBrains Mono,monospace;font-size:12px;letter-spacing:.15em;font-weight:400;text-transform:uppercase;color:#fff}.section-header__divider{display:flex;align-items:center;flex:1;min-width:0}.section-header__divider-cap{width:1px;height:10px;background:#ffffff14;flex-shrink:0}.section-header__divider-line{flex:1;height:1px;background:#ffffff14}.n-btn,.char-cell{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:4px 8px 8px 4px;gap:8px}@media(min-width:768px){.n-btn,.char-cell{padding:12px 16px 16px 12px;gap:12px}}.n-btn,.char-cell{border-radius:0;border:1px solid rgba(255,255,255,.05);clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%);font-family:JetBrains Mono,monospace;transition:all .15s;min-height:clamp(52px,7vw,88px);text-align:left;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.n-btn:after,.char-cell:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.02) 45%,transparent 65%);transform:translate(-100%);opacity:1;pointer-events:none}.locked.n-btn,.locked.char-cell{background:#00000040;color:gray;cursor:default;border-color:transparent}.completed.n-btn,.completed.char-cell{background:#090909;color:#cf0}@keyframes tileIn{0%{opacity:0}to{opacity:1}}@keyframes unlockIn{0%{opacity:.4;filter:saturate(0) brightness(.6)}60%{opacity:1;filter:saturate(0) brightness(1.2)}to{opacity:1;filter:saturate(1) brightness(1)}}.char-cell--unlocking{animation:unlockIn .6s ease-out forwards}.row-header{display:flex;align-items:center;justify-content:center;font-size:10px;color:gray;letter-spacing:.1em}.char-cell{animation:tileIn .2s ease-out backwards;cursor:pointer;background:#ffffff0d;color:#00cfcf;font-size:clamp(28px,5vw,52px)}.char-cell:active:not(.locked):not(.empty-cell){background:#ffffff1a;color:#fff}.char-cell:active:not(.locked):not(.empty-cell):after{transform:translate(100%);opacity:0;transition:transform 1s ease,opacity .6s ease .3s}@media(hover:hover){.char-cell:hover:not(.locked):not(.empty-cell){background:#ffffff1a;color:#fff}.char-cell:hover:not(.locked):not(.empty-cell):after{transform:translate(100%);opacity:0;transition:transform 1s ease,opacity .6s ease .3s}}.char-cell.empty-cell{background:#0000000d;border:none;cursor:default;pointer-events:none}.char-cell .rom-label{font-size:clamp(14px,1.6vw,20px);font-weight:600;letter-spacing:.05em;color:#fff;padding-left:6px}.char-cell.locked .rom-label{color:gray}.char-cell.locked .cell-count{color:gray;text-transform:uppercase}.char-cell.locked .tile-lock{color:currentColor}.char-cell.completed .rom-label{color:#cf0}.char-cell .checkmark{position:absolute;top:3px;right:4px;font-size:16px;color:#cf0}.char-cell .checkmark--pending{color:#00cfcf}.char-cell .tile-lock{position:absolute;top:4px;right:4px;width:11px;height:11px;color:#ffffff14}.char-cell .cell-bar{position:absolute;top:0;left:0;right:0;height:3px;overflow:hidden}.char-cell .lock-hint{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#090909eb;font-family:JetBrains Mono,monospace;font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:gray;text-align:center;padding:8px;z-index:1}.char-cell .cell-count{font-size:8px}@media(min-width:768px){.char-cell .cell-count{font-size:12px}}.char-cell .cell-count{font-family:JetBrains Mono,monospace;color:#fff9;letter-spacing:0;padding-left:6px}.char-cell .cell-count__value{color:#fff}.char-cell .cell-progress-row{display:flex;align-items:center;justify-content:space-between;width:100%;padding-left:6px}.char-cell .cell-count-badge{font-family:JetBrains Mono,monospace;font-size:9px;color:#ffffff80;line-height:1;flex-shrink:0}@media(min-width:768px){.char-cell .cell-count-badge{font-size:11px}}.char-cell .cell-progress{display:flex;gap:3px}.char-cell .cell-progress__segment{width:7px;height:3px;border-radius:1px;background:#fff3}@media(min-width:768px){.char-cell .cell-progress__segment{width:14px}}.char-cell .cell-progress__segment.filled{background:#00cfcf}.char-cell.completed .cell-progress__segment.filled{background:#cf0}.n-btn{width:100%;cursor:pointer;background:#ffffff0d;color:#ccc}@media(hover:hover){.n-btn:hover:not(.locked){background:#ffffff1a;color:#fff}.n-btn:hover:not(.locked):after{transform:translate(100%);opacity:0;transition:transform 1s ease,opacity .6s ease .3s}}.recall-check-cta{display:flex;justify-content:center;padding-block:24px}.debug-modal-triggers{display:flex;justify-content:center;gap:12px}@keyframes activityTodayPulse{0%,to{background-color:#00cfcf}50%{background-color:#a6eeee}}.activity-dashboard{width:100%;min-width:0;display:flex;flex-direction:column;gap:20px}@media(min-width:1024px){.activity-dashboard{gap:40px}}.activity-dashboard__body{display:flex;flex-direction:column;gap:20px;width:100%;min-width:0}@media(min-width:1024px){.activity-dashboard__body{flex-direction:row;align-items:stretch;gap:40px}}.activity-grid{width:fit-content;max-width:100%;min-width:0;box-sizing:border-box;padding:20px;background:#00000040;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%)}@media(min-width:768px){.activity-grid{padding:28px}}.activity-grid__body{display:flex;gap:6px;min-width:0}.activity-grid__day-labels{display:flex;flex-direction:column;gap:3px;flex-shrink:0}.activity-grid__month-label-spacer{height:14px}.activity-grid__day-label{height:14px;line-height:14px;font-family:JetBrains Mono,monospace;font-size:9px;color:#fff;white-space:nowrap}.activity-grid__scroll{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;scrollbar-width:none;min-width:0}.activity-grid__scroll::-webkit-scrollbar{display:none}.activity-grid__month-labels{display:flex;gap:3px;height:14px}.activity-grid__month-label-slot{position:relative;width:14px;flex-shrink:0}.activity-grid__month-label-slot span{position:absolute;left:0;top:0;white-space:nowrap;font-family:JetBrains Mono,monospace;font-size:9px;color:#fff}.activity-grid__weeks{display:flex;gap:3px;width:max-content}.activity-grid__week{display:flex;flex-direction:column;gap:3px}.activity-grid__week .activity-grid__cell:not(.activity-grid__cell--level-0){transition:transform .15s ease-in-out,box-shadow .15s ease-in-out}@media(hover:hover){.activity-grid__week .activity-grid__cell:not(.activity-grid__cell--level-0):hover{transform:scale(1.4);box-shadow:0 4px 10px #0009}}.activity-grid__cell{width:14px;height:14px;border-radius:1px;background:#ffffff0d;animation:tileIn .2s ease-out backwards;flex-shrink:0}.activity-grid__cell--level-1{background:#ccff0040}.activity-grid__cell--level-2{background:#ccff0080}.activity-grid__cell--level-3{background:#ccff00bf}.activity-grid__cell--level-4{background:#cf0}.activity-grid__cell--today{background:#00cfcf;animation:tileIn .2s ease-out backwards,activityTodayPulse 2.5s ease-in-out infinite}.activity-grid__footer{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.activity-grid__year{font-family:JetBrains Mono,monospace;font-size:11px;color:gray}.activity-grid__legend{display:flex;align-items:center;gap:4px;font-family:JetBrains Mono,monospace;font-size:11px;color:gray}.activity-grid__legend .activity-grid__cell{animation:none}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:1.5rem;max-width:500px;margin-left:auto;margin-right:auto}.stat-card{background:#090909;border:.5px solid rgba(255,255,255,.2);border-radius:8px;padding:12px;text-align:center}.stat-label{font-family:JetBrains Mono,monospace;font-size:12px;color:gray;margin-bottom:4px}.stat-value{font-family:JetBrains Mono,monospace;font-size:20px;font-weight:700;color:#cf0}.stat-box{display:flex;flex-direction:column;gap:4px;text-align:left;flex-shrink:0}@media(min-width:768px){.stat-box{text-align:right;flex-shrink:1}}.stat-box__value-row{display:flex;align-items:baseline;gap:3px}.stat-box__value{font-family:JetBrains Mono,monospace;font-weight:700;font-size:16px;line-height:1;color:#cf0}.stat-box__unit--muted{font-family:JetBrains Mono,monospace;font-size:11px;color:gray}.stat-box__label{font-family:JetBrains Mono,monospace;font-size:11px;color:gray;white-space:nowrap}.canvas-area{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding-bottom:calc(4rem + 176px);padding-inline:24px;position:relative}@media(min-width:1024px){.canvas-area{padding-top:40px}}.canvas-wrapper{position:relative;width:100%;max-width:min(400px,55vh)}.canvas-inner{position:relative;width:100%}.drawing-canvas{display:block;touch-action:none;border:2px solid rgba(255,255,255,.2);border-radius:2px;width:100%;max-width:min(400px,55vh);aspect-ratio:1;cursor:crosshair}.drawing-canvas--disabled{cursor:default}.drawing-canvas--correct{border-color:#cf0}.drawing-canvas--incorrect{border-color:#f92a82}.controls{position:fixed;bottom:0;left:0;right:0;z-index:100;display:flex;flex-direction:column;gap:16px;padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));padding-left:calc(16px + env(safe-area-inset-left,0px));padding-right:calc(16px + env(safe-area-inset-right,0px));background:#000c;border-top:1px solid rgba(255,255,255,.08);transform:translateY(100%);transition:transform .3s cubic-bezier(.22,1,.36,1)}.controls--visible{transform:translateY(0)}@media(min-width:1024px){.controls{padding:32px;padding-bottom:calc(32px + env(safe-area-inset-bottom,0px));padding-left:calc(32px + env(safe-area-inset-left,0px));padding-right:calc(32px + env(safe-area-inset-right,0px))}}.controls__row{display:flex;justify-content:center;align-items:center;gap:24px}.controls__row button{max-width:200px;flex:1}@media(min-width:1024px){.controls__row{gap:48px}}.controls__status{display:flex;flex-direction:column;gap:16px;width:100%}.controls__status-label{font-family:JetBrains Mono,monospace;font-size:16px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;text-align:center;width:100%}.controls__status-label--correct{color:#cf0}.controls__status-label--incorrect{color:#f92a82}.controls__status-feedback{font-family:JetBrains Mono,monospace;font-size:11px;color:gray;text-align:center}.controls__status-note{font-family:JetBrains Mono,monospace;font-size:11px;color:#f92a8299;text-align:center;letter-spacing:.05em}.controls__status-bar{max-width:400px;margin:0 auto}.controls__status-bar .action-card__progress-active{background:#cf0;box-shadow:0 0 8px #ccff004d}.controls__status-bar .action-card__progress-cap{background:#cf0}.hint-svg-overlay svg{width:100%;height:100%}.stroke-intro-overlay{opacity:1;transition:opacity .4s ease}.stroke-intro-overlay--exit{opacity:0}.stroke-intro-overlay svg{width:100%;height:100%}@keyframes stroke-badge-pop{0%{transform:scale(0);opacity:0}60%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:1}}.stroke-badge{transform-box:fill-box;transform-origin:center;animation:stroke-badge-pop .45s cubic-bezier(.34,1.56,.64,1) forwards}.score-badge{position:absolute;bottom:8px;right:8px;font-size:13px;font-weight:600;letter-spacing:.05em;padding:4px 10px;border-radius:6px}.score-badge.good{color:#cf0;background:#ccff001f}.score-badge.medium{color:#f5b700;background:#f5b70026}.score-badge.low{color:#f92a82;background:#f92a8226}.feedback-overlay{padding:24px 28px;border-radius:12px;text-align:center;z-index:10;font-size:20px;font-weight:500;pointer-events:none;border:1px solid transparent}.feedback-overlay.success{color:#ebff99;background:#0a0a0af2;border-color:#ccff0073;box-shadow:0 0 40px #ebff9926}.feedback-overlay.retry{color:#f5b700;background:#0a0a0af2;border-color:#f5b70066;box-shadow:0 0 40px #f5b7001a}.practice-success{border-radius:8px;animation:successIn .25s ease forwards}.practice-success--out{animation:successOut .3s ease forwards}.practice-success__char svg{width:100%;height:100%}.practice-reveal{gap:12px;animation:revealIn .2s ease forwards;z-index:10}.practice-reveal__char svg{width:100%;height:100%}.below-canvas-row{display:flex;align-items:center;justify-content:space-between;margin-top:16px}.below-canvas-row__left,.below-canvas-row__right{flex:1}.below-canvas-row__right{display:flex;justify-content:flex-end}.below-canvas-row__center{flex:1;text-align:center}.stroke-count{font-family:JetBrains Mono,monospace;font-size:11px;color:gray}.hint-toggle.hint-toggle--on{border-color:#00cfcf;color:#00cfcf;background:#00cfcf14}.hint-toggle.hint-toggle--locked{cursor:default;pointer-events:none;background:#131313;color:gray;border-color:transparent}.debug-panel-wrapper{position:relative}.debug-copy-tooltip{position:absolute;top:8px;right:8px;background:#ccff001f;color:#cf0;padding:2px 8px;border-radius:6px;font-size:12px;font-weight:600;pointer-events:none}.debug-panel{background:#00000059;color:#cf0;font-family:JetBrains Mono,monospace;font-size:11px;line-height:1.5;padding:12px;margin:0;border-radius:0 0 4px 4px;white-space:pre-wrap;word-break:break-all;-webkit-user-select:all;user-select:all;max-height:160px;overflow-y:auto;width:100%;box-sizing:border-box}.progress-row{display:flex;align-items:center;gap:4px;width:calc(100% - 16px)}.progress-bar{flex:1;height:4px;background:#fff3;overflow:hidden}.progress-fill{height:100%;background:#cf0;transition:width .3s ease}.progress-fill.incomplete{background:#00cfcf}.cell-bar{background:#fff3}.cell-bar--complete{background:#cf0}.attempt-count{font-size:9px;min-width:24px;text-align:right;line-height:1}.attempt-current{color:#ccc}.attempt-total{color:gray}.error-boundary-fallback{display:flex;align-items:center;justify-content:center;gap:16px;padding:24px;color:gray;font-size:.9rem}.error-boundary-fallback button{padding:4px 16px;border-radius:6px;border:1px solid rgba(255,255,255,.2);background:#090909;color:#ccc;cursor:pointer;transition:all .15s}@media(hover:hover){.error-boundary-fallback button:hover{border-color:#ffffff59}}.settings-content-body{display:flex;flex-direction:column;margin:0 -24px}.settings-content-body__action{margin:16px 24px 0}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;gap:16px;width:100%;background:none;border:none;text-align:left;color:#ccc;font-size:14px;cursor:default;box-sizing:border-box}.settings-row--action{cursor:pointer;transition:all .15s}@media(hover:hover){.settings-row--action:hover{background:#131313}}.settings-row--action .settings-row__label{color:#f92a82}.settings-row--neutral{cursor:pointer;transition:all .15s}@media(hover:hover){.settings-row--neutral:hover{background:#131313}}.settings-row--disabled{color:gray}.settings-row--meta{padding-top:16px;flex-direction:column;align-items:flex-start;gap:4px}.settings-row__label{font-size:15px;color:#ccc;font-family:JetBrains Mono,monospace}.settings-row__value{font-size:15px;font-weight:700;color:#cf0}.settings-row__meta{font-size:11px;color:#a6a6a6;font-variant-numeric:tabular-nums}.settings-row__meta-link{color:inherit;text-decoration:underline;text-underline-offset:2px}.settings-row__meta-btn{background:none;border:none;padding:0;font:inherit;font-size:inherit;cursor:pointer}.settings-toggle{display:inline-flex;align-items:center;cursor:pointer;position:relative}.settings-toggle:after{content:"";position:absolute;top:50%;left:50%;width:max(44px,100%);height:max(44px,100%);transform:translate(-50%,-50%)}.settings-toggle input[type=checkbox]{position:absolute;opacity:0;width:0;height:0}.settings-toggle input[type=checkbox]:checked~.settings-toggle__track{background:#00cfcf33;border-color:#00cfcf}.settings-toggle input[type=checkbox]:checked~.settings-toggle__track:after{transform:translate(18px);background:#fff}.settings-toggle__track{display:block;width:40px;height:22px;background:#131313;border:1px solid rgba(255,255,255,.2);border-radius:11px;transition:background .2s,border-color .2s;position:relative}.settings-toggle__track:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:#a6a6a6;border-radius:50%;transition:transform .2s,background .2s}.settings-difficulty{display:flex;gap:6px}.settings-difficulty__btn{flex:1;background:#131313;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:gray;font-size:12px;font-family:JetBrains Mono,monospace;padding:6px;cursor:pointer;transition:all .15s}@media(hover:hover){.settings-difficulty__btn:hover{border-color:#ffffff59;color:#ccc}}.settings-difficulty__btn:focus-visible{outline:2px solid rgb(0,207,207);outline-offset:2px}.settings-difficulty__btn--active{background:#00cfcf1f;border-color:#00cfcf;color:#fff}.settings-section{padding-top:24px;margin-top:24px}.settings-section:first-child{padding-top:0;margin-top:0}.settings-section__header{padding:4px 24px}.settings-row--field{flex-direction:column;align-items:flex-start;gap:8px;cursor:default}.settings-row--field .settings-row__label{font-size:13px}.settings-username-group{display:flex;gap:8px;width:100%}.settings-input{flex:1;background:#131313;border:1px solid rgba(255,255,255,.2);color:#ccc;font-family:JetBrains Mono,monospace;font-size:16px;padding:7px 16px;border-radius:6px;outline:none;transition:border-color .15s;min-width:0}.settings-input::placeholder{color:#a6a6a6}.settings-input:focus{border-color:#00cfcf}.settings-input-save{background:#131313;border:1px solid rgba(255,255,255,.2);color:#ccc;font-family:JetBrains Mono,monospace;font-size:13px;padding:7px 16px;border-radius:6px;cursor:pointer;white-space:nowrap;transition:all .15s}@media(hover:hover){.settings-input-save:hover:not(:disabled){border-color:#ffffff59}}.settings-input-save:focus-visible{outline:2px solid rgb(0,207,207);outline-offset:2px}.settings-input-save:disabled{background:#131313;color:gray;border-color:#131313;cursor:default}.settings-field-error{font-size:12px;color:#f92a82}.settings-field-hint{font-size:12px;color:#a6a6a6}.settings-toggle--disabled{cursor:not-allowed}.settings-toggle--disabled .settings-toggle__track{background:#131313;border-color:#131313}.settings-toggle--disabled .settings-toggle__track:after{background:gray}.settings-toast{position:absolute;bottom:calc(100% + 16px);left:50%;transform:translate(-50%);background:#131313;color:#ccc;font-size:13px;padding:8px 16px;border-radius:8px;border:1px solid rgba(255,255,255,.2);white-space:nowrap;animation:toastFadeIn .2s ease;pointer-events:none}@keyframes toastFadeIn{0%{opacity:0;transform:translate(-50%) translateY(6px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.nav-panel-rail{display:none}@media(min-width:768px){.nav-panel-rail{display:flex;flex-shrink:0}}.nav-panel{display:none}@media(min-width:768px){.nav-panel{display:flex;flex-direction:column;align-items:center;width:120px;height:100%;padding:40px 16px 20px;background:#ffffff14;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 0 32px #0009;z-index:99;transition:transform .3s ease}}@media(min-width:768px){.nav-panel-rail--session{display:none}}@media(min-width:1024px){.nav-panel-rail--session{display:flex;position:fixed;left:0;top:0;height:100%;width:120px;z-index:99}.nav-panel-rail--session .nav-panel{transform:translate(-100%)}.nav-panel-rail--session:after{content:"";position:absolute;left:12px;top:50%;transform:translateY(-50%);width:4px;height:48px;border-radius:999px;background:#ffffff59;opacity:1;transition:opacity .2s ease;pointer-events:none}}@media(min-width:1024px)and (hover:hover){.nav-panel-rail--session:hover .nav-panel{transform:translate(0)}.nav-panel-rail--session:hover:after{opacity:0}}.nav-panel__logo{align-self:center;margin-bottom:28px}.nav-panel__items{display:flex;flex-direction:column;width:100%;gap:8px;flex:1;justify-content:flex-start}.nav-panel__footer{display:flex;flex-direction:column;width:100%;gap:4px;padding-top:16px}.nav-item{display:flex;align-items:center;gap:8px;width:100%;background:none;border:none;color:gray;font-family:JetBrains Mono,monospace;font-size:14px;padding:8px 16px;border-radius:1px;cursor:pointer;text-align:left;transition:all .15s}.nav-item:active:not(:disabled){color:#00cfcf}@media(hover:hover){.nav-item:hover:not(:disabled){color:#00cfcf}}.nav-item--active{color:#fff}.nav-item--locked,.nav-item:disabled{color:gray;cursor:default}.nav-item--primary{font-family:Special Gothic Expanded One,sans-serif;font-size:24px}.nav-item--secondary{font-family:Special Gothic Expanded One,sans-serif;font-size:16px}.nav-item--stacked{position:relative;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;padding:16px;overflow:hidden;text-align:center}.nav-item--stacked .nav-item__label{max-width:100%;overflow:hidden;text-overflow:ellipsis;font-family:JetBrains Mono,monospace;font-size:8px;text-transform:uppercase}.nav-item__text{display:flex;flex-direction:column;gap:2px;min-width:0}.nav-item__icon{display:flex;align-items:center;justify-content:center;width:22px;height:22px;font-family:JetBrains Mono,monospace;font-size:20px;line-height:22px;color:inherit}.nav-item__icon svg{width:22px;height:22px}.nav-item__mono-label{font-family:JetBrains Mono,monospace;font-size:11px;color:gray}.nav-item__mono-label--available{color:#00cfcf}.nav-item__lock{flex-shrink:0;width:12px;height:12px;margin-left:auto}.nav-item--stacked .nav-item__lock{margin-left:0;position:absolute;top:6px;right:6px}.nav-panel__secondary,.nav-tray__secondary{display:flex;flex-direction:column;width:100%;gap:8px;border-top:1px solid rgba(255,255,255,.05);margin-top:16px;padding-top:16px}.mobile-tab-bar{display:none}@media(max-width:767px){.mobile-tab-bar{display:flex;gap:20px;position:fixed;bottom:0;left:0;right:0;z-index:99;background:#00000080;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 -16px 32px #0009;padding:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));padding-left:calc(24px + env(safe-area-inset-left,0px));padding-right:calc(24px + env(safe-area-inset-right,0px));transform:translateY(0);transition:transform .3s ease}.mobile-tab-bar--hidden{transform:translateY(100%)}}.mobile-tab-bar__tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding-block:8px;background:none;border:none;border-radius:1px;color:gray;font-family:JetBrains Mono,monospace;font-size:8px;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;transition:all .15s}.mobile-tab-bar__tab:active{color:#ccc}@media(hover:hover){.mobile-tab-bar__tab:hover{color:#ccc}}.mobile-tab-bar__tab--active{color:#fff}.mobile-tab-bar__icon{width:22px;height:22px;color:inherit}.mobile-tab-bar__icon--kanji{font-family:JetBrains Mono,monospace;font-size:15px;line-height:22px;color:inherit}.nav-tray-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#0a0a0aa6;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:backdropFadeIn .2s ease}.nav-tray-backdrop--closing{animation:backdropFadeOut .3s ease forwards}.nav-tray__header{position:relative;display:flex;justify-content:flex-end;margin-bottom:4px}.nav-tray__drag-handle{display:none}@media(hover:none){.nav-tray__drag-handle{display:block;position:absolute;top:2px;left:50%;transform:translate(-50%);width:47px;height:4px;border-radius:2px;background:#fff3}}.nav-tray__close{display:flex;align-items:center;justify-content:center;background:none;border:none;color:gray;cursor:pointer;padding:4px;border-radius:6px;transition:all .15s;position:relative}.nav-tray__close:after{content:"";position:absolute;top:50%;left:50%;width:max(44px,100%);height:max(44px,100%);transform:translate(-50%,-50%)}@media(hover:hover){.nav-tray__close:hover{color:#ccc;background:#131313}}.nav-tray__close-icon{width:20px;height:20px}.nav-tray{position:fixed;bottom:0;left:0;right:0;z-index:101;display:flex;flex-direction:column;gap:8px;background:#000c;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 -12px 80px 24px #000c;padding:16px;padding-bottom:calc(36px + env(safe-area-inset-bottom,0px));padding-left:calc(16px + env(safe-area-inset-left,0px));padding-right:calc(16px + env(safe-area-inset-right,0px));animation:traySlideUp .3s ease-out;touch-action:none}.nav-tray--closing{animation:none;transition:transform .3s ease-in;transform:translateY(100%)}.mastery-header{display:flex;flex-direction:row;align-items:center;justify-content:left;gap:40px}.mastery-header__char-set{font-family:Special Gothic Expanded One,sans-serif;font-size:24px;color:#fff;text-transform:uppercase}@media(min-width:768px){.mastery-header__char-set{font-size:44px}}.mastery-header__info{display:flex;flex-direction:column;gap:16px;flex:1;min-width:0}@media(min-width:768px){.mastery-header__info{flex-direction:row;align-items:flex-end;gap:40px}}.mastery-header__left{display:flex;flex-direction:column;gap:20px;flex:1;min-width:0}.mastery-header__levels{display:flex;gap:6px}.mastery-level-btn{display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .15s}@media(hover:hover){.mastery-level-btn:hover:not(:disabled){filter:brightness(1.15)}}.mastery-level-btn--locked{cursor:default;opacity:.6}.mastery-level-btn__lock{width:10px;height:10px;color:currentColor}.attribution-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px;color:#ccc;font-size:14px;max-height:440px;overflow-y:auto}.attribution-list__link{color:inherit;text-decoration:underline;text-underline-offset:2px}@keyframes modalIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes modalOut{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.9)}}@keyframes backdropFadeIn{0%{opacity:0}to{opacity:1}}@keyframes backdropFadeOut{0%{opacity:1}to{opacity:0}}@keyframes traySlideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#131313cc;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:backdropFadeIn .2s ease}.modal-backdrop--closing{animation:backdropFadeOut .2s ease forwards}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:201;width:calc(100vw - 80px);max-width:480px;max-height:calc(100vh - 80px);overflow:hidden}@media(min-width:768px){.modal{max-width:560px}}.modal{background:#090909;border:1px solid rgba(255,255,255,.05);clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);box-shadow:0 24px 80px 24px #000c;color:#00cfcf;animation:modalIn .3s ease forwards;display:flex;flex-direction:column;outline:none}.modal--closing{animation:modalOut .3s ease forwards}.modal:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:currentColor}@media(max-width:767px){.modal--tray{top:auto;left:0;right:0;bottom:0;transform:none;width:100%;max-width:none;border-radius:0;max-height:85vh;padding-bottom:calc(20px + env(safe-area-inset-bottom,0px));padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px);clip-path:none;box-shadow:none;background:#090909e6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:none;overflow:visible;filter:drop-shadow(0 -40px 20px rgba(9,9,9,.6));animation:traySlideUp .3s ease-out;touch-action:none}.modal--tray:before{content:"";position:absolute;top:-24px;left:50%;transform:translate(-50%);width:82%;height:24px;background:#090909e6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);clip-path:polygon(18.79px 0,calc(100% - 18.79px) 0,100% 100%,0 100%)}.modal--tray .modal__tab{position:absolute;top:-24px;left:0;width:100%;height:24px;display:flex;align-items:center;justify-content:center}.modal--tray .modal__body{padding:40px;gap:20px}.modal--tray.modal--closing{animation:none;transition:transform .3s ease-in;transform:translateY(100%)}}.modal__tab{display:none;width:100%;height:20px;flex-shrink:0}.modal__drag-handle{display:none}@media(hover:none){.modal__drag-handle{display:block;width:47px;height:4px;border-radius:2px;background:#fff3}}.modal__close{position:relative}.modal__close:after{content:"";position:absolute;top:50%;left:50%;width:max(44px,100%);height:max(44px,100%);transform:translate(-50%,-50%)}.modal__close{position:absolute;top:12px;right:14px;background:none;border:none;color:gray;font-size:20px;line-height:1;cursor:pointer;padding:2px 4px;transition:all .15s}@media(hover:hover){.modal__close:hover{color:#ccc}}.modal__body{padding:40px;display:flex;flex-direction:column;gap:24px;flex:1 1 auto;min-height:0;overflow-y:auto}.modal__dismiss{margin:0 24px 24px;padding:12px;background:#00cfcf;border:none;color:#001414;animation:tealPulse 2.75s ease-in-out infinite;font-family:JetBrains Mono,monospace;font-size:15px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:all .15s}@media(hover:hover){.modal__dismiss:hover:not(:disabled){filter:brightness(1.1)}}@media(min-width:1024px){.modal__dismiss{margin:0 48px 48px}}.modal__dismiss--ghost{background:transparent;border:1px solid rgba(255,255,255,.2);color:#ccc;animation:none;margin-top:-24px}@media(hover:hover){.modal__dismiss--ghost:hover{background:#131313}}.modal-badge{font-family:JetBrains Mono,monospace;font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:#00cfcf}.modal-title{font-family:Special Gothic Expanded One,sans-serif;font-size:28px;color:#cf0;line-height:1}.modal-subtitle{font-family:JetBrains Mono,monospace;font-size:13px;color:#ccc}.modal-xp-callout{font-family:JetBrains Mono,monospace;font-size:20px;color:#cf0;margin-top:8px}.confirm-dialog__actions{display:flex;gap:8px;margin-top:8px}.confirm-dialog__actions .btn{flex:1}@keyframes xpToastIn{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}@keyframes xpToastOut{0%{opacity:1}to{opacity:0}}.xp-toast{position:fixed;top:15%;left:20px;z-index:300;display:flex;align-items:center;padding:8px 16px;background:#090909;border:1px solid rgba(255,255,255,.2);border-left:3px solid rgb(204,255,0);pointer-events:none;animation:xpToastIn .3s ease-out forwards}.xp-toast--exiting{animation:xpToastOut .3s ease forwards}.xp-toast__amount{font-family:JetBrains Mono,monospace;font-size:16px;font-weight:700;color:#cf0;letter-spacing:.05em}.leaderboard-medal,.leaderboard-rank{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.05em}.leaderboard-medal{background:#ccff001f;color:#cf0;font-weight:700}.leaderboard-rank{background:#ffffff0d;color:#fff;font-weight:400}.lb-banner__card--me .leaderboard-medal,.lb-banner__card--me .leaderboard-rank,.leaderboard-row--me .leaderboard-medal,.leaderboard-row--me .leaderboard-rank{background:#00cfcf;color:#001414}.leaderboard-name{font-family:JetBrains Mono,monospace;font-size:14px;color:#ccc;letter-spacing:.05em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leaderboard-xp{font-family:JetBrains Mono,monospace;font-variant-numeric:tabular-nums;white-space:nowrap}.leaderboard-xp-count{font-family:JetBrains Mono,monospace;font-weight:700;font-size:16px;color:#cf0}.leaderboard-xp-label{font-size:11px;color:gray}.lb-banner{width:100%}.lb-banner__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;overflow-x:auto;margin-inline:-20px;padding-inline:20px}@media(min-width:768px){.lb-banner__grid{margin-inline:-40px;padding-inline:40px}}@media(min-width:1024px){.lb-banner__grid{margin-inline:-80px;padding-inline:80px}}.lb-banner__grid[data-cols="4"]{grid-template-columns:repeat(4,1fr)}.lb-banner__card{display:flex;flex-direction:column;gap:8px;padding:12px 16px;background:#00000040;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);min-width:110px}.lb-banner__card .leaderboard-name{font-size:12px;color:#fff}.lb-banner__card--separated{position:relative;margin-left:16px}.lb-banner__card--separated:before{content:"";position:absolute;left:-16px;top:16px;bottom:16px;width:2px;background:#00cfcf;transform:translate(-50%)}.app-content{position:relative}.app-content--ptr-releasing .view-fade{transition:transform .3s ease}.app-content--ptr-releasing .pull-to-refresh,.app-content--ptr-releasing .pull-to-refresh__grabber{transition:opacity .3s ease,transform .3s ease}.pull-to-refresh{position:absolute;top:12px;left:50%;z-index:2;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:#000c;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);pointer-events:none;opacity:var(--ptr-pull, 0);transform:translate(-50%) scale(calc(.6 + .4 * var(--ptr-pull, 0)))}.pull-to-refresh__spinner{width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.2);border-top-color:#00cfcf;transform:rotate(calc(var(--ptr-pull, 0) * 270deg))}.pull-to-refresh--ready .pull-to-refresh__spinner{border-top-color:#a6eeee}.pull-to-refresh--refreshing .pull-to-refresh__spinner{transform:none;animation:ptrSpin .8s linear infinite}.pull-to-refresh__grabber{display:none}@media(hover:none)and (display-mode:standalone){.pull-to-refresh__grabber{display:block;position:absolute;top:8px;left:50%;transform:translate(-50%);z-index:2;width:47px;height:4px;border-radius:2px;background:#fff3;width:28px;opacity:calc(.5 * (1 - var(--ptr-pull, 0)));pointer-events:none}}@keyframes ptrSpin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.app-content--ptr-releasing .view-fade,.app-content--ptr-releasing .pull-to-refresh,.app-content--ptr-releasing .pull-to-refresh__grabber{transition:none}}.auth-gate{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;color:#fff;font-family:JetBrains Mono,monospace;width:100%}.auth-gate__title{font-family:JetBrains Mono,monospace;font-size:16px;font-weight:400;color:#fff;letter-spacing:.8px;text-transform:uppercase;line-height:normal}.auth-gate__form{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%}.auth-gate__form .modal__dismiss{margin:0}.auth-gate__form .modal__dismiss--ghost{margin-top:0}.auth-gate__group{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%}.auth-gate__label{font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:#ccc;margin:0}.auth-gate__full-btn{width:100%;height:42px;min-height:42px}.auth-gate__guest-btn{background:#ffffff14}.auth-gate__error{color:#f92a82;font-size:14px}.home-content{display:flex;flex-direction:column;gap:40px;align-items:center}.home-header{width:100%;display:flex;align-items:stretch;border:1px solid rgba(255,255,255,.08)}.home-header__item{padding:12px 16px;display:flex;align-items:center}.home-header__item+.home-header__item{border-left:1px solid rgba(255,255,255,.08)}.home-header__item--progress{flex:1}.home-header__item--progress .home-progress-bar{width:100%}.home-header__stats{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}.home-stat{font-size:14px;color:#fff;font-variant-numeric:tabular-nums}.home-stat__count{font-weight:700}.home-progress-bar{height:6px;background:#fff3;border-radius:2px;overflow:hidden}.home-progress-fill{height:100%;background:#cf0;border-radius:2px;transition:width .3s ease}.home-tile{position:relative;width:100%}.home-tile__stat{font-size:20px;color:#fff;font-variant-numeric:tabular-nums;margin-bottom:16px}.home-tile__actions{display:flex;flex-direction:column;gap:20px}@media(min-width:768px){.home-tile__actions{gap:40px}}.home-tile--learn{display:flex;flex-direction:column;gap:40px}.home-tile__section{display:flex;flex-direction:column;gap:20px;min-width:0}@media(min-width:1024px){.home-tile__section{gap:40px}}@media(min-width:1024px){.home-tile--learn .home-tile__actions{flex-direction:row;flex-wrap:wrap}.home-tile--learn .home-tile__actions .action-card{flex:1 1 320px;min-width:0}}@media(min-width:1024px){.home-tile__actions--exe{flex-direction:row;flex-wrap:wrap}.home-tile__actions--exe .action-card{flex:1 1 240px}}.home-btn-stat{font-size:14px;font-weight:400;font-variant-numeric:tabular-nums;color:#fff}.home-btn-stat__value{color:#fff;font-weight:700;padding-right:8px}.home-btn-stat__total{color:gray}.home-tile__locked-msg{font-family:JetBrains Mono,monospace;font-size:11px;color:gray;margin:0}.home-tile__locked-msg--available{color:#00cfcf}.home-btn-tooltip-wrap{position:relative;display:block}.home-btn-tooltip-wrap:focus-within:after,.home-btn-tooltip-wrap:hover:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);background:#131313;color:#ccc;font-size:12px;padding:4px 10px;border-radius:6px;white-space:nowrap;border:1px solid rgba(255,255,255,.2);pointer-events:none;z-index:10}@media(hover:none){.home-btn-tooltip-wrap:hover:after{content:none}}.debug-toggle{display:flex;align-items:center;gap:8px;font-size:11px;color:gray;cursor:pointer;-webkit-user-select:none;user-select:none}.debug-toggle input[type=checkbox]{accent-color:rgb(0,207,207);width:12px;height:12px;cursor:pointer}.stats-dashboard{width:100%;min-width:0;display:flex;flex-direction:column;gap:20px;padding:10px 0 6px}@media(min-width:1024px){.stats-dashboard{width:auto;flex-shrink:0;padding:0}}.home-welcome{width:100%;margin:0;font-family:JetBrains Mono,monospace;font-size:18px;font-weight:700;text-transform:uppercase;color:#fff;letter-spacing:.05em}.stats-dashboard__boxes{display:flex;gap:40px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-inline:-24px;padding-inline:24px}.stats-dashboard__boxes::-webkit-scrollbar{display:none}@media(min-width:768px){.stats-dashboard__boxes{overflow-x:visible;margin-inline:-40px;padding-inline:40px}}@media(min-width:1024px){.stats-dashboard__boxes{gap:60px;margin-inline:-80px;padding-inline:80px}}@media(min-width:1024px){.activity-dashboard__body .stats-dashboard__boxes{flex-direction:column;align-items:flex-start;flex:1;justify-content:space-between;gap:0;margin-inline:0;padding-inline:0;padding-block:12px}.activity-dashboard__body .stats-dashboard__boxes .stat-box{text-align:left}}.home-tile--dimmed{opacity:.35;cursor:pointer;-webkit-user-select:none;user-select:none}.home-tile__tooltip{background:#131313;color:#fff;font-size:13px;padding:8px 16px;border-radius:8px;border:1px solid rgba(255,255,255,.2);pointer-events:none;white-space:nowrap}.streak-instruction{color:#fff}.quiz-view{display:flex;flex-direction:column}.quiz-score{display:flex;align-items:center;gap:20px}.quiz-score--centered{justify-content:center;padding-top:8px}.quiz-score__correct{display:flex;align-items:center;gap:4px;color:#ebff99;font-size:13px;font-variant-numeric:tabular-nums}.quiz-score__incorrect{display:flex;align-items:center;gap:4px;color:#f92a82;font-size:13px;font-variant-numeric:tabular-nums}.quiz-prompt{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 0 24px;gap:12px;flex:1;min-height:160px}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media(min-width:768px){.quiz-options{width:100%;max-width:440px;margin-inline:auto;gap:12px}}.quiz-option{position:relative;padding:18px 12px;border:1px solid rgba(255,255,255,.08);background:#090909;color:#ccc;font-family:JetBrains Mono,monospace;font-size:16px;letter-spacing:.05em;cursor:pointer;transition:all .15s;text-align:center;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}.quiz-option:not(:disabled):active{border-color:#ffffff59;background:#131313}@media(hover:hover){.quiz-option:hover:not(:disabled){border-color:#ffffff59;background:#131313}}.quiz-option:disabled{cursor:default}.quiz-option__indicator{position:absolute;top:6px;right:8px;line-height:0}.quiz-option--char{font-family:JetBrains Mono,monospace;font-size:36px;padding:16px 8px}@media(min-width:768px){.quiz-option--char{font-size:40px}}.quiz-option--correct{background:#ccff001f;border-color:#ccff0073;color:#ebff99}.quiz-option--incorrect{background:#f92a821a;border-color:#f92a8266;color:#f92a82}.quiz-missed{width:100%}.quiz-missed__label{font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:gray;margin-bottom:10px}.quiz-missed__list{display:flex;flex-wrap:wrap;gap:8px}.quiz-missed__item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 14px;border:1px solid rgba(255,255,255,.2);background:#090909}.quiz-missed__char{font-family:JetBrains Mono,monospace;font-size:24px;color:#fff;line-height:1.2}.quiz-missed__rom{font-family:JetBrains Mono,monospace;font-size:12px;color:gray}.leaderboard-view{padding-top:24px;padding-bottom:40px;max-width:560px;margin-inline:auto}@media(min-width:768px){.leaderboard-view{padding-top:28px}}.leaderboard-header{margin-bottom:24px}.leaderboard-updated{font-family:JetBrains Mono,monospace;font-size:11px;color:gray;letter-spacing:.05em;white-space:nowrap}.leaderboard-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.leaderboard-row{display:flex;align-items:center;gap:16px;padding:16px 24px;background:#00000040;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.leaderboard-row .leaderboard-name{flex:1}.leaderboard-gate{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;text-align:center}.leaderboard-gate__text{font-size:14px;color:gray;margin:0}.leaderboard-gate__hint{margin-top:24px;font-size:12px;color:gray;text-align:center;line-height:1.75}.leaderboard-gate__hint strong{color:gray}.leaderboard-empty{text-align:center;padding:40px 24px;color:gray;font-size:14px}.leaderboard-loading{text-align:center;padding:40px 24px;color:gray;font-family:JetBrains Mono,monospace;font-size:12px}.leaderboard-error{color:#f92a82;font-size:12px;text-align:center;padding:24px}.ds-section{padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:40px}.ds-section:last-child{border-bottom:none}.ds-section__title{font-family:Special Gothic Expanded One,sans-serif;font-size:24px;color:#00cfcf;margin:0 0 24px;letter-spacing:.05em}.ds-section__subtitle{display:block;margin-bottom:8px}.ds-group{margin-bottom:28px}.ds-group:last-child{margin-bottom:0}.ds-grid{display:flex;flex-wrap:wrap;gap:8px}.ds-grid--swatches{gap:16px}.ds-grid--buttons{gap:8px;align-items:center}.ds-grid--components{gap:16px;align-items:flex-start}.ds-grid--cards{gap:16px;flex-wrap:wrap}.ds-grid--cards>*{flex:1;min-width:240px;max-width:360px}.ds-grid--radius{gap:24px;align-items:flex-end}.ds-swatch{display:flex;flex-direction:column;gap:4px;flex:1;min-width:80px;max-width:160px}.ds-swatch__color{width:100%;height:56px;border:1px solid rgba(255,255,255,.08)}.ds-swatch__name{font-family:JetBrains Mono,monospace;font-size:9px;color:#ccc;word-break:break-all}@media(min-width:768px){.ds-swatch__name{font-size:11px}}.ds-swatch__value{font-family:JetBrains Mono,monospace;font-size:8px;color:gray}@media(min-width:768px){.ds-swatch__value{font-size:9px}}.ds-scale{display:flex;flex-direction:column;gap:8px}.ds-scale-row{display:flex;align-items:center;gap:16px}.ds-scale-row__label{min-width:72px;flex-shrink:0;text-align:right;color:gray}.ds-scale-row__steps{display:flex;gap:4px}.ds-scale-step{display:flex;flex-direction:column;align-items:center;gap:4px}.ds-scale-step__color{width:44px;height:44px;border-radius:2px;border:1px solid rgba(255,255,255,.08)}.ds-scale-step__name{font-family:JetBrains Mono,monospace;font-size:9px;color:gray;letter-spacing:0}.ds-type-scale{display:flex;flex-direction:column;gap:16px}.ds-type-row{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05)}.ds-type-meta{min-width:180px;flex-shrink:0}.ds-type-sample{color:#ccc;line-height:1.4}.ds-contrast-table{display:flex;flex-direction:column;gap:8px}.ds-contrast-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05)}.ds-contrast-row__label{min-width:260px;flex-shrink:0;color:#ccc}.ds-contrast-row__context{min-width:140px}.ds-contrast-row__ratio{font-family:JetBrains Mono,monospace;font-size:12px;color:#fff;min-width:60px}.ds-spacing-list{display:flex;flex-direction:column;gap:8px}.ds-spacing-row{display:flex;align-items:center;gap:16px}.ds-spacing-label{min-width:200px;flex-shrink:0}.ds-spacing-bar{height:16px;background:#00cfcf;border-radius:2px;opacity:.6;min-width:4px}.ds-radius-item{display:flex;flex-direction:column;align-items:center;gap:4px}.ds-radius-box{width:56px;height:56px;background:#262626;border:1px solid rgba(255,255,255,.2)}.ds-btn-table{display:flex;flex-direction:column;gap:8px;overflow-x:auto}.ds-btn-table__header{display:grid;grid-template-columns:140px repeat(3,1fr);gap:8px;align-items:center}.ds-btn-table__type-label,.ds-btn-table__size-label{text-align:center}.ds-btn-table__type-label{text-align:left}.ds-btn-row{display:grid;grid-template-columns:140px repeat(3,1fr);gap:16px;align-items:center}.ds-tile-row{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}.ds-tile-item{display:flex;flex-direction:column;gap:8px}.ds-tile-item .char-cell{width:100px;min-height:88px;font-size:36px;animation:none}.ds-progress-states{display:flex;flex-direction:column;gap:16px}.ds-progress-state{display:flex;align-items:center;gap:16px}.ds-progress-state .ds-component-block{flex:1;margin-bottom:0}.ds-state-label{min-width:80px;flex-shrink:0}.ds-component-block{padding:16px;background:#090909;border:1px solid rgba(255,255,255,.08);border-radius:8px}.ds-component-block--narrow{max-width:400px;margin-bottom:8px}
