.question-center{text-align:center;margin-bottom:32px}.listen-section{margin-bottom:20px}.listen-button{font-size:36px;background:#8b5cf633;border:2px solid #8b5cf6;border-radius:50%;width:80px;height:80px;color:#8b5cf6;cursor:pointer;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;transition:all .2s}.listen-button:hover{background:#8b5cf64d;transform:scale(1.05)}.listen-text{font-size:14px;color:#fff9;font-family:JetBrains Mono,Fira Code,Consolas,Monaco,monospace}.item-display{margin-bottom:20px}.question-text{font-size:14px;color:#fff6;margin-top:8px}.answer-options{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.answer-button{transition:opacity .3s}.answer-button.faded,.answer-button.disabled{opacity:.3}.feedback-section{text-align:center;margin-top:20px}.incorrect-feedback{font-size:18px;font-weight:700;margin-bottom:16px;padding:10px 20px;border-radius:8px;background:#ef444433;border:2px solid #ef4444;color:#ef4444;text-align:center;display:inline-block}.correct-feedback{font-size:18px;font-weight:700;margin-bottom:16px;padding:10px 20px;border-radius:8px;background:#22c55e33;border:2px solid #22c55e;color:#22c55e;text-align:center;display:inline-block}.next-button-section{text-align:center;margin-top:12px}.quiz-results{text-align:center;padding-top:40px}.quiz-results__emoji{font-size:48px;margin-bottom:10px}.quiz-results__score{font-size:28px;font-weight:700;margin-bottom:8px}.quiz-results__streak{color:#ffffff80;margin-bottom:8px}.quiz-results__message{color:#fff6;margin-bottom:28px}.quiz-results__actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.quiz-header-box{display:flex;flex-direction:column;margin-bottom:16px;padding:10px 14px;border-radius:12px;background:linear-gradient(145deg,#111118f2,#191922d9);border:1px solid rgba(255,255,255,.12);box-shadow:0 4px 16px #00000038}.quiz-header-box--compact{margin-bottom:10px;padding:8px 10px}.quiz-header-row{display:flex;justify-content:space-between;align-items:center;width:100%}.quiz-header-info{display:flex;gap:16px;font-size:13px;color:#ffffff80;font-family:JetBrains Mono,Fira Code,Consolas,Monaco,monospace;font-weight:500;flex:1;justify-content:center}.quiz-header-info--compact{font-size:12px}.quiz-header-controls{display:flex;gap:6px}.quiz-header-nav{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:16px}.quiz-header-nav--compact{flex-direction:column;align-items:stretch;margin-bottom:8px;gap:8px}.quiz-header-stats{display:flex;gap:16px;font-size:14px;color:#ffffff80;font-family:JetBrains Mono,Fira Code,Consolas,Monaco,monospace;flex:1;justify-content:center}.quiz-header-stats--compact{flex:unset}.quiz-progress{height:4px;background:#ffffff1a;border-radius:2px;margin-bottom:24px;overflow:hidden}.quiz-progress__fill{height:100%;width:var(--progress, 0%);background:linear-gradient(90deg,#eab308,#f59e0b);transition:width .3s}.tone-actions{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap}.tone-section{margin-bottom:24px}.tone-card-grid{display:flex;gap:12px;flex-wrap:wrap}.tone-card{flex:var(--tone-flex, 1 1 18%);cursor:pointer;padding:var(--tone-padding, 24px 16px)}.tone-card__symbol{font-size:clamp(36px,5vw,44px);font-weight:800}.tone-card__title{font-size:clamp(16px,2.2vw,18px);font-weight:700}.tone-card__thai{font-size:clamp(12px,1.8vw,14px);color:#ffffff80}.tone-card__description{font-size:clamp(12px,1.8vw,14px);color:#fff6;margin-top:4px}.tone-card__example{font-size:clamp(20px,2.6vw,24px);margin-top:8px;opacity:.7}.tone-mark-card__symbol{font-size:clamp(44px,6vw,56px);font-weight:700;color:#eab308}.tone-mark-card__title{font-size:clamp(16px,2.2vw,18px);font-weight:700;color:#fffc}.tone-mark-card__example{font-size:clamp(20px,2.6vw,24px);color:#eab308;margin-top:8px;opacity:.7}.tone-grid-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.tone-grid-table{border-collapse:collapse;width:100%;min-width:600px}.tone-grid-table__head{padding:8px;text-align:center;font-size:10px;color:#ffffff80;border-bottom:1px solid rgba(255,255,255,.15);white-space:pre-line;line-height:1.3}.tone-grid-table__head--left{text-align:left;font-size:11px}.tone-grid-table__class-cell{padding:8px;font-weight:700;font-size:13px;border-bottom:1px solid rgba(255,255,255,.08)}.tone-grid-table__class-thai{font-size:11px;opacity:.7}.tone-grid-table__cell{padding:8px;text-align:center;border-bottom:1px solid rgba(255,255,255,.08)}.tone-grid-table__tone-symbol{font-size:16px;font-weight:700}.tone-grid-table__tone-label{font-size:10px;font-weight:600}.tone-grid-table__empty-cell{font-size:14px;color:#fff3}.tone-example-card__thai{font-size:clamp(36px,5vw,44px);font-weight:400;color:var(--tone-color, #eab308);min-width:60px;text-align:center}.tone-example-card__content{flex:1}.tone-example-card__formula{font-size:clamp(13px,2vw,14px);color:#ffffffb3}.tone-example-card__class{font-weight:700}.tone-example-card__result{font-size:clamp(16px,2.2vw,18px);font-weight:700;color:var(--tone-color, #eab308);margin-top:4px}.tone-quiz-option__symbol{font-size:clamp(32px,5vw,40px);font-weight:800}.tone-quiz-option__label{font-size:clamp(14px,2.2vw,16px);font-weight:700}.tone-quiz-item__thai{font-size:80px;font-weight:400;cursor:pointer;line-height:1;margin-bottom:8px;color:var(--tone-color, #eab308);transition:color .15s}.tone-quiz-item__romanization{font-size:clamp(18px,2.8vw,20px);color:#ffffff8c;font-family:var(--font-mono);margin-bottom:6px}.tone-quiz-item__translation{font-size:14px;color:#fff6}.tone-quiz-item__hint-box{margin-top:12px;padding:8px 16px;border-radius:8px;background:#ffffff0f;display:inline-block}.tone-quiz-item__hint-text{font-size:13px;color:#fff9}.tone-quiz-item__hint-class,.tone-quiz-item__hint-tone{font-weight:700}.tone-tree-question-block{text-align:center;margin-bottom:24px}.tone-tree-question-block__thai{font-size:72px;font-weight:400;color:#eab308;cursor:pointer;line-height:1;margin-bottom:8px}.tone-tree-question-block__translation{font-size:14px;color:#fff6}.tone-tree-summary{display:flex;gap:8px;justify-content:center;margin-bottom:16px;flex-wrap:wrap}.tone-tree-summary__chip{padding:4px 10px;border-radius:12px;font-size:12px;font-weight:700;background:var(--chip-bg, rgba(255, 255, 255, .12));border:var(--chip-border, 1px solid rgba(255, 255, 255, .3));color:var(--chip-color, #fff)}.tone-tree-step-title-wrap{text-align:center;margin-bottom:20px}.tone-tree-step-title{font-size:15px;color:#ffffffb3;font-weight:600}.tone-tree-options{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.tone-tree-option__title{font-size:18px;font-weight:700}.tone-tree-option__subtitle{font-size:11px;color:#ffffff80}.tone-tree-option__subtitle--dim{color:#fff6}.tone-tree-option__title--nomark{color:#94a3b8;font-size:16px}.tone-tree-option__title--live{color:#22c55e}.tone-tree-option__title--dead{color:#ef4444}.tone-tree-option__title--short{color:#f59e0b}.tone-tree-option__title--long{color:#3b82f6}.tone-tree-option__mark-char{font-size:28px;font-weight:700;color:#eab308}.tone-tree-option__tone-symbol{font-size:22px;font-weight:800}.tone-tree-option__tone-label{font-size:12px;font-weight:700}.tone-tree-result-wrap{text-align:center;width:100%}.tone-tree-result-card{padding:20px;border-radius:12px;margin-bottom:16px;background:var(--result-bg, rgba(255, 255, 255, .08));border:var(--result-border, 2px solid rgba(255, 255, 255, .2))}.tone-tree-result-card__icon{font-size:36px;margin-bottom:8px}.tone-tree-result-card__title{font-size:16px;color:#ffffffb3;margin-bottom:8px}.tone-tree-result-card__tone{font-weight:800}.tone-tree-result-card__formula{font-size:13px;color:#ffffff80}.trainer-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:10px 14px;border-radius:14px;background:#ffffff0a;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 20px #0003}.trainer-topbar__back{padding:8px 16px;min-height:40px;border-radius:10px;font-size:13px;cursor:pointer;font-family:var(--font-mono);font-weight:700;background:color-mix(in srgb,var(--trainer-accent, #eab308) 18%,transparent);border:2px solid var(--trainer-accent, #eab308);color:#fff;transition:background .18s ease,transform .12s ease;white-space:nowrap;-webkit-tap-highlight-color:transparent}.trainer-topbar__back:hover{background:color-mix(in srgb,var(--trainer-accent, #eab308) 30%,transparent)}.trainer-topbar__back:active{transform:scale(.95)}.trainer-topbar__controls{display:flex;align-items:center;gap:8px}.trainer-menu-header{text-align:center;margin-bottom:36px}.trainer-menu-header--mobile{margin-bottom:28px}.trainer-menu-header__kicker{font-size:12px;letter-spacing:4px;text-transform:uppercase;color:var(--trainer-accent, #eab308);margin-bottom:10px;font-family:var(--font-mono);font-weight:700}.trainer-menu-header__title{font-size:52px;font-weight:800;margin:0;background:linear-gradient(135deg,var(--trainer-accent, #eab308),var(--trainer-accent-dark, #d97706));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.2;filter:drop-shadow(0 2px 8px rgba(0,0,0,.4))}.trainer-menu-header__title--mobile{font-size:40px}.trainer-menu-header__subtitle{color:#ffffff94;font-size:14px;margin-top:10px;margin-bottom:0;font-family:var(--font-mono);font-weight:500;line-height:1.5}.trainer-section-label{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:#ffffff61;margin-bottom:12px;font-family:var(--font-mono);font-weight:600}.trainer-module-list{display:flex;flex-direction:column;gap:10px;margin-bottom:32px}.trainer-module-btn{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:14px;cursor:pointer;text-align:left;width:100%;min-height:72px;background:#ffffff0d;border:1.5px solid color-mix(in srgb,var(--module-color) 22%,transparent);transition:background .18s ease,border-color .18s ease,transform .12s ease;-webkit-tap-highlight-color:transparent}.trainer-module-btn:hover{background:color-mix(in srgb,var(--module-color) 8%,transparent);border-color:color-mix(in srgb,var(--module-color) 42%,transparent)}.trainer-module-btn:active{transform:scale(.98)}.trainer-module-btn--mobile{gap:14px;padding:16px 18px}.trainer-module-btn__icon{width:48px;height:48px;border-radius:12px;flex-shrink:0;background:color-mix(in srgb,var(--module-color) 12%,transparent);border:1.5px solid color-mix(in srgb,var(--module-color) 28%,transparent);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;color:var(--module-color);font-family:var(--font-thai)}.trainer-module-btn__content{flex:1;min-width:0}.trainer-module-btn__meta{display:flex;align-items:center;gap:8px;margin-bottom:3px}.trainer-module-btn__number{font-size:11px;color:#ffffff61;font-family:var(--font-mono);font-weight:700;text-transform:uppercase;letter-spacing:.08em}.trainer-module-btn__title{font-size:17px;font-weight:700;color:#fff;line-height:1.3}.trainer-module-btn__title--mobile{font-size:16px}.trainer-module-btn__thai{color:var(--module-color);font-size:15px;font-family:var(--font-thai)}.trainer-module-btn__thai--mobile{font-size:14px}.trainer-module-btn__desc{font-size:12px;color:#ffffff7a;margin-top:3px;font-family:var(--font-mono);line-height:1.4}.trainer-module-btn__arrow{color:var(--module-color);font-size:18px;font-weight:700;opacity:.55;flex-shrink:0}@media(max-width:640px){.trainer-topbar{margin-bottom:16px;padding:8px 12px}.trainer-topbar__back{padding:6px 12px;font-size:12px;min-height:36px}.trainer-menu-header{margin-bottom:24px}.trainer-module-btn{padding:14px 16px;gap:12px}.trainer-module-btn__icon{width:44px;height:44px;font-size:18px}}.thai-tonal-trainer{--trainer-accent: #a855f7;--trainer-accent-dark: #6d28d9;background:linear-gradient(160deg,#0d0b09,#111118 55%,#0c0e0d);color:#fff;font-family:var(--font-thai);outline:none;-webkit-tap-highlight-color:transparent;min-height:100vh;overflow:auto}.thai-tonal-trainer__content{max-width:800px;margin:0 auto;padding:36px 24px}.thai-tonal-trainer__content--mobile{max-width:100%;padding:20px 16px}.thai-tonal-trainer__pill{padding:8px 14px;border-radius:8px;font-size:13px;cursor:pointer;font-family:var(--font-mono);white-space:nowrap;font-weight:700;background:#ffffff1f;border:2px solid rgba(255,255,255,.3);color:#fffc;transition:all .15s}.thai-tonal-trainer__pill--active{background:#eab3084d;border:2px solid #eab308;color:#fff}.thai-tonal-trainer__module-header{margin-bottom:22px;padding:14px 16px;border-radius:14px;background:#ffffff0a;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 24px #00000038}.thai-tonal-trainer__module-header--mobile{margin-bottom:14px;padding:12px}.thai-tonal-trainer__module-header-main{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px}.thai-tonal-trainer__header-back{padding:9px 14px;border-radius:10px;border:1px solid rgba(234,179,8,.6);background:#eab30829;color:#fef3c7;font-family:var(--font-mono);font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .18s ease}.thai-tonal-trainer__header-back:hover{background:#eab30840;border-color:#fbbf24}.thai-tonal-trainer__module-heading{margin:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;text-align:center;font-size:22px;line-height:1.28;font-weight:700}.thai-tonal-trainer__module-heading--mobile{font-size:16px;gap:6px}.thai-tonal-trainer__module-tag{display:inline-flex;align-items:center;justify-content:center;padding:3px 8px;border-radius:999px;border:1px solid rgba(168,85,247,.58);background:#a855f72e;color:#ddd6fe;font-size:11px;letter-spacing:.06em;font-family:var(--font-mono);text-transform:uppercase}.thai-tonal-trainer__module-heading-thai{color:#facc15;text-shadow:0 0 20px rgba(234,179,8,.25)}.thai-tonal-trainer__header-controls{display:inline-flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px}.thai-tonal-trainer__header-toggle{min-width:42px;padding:8px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:#ffffff1a;color:#ffffffdb;font-size:13px;font-weight:700;font-family:var(--font-mono);cursor:pointer;transition:all .18s ease}.thai-tonal-trainer__header-toggle:hover{border-color:#ffffff6b;background:#ffffff29}.thai-tonal-trainer__header-toggle--active{background:#eab30842;border-color:#eab308f2;color:#fff}.thai-tonal-trainer__tts-label{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:#eab308;margin-bottom:12px;font-family:var(--font-mono);font-weight:600}.thai-tonal-trainer__tts-box{margin-top:32px;padding:20px;border-radius:12px;background:#eab3080d;border:2px solid rgba(234,179,8,.2)}.thai-tonal-trainer__tts-label{color:#eab308;margin-bottom:16px}.thai-tonal-trainer__tts-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.thai-tonal-trainer__tts-input{flex:1;min-width:300px;padding:12px;border-radius:8px;background:#ffffff14;border:2px solid rgba(255,255,255,.15);color:#fff;font-size:16px;font-family:var(--font-input);outline:none}.thai-tonal-trainer__tts-input--mobile{min-width:100%}.thai-tonal-trainer__tts-play{padding:12px 24px;border-radius:8px;background:#eab30833;border:2px solid #eab308;color:#eab308;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s;font-family:var(--font-mono)}.thai-tonal-trainer__tts-play:hover{background:#eab3084d}.module-actions{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap}.module-section{margin-bottom:24px}.card-roman{color:#fff9;font-family:JetBrains Mono,Fira Code,Consolas,Monaco,monospace;margin-bottom:4px}.card-roman--sm{font-size:14px}.card-roman--md{font-size:16px}.card-detail{color:#fff6;margin-top:2px}.card-detail--sm{font-size:12px}.card-detail--md{font-size:14px}@media(max-width:640px){.thai-tonal-trainer__module-header-main{grid-template-columns:1fr;justify-items:stretch}.thai-tonal-trainer__header-back{justify-self:flex-start;padding:7px 11px;font-size:12px}.thai-tonal-trainer__header-controls{justify-content:flex-start}.thai-tonal-trainer__header-toggle{min-width:38px;padding:7px 9px;font-size:12px}.thai-tonal-trainer{padding-bottom:env(safe-area-inset-bottom)}}.classifier-filter-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.classifier-card-expanded{margin-top:16px;text-align:left}.classifier-card-tip{font-size:13px;color:#ffffffa6;font-family:var(--font-mono);background:#ffffff0d;border-radius:8px;padding:10px 14px;margin-bottom:14px;line-height:1.6}.classifier-card-tip-label{color:#10b981;font-weight:700}.classifier-card-sentence{padding:14px 16px;border-radius:10px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);margin-bottom:14px;text-align:center;cursor:pointer;transition:background .15s}.classifier-card-sentence:hover{background:#ffffff12}.classifier-card-examples{margin-top:6px}.classifier-examples-list{display:flex;flex-wrap:wrap;gap:8px}.classifier-example-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 12px;border-radius:8px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);cursor:pointer;transition:background .15s;min-width:80px}.classifier-example-item:hover{background:#ffffff17}.classifier-quiz-progress{margin-bottom:20px}.classifier-quiz-progress-bar{height:4px;border-radius:2px;background:#ffffff1a;overflow:hidden;margin-bottom:8px}.classifier-quiz-progress-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,#10b981,#34d399);transition:width .3s ease}.classifier-quiz-meta{display:flex;gap:16px;align-items:center}.classifier-quiz-question-area{text-align:center;margin-bottom:24px;padding:24px 16px;border-radius:14px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1)}.classifier-quiz-q-label{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#fff6;font-family:var(--font-mono);font-weight:600;margin-bottom:16px}.classifier-quiz-noun{display:inline-block;cursor:pointer}.classifier-quiz-options{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:20px}.classifier-quiz-feedback{padding:16px 20px;border-radius:12px;margin-top:8px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.classifier-quiz-feedback--correct{background:#22c55e1a;border:1px solid rgba(34,197,94,.3)}.classifier-quiz-feedback--wrong{background:#ef444414;border:1px solid rgba(239,68,68,.25)}.classifier-quiz-feedback-text{font-size:15px;font-weight:600;color:#ffffffd9;font-family:var(--font-mono)}.classifier-quiz-tip{font-size:13px;color:#ffffff8c;font-family:var(--font-mono);max-width:480px;line-height:1.5}.classifier-quiz-sentence-display{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;cursor:pointer;margin-bottom:8px}.classifier-quiz-sentence-noun{font-size:48px;font-weight:700;color:#fbbf24}.classifier-quiz-sentence-num{font-size:40px;font-weight:600;color:#60a5fa}.classifier-quiz-sentence-blank{font-size:48px;font-weight:700;border-bottom:3px solid rgba(255,255,255,.2);min-width:80px;text-align:center;transition:color .15s}.classifier-quiz-sentence-hint{font-size:13px;color:#fff6;font-family:var(--font-mono);margin-top:8px}@media(max-width:640px){.classifier-quiz-sentence-noun,.classifier-quiz-sentence-blank{font-size:36px}.classifier-quiz-sentence-num{font-size:30px}.classifier-quiz-sentence-display{gap:10px}}.thai-classifier-trainer{--trainer-accent: #10b981;--trainer-accent-dark: #047857;background:linear-gradient(160deg,#0a0d0b,#0f1a14 55%,#0c0e0d);color:#fff;font-family:var(--font-thai);outline:none;-webkit-tap-highlight-color:transparent;min-height:100vh;overflow:auto}.thai-classifier-trainer__content{max-width:800px;margin:0 auto;padding:36px 24px}.thai-classifier-trainer__content--mobile{max-width:100%;padding:20px 16px}.thai-classifier-trainer__pattern-box{margin-bottom:24px;padding:18px 20px;border-radius:14px;background:#10b9810f;border:1px solid rgba(16,185,129,.22);text-align:center}.thai-classifier-trainer__pattern-label{display:block;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#10b981;font-family:var(--font-mono);font-weight:700;margin-bottom:12px}.thai-classifier-trainer__pattern-demo{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.thai-classifier-trainer__pattern-part{padding:8px 16px;border-radius:10px;font-size:26px;font-weight:700;font-family:var(--font-thai)}.thai-classifier-trainer__pattern-part--noun{background:#f59e0b26;border:2px solid rgba(245,158,11,.4);color:#fbbf24}.thai-classifier-trainer__pattern-part--num{background:#3b82f626;border:2px solid rgba(59,130,246,.4);color:#60a5fa}.thai-classifier-trainer__pattern-part--clf{background:#10b98126;border:2px solid rgba(16,185,129,.5);color:#34d399}.thai-classifier-trainer__pattern-sep{font-size:18px;color:#ffffff4d;font-family:var(--font-mono)}.thai-classifier-trainer__pattern-hint{margin-top:10px;font-size:12px;color:#fff6;font-family:var(--font-mono)}.thai-classifier-trainer__tts-box{margin-top:8px;padding:18px 20px;border-radius:12px;background:#10b9810d;border:1.5px solid rgba(16,185,129,.18)}.thai-classifier-trainer__tts-label{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#10b981;margin-bottom:10px;font-family:var(--font-mono);font-weight:700}.thai-classifier-trainer__tts-hint{font-size:13px;color:#ffffffa6;margin:0;font-family:var(--font-mono);line-height:1.6}@media(max-width:640px){.thai-classifier-trainer__pattern-part{font-size:20px;padding:6px 12px}.thai-classifier-trainer{padding-bottom:env(safe-area-inset-bottom)}}.app-base{background:linear-gradient(160deg,#0d0b09,#111118 55%,#0c0e0d);color:#fff;font-family:var(--font-thai);outline:none;-webkit-tap-highlight-color:transparent}.app-base--full-height{min-height:100vh;overflow:auto}.app-base--fixed{position:fixed;top:0;left:0;right:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;box-sizing:border-box}.google-fonts{font-family:var(--font-mono)}.container{max-width:800px;margin:0 auto;padding:36px 24px;box-sizing:border-box}.container--mobile{max-width:100%;padding:20px 16px}.container--narrow{max-width:500px}.container--explore{padding:36px 10px}.container--drill-words{flex:1;display:flex;flex-direction:column;width:auto;overflow:hidden}.visual-keyboard{-webkit-user-select:none;user-select:none;width:100%;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:0;box-sizing:border-box}.visual-keyboard__row-wrapper{display:inline-block;min-width:750px}.visual-keyboard__row-wrapper--compact{display:block;min-width:0;width:100%}.visual-keyboard__row{display:flex;gap:4px;margin-bottom:4px;width:auto;overflow:hidden}.visual-keyboard__row--compact{gap:2px;margin-bottom:2px;padding-left:0;width:100%}.visual-keyboard__row--offset{padding-left:0}.vk-key{height:54px;border-radius:8px;background:#fffffff2;border:2px solid rgba(150,150,150,.6);flex-shrink:0;min-width:0;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:all .1s;cursor:pointer;box-shadow:0 2px 4px #0000001a}.vk-key--compact{height:38px;border-radius:5px;flex-shrink:1;flex:1}.vk-key--disabled{background:#e6e6e6e6;border:2px solid rgba(180,180,180,.6);color:#64646499}.vk-key--target{background:#ffffc8f2;border:2px solid #ffcc00}.vk-key--pressed{background:#c8c8c8f2;border:2px solid rgba(120,120,120,.8)}.vk-key--pressed-correct{background:#c8ffc8f2;border:2px solid #2d9b10}.vk-key__char-main{font-size:18px;line-height:1;color:#000000e6;font-weight:600}.vk-key__char-main--compact{font-size:14px}.vk-key__char-main--target{color:#000;font-weight:800}.vk-key__char-shift{font-size:10px;color:#000000b3;line-height:1;font-weight:500;margin-top:1}.vk-key__char-shift--compact{font-size:8px}.vk-key__char-shift--target{color:#000c}.vk-key__physical{font-size:8px;color:#00000080;line-height:1;font-weight:700;margin-top:1;font-family:var(--font-mono)}.vk-key--shift,.vk-key--backspace,.vk-key--tab,.vk-key--caps,.vk-key--enter{background:#f0f0f0e6;border:2px solid rgba(150,150,150,.6);color:#000c;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center}.vk-key--shift-active{background:#90ee90cc;border:2px solid #2d9b10;color:#2d9b10;box-shadow:0 0 10px #90ee9080}.vk-key--shift{width:118px}.vk-key--tab,.vk-key--backspace{width:84px}.vk-key--enter{width:111px}.vk-key--regular{width:48px}.alphabet-carousel__header{margin-bottom:22px;padding:16px;border-radius:14px;background:linear-gradient(145deg,#111118f2,#191922d9);border:1px solid rgba(255,255,255,.12);box-shadow:0 10px 24px #00000047}.alphabet-carousel__header--grid{margin-top:8px}.alphabet-page-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:14px;padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(150deg,#1d1d26eb,#101018e6);box-shadow:0 10px 28px #00000047;gap:12px}.alphabet-page-header--compact{flex-direction:column;align-items:stretch;gap:8px;margin-bottom:8px}.alphabet-page-header__top-row{display:flex;justify-content:space-between;align-items:center;width:100%;gap:12px}.alphabet-page-header__controls{display:flex;gap:6px}.alphabet-page-header__title{font-size:12px;color:#ffffff9e;font-family:var(--font-mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:40%;font-weight:600;text-align:center;letter-spacing:.03em}.alphabet-view-toggle{display:inline-flex;background:#ffffff0f;border:1px solid rgba(255,255,255,.22);border-radius:10px;padding:3px;gap:4px}.alphabet-view-toggle__btn{padding:6px 12px;border-radius:8px;cursor:pointer;font-size:12px;font-weight:700;font-family:var(--font-mono);background:transparent;border:1px solid transparent;color:#ffffffb8;transition:all .15s}.alphabet-view-toggle__btn:hover{background:#ffffff1a}.alphabet-view-toggle__btn--active{background:#eab3084d;border-color:#eab308b8;color:#fff}.alphabet-carousel__header--compact{margin-bottom:14px;padding:12px}.alphabet-carousel__tabs{display:flex;gap:8px;justify-content:center;width:100%}.alphabet-carousel__tabs .alphabet-btn{padding:10px 18px;border-radius:10px;background:#ffffff1a;border:1px solid rgba(255,255,255,.25);color:#ffffffb3;cursor:pointer;font-size:13px;font-weight:600;font-family:var(--font-mono);transition:all .18s ease}.alphabet-carousel__tabs .alphabet-btn:hover{border-color:#ffffff6b;background:#ffffff29}.alphabet-carousel__tabs .alphabet-btn--active{background:#eab30842;border-color:#eab308f2;color:#fff}.alphabet-carousel__content{display:flex;flex-direction:column;align-items:center;min-height:500px;justify-content:center;margin-top:40px}.alphabet-carousel__content--compact{min-height:400px;margin-top:20px}.alphabet-carousel__card{position:relative;width:80%;max-width:500px;padding:60px 40px;border-radius:20px;background:#ffffff26;border:2px solid rgba(255,255,255,.3);text-align:center;box-shadow:0 8px 32px #0003;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease;cursor:pointer}.alphabet-carousel__card--compact{width:90%;padding:40px 20px}.alphabet-carousel__image{margin-bottom:16px}.alphabet-carousel__image img{max-width:100%;max-height:200px;object-fit:contain;border-radius:12px}.alphabet-carousel__image-img--compact{max-height:150px}.alphabet-carousel__char{font-size:120px;font-weight:700;color:#eab308;margin-bottom:30px;line-height:1;text-shadow:0 4px 8px rgba(0,0,0,.3)}.alphabet-carousel__char--compact{font-size:80px}.alphabet-carousel__roman{font-size:24px;color:#ffffffe6;font-family:var(--font-mono);font-weight:600;margin-bottom:8px}.alphabet-carousel__roman--compact{font-size:18px}.alphabet-carousel__translation{font-size:15px;color:#ffffff73;font-family:var(--font-mono);font-style:italic;margin-bottom:4px}.alphabet-carousel__translation--compact{font-size:12px}.alphabet-carousel__controls{display:flex;gap:12px;margin-top:16px}.alphabet-carousel__progress{margin-top:24px;font-size:14px;color:#ffffff80;font-family:var(--font-mono)}.alphabet-carousel__progress--compact{font-size:12px}@media(max-width:640px){.alphabet-carousel__header{padding:12px;margin-bottom:14px}.alphabet-carousel__tabs{gap:6px}.alphabet-carousel__tabs .alphabet-btn{padding:8px 12px;font-size:12px}.alphabet-page-header{padding:10px;border-radius:12px}.alphabet-page-header__top-row{gap:8px}.alphabet-page-header__controls{gap:4px}.alphabet-page-header__title{max-width:100%}.alphabet-view-toggle__btn{padding:6px 10px}}.alphabet-btn{padding:10px 18px;border-radius:10px;background:#ffffff1a;border:1px solid rgba(255,255,255,.25);color:#ffffffb3;cursor:pointer;font-size:13px;font-weight:600;font-family:var(--font-mono);transition:all .18s ease}.alphabet-btn:hover{border-color:#ffffff6b;background:#ffffff29}.alphabet-btn--compact{padding:8px 12px;font-size:12px}.alphabet-btn--active{background:#eab30842;border-color:#eab308f2;color:#fff}.nav-btn{padding:8px 20px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;background:#ffffff1f;border:2px solid rgba(255,255,255,.3);color:#fffc;transition:all .15s;font-family:var(--font-mono)}.nav-btn--compact{padding:6px 14px;font-size:12px}.nav-btn--disabled{cursor:not-allowed;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);color:#ffffff4d}.alphabet-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}.alphabet-grid--compact{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.alphabet-card{padding:24px 16px;border-radius:12px;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);text-align:center;cursor:pointer;transition:all .2s;box-shadow:0 2px 4px #0000001a}.alphabet-card--compact{padding:16px 12px}.alphabet-card:hover{transform:translateY(-4px);background:#ffffff26;box-shadow:0 4px 8px #0003}.alphabet-card__char{font-size:64px;font-weight:700;color:#eab308;margin-bottom:8px;line-height:1}.alphabet-card__char--compact{font-size:48px}.alphabet-card__roman{font-size:14px;color:#ffffffb3;font-family:var(--font-mono);font-weight:600;margin-bottom:4px}.alphabet-card__roman--compact{font-size:12px}.alphabet-card__translation{font-size:10px;color:#fff6;font-family:var(--font-mono);font-style:italic;margin-top:2px}.alphabet-card__translation--compact{font-size:9px}.explore-container{margin-bottom:20px;overflow-x:hidden}.explore-result{padding:18px 24px;border-radius:10px;background:#fffffff2;border:2px solid rgba(150,150,150,.6);display:flex;gap:28px;align-items:center;justify-content:center;flex-wrap:wrap;box-shadow:0 2px 4px #0000001a}.explore-result--compact{padding:14px;gap:16px}.explore-char{text-align:center}.explore-char__label{font-size:11px;color:#0009;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:4px;font-weight:700}.explore-char__value{font-size:48px;color:#000;font-weight:700}.explore-char__value--compact{font-size:36px}.explore-divider{width:2px;height:44px;background:#0003}.explore-speak-btn{padding:10px 16px;border-radius:8px;background:#f0f0f0e6;border:2px solid rgba(150,150,150,.6);color:#000c;cursor:pointer;font-size:18px;font-weight:600;transition:all .15s;box-shadow:0 2px 4px #0000001a}.pill-btn{padding:8px 14px;border-radius:8px;font-size:13px;cursor:pointer;font-family:var(--font-mono);white-space:nowrap;font-weight:700;background:#ffffff1f;border:2px solid rgba(255,255,255,.3);color:#fffc;transition:all .15s}.pill-btn--compact{padding:4px 8px;font-size:11px}.pill-btn--active{background:#eab3084d;border:2px solid #eab308;color:#fff}.mobile-input{position:fixed;top:-100;left:0;width:1px;height:1px;opacity:0;font-size:16px;border:none;outline:none;z-index:-1;pointer-events:auto}.view-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;flex-shrink:0;padding:10px 14px;border-radius:14px;background:#ffffff0a;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 20px #0003;gap:8px}.view-header--compact{margin-bottom:8px;padding:7px 10px}.view-header__title{font-size:12px;color:#ffffff8c;font-family:var(--font-mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:500;text-align:center}.view-header__controls{display:flex;gap:5px;flex-shrink:0}.view-header__back-section{display:flex;justify-content:flex-end;gap:10px;margin-bottom:20px}.tab-switcher{display:flex;justify-content:center;gap:4px;margin-bottom:24px;background:#ffffff0f;border-radius:10px;padding:4px;border:1px solid rgba(255,255,255,.1)}.tab-switcher__btn{flex:1;padding:10px 12px;min-height:42px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:700;font-family:var(--font-mono);transition:all .18s ease;background:transparent;border:1px solid transparent;color:#ffffff80;-webkit-tap-highlight-color:transparent}.tab-switcher__btn:active{transform:scale(.97)}.tab-switcher__btn--active-keyboard{background:#eab30840;border:1px solid rgba(234,179,8,.4);color:#fbbf24}.tab-switcher__btn--active-tonal{background:#a855f740;border:1px solid rgba(168,85,247,.4);color:#a855f7}.tab-switcher__btn--active-classifiers{background:#10b98138;border:1px solid rgba(16,185,129,.45);color:#34d399}.menu-header{text-align:center;margin-bottom:40px}.menu-header--mobile{margin-bottom:32px}.menu-header__subtitle{font-size:13px;letter-spacing:4px;text-transform:uppercase;color:#fbbf24;margin-bottom:10px;font-family:var(--font-mono);font-weight:700}.menu-header__title{font-size:56px;font-weight:800;margin:0;background:linear-gradient(135deg,#fbbf24,#f59e0b,#d97706);-webkit-background-clip:text;-webkit-text-fill-color:transparent;line-height:1.2;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.menu-header__title--mobile{font-size:42px}.menu-header__word-count{color:#ffffffb3;font-size:14px;margin-top:8px;font-family:var(--font-mono);font-weight:600}.menu-quick-btns{display:flex;gap:12px;justify-content:center;margin-bottom:16px;flex-wrap:wrap}.lesson-btn{display:flex;align-items:center;gap:16px;padding:16px 20px;min-height:68px;border-radius:14px;background:#ffffff0f;border:1.5px solid rgba(255,255,255,.14);cursor:pointer;text-align:left;width:100%;transition:background .18s ease,border-color .18s ease,transform .12s ease;-webkit-tap-highlight-color:transparent}.lesson-btn:hover{background:#ffffff1a;border-color:#ffffff38}.lesson-btn:active{transform:scale(.99)}.lesson-btn--mobile{padding:14px 16px;gap:12px;min-height:60px}.lesson-btn--done{background:#22c55e26;border:2px solid rgba(34,197,94,.4)}.lesson-btn__number{width:36px;height:36px;border-radius:8px;flex-shrink:0;background:#ffffff1f;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:#ffffffb3;font-family:var(--font-mono)}.lesson-btn__number--done{background:#22c55e40;color:#4ade80}.lesson-btn__content{flex:1;min-width:0}.lesson-btn__title{font-size:17px;font-weight:700;color:#fff}.lesson-btn__title--mobile{font-size:15px}.lesson-btn__subtitle{font-size:14px;color:#fbbf24;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.lesson-btn__subtitle--mobile{font-size:13px}.lesson-btn__arrow{color:#fff6;font-size:18px;font-weight:700}.lesson-list{display:flex;flex-direction:column;gap:8px}.category-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}.category-grid--mobile{grid-template-columns:1fr 1fr}.category-btn{padding:16px 20px;border-radius:10px;cursor:pointer;text-align:left;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);transition:all .2s;display:flex;justify-content:space-between;align-items:center}.category-btn--mobile{padding:14px 16px}.category-btn__name{font-size:17px;color:#fff;font-weight:600}.category-btn__name--mobile{font-size:15px}.category-btn__count{font-size:13px;color:#fff9;font-family:var(--font-mono);font-weight:700}.category-btn--fc{border-color:#8b5cf64d;background:#8b5cf614}.category-btn--fc:hover{border-color:#8b5cf699;background:#8b5cf62e}.difficulty-btns{display:flex;gap:10px;flex-wrap:wrap}.difficulty-btn{padding:14px 22px;border-radius:10px;cursor:pointer;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);transition:all .2s;flex:0 1 auto}.difficulty-btn--mobile{flex:1 1 45%}.difficulty-btn__label{font-size:17px;color:#fff;font-weight:600}.difficulty-btn__label--mobile{font-size:15px}.section{margin-bottom:28px}.section__title{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:#fff6;margin-bottom:12px;font-family:var(--font-mono);font-weight:600}.quick-btn{padding:12px 24px;min-height:44px;border-radius:12px;background:#ffffff14;border:1.5px solid rgba(255,255,255,.15);color:#e5e5e5;cursor:pointer;font-size:14px;font-weight:600;font-family:var(--font-mono);transition:background .18s ease,border-color .18s ease,transform .12s ease;-webkit-tap-highlight-color:transparent}.quick-btn:hover{background:#ffffff1f;border-color:#ffffff40}.quick-btn:active{transform:scale(.97)}.alphabet-card-btn{padding:16px 24px;min-height:64px;border-radius:14px;cursor:pointer;background:#ffffff12;border:1.5px solid rgba(255,255,255,.14);transition:background .18s ease,border-color .18s ease,transform .12s ease;flex:0 1 auto;-webkit-tap-highlight-color:transparent}.alphabet-card-btn:active{transform:scale(.98)}.alphabet-card-btn--mobile{flex:1 1 100%}.alphabet-card-btn__title{font-size:17px;color:#fff;font-weight:600}.alphabet-card-btn__title--mobile{font-size:15px}.alphabet-card-btn__desc{font-size:13px;color:#fff9;margin-top:4px}.view-toggle-btn{padding:6px 12px;border-radius:6px;cursor:pointer;font-size:12px;font-weight:600;font-family:var(--font-mono);background:#ffffff1a;border:2px solid rgba(255,255,255,.2);color:#ffffffb3;transition:all .15s}.view-toggle-btn--active{background:#eab3084d;border:2px solid #eab308;color:#fff}.progress-bar{height:4px;background:#ffffff1a;border-radius:2px;margin-bottom:12px;overflow:hidden;flex-shrink:0}.progress-bar--compact{margin-bottom:8px}.progress-bar__fill{height:100%;width:0%;background:linear-gradient(90deg,#eab308,#f59e0b);transition:width .3s}.stats-bar{display:flex;justify-content:space-around;align-items:center;padding:12px 16px;background:#ffffff0d;border-radius:12px;margin-bottom:12px}.stats-bar--compact{padding:8px 12px;margin-bottom:8px}.stats-bar__item{display:flex;flex-direction:column;align-items:center;gap:4px}.stats-bar__value{font-size:20px;font-weight:700;font-family:var(--font-mono);color:#fff}.stats-bar__value--compact{font-size:16px}.stats-bar__label{font-size:11px;font-weight:600;font-family:var(--font-mono);color:#ffffff80;text-transform:uppercase;letter-spacing:1px}.stats-bar__label--compact{font-size:9px}.target-char{font-size:120px;font-weight:700;line-height:1;transition:color .15s;color:#eab308;text-shadow:0 0 32px rgba(234,179,8,.2)}.target-char--compact{font-size:88px}.target-char--compact-kb-open{font-size:72px}.target-char--correct{color:#22c55e;text-shadow:0 0 32px rgba(34,197,94,.3)}.target-char--error{color:#ef4444;text-shadow:0 0 32px rgba(239,68,68,.3)}.target-roman{font-size:18px;color:#fff9;margin-top:4px;font-family:var(--font-mono);font-weight:500}.target-roman--compact{font-size:14px}.target-hint{font-size:13px;color:#fff6;margin-top:8px;font-family:var(--font-mono);font-weight:500}.tap-zone{padding:12px;border-radius:10px;background:#eab3081a;border:2px dashed rgba(234,179,8,.4);text-align:center;cursor:pointer;margin-top:8px;margin-bottom:8px;flex-shrink:0}.tap-zone__title{font-size:15px;color:#eab308;font-weight:600}.tap-zone__hint{font-size:11px;color:#fff6;margin-top:4px;font-weight:500}.word-meaning{font-size:24px;color:#ffffff80;margin-bottom:8px;font-family:var(--font-mono);text-align:center;font-weight:500}.word-meaning--compact{font-size:14px;margin-bottom:0}.word-display{display:flex;align-items:center;gap:10px}.word-chars{font-size:102px;line-height:1.3}.word-chars--compact{font-size:60px}.word-chars--compact-kb-open{font-size:52px}.word-char{color:#ffffff4d;font-weight:500;transition:color .15s}.word-char--correct{color:#22c55e}.word-char--current{color:#eab308;font-weight:700;text-decoration:underline;text-decoration-color:#eab30880;text-underline-offset:8px}.word-char--current-correct{color:#22c55e}.word-char--current-error{color:#ef4444}.word-speak-btn{background:none;border:none;font-size:22px;cursor:pointer;opacity:.6;padding:4px;transition:opacity .15s}.word-speak-btn:hover{opacity:1}.flashcard-meaning{font-size:24px;color:#ffffff80;margin-bottom:8px;font-family:var(--font-mono);text-align:center;font-weight:500}.flashcard-meaning--compact{font-size:14px;margin-bottom:0}.flashcard-input{font-size:32px;padding:10px;border-radius:8px;border:2px solid rgba(255,255,255,.3);background:#ffffff1a;color:#fff;text-align:center;min-height:50px;width:80%;max-width:400px;word-break:break-all}.flashcard-input--placeholder{color:#ffffff4d}.flashcard-correct{font-size:32px;margin-bottom:20px;color:#eab308}.flashcard-user-input{font-size:32px;margin-bottom:10px}.flashcard-user-char{font-weight:600}.flashcard-user-char--correct{color:#22c55e}.flashcard-user-char--error{color:#ef4444}.flashcard-label{margin-bottom:10px;font-size:18px;color:#ffffffb3}.action-btn{padding:10px 20px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;font-family:var(--font-mono);transition:all .15s}.action-btn--primary{background:#eab3084d;border:2px solid #eab308;color:#fff}.action-btn--success{background:#22c55e4d;border:2px solid #22c55e;color:#fff}.action-btn--secondary{background:#ffffff14;border:2px solid rgba(255,255,255,.15);color:#ffffffb3}.action-btn--danger{background:#ef44441a;border:1px solid rgba(239,68,68,.2);color:#ef444499}.action-btn--large{padding:14px 28px;border-radius:10px;font-size:15px;font-weight:700}.results-emoji{font-size:48px;margin-bottom:10px}.results-title{font-size:30px;font-weight:700;margin-bottom:8px}.results-title--mobile{font-size:24px}.results-subtitle{color:#ffffff80;font-size:14px;margin-bottom:28px;font-family:var(--font-mono);font-weight:500}.results-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:28px}.results-stat{padding:18px;border-radius:10px;background:#ffffff0f;border:2px solid rgba(255,255,255,.12)}.results-stat--mobile{padding:14px}.results-stat__value{font-size:28px;font-weight:700;color:#eab308;font-family:var(--font-mono)}.results-stat__value--mobile{font-size:22px}.results-stat__label{font-size:10px;color:#fff6;text-transform:uppercase;letter-spacing:1.5px;margin-top:4px;font-weight:600}.results-words{margin-bottom:24px;text-align:left}.results-section-title{font-size:11px;color:#fff6;text-transform:uppercase;letter-spacing:2px;margin-bottom:8px;font-family:var(--font-mono);font-weight:600}.results-word-list{display:flex;gap:8px;flex-wrap:wrap}.results-word-item{padding:8px 14px;border-radius:8px;background:#eab3081a;border:2px solid rgba(234,179,8,.2);font-size:16px;cursor:pointer;font-weight:500}.results-word-item span{font-size:11px;color:#fff6;font-weight:500}.results-missed{margin-bottom:24px;text-align:left}.results-missed-item{padding:8px 14px;border-radius:8px;background:#ef44441f;border:2px solid rgba(239,68,68,.25);font-size:18px;font-weight:600}.results-missed-item span{font-size:12px;color:#fff6;font-weight:500}.results-btns{display:flex;gap:12px;justify-content:center}.warning-text{text-align:center;margin-top:28px;color:#ffffff80;font-size:12px;font-family:var(--font-mono);font-weight:600}.page-actions{display:flex;justify-content:flex-end;gap:10px;margin-bottom:20px}.page-title{font-size:30px;font-weight:700;margin-bottom:6px}.page-title--mobile{font-size:24px}.page-subtitle{color:#ffffff80;font-size:13px;margin-bottom:24px;font-family:var(--font-mono);font-weight:500}.badge-progress-bar{padding:20px 24px;background:#ffffff0f;border-radius:12px;margin-bottom:20px;border:1px solid rgba(255,255,255,.08)}.badge-progress-bar--mobile{padding:16px 12px}.badge-progress-bar__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.badge-progress-bar__badges{display:flex;align-items:center;gap:8px}.badge-progress-bar__icon{font-size:20px}.badge-progress-bar__count{font-size:13px;font-weight:700;color:#f59e0b;font-family:var(--font-mono)}.badge-progress-bar__streak{display:flex;align-items:center;gap:6px;font-size:12px;font-family:var(--font-mono)}.badge-progress-bar__streak-current{color:#f59e0b;font-weight:700}.badge-progress-bar__streak-days{color:#fff6}.badge-progress-bar__streak-sep{color:#ffffff40}.badge-progress-bar__streak-best{color:#fff6}.badge-progress-bar__track{height:6px;background:#ffffff1a;border-radius:3px;margin-bottom:14px;overflow:hidden}.badge-progress-bar__fill{height:100%;background:linear-gradient(90deg,#f59e0b,#fbbf24);border-radius:3px;transition:width .5s ease}.badge-progress-bar__recent{display:flex;gap:8px;justify-content:center;margin-bottom:14px;flex-wrap:wrap}.badge-progress-bar__recent-badge{padding:6px 10px;border-radius:8px;font-size:11px;font-weight:600;display:flex;align-items:center;gap:4px}.badge-progress-bar__recent-badge span{font-size:16px}.badge-progress-bar__actions{display:flex;gap:8px;justify-content:center}.badge-progress-bar__btn{padding:8px 16px;border-radius:8px;cursor:pointer;font-size:12px;font-weight:700;transition:all .15s}.badge-progress-bar__btn--badges{background:#f59e0b26;color:#f59e0b;border:1px solid rgba(245,158,11,.3)}.badge-progress-bar__btn--progress{background:#3b82f626;color:#3b82f6;border:1px solid rgba(59,130,246,.3)}.badge-gallery{padding:40px;max-width:800px;margin:0 auto}.badge-gallery--mobile{padding:20px 16px}.badge-gallery__header{text-align:center;margin-bottom:32px}.badge-gallery__emoji{font-size:40px;margin-bottom:8px}.badge-gallery__title{font-size:30px;font-weight:700;margin-bottom:4px}.badge-gallery__title--mobile{font-size:24px}.badge-gallery__subtitle{color:#ffffff80;font-size:14px;font-family:var(--font-mono);font-weight:500}.badge-gallery__category{margin-bottom:28px}.badge-gallery__category-header{display:flex;align-items:center;gap:10px;margin-bottom:14px}.badge-gallery__category-icon{font-size:20px}.badge-gallery__category-name{font-size:15px;font-weight:700}.badge-gallery__category-count{font-size:12px;color:#ffffff4d;font-family:var(--font-mono)}.badge-gallery__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.badge-gallery__grid--mobile{grid-template-columns:repeat(2,1fr)}.badge-gallery__item{padding:16px 18px;border-radius:10px;text-align:center;background:#ffffff08;border:1px solid rgba(255,255,255,.06);transition:all .2s}.badge-gallery__item--mobile{padding:14px 12px}.badge-gallery__item--unlocked{background:var(--badge-bg, rgba(245, 158, 11, .1));border:1px solid var(--badge-border, rgba(245, 158, 11, .3))}.badge-gallery__item-icon{font-size:32px;margin-bottom:6px}.badge-gallery__item-icon--locked{filter:grayscale(1)}.badge-gallery__item-name{font-size:13px;font-weight:700;margin-bottom:2px}.badge-gallery__item-name--unlocked{color:var(--badge-border, #f59e0b)}.badge-gallery__item-name--locked{color:#ffffff80}.badge-gallery__item-desc{font-size:10px;color:#fff6;line-height:1.4}.badge-gallery__item-date{font-size:9px;color:#ffffff4d;margin-top:4px;font-family:var(--font-mono)}.progress-view{padding:40px;max-width:800px;margin:0 auto}.progress-view--mobile{padding:20px 16px}.progress-view__header{text-align:center;margin-bottom:32px}.progress-view__emoji{font-size:40px;margin-bottom:8px}.progress-view__title{font-size:30px;font-weight:700;margin-bottom:4px}.progress-view__title--mobile{font-size:24px}.progress-view__stats-grid{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px;justify-content:center}.progress-view__stat-card{padding:18px;border-radius:10px;background:#ffffff0a;border:1px solid rgba(255,255,255,.06);text-align:center;flex:1;min-width:auto}.progress-view__stat-card--mobile{padding:14px;min-width:40%}.progress-view__stat-icon{font-size:24px;margin-bottom:6px}.progress-view__stat-label{font-size:11px;color:#fff6;margin-bottom:4px;text-transform:uppercase;letter-spacing:1}.progress-view__stat-value{font-size:22px;font-weight:700}.progress-view__stat-subvalue{font-size:11px;color:#ffffff4d;margin-top:2px}.progress-view__sessions{margin-top:24px}.progress-view__sessions-title{font-size:14px;font-weight:700;margin-bottom:12px;color:#fff9}.progress-view__sessions-list{display:flex;flex-direction:column;gap:6px}.progress-view__session-item{padding:10px 14px;border-radius:8px;background:#ffffff0a;display:flex;justify-content:space-between;align-items:center;font-size:12px}.progress-view__session-date{color:#ffffff80}.progress-view__session-mode{font-weight:600;color:#3b82f6}.progress-view__session-score{color:#ffffffb3}.progress-view__session-accuracy{font-weight:700}.progress-view__session-accuracy--high{color:#22c55e}.progress-view__session-accuracy--medium{color:#f59e0b}.progress-view__session-accuracy--low{color:#ef4444}.new-badge-notification{margin-bottom:28px;padding:20px;border-radius:12px;background:#f59e0b1a;border:2px solid rgba(245,158,11,.3)}.new-badge-notification__title{font-size:13px;color:#f59e0b;text-transform:uppercase;letter-spacing:2;margin-bottom:14px;font-family:var(--font-mono);font-weight:700}.new-badge-notification__badges{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.new-badge-notification__badge{padding:16px 20px;border-radius:10px;text-align:center;box-shadow:0 0 16px var(--badge-glow, rgba(245, 158, 11, .3));animation:badgePulse .6s ease-out}.new-badge-notification__badge-icon{font-size:32px;margin-bottom:4px}.new-badge-notification__badge-name{font-size:13px;font-weight:700}.new-badge-notification__badge-desc{font-size:10px;color:#ffffff80;margin-top:2px}.new-badge-notification__actions{display:flex;gap:10px;justify-content:center;margin-top:18px}.new-badge-notification__btn{padding:10px 20px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:600}.new-badge-notification__btn--view{background:#f59e0b33;color:#f59e0b;border:1px solid rgba(245,158,11,.4)}.new-badge-notification__btn--dismiss{background:#ffffff1a;color:#fffc;border:1px solid rgba(255,255,255,.2)}@media(max-width:640px){.container{padding:16px 14px;padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right));padding-bottom:max(20px,calc(16px + env(safe-area-inset-bottom)))}.view-header,.progress-bar{margin-bottom:8px}.pill-btn{padding:4px 8px;font-size:11px}.mobile-back-button{padding:6px 10px!important;font-size:12px!important}.mobile-header-title{display:block;width:100%;text-align:center;margin-top:8px;margin-bottom:4px}.app-base{padding-bottom:env(safe-area-inset-bottom)}}.cookie-consent-banner{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(135deg,#1e1e28fa,#14141efa);border-top:1px solid rgba(234,179,8,.3);padding:16px 20px;display:flex;flex-direction:column;align-items:center;gap:12px;z-index:1000;box-shadow:0 -4px 20px #0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.cookie-consent-banner__message{color:#ffffffe6;font-size:14px;text-align:center;font-family:var(--font-mono);font-weight:500;line-height:1.4}.cookie-consent-banner__actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.cookie-consent-banner__button{padding:10px 24px;border-radius:8px;font-size:14px;font-weight:600;font-family:var(--font-mono);cursor:pointer;transition:all .2s ease;border:2px solid transparent}.cookie-consent-banner__button--accept{background:linear-gradient(135deg,#eab308,#f59e0b);color:#000;border-color:#eab308}.cookie-consent-banner__button--accept:hover{background:linear-gradient(135deg,#fbbf24,#eab308);transform:translateY(-2px);box-shadow:0 4px 12px #eab30866}.cookie-consent-banner__button--decline{background:#ffffff1a;color:#ffffffb3;border-color:#fff3}.cookie-consent-banner__button--decline:hover{background:#ffffff26;color:#ffffffe6;border-color:#ffffff4d}@media(min-width:640px){.cookie-consent-banner{flex-direction:row;justify-content:center;padding:14px 32px;gap:24px}.cookie-consent-banner__message{font-size:15px}.cookie-consent-banner__actions{flex-wrap:nowrap}}.fc-card{position:relative;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.4,0,.2,1);height:260px}.fc-card--flipped{transform:rotateY(180deg)}.fc-card__face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:20px;padding:28px 24px;box-sizing:border-box;border:2px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0006}.fc-card__front{background:linear-gradient(135deg,#8b5cf626,#1e1432e6);border-color:#8b5cf64d}.fc-card__back{background:linear-gradient(135deg,#14281ee6,#1e3c2de6);border-color:#a7f3d033;transform:rotateY(180deg)}@media(max-width:600px){.fc-card{height:200px}}.bug-report-fab{position:fixed;right:14px;bottom:max(14px,env(safe-area-inset-bottom));z-index:1500;width:36px;height:36px;border-radius:999px;border:1px solid rgba(255,255,255,.26);background:#0c0c12b3;color:#ffffffd9;font-size:16px;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.bug-report-fab:active{cursor:grabbing}.bug-report-overlay{position:fixed;inset:0;z-index:1600;background:#0000008c;display:flex;align-items:flex-end;justify-content:center;padding:12px}.bug-report-modal{width:min(100%,520px);background:#101018f7;border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:14px}.bug-report-note,.bug-report-error{margin:6px 0 10px;font-size:12px;color:#ffffffb3}.bug-report-error{color:#f87171}.bug-report-textarea{width:100%;min-height:90px;resize:vertical;border-radius:8px;padding:10px;background:#ffffff14;border:1px solid rgba(255,255,255,.2);color:#fff}.bug-report-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}.bug-report-btn{border-radius:8px;padding:8px 12px;cursor:pointer;border:1px solid rgba(255,255,255,.28)}.bug-report-btn--primary{background:#eab3083d;color:#eab308}.bug-report-btn--secondary{background:#ffffff1a;color:#ffffffe0}.install-prompt{position:fixed;bottom:80px;left:50%;transform:translate(-50%);width:90%;max-width:400px;background:#1e1e28f2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:16px;z-index:9998;box-shadow:0 4px 20px #0000004d;display:flex;align-items:center;gap:12px}.install-prompt__copy{flex:1}.install-prompt__title{font-weight:700;color:#fff;margin-bottom:4px}.install-prompt__description{font-size:12px;color:#ffffffb3}.install-prompt__install-btn{padding:8px 16px;border-radius:8px;background:#eab308;border:none;color:#000;font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap}.install-prompt__dismiss-btn{background:none;border:none;color:#ffffff80;cursor:pointer;padding:4px;font-size:18px;display:flex;align-items:center;justify-content:center}:root{--font-thai: "TH Sarabun New", "Sarabun", "Prompt", "Noto Sans Thai", "Kanit", "Tahoma", "Arial Unicode MS", "Thonburi", "Ayuthaya", system-ui, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", "Monaco", monospace;--font-input: var(--font-thai);font-family:var(--font-thai);line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}a{color:inherit;text-decoration:inherit}html{overflow-x:hidden}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden;max-width:100vw}#root{width:100%;min-height:100vh}@keyframes badgePulse{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}