body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body,html{height:100%;margin:0}*,.DefaultWindow,.LeftSide,.MainComponent,.Navbar,.RightSide,:after,:before{box-sizing:border-box}img{height:auto;max-width:100%}.body,html::-webkit-scrollbar{display:none}.Navbar{align-items:center;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;min-height:60px;padding:8px 12px;width:100%}.Navbar h2{color:red;font-weight:500;margin:0;padding-left:18px}.UserSmallInfo{flex-wrap:wrap;font-family:poppins;justify-content:space-evenly;max-width:100%;width:auto}.UserName,.UserSmallInfo{align-items:center;display:flex;gap:10px}.UserName{justify-content:center}.LeveIndicator{border-radius:8px;padding:8px;width:auto}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}.MainComponent{display:flex;gap:12px;justify-content:space-between;min-height:calc(100vh - 80px);width:100%}.LeftSide{align-items:center;display:flex;flex:0 0 240px;flex-direction:column;gap:30px;margin-top:10px;padding:0 6px;width:240px}.LeftSide div{border-radius:6px;box-shadow:6px 6px;cursor:pointer;display:flex;gap:15px;height:50px;max-width:200px;overflow:hidden;position:relative;width:100%}.LeftSide div:first-child{box-shadow:6px 6px #df342c}.LeftSide div:nth-child(2){box-shadow:6px 6px #6a4a73}.LeftSide div:nth-child(3){box-shadow:6px 6px #1b7ec2}.LeftSide div:hover{box-shadow:8px 8px #000}.RightSide{flex:1 1 auto;height:auto;margin-top:10px;min-width:0;overflow:scroll;padding-inline:20px;width:auto}.RightSide::-webkit-scrollbar{display:none}.DefaultWindow{height:auto;margin-bottom:30px;width:100%}@media (max-width:900px){.Navbar h2{padding-left:0}.MainComponent{flex-direction:column;min-height:0;min-height:auto}.LeftSide{-webkit-overflow-scrolling:touch;align-items:stretch;flex:0 0 auto;flex-direction:row;gap:12px;justify-content:flex-start;overflow-x:auto;padding:0 12px;width:100%}.LeftSide div{flex:0 0 auto;height:46px;max-width:none;width:180px}.RightSide{overflow:visible;padding-inline:12px;width:100%}}@media (max-width:520px){.Navbar{justify-content:flex-start}.Navbar>div{max-width:100%}}.timeline-wrapper{overflow-x:auto;overflow-y:hidden;padding-right:20px;width:100%}.timeline-wrapper::-webkit-scrollbar{display:none;height:6px}.timeline-wrapper::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.timeline-wrapper::-webkit-scrollbar-thumb{background:#888;border-radius:10px}.timeline-wrapper::-webkit-scrollbar-thumb:hover{background:#555}.timeline-container{align-items:center;display:flex;min-width:-webkit-max-content;min-width:max-content;padding:30px 20px;position:relative}.timeline-line{background-color:#ddd;height:2px;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:0}.timeline-item{align-items:center;display:flex;flex-direction:column;margin-right:30px;position:relative}.timeline-item:last-child{margin-right:0}.timeline-circle{border:2px solid #fff;border-radius:50%;cursor:pointer;height:12px;transition:all .3s ease;width:12px;z-index:1}.timeline-circle.active{background-color:#22c55e;box-shadow:0 0 0 3px #22c55e33}.timeline-circle.inactive{background-color:#9ca3af}.timeline-circle:hover{transform:scale(1.3)}.timeline-month-label{color:#374151;font-size:11px;font-weight:600;position:absolute;top:-25px;white-space:nowrap}.VocabSection{height:auto;width:100%}.VocabBanner{align-items:center;background-color:#6a4a73;border-top-left-radius:18px;border-top-right-radius:18px;display:flex;height:120px;justify-content:center;text-align:center;width:100%}.VocabText{-webkit-text-fill-color:#0000;background-clip:text;-webkit-background-clip:text;background-image:url(/Nihongono-Practice/static/media/banner2.1494426ed3175eabba7b.jpg);background-size:contain;font-size:clamp(44px,9vw,80px);font-weight:700}.VocabContents{font-family:Short Stack,cursive;font-size:20px;font-weight:700;padding-inline:10px;padding-bottom:40px}.VocabInput{align-items:center;display:flex;flex-wrap:wrap;gap:20px}.VocabInput input{border:2px solid #6a4a73;border-radius:8px;flex:1 1 260px;font-family:Zen Kaku Gothic Antique,sans-serif;font-weight:700;height:35px;max-width:100%;padding-left:10px;width:250px}.SubmitButton{border:0;border-radius:8px;font-family:poppins;font-weight:700;height:40px;width:80px}.words{display:flex;height:auto;position:relative;width:100%}.list{border:1px solid #dedede;border-radius:12px;color:#555;margin:0;max-height:500px;overflow:scroll;padding:0!important;width:100%}.list::-webkit-scrollbar{display:none}.list li{border-bottom:1px dotted #ccc;font-size:12px;font-size:15px;height:auto;list-style:none;overflow-wrap:anywhere;padding:10px;text-indent:40px;text-transform:capitalize}.list li:last-child{border-bottom:none}.list li:hover{background-color:#f0f0f0;border-radius:12px;transition:all .2s;-webkit-transition:all .2s;-moz-transition:all .2s;-ms-transition:all .2s;-o-transition:all .2s}.lines{border-left:1px solid #ffaa9f;border-right:1px solid #ffaa9f;bottom:0;height:auto;margin-left:3%;position:absolute;top:0;width:2px}.AddedWordsSection{display:flex;flex-wrap:wrap;gap:15px;list-style:none;padding:0}.LanguageChange{border:0;border-radius:8px;cursor:pointer;font-weight:700}.changeSection{border:1px solid #6a4a73;border-radius:8px;cursor:pointer;font-family:poppins;font-size:15px;font-weight:700;padding:10px;text-align:center;width:150px}.RevisionLayout{grid-gap:16px;align-items:start;display:grid;gap:16px;grid-template-columns:1fr 320px;margin-top:14px}.RevisionMain{min-width:0}.RevisionHeader{align-items:center;display:flex;justify-content:space-between;margin-bottom:10px}.RevisionScore{color:#333;font-family:poppins;font-size:16px}.RevisionScoreNumber{color:#6a4a73;font-weight:900}.RevisionNext{background:#fff;font-weight:700}.RevisionFlip,.RevisionNext{border:1px solid #6a4a73;border-radius:10px;cursor:pointer;font-family:poppins;padding:10px 14px}.RevisionFlip{background:#6a4a73;color:#fff;font-weight:800;margin-right:8px}.RevisionExtra{background:#fafafa;border:1px solid #dedede;border-radius:10px;color:#333;font-weight:800}.RevisionExtra,.RevisionStar{cursor:pointer;font-family:poppins;margin-right:8px;padding:10px 12px}.RevisionStar{background:#fff6d6;border:1px solid #f0c14b;border-radius:10px;color:#8a6d00;font-weight:900;min-width:44px}.RevisionExtra:disabled,.RevisionFlip:disabled,.RevisionNext:disabled,.RevisionStar:disabled{cursor:not-allowed;opacity:.6}.RevisionCard{background:#fff;border:1px solid #dedede;border-radius:14px;box-shadow:0 6px 18px #0000000f;padding:16px}.RevisionPrompt{align-items:baseline;border-bottom:1px dashed #ddd;display:flex;gap:14px;justify-content:space-between;margin-bottom:12px;padding-bottom:12px}.RevisionKana{color:#6a4a73;font-size:34px;letter-spacing:.5px}.RevisionKana,.RevisionKanji{font-family:Zen Kaku Gothic Antique,sans-serif;font-weight:900}.RevisionKanji{color:#222;font-size:40px}.RevisionOptions{grid-gap:10px;display:grid;gap:10px;grid-template-columns:1fr 1fr}.RevisionOption{background:#fafafa;border:1px solid #dedede;border-radius:12px;color:#333;cursor:pointer;font-family:poppins;font-size:14px;font-weight:700;padding:12px;text-align:left;transition:all .15s ease}.RevisionOption:hover{background:#f1e9f4;border-color:#6a4a73}.RevisionOption:disabled{cursor:not-allowed;opacity:.75}.RevisionSidebar{background:#fff;border:1px solid #dedede;border-radius:14px;box-shadow:0 6px 18px #0000000f;padding:14px}.RevisionSidebarTitle{color:#222;font-family:poppins;font-size:16px;font-weight:900;margin-bottom:10px}.RevisionSidebarEmpty{color:#666;font-family:poppins;font-size:13px}.RevisionWrongList{list-style:none;margin:0;max-height:460px;overflow:auto;padding:0}.RevisionWrongList::-webkit-scrollbar{display:none}.RevisionWrongItem{border-bottom:1px dotted #ddd;padding:10px 0}.RevisionWrongItem:last-child{border-bottom:none}.RevisionWrongWord{color:#d36cff;font-family:Zen Kaku Gothic Antique,sans-serif;font-size:16px;font-weight:900;margin-bottom:4px}.RevisionWrongMeta{color:#555;font-family:poppins;font-size:12px}@media (max-width:900px){.RevisionLayout{grid-template-columns:1fr}}@media (max-width:700px){.VocabBanner{height:96px}.VocabContents{font-size:18px;padding-inline:8px}.VocabInput{gap:10px}.VocabInput input{flex-basis:100%;font-size:16px;height:40px}.LanguageChange,.SubmitButton{height:40px}.changeSection{flex:1 1 100%;width:auto}.lines{display:none}.list li{text-indent:0}}@media (max-width:520px){.RevisionPrompt{align-items:flex-start;flex-direction:column}.RevisionKana{font-size:28px}.RevisionKanji{font-size:34px}.RevisionOptions{grid-template-columns:1fr}}.GrammarSection{height:auto;width:100%}.GrammarBanner{align-items:center;background-color:#000;border-top-left-radius:18px;border-top-right-radius:18px;display:flex;height:120px;justify-content:center;text-align:center;width:100%}.GrammarText{-webkit-text-fill-color:#0000;-webkit-background-clip:text;background-image:url(/Nihongono-Practice/static/media/banner3.39b2e7345c8fb03f4e88.jpg);background-size:contain;font-size:clamp(44px,9vw,80px);font-weight:700}.GrammarListContainer{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;width:100%}.GrammarList{align-items:center;display:flex;flex-direction:column}.GrammarDiv{border-bottom:1px solid grey;border-left:1px solid grey;border-radius:12px;border-right:1px solid grey;height:auto;margin-top:10px;padding-bottom:10px;width:min(580px,100%)}.GrammarDivHeading{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;margin-top:10px;width:90%}.GrammarDivOtherInfo{font-family:poppins;margin-left:15px}.GrammarDivOtherInfo p{margin:0}@media (max-width:520px){.GrammarBanner{height:96px}.GrammarDivHeading{width:100%}.GrammarDivOtherInfo{margin-left:12px;margin-right:12px}}.ReadingBanner{align-items:center;background-color:brown;border-radius:12px;display:flex;gap:25px;height:60px;padding:10px;width:100%}.ReadingBanner img{border-radius:50%;height:55px;width:55px}.ReadingBanner p{color:#fff;font-family:poppins;font-size:clamp(22px,5vw,45px)}.ReadingPassage{border:.5px solid #e4e2e2;border-radius:12px;height:500px;margin-top:20px;overflow:scroll;padding:10px;width:48%}.ReadingSection{display:flex;gap:16px;justify-content:space-between}.ReadingAnswer{border:.5px solid #e4e2e2;border-radius:12px;height:500px;margin-top:20px;overflow:scroll;padding:10px;width:48%}.ReadingAnswer p{font-family:poppins;margin:0}.ReadingAnswer::-webkit-scrollbar,.ReadingPassage::-webkit-scrollbar{display:none}.Translation{align-items:center;display:flex;gap:10px;height:40px;width:100%}.AnswerUnlock,.TranscribeTab{align-items:center;background-color:#e5e5e5;border-radius:8px;cursor:pointer;display:flex;font-family:poppins;font-size:15px;font-weight:400;height:40px;justify-content:center;width:90px}.TranslationOption{align-items:center;display:flex;height:40px;justify-content:space-between;width:100%}.TranslationOption button{background-color:#1d901d;border:0;border-radius:8px;color:#fff;cursor:pointer;font-family:poppins;height:35px;padding-left:15px;padding-right:15px}.TranslationText{border:.5px solid #000;border-radius:8px;font-family:poppins;font-size:15px;height:30px;max-width:100%;text-align:center;width:75%}.TranslationText:focus{outline:none}.ResultCardsContainer{align-items:center;display:flex;flex-direction:column;gap:10px;justify-content:center}.ReadingPassage p{font-family:poppins;font-size:19px;font-weight:700;margin:0}.ResultCards{border:.5px solid #000;border-radius:8px;height:auto;padding:5px;width:98%}.OneLine{background-image:linear-gradient(180deg,#0000 95%,#3b3b3b 0);background-size:100% 2.2em;line-height:2.2em;padding-left:48px;position:relative;white-space:pre-line}.OneLine:before{border-left:.5px solid #e06666;border-right:.5px solid #e06666;content:"";height:100%;left:32px;position:absolute;top:0;width:3px}@media (max-width:900px){.ReadingSection{flex-direction:column}.ReadingAnswer,.ReadingPassage{height:auto;max-height:none;width:100%}.Translation{flex-wrap:wrap;height:auto}.AnswerUnlock,.TranscribeTab{min-width:140px;width:48%}.TranslationText{font-size:16px;height:40px;width:100%}}@media (max-width:520px){.ReadingBanner{gap:12px}.ReadingBanner img{height:44px;width:44px}.OneLine{padding-left:38px}.OneLine:before{left:24px}}.ListeningBanner{align-items:center;background-color:#6495ed;border-radius:12px;display:flex;gap:25px;height:60px;padding:10px;width:100%}.ListeningBanner img{border-radius:50%;height:55px;width:55px}.ListeningBanner p{color:#fff;font-family:poppins;font-size:clamp(22px,5vw,45px);margin:0}.ListeningChatBot{background-color:#b7d1ff;border-radius:8px;display:flex;flex-direction:column;height:90%;margin-top:20px;position:relative;width:100%}.ChatNavbar{align-items:center;background-color:#6495ed;border-top-left-radius:8px;border-top-right-radius:8px;display:flex;flex-shrink:0;height:50px;width:100%}.ChatNavbar p{color:#fff;font-family:poppins;margin:0 0 0 10px}.status{background-color:gray;border-radius:50%;height:10px;margin-left:20px;transition:background-color .3s;width:10px}.status.active{background-color:green}.Messages{box-sizing:border-box;flex:1 1;margin-bottom:80px;overflow-x:hidden;overflow-y:auto;padding:10px;width:100%}.Messages::-webkit-scrollbar{width:8px}.Messages::-webkit-scrollbar-track{background:#ffffff1a;border-radius:4px}.Messages::-webkit-scrollbar-thumb{background:#6495ed;border-radius:4px}.Messages::-webkit-scrollbar-thumb:hover{background:#4169e1}.AudioDiv{align-items:center;background-color:#fff;border-radius:30px;box-sizing:border-box;display:flex;gap:10px;height:50px;margin-bottom:10px;max-width:60%;padding:5px;width:auto}.audio-name{color:#333;font-family:poppins;font-size:16px}.audio-btn{background-color:#6495ed;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:18px;height:40px;transition:background-color .2s;width:40px}.audio-btn:hover{background-color:#4169e1}.audio-btn:active{transform:scale(.95)}.AudioControls{background-color:#fffc;border-radius:8px;margin-bottom:15px;max-width:60%;padding:10px;width:100%}.SpeedControl{display:flex;flex-direction:column;gap:8px}.SpeedLabel{color:#333;font-family:poppins;font-size:14px;font-weight:500}.SpeedSlider{-webkit-appearance:none;appearance:none;background:#e0e0e0;border-radius:3px;height:6px;outline:none;width:100%}.SpeedSlider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#6495ed;border-radius:50%;cursor:pointer;height:18px;-webkit-transition:background-color .2s;transition:background-color .2s;width:18px}.SpeedSlider::-webkit-slider-thumb:hover{background:#4169e1}.SpeedSlider::-moz-range-thumb{background:#6495ed;border:none;border-radius:50%;cursor:pointer;height:18px;-moz-transition:background-color .2s;transition:background-color .2s;width:18px}.SpeedSlider::-moz-range-thumb:hover{background:#4169e1}.SpeedLabels{color:#666;display:flex;font-family:poppins;font-size:11px;justify-content:space-between;margin-top:-5px}.OptionsContainer{display:flex;flex-direction:column;gap:8px;margin-bottom:15px}.AnswerOptions{align-items:center;background-color:hsla(0,0%,100%,.241);border:1px dashed #fff;border-radius:30px;box-sizing:border-box;color:#2468e6;cursor:pointer;display:inline-flex;display:flex;font-family:poppins;height:auto;max-width:80%;padding-left:15px;padding-right:15px;transition:all .3s ease;width:-webkit-fit-content;width:fit-content}.AnswerOptions:hover{background-color:#fff6;transform:translateX(5px)}.AnswerOptions p{font-size:15px;margin:10px}.ConvoButton{align-items:center;background-color:#000;border-radius:30px;color:#fff;cursor:pointer;display:flex;font-family:poppins;height:35px;justify-content:center;margin-left:10px;transition:background-color .3s;width:100px}.ConvoButton:hover{background-color:green}.KeyBoard{align-items:center;bottom:10px;box-sizing:border-box;display:flex;gap:10px;height:auto;justify-content:center;padding:10px;position:absolute;width:100%}.InputFiled{background-color:#fff;border-radius:8px;height:auto;width:90%}.HintContainer{border-radius:8px;height:50px;width:100%}.Hint,.HintContainer{box-sizing:border-box;display:flex;padding:5px}.Hint{align-items:center;border:1px dashed #a9a9a9;color:grey;font-family:poppins;font-size:14px;height:98%;width:98%}.UserAnswer{display:flex;height:auto;justify-content:right;margin-bottom:10px;width:100%}.Answer{background-color:#fff;border-radius:30px;box-shadow:0 2px 5px #0000001a;font-family:poppins;font-size:15px;height:auto;max-width:70%;padding:10px 15px;transition:background-color .3s;width:auto}.Answer p{margin:5px 0}.InputFiled input{border:0;border-radius:8px;box-sizing:border-box;font-family:poppins;height:50px;outline:none;padding-left:10px;width:100%}.InputFiled input:disabled{background-color:#f0f0f0;cursor:not-allowed}.Send{align-items:center;background-color:#447ce3;border-radius:50%;cursor:pointer;display:flex;height:50px;justify-content:center;transition:all .2s;width:50px}.Send:hover{background-color:#3068cf;transform:scale(1.05)}.Send:active{transform:scale(.95)}@media (max-width:900px){.ListeningBanner{gap:12px}.ListeningBanner img{height:44px;width:44px}.AnswerOptions,.AudioControls,.AudioDiv{max-width:100%}}@media (max-width:520px){.Messages{margin-bottom:96px}.KeyBoard{gap:8px;padding:8px}.InputFiled input{font-size:16px;height:44px}.Send{height:44px;width:44px}.Send span{line-height:44px!important}.ConvoButton{font-size:14px;height:32px;width:90px}.AudioDiv{height:46px}.audio-btn{height:36px;width:36px}}.kanji-container{background:#f5f5f5;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100vh}.kanji-header{margin:0 auto 2rem;max-width:700px}.header-content{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem}.title{color:#333;font-size:2rem;font-weight:600}.stats{align-items:center;color:#666;display:flex;gap:1rem}.stat-item{align-items:baseline;display:flex;gap:.25rem}.stat-value{color:#333;font-size:1.25rem;font-weight:600}.stat-label{font-size:1rem}.level-badge{background:#e0e0e0;border-radius:4px;color:#555;font-size:.875rem;font-weight:500;padding:.25rem .75rem}.progress-bar{background:#e0e0e0;border-radius:2px;height:4px;overflow:hidden;width:100%}.progress-fill{background:#333;border-radius:2px;height:100%;transition:width .3s ease}.card-section{margin:0 auto;max-width:500px}.flashcard{cursor:pointer;height:500px;margin-bottom:1.5rem;perspective:1000px;width:100%}.card-inner{align-items:center;display:flex;height:100%;justify-content:center;position:relative;transform-style:preserve-3d;transition:transform .5s;width:100%}.flashcard.flipped .card-inner{transform:rotateY(180deg)}.card-face{align-items:center;-webkit-backface-visibility:hidden;backface-visibility:hidden;background:#fff;border:1px solid #ddd;border-radius:8px;display:flex;flex-direction:column;height:400px;justify-content:center;overflow:hidden;padding:2rem;position:absolute;width:100%}.card-back{justify-content:flex-start;overflow-y:auto;transform:rotateY(180deg)}.kanji-display{text-align:center}.kanji-character{color:#333;font-size:10rem;font-weight:400;line-height:1;margin-bottom:1rem}.tap-hint{color:#999;font-size:.875rem}.kanji-info{margin-bottom:2rem;text-align:center}.kanji-character-small{color:#333;font-size:4rem;font-weight:400;margin-bottom:.5rem}.kanji-meaning{color:#555;font-size:1.5rem;font-weight:500}.vocab-section{height:auto;overflow-y:scroll;width:100%}.vocab-section::-webkit-scrollbar{display:none}.vocab-title{border-bottom:1px solid #ddd;color:#333;font-size:1rem;font-weight:600;margin-bottom:1rem;padding-bottom:.5rem}.vocab-list{display:flex;flex-direction:column;gap:.75rem}.vocab-item{background:#f9f9f9;border:1px solid #e0e0e0;border-radius:4px;display:flex;gap:1rem;padding:.75rem}.vocab-item:hover{background:#f0f0f0}.vocab-kanji{color:#333;font-size:1.5rem;font-weight:400;min-width:50px;text-align:center}.vocab-details{display:flex;flex:1 1;flex-direction:column;gap:.25rem}.vocab-reading{color:#333;font-size:1rem;font-weight:500}.vocab-meaning{color:#666;font-size:.875rem}.difficulty-buttons{display:flex;gap:.75rem;justify-content:center;margin-bottom:1.5rem;z-index:1}.difficulty-btn{align-items:center;background:#fff;border:1px solid #ddd;border-radius:4px;color:#333;cursor:pointer;display:flex;flex-direction:column;font-family:inherit;font-size:.875rem;font-weight:500;gap:.25rem;padding:1rem 1.5rem;transition:all .2s}.difficulty-btn:hover{background:#f5f5f5;border-color:#999}.difficulty-btn.selected{background:#333;border-color:#333;color:#fff}.btn-emoji{font-size:1.5rem}.btn-text{font-size:.75rem;letter-spacing:.05em;text-transform:uppercase}.navigation-buttons{display:flex;gap:1rem;justify-content:space-between}.nav-btn{align-items:center;background:#fff;border:1px solid #ddd;border-radius:4px;color:#333;cursor:pointer;display:flex;font-family:inherit;font-size:.875rem;font-weight:500;gap:.5rem;padding:.75rem 1.5rem;transition:all .2s}.nav-btn:hover{background:#f5f5f5;border-color:#999}.nav-btn:active{transform:translateY(1px)}.nav-btn svg{height:18px;width:18px}.keyboard-hints{background:#fff;border:1px solid #ddd;border-radius:4px;display:flex;gap:1.5rem;justify-content:center;margin-left:auto;margin-right:auto;margin-top:1.5rem;max-width:700px;padding:1rem}.hint-item{align-items:center;color:#666;display:flex;font-size:.875rem;gap:.5rem}kbd{background:#f5f5f5;border:1px solid #ddd;border-radius:3px;color:#333;font-family:monospace;font-size:.75rem;padding:.25rem .5rem}.empty-state{background:#fff;border:1px solid #ddd;border-radius:8px;margin:0 auto;max-width:500px;padding:3rem 2rem;text-align:center}.empty-icon{font-size:4rem;margin-bottom:1rem}.empty-state h2{color:#333;font-size:1.5rem;font-weight:600;margin-bottom:.5rem}.empty-state p{color:#666;font-size:1rem;line-height:1.5}@media (max-width:768px){.kanji-container{padding:1rem}.title{font-size:1.5rem}.flashcard{height:450px}.kanji-character{font-size:7rem}.kanji-character-small{font-size:3rem}.difficulty-buttons{gap:.5rem}.difficulty-btn{padding:.75rem 1rem}}@media (max-width:480px){.header-content{align-items:flex-start;flex-direction:column;gap:.75rem}.stats{width:100%}.flashcard{height:400px}.kanji-character{font-size:5rem}.card-face{padding:1.5rem}.difficulty-buttons{flex-direction:column}.difficulty-btn{width:100%}.keyboard-hints{flex-wrap:wrap;gap:.75rem}}.YoutubePracticeContainer{background-color:#f8fafc;color:#1e293b;display:flex;flex-direction:column;font-family:Poppins,Inter,sans-serif;height:calc(100vh - 80px);padding:20px}.YoutubeHeader{background:#fff;border-radius:12px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;display:flex;gap:15px;margin-bottom:25px;padding:15px}.YoutubeUrlInput{border:2px solid #e2e8f0;border-radius:8px;flex:1 1;font-size:16px;outline:none;padding:12px 18px;transition:border-color .2s}.YoutubeUrlInput:focus{border-color:#3b82f6}.LoadVideoButton{background-color:#3b82f6;border:none;border-radius:8px;color:#fff;cursor:pointer;font-weight:600;padding:12px 24px;transition:background-color .2s,transform .1s}.LoadVideoButton:hover{background-color:#2563eb}.LoadVideoButton:active{transform:scale(.98)}.YoutubeMainLayout{grid-gap:20px;display:grid;flex:1 1;gap:20px;grid-template-columns:1.5fr 1fr;min-height:0}.VideoWrapper{background:#fff;border-radius:16px;box-shadow:0 10px 15px -3px #0000001a;height:0;overflow:hidden;padding-bottom:56.25%;position:relative}.VideoWrapper iframe,.VideoWrapper>div{border:none;border-radius:16px;height:100%!important;left:0;position:absolute;top:0;width:100%!important}.TranscriptSidebar{background:#fff;border:1px solid #e2e8f0;border-radius:16px;box-shadow:0 10px 15px -3px #0000001a;display:flex;flex-direction:column;overflow:hidden}.TranscriptHeader{background:#f1f5f9;border-bottom:1px solid #e2e8f0;padding:15px 20px}.TranscriptHeader h2{color:#475569;font-size:18px;font-weight:700;margin:0}.TranscriptContent{flex:1 1;overflow-y:auto;padding:10px 0;scroll-behavior:smooth}.TranscriptLine{border-left:4px solid #0000;cursor:pointer;padding:15px 20px;transition:background-color .2s}.TranscriptLine:hover{background-color:#f1f5f9}.TranscriptLine.active{background-color:#eff6ff;border-left-color:#3b82f6}.JapaneseText{color:#1e293b;display:flex;flex-wrap:wrap;font-size:1.1rem;gap:2px;line-height:1.6;margin-bottom:4px}.Token{border-radius:4px;display:inline-block;padding:1px 2px;transition:background-color .2s}.Token:hover{background-color:#cbd5e1;text-decoration:underline}.EnglishTranslation{color:#64748b;font-size:.9rem;font-style:italic}.DictionaryPopup{animation:popupFadeIn .3s ease-out;background:#fff;border:1px solid #e2e8f0;border-radius:20px;box-shadow:0 25px 50px -12px #00000040;left:50%;max-width:450px;padding:25px;position:fixed;top:50%;transform:translate(-50%,-50%);width:90%;z-index:1000}@keyframes popupFadeIn{0%{opacity:0;transform:translate(-50%,-45%)}to{opacity:1;transform:translate(-50%,-50%)}}.PopupOverlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0f172a66;bottom:0;left:0;position:fixed;right:0;top:0;z-index:999}.PopupHeader{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:20px}.WordInfo h2{color:#1e293b;font-size:28px;margin:0}.WordReading{color:#64748b;font-size:16px}.ClosePopup{align-items:center;background:#f1f5f9;border:none;border-radius:50%;color:#64748b;cursor:pointer;display:flex;font-size:20px;height:32px;justify-content:center;width:32px}.WordMeaning{color:#334155;font-size:16px;line-height:1.6;margin-bottom:20px}.AddToVocabBtn{align-items:center;background-color:#10b981;border:none;border-radius:10px;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:8px;justify-content:center;padding:12px;transition:background-color .2s;width:100%}.AddToVocabBtn.success,.AddToVocabBtn:hover{background-color:#059669}.EmptyState{align-items:center;color:#94a3b8;display:flex;flex-direction:column;height:100%;justify-content:center;padding:40px;text-align:center}.EmptyState .icon{font-size:64px;margin-bottom:15px}@media (max-width:1024px){.YoutubeMainLayout{grid-template-columns:1fr}.YoutubePracticeContainer{height:auto;overflow:visible}.TranscriptSidebar{height:500px}}.TranscriptContent.subtitle-mode{align-items:center;display:flex;justify-content:center;padding:30px}.TranscriptLine.subtitle-display{background:#0000;border-left:none;cursor:default;text-align:center;width:100%}.TranscriptLine.subtitle-display:hover{background-color:initial}.JapaneseText.subtitle-text{color:#1e293b;font-size:2rem;font-weight:700;justify-content:center;line-height:1.5;margin-bottom:12px}.EnglishTranslation.subtitle-translation{border-top:1px solid #e2e8f0;color:#64748b;font-size:1rem;font-style:italic;line-height:1.6;margin-top:4px;min-height:1.6em;padding-top:10px;text-align:center}
/*# sourceMappingURL=main.3b118022.css.map*/