:root{--cat-primary:#6366f1;--cat-primary-light:#6366f11a;--cat-primary-hover:#4f46e5;--cat-success:#10b981;--cat-success-light:#10b9811a;--cat-danger:#ef4444;--cat-danger-light:#ef44441a;--cat-warning:#f59e0b;--cat-warning-light:#f59e0b1a;--cat-vowel:#8b5cf6;--cat-vowel-light:#8b5cf61a;--cat-consonant:#3b82f6;--cat-consonant-light:#3b82f61a;--cat-semivowel:#14b8a6;--cat-semivowel-light:#14b8a61a;--cat-sign:#f59e0b;--cat-sign-light:#f59e0b1a;--cat-text:#1e293b;--cat-text-secondary:#475569;--cat-text-muted:#64748b;--cat-bg:#fff;--cat-bg-secondary:#f8fafc;--cat-border:#e2e8f0;--cat-border-hover:#cbd5e1;--cat-shadow:0 1px 3px #00000014;--cat-shadow-md:0 4px 12px #00000014;--cat-radius:var(--main-radius,8px);--cat-radius-lg:var(--main-radius-lg,12px);--cat-radius-full:9999px}._cat-container{max-width:800px;margin:0 auto}._cat-hidden{display:none!important}._cat-tabs{background:var(--cat-bg);border-radius:var(--cat-radius-lg);box-shadow:var(--cat-shadow);border-style:solid;border-width:1px;border-color:var(--cat-border);gap:.25rem;margin-bottom:1.5rem;padding:.25rem;display:flex}._cat-tab{color:var(--cat-text-muted);border-radius:var(--cat-radius);cursor:pointer;background:0 0;border:0 solid #0000;flex:1;justify-content:center;align-items:center;gap:.375rem;padding:.625rem .75rem;font-size:.8125rem;font-weight:500;transition:color .2s,background .2s;display:flex}._cat-tab:hover{color:var(--cat-text-secondary);background:var(--cat-bg-secondary)}._cat-tab--active{background:var(--cat-primary);color:#fff;box-shadow:0 2px 8px #6366f140}._cat-tab--active:hover{background:var(--cat-primary);color:#fff}._cat-tab svg{flex-shrink:0;width:16px;height:16px}._cat-panel{display:none}._cat-panel--active{display:block}._cat-panel--animate{animation:.25s catFadeIn}@keyframes catFadeIn{0%{opacity:0}to{opacity:1}}._cat-btn{border-radius:var(--cat-radius);cursor:pointer;border:0 solid #0000;justify-content:center;align-items:center;gap:.375rem;padding:.625rem 1.25rem;font-size:.875rem;font-weight:600;transition:opacity .2s,box-shadow .2s;display:inline-flex}._cat-btn:hover{opacity:.9}._cat-btn svg{width:16px;height:16px}._cat-btn--primary{background:var(--cat-primary);color:#fff;box-shadow:0 2px 8px #6366f140}._cat-btn--secondary{background:var(--cat-bg);color:var(--cat-text-secondary);border-style:solid;border-width:1px;border-color:var(--cat-border)}._cat-btn--secondary:hover{border-color:var(--cat-border-hover)}._cat-btn--sm{padding:.5rem .875rem;font-size:.8125rem}._cat-btn--submit{border-radius:var(--cat-radius);flex-shrink:0;min-width:2.75rem;min-height:2.75rem;padding:.75rem}._cat-setup-label{color:var(--cat-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem;font-size:.8125rem;font-weight:600}._cat-chip{border-radius:var(--cat-radius-full);border-style:solid;border-width:1px;border-color:var(--cat-border);background:var(--cat-bg);min-width:2.5rem;color:var(--cat-text-secondary);cursor:pointer;justify-content:center;align-items:center;padding:.375rem .75rem;font-size:.8125rem;font-weight:500;transition:border-color .2s,background .2s,color .2s;display:inline-flex}._cat-chip:hover{border-color:var(--cat-primary);color:var(--cat-primary)}._cat-chip--active{background:var(--cat-primary);border-color:var(--cat-primary);color:#fff}._cat-chip--active:hover{background:var(--cat-primary-hover);border-color:var(--cat-primary-hover);color:#fff}._cat-option-group{margin-bottom:1rem}._cat-option-label{color:var(--cat-text-secondary);margin-bottom:.5rem;font-size:.8125rem;font-weight:600;display:block}._cat-option-chips{flex-wrap:wrap;gap:.375rem;display:flex}._cat-stat{color:var(--cat-text-secondary);align-items:center;gap:.25rem;font-size:.875rem;font-weight:600;display:inline-flex}._cat-stat-icon{color:var(--cat-warning);display:flex}._cat-stat-label{color:var(--cat-text-muted);font-weight:500}._cat-question-card{background:var(--cat-bg);border-radius:var(--cat-radius-lg);text-align:center;box-shadow:var(--cat-shadow-md);border-style:solid;border-width:1px;border-color:var(--cat-border);margin-bottom:1rem;padding:2rem}._cat-answer-row{justify-content:center;align-items:center;gap:.75rem;display:flex}._cat-answer-input{text-align:center;border-style:solid;border-width:2px;border-color:var(--cat-border);border-radius:var(--cat-radius);background:var(--cat-bg-secondary);width:200px;color:var(--cat-text);outline:none;padding:.75rem 1rem;font-size:1.25rem;font-weight:600}._cat-answer-input:focus{border-color:var(--cat-primary);box-shadow:0 0 0 3px #6366f126}._cat-answer-input--correct{border-color:var(--cat-success);background:var(--cat-success-light);box-shadow:0 0 0 3px #10b98126}._cat-answer-input--wrong{border-color:var(--cat-danger);background:var(--cat-danger-light);box-shadow:0 0 0 3px #ef444426}._cat-feedback{justify-content:center;align-items:center;gap:.25rem;min-height:1.5rem;margin-top:.75rem;font-size:.875rem;font-weight:600;display:flex}._cat-feedback svg{width:16px;height:16px}._cat-feedback--correct{color:var(--cat-success)}._cat-feedback--wrong{color:var(--cat-danger)}._cat-badge{border-radius:var(--cat-radius-full);padding:.125rem .5rem;font-size:.75rem;font-weight:600;display:inline-flex}._cat-badge--new{background:var(--cat-border);color:var(--cat-text-muted)}._cat-badge--learning{background:var(--cat-warning-light);color:#d97706}._cat-badge--mastered{background:var(--cat-success-light);color:#059669}@media (max-width:768px){._cat-container{padding-left:.75rem;padding-right:.75rem}._cat-tabs{margin-bottom:1rem}._cat-tab span{display:none}._cat-tab{min-height:44px;padding:.625rem}._cat-tab svg{width:18px;height:18px}._cat-question-card{padding:1.25rem 1rem}._cat-answer-row{gap:.5rem}._cat-answer-input{flex:1;width:auto;min-width:0;padding:.625rem .75rem;font-size:1.125rem}._cat-btn{min-height:44px}._cat-btn--sm{min-height:40px}._cat-chip{min-height:36px;padding:.5rem .875rem}}@media (max-width:480px){._cat-container{padding-left:.5rem;padding-right:.5rem}._cat-question-card{padding:1rem .75rem}._cat-answer-input{font-size:1rem}}._cat-chart-filters{flex-wrap:wrap;gap:.375rem;margin-bottom:1.25rem;display:flex}._cat-filter-btn{border-radius:var(--cat-radius-full);border-style:solid;border-width:1px;border-color:var(--cat-border);background:var(--cat-bg);color:var(--cat-text-secondary);cursor:pointer;padding:.375rem .75rem;font-size:.8125rem;font-weight:500;transition:border-color .2s,background .2s,color .2s}._cat-filter-btn:hover{border-color:var(--cat-primary);color:var(--cat-primary)}._cat-filter-btn--active{background:var(--cat-primary);border-color:var(--cat-primary);color:#fff}._cat-filter-btn--active:hover{background:var(--cat-primary-hover);border-color:var(--cat-primary-hover);color:#fff}._cat-chart-group{margin-bottom:1.25rem}._cat-chart-group-label{color:var(--cat-text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--cat-border);margin-bottom:.5rem;padding-bottom:.375rem;font-size:.8125rem;font-weight:600}._cat-chart-group-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem;display:grid}._cat-letter-card{border-radius:var(--cat-radius);background:var(--cat-bg);border-style:solid;border-width:1px;border-color:var(--cat-border);box-shadow:var(--cat-shadow);cursor:pointer;flex-direction:column;align-items:center;gap:.125rem;padding:.625rem .375rem;transition:border-color .2s,box-shadow .2s;display:flex;position:relative}._cat-letter-card:hover{border-color:var(--cat-primary);box-shadow:0 2px 8px #6366f126}._cat-letter-card--mastered{border-color:var(--cat-success)}._cat-letter-card--mastered:hover{border-color:var(--cat-success);box-shadow:0 2px 8px #10b98133}._cat-letter-card--learning{border-color:var(--cat-warning)}._cat-letter-card--learning:hover{border-color:var(--cat-warning);box-shadow:0 2px 8px #f59e0b33}._cat-card-letter{color:var(--cat-text);font-size:1.5rem;font-weight:700;line-height:1.2}._cat-card-lower{color:var(--cat-text-muted);font-size:.875rem;font-weight:500}._cat-card-roman{color:var(--cat-primary);font-size:.6875rem;font-weight:600;font-family:var(--main-font-mono)}._cat-card-lookalike{color:var(--cat-danger);background:var(--cat-danger-light);border-radius:3px;padding:0 .25rem;font-size:.5625rem;font-weight:700;line-height:1.4;position:absolute;top:.25rem;right:.375rem}._cat-chart-detail{margin-top:1rem;position:relative}._cat-detail-card{background:var(--cat-bg);border-radius:var(--cat-radius-lg);box-shadow:var(--cat-shadow-md);border-style:solid;border-width:1px;border-color:var(--cat-border);padding:1.5rem;position:relative}._cat-detail-close{color:var(--cat-text-muted);cursor:pointer;background:0 0;border:0 solid #0000;padding:.25rem;display:flex;position:absolute;top:.75rem;right:.75rem}._cat-detail-close:hover{color:var(--cat-text)}._cat-detail-close svg{width:16px;height:16px}._cat-detail-main{text-align:center;margin-bottom:1.25rem}._cat-detail-letter{color:var(--cat-text);letter-spacing:.25rem;font-size:3rem;font-weight:800}._cat-detail-info{grid-template-columns:repeat(2,1fr);gap:.625rem;margin-bottom:1rem;display:grid}._cat-detail-row{background:var(--cat-bg-secondary);border-radius:var(--cat-radius);flex-direction:column;gap:.125rem;padding:.5rem .75rem;display:flex}._cat-detail-label{color:var(--cat-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.6875rem;font-weight:600}._cat-detail-value{color:var(--cat-text);font-size:.9375rem;font-weight:600}._cat-detail-lookalike{border-top-style:dashed;border-top-width:1px;border-top-color:var(--cat-border);margin-top:1rem;padding-top:1rem}._cat-detail-compare{justify-content:center;align-items:center;gap:1.5rem;display:flex}._cat-detail-compare-item{flex-direction:column;align-items:center;gap:.25rem;display:flex}._cat-detail-compare-char{color:var(--cat-text);font-size:2rem;font-weight:800}._cat-detail-compare-label{color:var(--cat-text-muted);font-size:.75rem;font-family:var(--main-font-mono)}._cat-detail-compare-vs{color:var(--cat-danger);text-transform:uppercase;font-size:.875rem;font-weight:700}@media (max-width:768px){._cat-filter-btn{min-height:36px;padding:.5rem .875rem;font-size:.8125rem}._cat-letter-card{min-height:64px;padding:.5rem .375rem}._cat-detail-card{padding:1rem}._cat-detail-close{justify-content:center;align-items:center;min-width:36px;min-height:36px;padding:.5rem}}@media (max-width:480px){._cat-chart-group-grid{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:.375rem}._cat-card-letter{font-size:1.25rem}._cat-card-roman{font-size:.625rem}._cat-detail-info{grid-template-columns:1fr}._cat-detail-letter{font-size:2.5rem}._cat-chart-filters{gap:.25rem}._cat-filter-btn{min-height:34px;padding:.4375rem .625rem;font-size:.75rem}._cat-detail-compare{gap:1rem}._cat-detail-compare-char{font-size:1.75rem}}._cat-practice-setup{text-align:center}._cat-practice-modes{justify-content:center;gap:.5rem;margin-bottom:1rem;display:flex}._cat-practice-desc{color:var(--cat-text-muted);margin-bottom:1.5rem;font-size:.8125rem}._cat-practice-area{text-align:center}._cat-practice-stats{justify-content:center;gap:1.5rem;margin-bottom:1rem;display:flex}._cat-question-text{margin-bottom:1.5rem}._cat-question-letter{color:var(--cat-text);letter-spacing:.5rem;font-size:3.5rem;font-weight:800}._cat-question-roman{color:var(--cat-primary);font-size:2.5rem;font-weight:700;font-family:var(--main-font-mono)}._cat-question-hint{color:var(--cat-text-muted);margin-top:.25rem;font-size:.875rem;display:block}@media (max-width:768px){._cat-practice-stats{flex-wrap:wrap;gap:1rem}._cat-practice-modes{flex-wrap:wrap}}@media (max-width:480px){._cat-question-letter{letter-spacing:.25rem;font-size:2.5rem}._cat-question-roman{font-size:2rem}._cat-practice-modes{flex-direction:column;align-items:stretch}._cat-practice-modes ._cat-chip{width:100%}._cat-question-text{margin-bottom:1rem}}._cat-quiz-setup{text-align:center}._cat-quiz-config{text-align:left;max-width:500px;margin:0 auto 1.5rem}._cat-quiz-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}._cat-quiz-progress{color:var(--cat-text-secondary);font-size:.875rem;font-weight:600}._cat-quiz-timer{color:var(--cat-text-secondary);font-size:.875rem;font-weight:700;font-family:var(--main-font-mono)}._cat-timer-bar{background:var(--cat-border);border-radius:var(--cat-radius-full);height:4px;margin-bottom:1.25rem;overflow:hidden}._cat-timer-bar-fill{background:var(--cat-primary);border-radius:var(--cat-radius-full);width:100%;height:100%;transition:width 1s linear}._cat-timer-bar-fill--danger{background:var(--cat-danger)}._cat-quiz-question{text-align:center;margin-bottom:1.5rem}._cat-quiz-letter{color:var(--cat-text);letter-spacing:.5rem;font-size:3.5rem;font-weight:800}._cat-quiz-roman-q{color:var(--cat-primary);font-size:2.5rem;font-weight:700;font-family:var(--main-font-mono)}._cat-quiz-hint{color:var(--cat-text-muted);margin-top:.25rem;font-size:.8125rem;display:block}._cat-quiz-options{grid-template-columns:repeat(2,1fr);gap:.625rem;display:grid}._cat-quiz-option{border-radius:var(--cat-radius);border-style:solid;border-width:2px;border-color:var(--cat-border);background:var(--cat-bg);color:var(--cat-text);cursor:pointer;padding:.875rem 1rem;font-size:1.125rem;font-weight:600;transition:border-color .2s,background .2s}._cat-quiz-option:hover{border-color:var(--cat-primary);background:var(--cat-primary-light)}._cat-quiz-option--correct{border-color:var(--cat-success);background:var(--cat-success-light);color:#059669}._cat-quiz-option--wrong{border-color:var(--cat-danger);background:var(--cat-danger-light);color:#dc2626}._cat-quiz-result{text-align:center}._cat-result-score{margin-bottom:1.5rem}._cat-result-pct{color:var(--cat-primary);font-size:3rem;font-weight:800;display:block}._cat-result-fraction{color:var(--cat-text-muted);font-size:1rem}._cat-result-stats{grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:1.5rem;display:grid}._cat-result-stat{background:var(--cat-bg);border-radius:var(--cat-radius-lg);box-shadow:var(--cat-shadow);border-style:solid;border-width:1px;border-color:var(--cat-border);padding:.75rem}._cat-result-stat-value{color:var(--cat-text);justify-content:center;align-items:center;gap:.25rem;font-size:1.25rem;font-weight:800;display:flex}._cat-result-stat-value svg{width:16px;height:16px}._cat-result-stat--correct{color:var(--cat-success)}._cat-result-stat--wrong{color:var(--cat-danger)}._cat-result-stat-label{color:var(--cat-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:.125rem;font-size:.6875rem}._cat-result-actions{margin-top:1.5rem}._cat-result-wrong{text-align:left;margin-top:1rem}._cat-result-wrong-title{color:var(--cat-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;font-size:.8125rem;font-weight:600}._cat-result-wrong-list{flex-wrap:wrap;gap:.5rem;display:flex}._cat-result-wrong-item{background:var(--cat-danger-light);border-radius:var(--cat-radius);align-items:center;gap:.375rem;padding:.375rem .75rem;font-size:.8125rem;display:inline-flex}._cat-result-wrong-letter{color:var(--cat-text);font-size:1rem;font-weight:700}._cat-result-wrong-roman{color:var(--cat-text-secondary)}@media (max-width:768px){._cat-quiz-option{min-height:48px;padding:.875rem;font-size:1rem}._cat-quiz-options{gap:.5rem}._cat-quiz-question{margin-bottom:1rem}._cat-result-stats{grid-template-columns:repeat(3,1fr);gap:.5rem}._cat-result-stat{padding:.625rem .5rem}._cat-result-stat-value{font-size:1.125rem}}@media (max-width:480px){._cat-quiz-letter{letter-spacing:.25rem;font-size:2.5rem}._cat-quiz-roman-q{font-size:2rem}._cat-quiz-options{grid-template-columns:1fr}._cat-quiz-option{font-size:1rem}._cat-result-pct{font-size:2.5rem}._cat-result-wrong-list{gap:.375rem}._cat-result-wrong-item{padding:.375rem .625rem;font-size:.75rem}}._cat-progress-stats{grid-template-columns:repeat(3,1fr);gap:.75rem;min-height:5rem;margin-bottom:1.5rem;display:grid}._cat-progress-stat-card{background:var(--cat-bg);border-radius:var(--cat-radius-lg);text-align:center;box-shadow:var(--cat-shadow);border-style:solid;border-width:1px;border-color:var(--cat-border);padding:1rem}._cat-progress-stat-value{color:var(--cat-primary);font-size:1.5rem;font-weight:800}._cat-progress-stat-label{color:var(--cat-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:.125rem;font-size:.75rem}._cat-mastery-grid{min-height:200px;margin-bottom:1rem}._cat-mastery-group{margin-bottom:1rem}._cat-mastery-group-label{color:var(--cat-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;font-size:.75rem;font-weight:600}._cat-mastery-group-items{flex-wrap:wrap;gap:.5rem;display:flex}._cat-mastery-item{border-radius:var(--cat-radius);background:var(--cat-bg);border-style:solid;border-width:1px;border-color:var(--cat-border);min-width:3.5rem;box-shadow:var(--cat-shadow);flex-direction:column;align-items:center;gap:.125rem;padding:.5rem;display:flex}._cat-mastery-item--mastered{border-color:var(--cat-success);background:var(--cat-success-light)}._cat-mastery-item--learning{border-color:var(--cat-warning);background:var(--cat-warning-light)}._cat-mastery-letter{color:var(--cat-text);font-size:1.125rem;font-weight:700}._cat-mastery-roman{color:var(--cat-text-muted);font-size:.6875rem;font-family:var(--main-font-mono)}._cat-mastery-dots{gap:.1875rem;margin-top:.125rem;display:flex}._cat-mastery-dot{border-radius:var(--cat-radius-full);background:var(--cat-border);width:.375rem;height:.375rem}._cat-mastery-dot--filled{background:var(--cat-success)}._cat-mastery-legend{justify-content:center;gap:1.25rem;margin-bottom:1rem;display:flex}._cat-legend-item{color:var(--cat-text-muted);align-items:center;gap:.375rem;font-size:.8125rem;display:flex}._cat-legend-dot{border-radius:var(--cat-radius-full);width:.75rem;height:.75rem}._cat-legend-dot--new{background:var(--cat-border)}._cat-legend-dot--learning{background:var(--cat-warning)}._cat-legend-dot--mastered{background:var(--cat-success)}._cat-progress-actions{text-align:center}@media (max-width:768px){._cat-progress-stats{grid-template-columns:repeat(3,1fr);gap:.5rem}._cat-progress-stat-card{padding:.75rem .5rem}._cat-progress-stat-value{font-size:1.25rem}._cat-mastery-legend{flex-wrap:wrap;gap:.875rem}}@media (max-width:480px){._cat-progress-stats{grid-template-columns:repeat(3,1fr)}._cat-progress-stat-value{font-size:1.0625rem}._cat-progress-stat-label{font-size:.625rem}._cat-mastery-item{min-width:2.75rem;padding:.375rem .25rem}._cat-mastery-letter{font-size:1rem}._cat-mastery-group-items{gap:.375rem}._cat-mastery-legend{flex-flow:wrap;justify-content:center;gap:.5rem .875rem}._cat-legend-item{font-size:.75rem}}