:root{--ink: #211c18;--pomegranate: #a6283b;--pomegranate-dark: #7e1e2c;--saffron: #d9a441;--saffron-light: #f0c96b;--juniper: #43594a;--juniper-light: #6c8874;--parchment: #f4ead2;--parchment-warm: #ede0c2;--paper: #fbf6ea;--ink-soft: #4a423a;--border-soft: rgba(33, 28, 24, .14);--shadow: 0 10px 30px rgba(33, 28, 24, .12);--radius-lg: 22px;--radius-md: 14px;--font-display: "Fraunces", "Georgia", serif;--font-body: "Work Sans", "Segoe UI", sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%;background:var(--parchment);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;overflow-x:hidden;width:100%}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{background-image:radial-gradient(circle at 10% 0%,rgba(217,164,65,.16),transparent 45%),radial-gradient(circle at 92% 12%,rgba(166,40,59,.1),transparent 40%);min-height:100vh}button{touch-action:manipulation}img{max-width:100%}#root{display:flex;flex-direction:column;min-height:100vh}.zigzag{height:14px;width:100%;background:linear-gradient(135deg,var(--saffron) 25%,transparent 25%) -7px 0,linear-gradient(225deg,var(--saffron) 25%,transparent 25%) -7px 0,linear-gradient(315deg,var(--pomegranate) 25%,transparent 25%) 0 0,linear-gradient(45deg,var(--pomegranate) 25%,transparent 25%) 0 0;background-size:14px 14px;background-color:var(--juniper)}header.app-header{background:var(--ink);color:var(--paper);position:relative}.header-inner{max-width:1080px;margin:0 auto;padding:calc(30px + env(safe-area-inset-top,0px)) calc(28px + env(safe-area-inset-right,0px)) 26px calc(28px + env(safe-area-inset-left,0px));display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:nowrap}.brand{display:flex;align-items:center;gap:16px;flex-shrink:0;margin-right:auto}nav.mode-tabs{flex-shrink:0;margin-left:auto}@media (max-width: 720px){.header-inner{flex-wrap:wrap;gap:6px;padding:calc(10px + env(safe-area-inset-top,0px)) 14px 10px}.brand,nav.mode-tabs{margin:0}.brand{width:100%;flex-shrink:1;min-width:0}.brand-text{min-width:0}.brand-text p{overflow-wrap:break-word}.brand-logo{height:26px}.brand-text h1{font-size:.95rem}.brand-text p{font-size:.65rem;margin-top:2px}.brand{gap:6px}nav.mode-tabs{width:100%;max-width:100%;justify-content:space-between;background:transparent;padding:4px 0;gap:2px;flex-wrap:nowrap;overflow:hidden}nav.mode-tabs button{flex:0 1 auto;min-width:0;padding:8px 10px;font-size:.8rem;white-space:nowrap}nav.mode-tabs button.active{padding:8px 12px;font-size:.8rem}}@media (max-width: 380px){nav.mode-tabs{gap:0}nav.mode-tabs button:not(.active){font-size:.7rem;padding:7px 6px;letter-spacing:-.1px}}.brand-logo{height:54px;width:auto;flex-shrink:0;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}.brand-text h1{font-family:var(--font-display);font-weight:600;font-size:1.7rem;margin:0;letter-spacing:.2px}.brand-text p{margin:4px 0 0;font-size:.92rem;color:#fbf6eaad}nav.mode-tabs{display:flex;gap:6px;background:#fbf6ea14;padding:6px;border-radius:999px;flex-wrap:wrap}nav.mode-tabs button{border:none;background:transparent;color:#fbf6eabf;font-family:var(--font-body);font-size:.88rem;font-weight:600;padding:10px 16px;border-radius:999px;cursor:pointer;transition:background .2s ease,color .2s ease;white-space:nowrap}nav.mode-tabs button:hover{color:var(--paper)}nav.mode-tabs button.active{background:var(--saffron);color:var(--ink)}main{flex:1;max-width:1080px;width:100%;margin:0 auto;padding:34px calc(28px + env(safe-area-inset-right,0px)) 60px calc(28px + env(safe-area-inset-left,0px))}.category-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}.category-chip{border:1.5px solid var(--border-soft);background:var(--paper);color:var(--ink-soft);font-family:var(--font-body);font-size:.85rem;font-weight:600;padding:8px 15px;border-radius:999px;cursor:pointer;transition:all .18s ease}.category-chip:hover{border-color:var(--pomegranate)}.category-chip.active{background:var(--pomegranate);border-color:var(--pomegranate);color:var(--paper)}.panel-title{font-family:var(--font-display);font-size:1.5rem;font-weight:600;margin:0 0 6px}.panel-sub{color:var(--ink-soft);font-size:.95rem;margin:0 0 26px}.flash-wrap{display:flex;flex-direction:column;align-items:center;gap:22px}.flash-progress{font-size:.85rem;color:var(--ink-soft);font-weight:600}.flashcard{width:100%;max-width:440px;height:260px;perspective:1400px;cursor:pointer}.flashcard-inner{position:relative;width:100%;height:100%;transition:transform .5s cubic-bezier(.4,.2,.2,1);transform-style:preserve-3d}.flashcard.flipped .flashcard-inner{transform:rotateY(180deg)}.flash-face{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;backface-visibility:hidden;box-shadow:var(--shadow);padding:24px;text-align:center}.flash-face.front{background:var(--paper);border:2px solid var(--border-soft)}.flash-face.back{background:var(--pomegranate);color:var(--paper);transform:rotateY(180deg)}.flash-face .lang-label{text-transform:uppercase;font-size:.72rem;letter-spacing:1.5px;opacity:.6;margin-bottom:14px;font-weight:700}.flash-face .word{font-family:var(--font-display);font-size:2.1rem;font-weight:600;line-height:1.2}.flash-face .hint{margin-top:16px;font-size:.8rem;opacity:.55}.audio-btn{margin-top:16px;width:46px;height:46px;border-radius:50%;border:2px solid var(--paper);background:#fbf6ea1f;color:var(--paper);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s ease,transform .1s ease}.audio-btn:hover{background:#fbf6ea40}.audio-btn:active{transform:scale(.94)}.flash-controls{display:flex;align-items:center;gap:14px}.round-btn{width:48px;height:48px;border-radius:50%;border:2px solid var(--ink);background:var(--paper);color:var(--ink);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.round-btn:hover{background:var(--ink);color:var(--paper)}.pill-btn{border:none;background:var(--juniper);color:var(--paper);font-family:var(--font-body);font-weight:600;font-size:.9rem;padding:12px 22px;border-radius:999px;cursor:pointer;transition:background .15s ease}.pill-btn:hover{background:var(--juniper-light)}.pill-btn.secondary{background:transparent;border:2px solid var(--ink);color:var(--ink)}.quiz-wrap{max-width:560px;margin:0 auto}.quiz-progress-bar{height:8px;border-radius:999px;background:var(--parchment-warm);overflow:hidden;margin-bottom:24px}.quiz-progress-fill{height:100%;background:var(--saffron);transition:width .3s ease}.quiz-score{text-align:center;font-size:.9rem;color:var(--ink-soft);font-weight:600;margin-bottom:18px}.quiz-question{background:var(--paper);border-radius:var(--radius-lg);padding:36px 28px;text-align:center;box-shadow:var(--shadow);margin-bottom:24px}.quiz-question .qlabel{font-size:.78rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--pomegranate);font-weight:700;margin-bottom:10px}.quiz-question .qword{font-family:var(--font-display);font-size:2.2rem;font-weight:600}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.quiz-option{border:2px solid var(--border-soft);background:var(--paper);padding:16px;border-radius:var(--radius-md);font-family:var(--font-body);font-size:1.02rem;font-weight:600;cursor:pointer;transition:all .15s ease;text-align:left}.quiz-option:hover{border-color:var(--saffron)}.quiz-option.correct{background:var(--juniper);border-color:var(--juniper);color:var(--paper)}.quiz-option.wrong{background:var(--pomegranate);border-color:var(--pomegranate);color:var(--paper)}.quiz-option.disabled{pointer-events:none;opacity:.55}.quiz-option.reveal-correct{border-color:var(--juniper);color:var(--juniper)}.quiz-next{display:flex;justify-content:center;margin-top:20px}.quiz-result{text-align:center;padding:50px 20px}.quiz-result .big-score{font-family:var(--font-display);font-size:3.4rem;font-weight:600;color:var(--pomegranate)}.write-wrap{display:flex;flex-direction:column;align-items:stretch}.write-input-row{margin-bottom:18px}.write-input{width:100%;padding:16px 18px;border-radius:var(--radius-md);border:2px solid var(--border-soft);background:var(--paper);font-family:var(--font-display);font-size:1.3rem;font-weight:600;color:var(--ink);text-align:center;transition:border-color .15s ease,background .15s ease}.write-input:focus{outline:none;border-color:var(--saffron)}.write-input.correct{border-color:var(--juniper);background:#43594a1a;color:var(--juniper)}.write-input.wrong{border-color:var(--pomegranate);background:#a6283b14;color:var(--pomegranate-dark)}.write-feedback{text-align:center;font-weight:700;font-size:1rem;margin-top:18px}.write-feedback.ok{color:var(--juniper)}.write-feedback.no{color:var(--pomegranate-dark)}.kb-wrap{background:var(--paper);border:1.5px solid var(--border-soft);border-radius:var(--radius-md);padding:14px 16px 16px;box-shadow:var(--shadow)}.kb-label{font-size:.72rem;text-transform:uppercase;letter-spacing:1.2px;color:var(--ink-soft);font-weight:700;margin-bottom:10px;text-align:center}.kb-row{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.kb-row-controls{margin-top:8px}.kb-key{border:2px solid var(--border-soft);background:var(--parchment);color:var(--ink);font-family:var(--font-display);font-size:1.1rem;font-weight:600;min-width:42px;height:42px;padding:0 10px;border-radius:10px;cursor:pointer;transition:all .15s ease}.kb-key:hover:not(:disabled){border-color:var(--saffron);background:var(--saffron-light)}.kb-key:active:not(:disabled){transform:scale(.94)}.kb-key:disabled{opacity:.45;cursor:default}.kb-special{color:var(--pomegranate)}.kb-wide{flex:1;min-width:100px;font-family:var(--font-body);font-size:.85rem}.kb-backspace{max-width:140px}.match-wrap{display:flex;flex-direction:column;align-items:center;gap:18px}.match-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 24px;font-size:.9rem;font-weight:600;color:var(--ink-soft)}.match-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;width:100%;max-width:680px}@media (max-width: 640px){.match-grid{grid-template-columns:repeat(2,1fr)}.quiz-options{grid-template-columns:1fr}}.match-card{min-height:74px;border-radius:var(--radius-md);border:2px solid var(--border-soft);background:var(--paper);display:flex;align-items:center;justify-content:center;text-align:center;padding:10px;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .15s ease}.match-card.selected{border-color:var(--saffron);background:var(--saffron-light)}.match-card.matched{border-color:var(--juniper);background:var(--juniper);color:var(--paper);cursor:default;opacity:.85}.match-card.shake{animation:shake .35s;border-color:var(--pomegranate)}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.list-search{width:100%;padding:13px 18px;border-radius:999px;border:2px solid var(--border-soft);background:var(--paper);font-family:var(--font-body);font-size:16px;margin-bottom:22px}.list-search:focus{outline:none;border-color:var(--saffron)}.word-table{background:var(--paper);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow)}.word-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:center;padding:15px 22px;border-bottom:1px solid var(--border-soft)}.word-row:last-child{border-bottom:none}.word-row .tr-word{font-weight:600}.word-row .ku-word{font-family:var(--font-display);color:var(--pomegranate);font-weight:600}.empty-state{text-align:center;padding:40px 20px;color:var(--ink-soft)}footer.app-footer{background:var(--ink);color:#fbf6ea8c;text-align:center;padding:22px 20px calc(22px + env(safe-area-inset-bottom,0px));font-size:.82rem;letter-spacing:.3px}@media (max-width: 480px){main{padding:22px 16px 44px}.panel-title{font-size:1.25rem}.panel-sub{font-size:.85rem;margin-bottom:18px}.category-bar{gap:6px;margin-bottom:22px}.category-chip{padding:7px 12px;font-size:.8rem}.flash-wrap{gap:14px}.flash-progress{font-size:.78rem}.flashcard{height:170px;max-width:340px}.flash-face{padding:14px}.flash-face .lang-label{font-size:.62rem;margin-bottom:8px}.flash-face .word{font-size:1.3rem}.flash-face .hint{margin-top:10px;font-size:.7rem}.audio-btn{width:36px;height:36px;font-size:1rem;margin-top:10px}.flash-controls{gap:10px}.round-btn{width:38px;height:38px;font-size:.95rem}.pill-btn{padding:11px 18px;font-size:.85rem}.quiz-question{padding:24px 18px}.quiz-question .qword{font-size:1.6rem}.quiz-option{padding:14px;font-size:.92rem}.quiz-result .big-score{font-size:2.6rem}.write-input{font-size:1.1rem;padding:14px}.kb-wrap{padding:12px 10px 14px}.kb-key{min-width:36px;height:40px;font-size:1rem;padding:0 8px}.kb-wide{min-width:80px;font-size:.78rem}.match-card{min-height:60px;font-size:.85rem;padding:8px}.list-search{font-size:16px;padding:12px 16px}.word-row{padding:12px 16px;gap:10px}.word-row .tr-word,.word-row .ku-word{font-size:.92rem}}