body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;margin:0;padding:0;background:linear-gradient(135deg,#FFC0CB,#ADD8E6);color:#333333;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}.page-container{padding:10px;background-color:#FFFFFF;border-radius:15px;box-shadow:0 8px 16px rgba(0,0,0,.15);margin:15px auto;max-width:98%;width:100%;min-height:75vh;box-sizing:border-box;border:3px solid #ffd700;animation:popIn .9s cubic-bezier(.68,-.55,.27,1.55) forwards;position:relative;color-scheme:light}.home-page-container{display:flex;flex:1 1;min-height:100vh;margin:0;max-width:100%;width:100%;background-color:#F0F8FF;border-radius:0;box-shadow:none;flex-direction:column}.status-bar{background:linear-gradient(90deg,#FF69B4,#8A2BE2);padding:15px 25px;border-bottom:4px solid #ffd700;box-shadow:0 6px 12px rgba(0,0,0,.25);justify-content:space-between;color:white;font-weight:700;font-size:1.2em;text-shadow:2px 2px #4B0082}.book-card-small,.status-bar{display:flex;align-items:center}.book-card-small{background-color:#A7EEFF;border:2px solid #00ced1;border-radius:15px;padding:8px 12px;box-shadow:0 4px 8px rgba(0,0,0,.15);transition:transform .25s ease-out}.book-card-small:hover{transform:scale(1.05)}.sidebar{width:280px;background:linear-gradient(180deg,#FFD1DC,#FF69B4);padding:25px;box-shadow:8px 0 20px rgba(0,0,0,.2);border-radius:0;display:flex;flex-direction:column;align-items:center}.sidebar h2{color:#4B0082;text-align:center;margin-bottom:25px;font-size:2em;text-shadow:3px 3px #FFFACD;animation:pulse 1.8s infinite alternate}.book-list{list-style:none;padding:0;width:100%}.book-item{background-color:#FFFACD;margin-bottom:15px;padding:18px;border-radius:20px;cursor:pointer;transition:all .35s cubic-bezier(.25,.8,.25,1);box-shadow:0 8px 15px rgba(0,0,0,.15);border:4px solid #ffd700;font-size:1.3em;color:#228B22;text-align:center;text-shadow:1px 1px #FFFFFF}.book-item:hover{background-color:#FFEFD5;transform:translateY(-8px) scale(1.03);box-shadow:0 12px 25px rgba(0,0,0,.3);border-color:#FF69B4}.book-item.selected{background:linear-gradient(45deg,#00CED1,#7B68EE);color:white;font-weight:700;box-shadow:0 10px 20px rgba(0,0,0,.35);border-color:#4B0082;transform:scale(1.08)}.content-area{flex:1 1;padding:15px;display:flex;flex-direction:column;width:100%}.select-book-prompt{font-size:32px;color:#FF69B4;text-align:center;text-shadow:3px 3px #FFFACD;animation:bounceIn 1.2s ease-out}.start-learning-button{display:inline-block;background:linear-gradient(45deg,#00CED1,#228B22);color:white;padding:20px 40px;border-radius:40px;text-decoration:none;font-size:28px;transition:all .4s cubic-bezier(.25,.8,.25,1);box-shadow:0 10px 20px rgba(0,0,0,.25);border:none;text-shadow:3px 3px #4B0082}.start-learning-button:hover{background:linear-gradient(45deg,#228B22,#00CED1);transform:translateY(-8px) scale(1.05);box-shadow:0 15px 30px rgba(0,0,0,.4)}h1{color:#FF69B4;text-align:center;margin-bottom:35px;font-size:3.5em;text-shadow:4px 4px #FFFACD;animation:bounceIn 1.1s ease-out}button{background:linear-gradient(45deg,#7B68EE,#00CED1);color:white;border:none;padding:15px 30px;border-radius:25px;cursor:pointer;font-size:1.2em;transition:all .35s cubic-bezier(.25,.8,.25,1);box-shadow:0 6px 12px rgba(0,0,0,.2);text-shadow:2px 2px #4B0082}button:hover{background:linear-gradient(45deg,#00CED1,#7B68EE);transform:translateY(-5px) scale(1.05);box-shadow:0 8px 16px rgba(0,0,0,.3)}button:disabled{background-color:#cccccc;cursor:not-allowed;box-shadow:none;transform:none}input[type=text],select{padding:4px;border:2px solid #d3d3d3;border-radius:8px;font-size:1.1em;box-shadow:inset 0 1px 3px rgba(0,0,0,.1);transition:border-color .3s ease,box-shadow .3s ease}input[type=text]:focus,select:focus{border-color:#FF69B4;box-shadow:0 0 0 4px rgba(255,105,180,.4);outline:none}.word-list-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));grid-gap:10px;gap:10px;justify-content:center;margin-top:15px}.word-card-link{display:block;padding:15px;border-radius:25px;box-shadow:0 8px 16px rgba(0,0,0,.2);transition:all .35s cubic-bezier(.25,.8,.25,1);border:4px solid #ffd700;cursor:pointer}.word-card-link:hover{transform:translateY(-8px) scale(1.03);box-shadow:0 12px 25px rgba(0,0,0,.35);border-color:#FF69B4}.word-card{background-color:transparent;border:none;box-shadow:none;padding:0;text-align:center;position:relative;overflow:hidden}.word-card h3{color:#4B0082;margin-top:0;margin-bottom:8px;font-size:2em;text-shadow:3px 3px #FFFFFF}.word-card p{margin:3px 0;color:#228B22;font-size:1.1em}.search-component{margin-bottom:15px;background:linear-gradient(45deg,#A7EEFF,#FFFACD);padding:15px;border-radius:25px;box-shadow:0 8px 16px rgba(0,0,0,.15);border:2px solid #d3d3d3}.search-component h3{color:#4B0082;margin-top:0;margin-bottom:15px;font-size:2.2em;text-shadow:3px 3px #FFFFFF}.search-component h4{color:#228B22;margin-top:15px;margin-bottom:10px;font-size:1.2em}.checkbox-label{margin-right:20px;font-size:1.1em;color:#4B0082;cursor:pointer}.checkbox-label input[type=checkbox]{margin-right:8px;transform:scale(1.5)}.filter-group{margin-top:20px}.pronunciation-button{background:linear-gradient(45deg,#FFD700,#FF69B4);border-radius:50%;width:80px;height:80px;font-size:3em;display:inline-flex;justify-content:center;align-items:center;margin:0 15px;box-shadow:0 8px 16px rgba(0,0,0,.25);animation:pulse 1.8s infinite alternate}.pronunciation-button:hover{background:linear-gradient(45deg,#FF69B4,#FFD700);transform:scale(1.15)}.dictation-input{width:90%;max-width:550px;margin-right:20px}.dictation-button{background:linear-gradient(45deg,#228B22,#00CED1)}.dictation-button:hover{background:linear-gradient(45deg,#00CED1,#228B22)}.feedback-section{margin-top:25px;padding:25px;border-radius:20px;box-shadow:0 8px 16px rgba(0,0,0,.15);text-align:center;background-color:#FFFACD}.correct-feedback{color:#228B22}.correct-feedback,.incorrect-feedback{font-size:1.8em;font-weight:700;text-shadow:1px 1px #FFFFFF}.incorrect-feedback{color:#FF69B4}.word-details{margin-top:20px;background-color:#A7EEFF;padding:20px;border-radius:15px;border:2px solid #00ced1}.word-details p{margin:10px 0;font-size:1.2em;color:#4B0082}.next-button{margin-top:25px;background:linear-gradient(45deg,#7B68EE,#FF69B4)}.navigation-buttons button,.summary-buttons button{margin:0 15px}#root{width:100%;margin:0;padding:0}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin 20s linear infinite}}.card{padding:2em}.read-the-docs{color:#888}.page-container{display:flex;flex-direction:column;min-height:80vh;min-width:500px;margin:0 auto;text-align:left}.content-grow{flex-grow:1}.navigation-buttons{display:flex;justify-content:space-between;align-items:center;padding-top:1.5rem}h1>.btn-play-span,li>.btn-play-span,p>.btn-play-span{display:inline-block!important;padding:5px 10px!important;margin:0 8px!important;line-height:1!important;vertical-align:middle!important;border:2px solid #4b0082!important;border-radius:12px!important;cursor:pointer!important;text-align:center!important;box-shadow:0 3px 6px rgba(0,0,0,.2);transition:all .25s ease-out;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpolygon points='2,2 8,5 2,8' fill='white'/%3E%3C/svg%3E"),linear-gradient(45deg,#FFD700,#FF69B4)!important;background-repeat:no-repeat,no-repeat;background-position:50%,50%;background-size:40%,cover;min-width:30px;min-height:20px}h1>.btn-play-span:hover,li>.btn-play-span:hover,p>.btn-play-span:hover{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpolygon points='2,2 8,5 2,8' fill='white'/%3E%3C/svg%3E"),linear-gradient(45deg,#FF69B4,#FFD700)!important;transform:scale(1.1)}@keyframes flash{0%{background-color:transparent}50%{background-color:#FFC0CB}to{background-color:transparent}}.flash-background{animation:flash .5s ease-in-out}@keyframes flash-text{0%{color:inherit}50%{color:#FF69B4}to{color:inherit}}.flash-text{animation:flash-text .5s ease-in-out}.input-area{margin-top:30px;display:flex;flex-direction:column;align-items:center}.input-and-status-wrapper{display:flex;align-items:center;width:100%;justify-content:center}.input-area input{padding:12px;font-size:1.2em;border:3px solid #00ced1;border-radius:20px;width:85%;max-width:600px;box-shadow:inset 0 5px 10px rgba(0,0,0,.15)}.status-icon{margin-left:15px;font-size:2em;font-weight:700}.correct-icon{color:#228B22}.error-icon{color:#FF69B4}.hint-text{margin-top:15px;font-size:1.8rem;color:#7B68EE;font-weight:700;text-shadow:1px 1px #FFFFFF}.audio-error-hint{font-size:14px;font-weight:400;color:#999999;text-shadow:none;margin-left:15px}.word-card-link{text-decoration:none;color:inherit}.word-card-link.init{background-color:#FFFFFF}.word-card-link.learned{background-color:#FFFACD}.word-card-link.error{background-color:#FFC0CB}.word-card-link.correct{background-color:#A7EEFF}.last-result-correct{background-color:#A7EEFF;border-radius:15px;border:3px solid #228b22}.last-result-correct,.last-result-incorrect{padding:15px;margin-bottom:20px;box-shadow:0 5px 10px rgba(0,0,0,.15)}.last-result-incorrect{background-color:#FFC0CB;border-radius:15px;border:3px solid #ff69b4}@keyframes popIn{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.07)}to{transform:scale(1)}}@keyframes bounceIn{0%,20%,40%,60%,80%,to{transition-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:scale3d(.2,.2,.2)}20%{transform:scale3d(1.2,1.2,1.2)}40%{transform:scale3d(.95,.95,.95)}60%{opacity:1;transform:scale3d(1.05,1.05,1.05)}80%{transform:scale3d(.98,.98,.98)}to{opacity:1;transform:scaleX(1)}}.last-result-incorrect .diff-container{text-align:left;padding:10px;border-radius:10px;background-color:rgba(255,255,255,.5)}.status-bar .current-book-info{display:flex;align-items:center}.status-bar .book-cover-small{width:30px;height:45px;object-fit:cover;margin-right:10px}.status-bar .book-card-small{border:1px solid #eee;padding:5px;border-radius:5px;display:flex;align-items:center;background-color:rgba(255,255,255,.2);color:white}.status-bar .book-name{color:white;font-weight:700}.status-bar .switch-book-button{margin-left:15px}.status-bar .stats-button,.status-bar .switch-book-button{padding:8px 15px;border-radius:5px}.status-bar .no-book-selected{color:white;font-weight:700}.last-result-incorrect .diff-container p{margin:8px 0;font-size:1.2em;font-family:Courier New,Courier,monospace;display:flex;align-items:center}.last-result-incorrect .diff-container strong{color:#4B0082;width:120px;display:inline-block}@media (max-width:768px){.home-page-container{flex-direction:column}.sidebar{width:100%;box-shadow:none;padding:15px;border-bottom:2px solid #ffd1dc}.content-area{padding:10px}.page-container{min-width:0;margin:5px;padding:10px}h1{font-size:2.5em}.sidebar h2{font-size:1.8em;margin-bottom:15px}.book-item{padding:15px;font-size:1.1em}.status-bar{flex-direction:row;justify-content:space-between;align-items:center;padding:5px 10px;height:55px;gap:10px}.status-bar .current-book-info{flex-direction:row;align-items:center;gap:5px;min-width:0}.status-bar .book-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:100px;display:inline-block}.status-bar .stats-button,.status-bar .switch-book-button{padding:6px 10px;font-size:.9em;flex-shrink:0}.status-bar .book-card-small{padding:2px 5px;min-width:0}.status-bar .book-cover-small{width:25px;height:38px;margin-right:5px}.search-component{flex-direction:column;align-items:stretch}.search-component.book-list-search{flex-direction:row;align-items:center;flex-wrap:nowrap;padding:.5rem;gap:.5rem}.book-list-search .book-search-input{flex:1 1 60%;min-width:0}.book-list-search .book-type-select{flex:1 1 40%;min-width:0}.pronunciation-button{width:60px;height:60px;font-size:2.5em}.navigation-buttons{flex-direction:column;gap:10px}.navigation-buttons button{width:100%}.word-list-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.word-card h3{font-size:1.5em}.word-list-top-bar{justify-content:flex-end}.word-list-book-title,.word-list-search .phrases-filter,.word-list-search .type-filter{display:none}.search-component.word-list-search{flex-direction:row;flex-wrap:nowrap;gap:.5rem}.word-list-search .word-search-input{flex:1 1 40%;min-width:0}.word-list-search .status-filter,.word-list-search .unit-filter{flex:1 1 30%;min-width:0}.word-list-search .status-filter select,.word-list-search .unit-filter select{width:100%}.word-detail-page .word-display-title{font-size:1.8em;margin-bottom:.5rem;margin-top:0}.word-detail-page .hint-text,.word-detail-page .sentence-section{display:none}.word-detail-page .hint-text.audio-error-hint{display:inline!important}.word-detail-page .word-meta-info{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1rem;padding:.2rem;margin-bottom:.5rem;background-color:#f7f7f7;border-radius:8px}.word-detail-page .word-meta-info p{margin:0;flex-shrink:0}.word-detail-page .input-area{margin-top:.2rem}.word-detail-page .navigation-buttons{flex-direction:row;justify-content:space-between;gap:.5rem;padding-top:.5rem}.word-detail-page .navigation-buttons button{flex:1 1;width:auto;padding:10px 5px;font-size:1em;white-space:nowrap}.dictation-page .dictation-sentence-section,.dictation-page .hint-text{display:none}.dictation-page .hint-text.audio-error-hint{display:inline!important}.dictation-page .dictation-meta-info{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;margin:.5rem 0}.dictation-page .dictation-meta-info p{margin:0}.dictation-page .last-result-correct,.dictation-page .last-result-incorrect{padding:10px;margin-bottom:10px}.dictation-page input[type=text]{margin:.5rem auto;text-align:center}.dictation-page .dictation-progress{margin:.5rem 0;text-align:center}.dictation-page .pronunciation-button{width:50px;height:50px;font-size:2em}.dictation-page .navigation-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:.5rem}.dictation-page .navigation-buttons button{width:calc(50% - 10px);flex-grow:0;margin:5px 0}.word-list-page .word-count-summary{margin:.5rem 0}.word-detail-page .content-grow{flex-grow:0}.dictation-page .dictation-top-area{flex-direction:row;align-items:center;justify-content:center;gap:1rem}.dictation-page .dictation-top-area .pronunciation-button{width:40px;height:40px;font-size:1.5em;flex-shrink:0}.dictation-page .dictation-top-area .last-result-correct,.dictation-page .dictation-top-area .last-result-incorrect{flex-grow:1;margin-bottom:0;padding:8px;text-align:center}.summary-page .summary-buttons{display:flex;flex-direction:column;gap:10px;align-items:center}.summary-page .summary-buttons button{width:80%;margin:0}.word-detail-page .last-result-incorrect{display:none}.word-detail-page .word-display-title{justify-content:space-between;flex-wrap:wrap;text-align:left}.word-detail-page .word-display-title .btn-play-span{flex-shrink:0}.word-detail-page .dictate-today-learned-button{padding:5px 10px;font-size:1em!important;margin-left:auto;vertical-align:middle}.word-detail-page .word-header-area{flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:.5rem}}.book-list-search{display:flex;gap:1rem;align-items:center;margin-bottom:1rem;flex-wrap:wrap}.book-list-search .book-search-input,.book-list-search .book-type-select{padding:.5rem;font-size:1em}.word-list-top-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.word-list-top-bar h2{margin:0}.word-list-actions{display:flex;gap:10px}.word-list-search{display:flex;gap:1rem;align-items:center;margin-bottom:1rem;flex-wrap:wrap}.word-list-search .word-search-input,.word-list-search select{padding:.5rem}.dictation-meta-info{text-align:center;margin:1rem 0}.word-count-summary{margin-bottom:1rem;text-align:center}.dictation-top-area{flex-direction:column;gap:1rem}.dictation-top-area,.word-header-area{display:flex;align-items:center;margin-bottom:1rem}.word-header-area{justify-content:space-between}.summary-page{text-align:center}.summary-buttons{margin-top:20px}.word-display-title{display:flex;align-items:center;justify-content:center;color:#333;text-shadow:none}.word-detail-page .pronunciation-button{width:50px;height:50px;font-size:2em;margin:0 5px}.word-detail-page{background-color:#FFFFFF!important}.page-container.word-detail-page .content-grow h1.word-display-title .dictate-today-learned-button{font-size:24px;padding:8px 15px;flex-shrink:0;margin-right:20px}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.7);display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:white;padding:20px;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.2);position:relative}.modal-close-button{position:absolute;top:-40px;right:-30px;background:transparent;color:yellow;border:none;font-size:48px;cursor:pointer;line-height:1;padding:0;text-shadow:0 2px 4px rgba(0,0,0,.5)}