.fade-in-scroll{opacity:0;transition:opacity .6s ease-out,transform .6s ease-out;transition-delay:var(--delay, 0ms)}.fade-in-scroll.visible{opacity:1}.fade-in-up{transform:translateY(30px)}.fade-in-up.visible{transform:translateY(0)}.fade-in-down{transform:translateY(-30px)}.fade-in-down.visible{transform:translateY(0)}.fade-in-left{transform:translate(-30px)}.fade-in-left.visible{transform:translate(0)}.fade-in-right{transform:translate(30px)}.fade-in-right.visible{transform:translate(0)}@media (max-width: 768px){.fade-in-scroll{transition-duration:.4s}.fade-in-up,.fade-in-down,.fade-in-left,.fade-in-right{transform:translateY(20px) translate(0)}.fade-in-up.visible,.fade-in-down.visible,.fade-in-left.visible,.fade-in-right.visible{transform:translateY(0) translate(0)}}@media (prefers-reduced-motion: reduce){.fade-in-scroll{opacity:1;transform:none;transition:none}}.level-selection{text-align:center;width:100%;max-width:900px;padding:20px 10px;box-sizing:border-box}.title{font-size:3rem;margin-bottom:1rem;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:.1em;line-height:1.2}.title-char{display:inline-block;background:linear-gradient(135deg,#ffffff 0%,#f0f0ff 25%,#e0e0ff 50%,#d0d0ff 75%,#ffffff 100%);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:titleCharEntrance .8s cubic-bezier(.34,1.56,.64,1) backwards,titleGradient 3s ease infinite,titleFloat 4s ease-in-out infinite;text-shadow:0 0 20px rgba(255,255,255,.5);filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));will-change:transform,opacity}@keyframes titleCharEntrance{0%{opacity:0;transform:translateY(30px) rotateX(-90deg) scale(.5)}60%{transform:translateY(-5px) rotateX(10deg) scale(1.1)}to{opacity:1;transform:translateY(0) rotateX(0) scale(1)}}@keyframes titleGradient{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes titleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.mascot-container{display:flex;justify-content:center;align-items:center;margin:2rem 0;width:100%;position:relative;height:300px;perspective:600px;perspective-origin:center center;transform-style:preserve-3d}.mascot-image{max-width:200px;max-height:200px;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2));animation:float 3s ease-in-out infinite;position:relative;z-index:2;transform-style:preserve-3d}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.floating-kana{position:absolute;font-size:2.5rem;font-weight:700;pointer-events:none;animation:rotate3DSphere 60s infinite linear;animation-delay:calc(var(--delay) * .1s);transform-style:preserve-3d;left:50%;top:50%;margin-left:-.5em;margin-top:-.5em;text-shadow:0 2px 8px rgba(0,0,0,.5),0 0 10px rgba(255,255,255,.3);z-index:var(--z-index, 3);filter:brightness(1.1);will-change:transform}@keyframes rotate3DSphere{0%{transform:rotateY(calc(var(--horizontal-angle) * 1deg)) rotateX(calc(var(--vertical-angle) * 1deg)) translateZ(130px) rotateX(calc(var(--vertical-angle) * -1deg)) rotateY(calc(var(--horizontal-angle) * -1deg))}to{transform:rotateY(calc(var(--horizontal-angle) * 1deg + 360deg)) rotateX(calc(var(--vertical-angle) * 1deg)) translateZ(130px) rotateX(calc(var(--vertical-angle) * -1deg)) rotateY(calc(var(--horizontal-angle) * -1deg - 360deg))}}@media (max-width: 768px){.mascot-container{height:250px;perspective:800px}.mascot-image{max-width:150px;max-height:150px}.floating-kana{font-size:2rem}@keyframes rotate3DSphere{0%{transform:rotateY(calc(var(--horizontal-angle) * 1deg)) rotateX(calc(var(--vertical-angle) * 1deg)) translateZ(100px) rotateX(calc(var(--vertical-angle) * -1deg)) rotateY(calc(var(--horizontal-angle) * -1deg))}to{transform:rotateY(calc(var(--horizontal-angle) * 1deg + 360deg)) rotateX(calc(var(--vertical-angle) * 1deg)) translateZ(100px) rotateX(calc(var(--vertical-angle) * -1deg)) rotateY(calc(var(--horizontal-angle) * -1deg - 360deg))}}}.subtitle{font-size:1.2rem;color:#ffffffe6;margin-bottom:3rem}.category-section{margin-bottom:60px;width:100%}.category-title{font-size:1.5rem;margin-bottom:20px;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.level-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;margin-top:2rem;width:100%;align-items:stretch}.jlpt-mode-buttons{display:flex;gap:30px;justify-content:center;margin-top:30px;flex-wrap:wrap;align-items:flex-start}.mode-button-container{width:100%;max-width:400px;display:flex;flex-direction:column;align-items:center}.jlpt-mode-button{background:rgba(255,255,255,.95);border:3px solid transparent;border-radius:20px;padding:30px 50px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 6px #0000001a;width:100%;max-width:400px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:15px;position:relative;overflow:hidden;transform:translateY(0) scale(1);min-height:200px;height:200px;box-sizing:border-box}.jlpt-mode-button:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 12px 24px #0003;border-color:#667eea}.jlpt-mode-button:active{transform:translateY(-2px) scale(.98);transition:all .1s ease}.jlpt-mode-button.active{border-color:#667eea;background:linear-gradient(135deg,rgba(102,126,234,.1) 0%,rgba(118,75,162,.1) 100%);box-shadow:0 6px 12px #667eea4d}.mode-button-icon{font-size:3rem;line-height:1;margin-bottom:5px;flex-shrink:0}.mode-button-title{font-size:1.5rem;color:#333;margin:0;font-weight:700;flex-shrink:0;line-height:1.2}.mode-button-description{font-size:.95rem;color:#0009;margin:0;font-style:italic;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;max-height:2.8em;min-height:2.8em;flex-shrink:0}.level-select-inline{width:100%;margin-top:25px;animation:fadeInExpand .4s ease-out}@keyframes fadeInExpand{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.inline-levels{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center;width:100%;max-width:800px;margin:0 auto}.inline-level-card{border:3px solid var(--level-color, #e0e0e0);border-radius:50%;width:70px;height:70px;padding:0;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;transform:translateY(0) scale(1);animation:circlePopUp .4s cubic-bezier(.34,1.56,.64,1) backwards;animation-delay:var(--delay, 0s);box-shadow:0 4px 15px #0003;flex-shrink:0}@keyframes circlePopUp{0%{opacity:0;transform:translateY(20px) scale(.5) rotate(-180deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}.inline-level-card:hover:not(.coming-soon){transform:translateY(-5px) scale(1.15);border-color:var(--level-color);box-shadow:0 8px 25px #0000004d;background:linear-gradient(135deg,var(--level-color) 0%,var(--level-color)dd 100%)!important;filter:brightness(1.1)}.inline-level-card:active:not(.coming-soon){transform:translateY(-2px) scale(1.1);transition:all .1s ease}.inline-level-card.coming-soon{opacity:.5;cursor:not-allowed;border-color:#e0e0e0;background:#f0f0f0!important}.inline-level-card.coming-soon:hover{transform:translateY(0) scale(1);border-color:#e0e0e0;box-shadow:0 4px 12px #00000026;background:#f0f0f0!important;filter:none}.inline-level-card.coming-soon .inline-level-name{color:#999}.inline-level-name{font-size:1.1rem;font-weight:800;color:var(--level-color);text-align:center;white-space:nowrap;line-height:1;text-shadow:0 1px 3px rgba(0,0,0,.1);letter-spacing:.5px}.inline-coming-soon{position:absolute;top:-5px;right:-5px;background:#ff6b6b;color:#fff;font-size:.5rem;font-weight:700;padding:2px 5px;border-radius:8px;white-space:nowrap;box-shadow:0 2px 4px #0003;line-height:1.2}.panel-level-card.coming-soon{opacity:.6;cursor:not-allowed}.panel-level-icon{font-size:2.5rem;line-height:1}.panel-level-name{font-size:1.2rem;font-weight:600;color:#333;text-align:center}@media (max-width: 768px){.jlpt-mode-buttons{flex-direction:column;align-items:center;gap:20px}.mode-button-container{width:100%;max-width:100%}.jlpt-mode-button{width:100%;max-width:100%;padding:25px 30px;min-height:180px;height:180px}.mode-button-description{font-size:.9rem;max-height:2.6em}.level-select-inline{margin-top:20px;width:100%}.inline-levels{width:100%;max-width:100%;gap:10px}.inline-level-card{width:60px;height:60px}.inline-level-name{font-size:.95rem}.inline-coming-soon{font-size:.45rem;padding:1px 4px;top:-3px;right:-3px}}.kana-level-grid{grid-template-columns:repeat(2,1fr);gap:16px;max-width:500px;margin-left:auto;margin-right:auto;width:100%}.jlpt-level-grid{grid-template-columns:repeat(5,1fr);gap:16px;width:100%}.theme-level-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;width:100%;max-width:900px;margin:0 auto}@media (max-width: 900px){.kana-level-grid{max-width:100%}.jlpt-level-grid{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:12px}.theme-level-grid{grid-template-columns:repeat(3,1fr);gap:12px}}.level-card{background:white;border:none;border-radius:15px;padding:0;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 6px #0000001a;position:relative;overflow:hidden;transform:translateY(0) scale(1);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:140px;height:100%;width:100%}.level-card.coming-soon{opacity:.6;cursor:not-allowed;position:relative}.level-card.coming-soon:hover{transform:none;box-shadow:0 4px 6px #0000001a}.level-card.coming-soon:hover:before{transform:scaleX(0)}.coming-soon-badge{position:absolute;top:8px;right:8px;background:#ff6b6b;color:#fff;font-size:.7rem;font-weight:700;padding:4px 8px;border-radius:12px;white-space:nowrap;box-shadow:0 2px 4px #0003}.kana-level-card,.jlpt-level-card{padding:1.5rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:140px}.kana-icon{font-size:3rem;line-height:1;font-weight:400;display:flex;align-items:center;justify-content:center;min-height:48px}.jlpt-icon{font-size:2.5rem;line-height:1;display:flex;align-items:center;justify-content:center;min-height:48px}.level-card:before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--level-color);transform:scaleX(0);transition:transform .3s ease}.level-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 12px 24px #00000026}.level-card:active{transform:translateY(-4px) scale(.98);transition:all .1s ease}.level-card:hover:before{transform:scaleX(1)}.level-name{font-size:1.1rem;font-weight:600;color:#333;text-align:center;line-height:1.3;word-break:break-word}.kana-level-card .level-name,.jlpt-level-card .level-name{font-size:1.1rem}.theme-level-card .level-name{font-size:1rem}.theme-level-card{padding:1.5rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:140px}.theme-icon{font-size:3rem;line-height:1;display:flex;align-items:center;justify-content:center;min-height:48px}.theme-level-card .level-name{font-size:1.1rem;font-weight:600}.action-buttons{display:flex;gap:15px;justify-content:center;margin-top:30px;flex-wrap:wrap}.board-button,.blog-button{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;padding:15px 40px;border-radius:25px;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003}.board-button:hover,.blog-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}@media (max-width: 768px){.level-selection{padding:15px 10px}.title{font-size:clamp(1.5rem,8vw,2.5rem);margin-bottom:.5rem}.subtitle{font-size:clamp(.9rem,4vw,1.2rem);margin-bottom:1.5rem}.category-section{margin-bottom:25px}.category-title{font-size:clamp(1.1rem,5vw,1.5rem);margin-bottom:15px}.level-grid{grid-template-columns:1fr;gap:15px;margin-top:1rem}.theme-level-grid{grid-template-columns:repeat(2,1fr)}.jlpt-options{margin-top:30px;gap:25px}.option-section-title{font-size:1.1rem;margin-bottom:15px}.theme-icon,.kana-icon{font-size:2rem}.jlpt-icon{font-size:1.8rem}.level-card{padding:1.2rem .8rem;min-height:120px}.kana-level-card,.jlpt-level-card,.theme-level-card{min-height:120px;padding:1.2rem .8rem}.kana-icon,.theme-icon{font-size:2.5rem;min-height:40px}.jlpt-icon{font-size:2rem;min-height:40px}.level-name{font-size:clamp(.9rem,4vw,1.1rem)}.kana-level-grid{max-width:100%;gap:12px}.theme-level-grid{grid-template-columns:repeat(2,1fr);gap:12px}.jlpt-level-grid{grid-template-columns:repeat(3,1fr);gap:12px}.board-button{width:100%;max-width:300px;padding:12px 30px;font-size:1rem;margin-top:20px}}@media (prefers-reduced-motion: reduce){.level-card,.jlpt-mode-button,.panel-level-card{animation:none!important;transition:none!important}.level-select-panel,.panel-overlay,.mascot-image,.floating-kana{animation:none!important}}.report-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.report-modal{background:white;border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 4px 20px #0000004d;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.report-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e0e0e0}.report-modal-header h2{margin:0;font-size:1.3rem;color:#333}.report-modal-close{background:none;border:none;font-size:2rem;color:#666;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s}.report-modal-close:hover:not(:disabled){background:#f0f0f0;color:#333}.report-modal-close:disabled{opacity:.5;cursor:not-allowed}.report-modal-form{padding:20px}.report-modal-field{margin-bottom:20px}.report-modal-field label{display:block;margin-bottom:8px;font-weight:600;color:#333;font-size:.95rem}.report-type-buttons{display:flex;gap:10px}.report-type-btn{flex:1;padding:10px 15px;border:2px solid #e0e0e0;background:white;border-radius:8px;cursor:pointer;font-size:.9rem;transition:all .2s;color:#666}.report-type-btn:hover{border-color:#4a90e2;color:#4a90e2}.report-type-btn.active{border-color:#4a90e2;background:#4a90e2;color:#fff}.report-modal-field textarea{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:.95rem;font-family:inherit;resize:vertical;min-height:120px;box-sizing:border-box;transition:border-color .2s}.report-modal-field textarea:focus{outline:none;border-color:#4a90e2}.report-modal-field textarea:disabled{background:#f5f5f5;cursor:not-allowed}.report-char-count{text-align:right;font-size:.85rem;color:#999;margin-top:5px}.report-modal-error{background:#fee;color:#c33;padding:12px;border-radius:8px;margin-bottom:15px;font-size:.9rem}.report-modal-success{padding:40px 20px;text-align:center}.report-modal-success p{color:#4a90e2;font-size:1.1rem;font-weight:600;margin:0}.report-modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}.report-modal-cancel,.report-modal-submit{padding:12px 24px;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.report-modal-cancel{background:#f0f0f0;color:#666}.report-modal-cancel:hover:not(:disabled){background:#e0e0e0}.report-modal-submit{background:#4a90e2;color:#fff}.report-modal-submit:hover:not(:disabled){background:#357abd}.report-modal-cancel:disabled,.report-modal-submit:disabled{opacity:.5;cursor:not-allowed}.flashcard-quiz{width:100%;max-width:500px;margin:0 auto;padding:20px;display:flex;flex-direction:column;height:calc(100% - 60px);max-height:min(calc(100vh - 60px),900px);overflow:hidden;box-sizing:border-box;justify-content:center}.quiz-info{display:flex;justify-content:space-between;color:#fff;font-size:.9rem}.flashcard-single{position:relative;width:100%;flex:1;min-height:0;max-height:min(calc(100vh - 260px),580px);margin-bottom:15px;background:white;border-radius:15px;padding:20px 20px 16px;box-shadow:0 8px 20px #0000004d;display:flex;flex-direction:column;gap:0;overflow:hidden;transition:opacity .15s ease-in-out}.flashcard-content-scroll{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:16px;padding-top:12px}.flashcard-single.transitioning{opacity:0;pointer-events:none}.flashcard-single.kana-mode .flashcard-content-scroll{align-items:center;justify-content:center}.flashcard-single.kana-mode .flashcard-section{align-items:center;width:100%}.flashcard-single.kana-mode .section-example .section-content,.flashcard-single.kana-mode .section-example .example-content{text-align:center}.flashcard-section{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.flashcard-section .section-label{font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b}.flashcard-divider{border:none;border-top:1px solid #e5e7eb;margin:8px 0}.section-toggle-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:auto;min-width:fit-content;padding:6px 14px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;font-size:.88rem;font-weight:600;color:#fff;cursor:pointer;transition:transform .2s,box-shadow .2s;text-align:center;box-shadow:0 2px 8px #667eea59}.section-toggle-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px #667eea80}.section-toggle-btn:active{transform:translateY(0)}.section-toggle-btn[aria-expanded=true]{background:linear-gradient(135deg,#5568d3 0%,#6a3f8f 100%);box-shadow:0 2px 8px #667eea59}.section-toggle-label{flex:0 1 auto}.section-toggle-icon{font-size:.65rem;opacity:.9}.flashcard-bottom-buttons{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:4px;padding-top:4px;border-top:1px solid #e5e7eb;flex-shrink:0}.flashcard-bottom-buttons .section-toggle-btn{height:36px;padding:0 10px;font-size:.82rem;box-sizing:border-box}.flashcard-bottom-buttons .section-toggle-btn.revealed{opacity:.7;background:linear-gradient(135deg,#94a3b8 0%,#64748b 100%)}.flashcard-bottom-buttons .add-to-notes-btn{margin-top:0;margin-left:auto;padding:6px 12px;font-size:.85rem}.flashcard-bottom-buttons .add-to-notes-btn-icon{height:36px;min-width:32px;padding:0 8px;font-size:1.05rem;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}.flashcard-section .section-content{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;color:#0f172a}.section-reading{min-height:2em;height:2em;margin-bottom:-8px;display:flex;align-items:center;justify-content:center}.section-reading .section-content{font-size:clamp(.95rem,2.5vw,1.15rem);color:#6b7280;line-height:1.4;text-align:center;font-weight:400;width:100%}.section-word{width:100%;align-items:center;margin-top:0}.section-word .section-content{font-size:clamp(2.25rem,10vw,3.75rem);font-weight:700;color:#111827;line-height:1.2;text-align:center;margin:4px 0 0;width:100%}.section-meaning{min-height:3em;height:3em;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-top:-8px}.section-meaning .section-content{font-size:clamp(1.15rem,3.5vw,1.5rem);font-weight:500;color:#111827;text-align:center;width:100%;line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.section-example{min-height:6em;height:auto;flex-shrink:0}.section-example .section-content,.section-example .example-content{background:transparent;border:none;padding:0;text-align:left;display:flex;flex-direction:column;gap:6px;width:100%}.section-example .example-japanese{font-size:clamp(.8rem,1.9vw,.95rem);font-weight:500;color:#111827;line-height:1.6}.section-example .example-meaning{font-size:clamp(.8rem,1.9vw,.95rem);color:#374151;font-weight:400;line-height:1.6}.section-example .example-hiragana{font-size:clamp(.72rem,1.6vw,.85rem);color:#6b7280;line-height:1.5}.flashcard-single .add-to-notes-btn{align-self:flex-start;margin-top:4px}.answer-buttons{display:flex;gap:15px;justify-content:center;margin-top:15px;flex-shrink:0}.answer-btn{padding:15px 40px;border:none;border-radius:25px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003;white-space:nowrap;word-break:keep-all;overflow-wrap:normal}.wrong-btn{background:#e74c3c;color:#fff}.wrong-btn:hover{background:#c0392b;transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}.correct-btn{background:#2ecc71;color:#fff}.correct-btn:hover{background:#27ae60;transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}.result-message{text-align:center;color:#fff;font-size:1.2rem;margin-top:20px;padding:15px;background:rgba(255,255,255,.2);border-radius:10px}.add-to-notes-btn{margin-top:8px;padding:10px 20px;background:#667eea;color:#fff;border:none;border-radius:8px;font-size:.9rem;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 5px #0003}.add-to-notes-btn:hover:not(:disabled){background:#5568d3;transform:translateY(-2px);box-shadow:0 4px 8px #0000004d}.add-to-notes-btn:disabled{opacity:.6;cursor:not-allowed}.add-to-notes-btn.added{background:#2ecc71}.add-to-notes-btn.added:hover{background:#27ae60}.quiz-complete{text-align:center;background:white;padding:40px;border-radius:20px;box-shadow:0 10px 30px #0000004d}.stat-label{font-size:1rem;color:#666}.stat-value{font-size:2.5rem;font-weight:700;color:#333}.restart-button{padding:15px 40px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;border-radius:25px;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003;width:100%;max-width:300px}.next-day-button{padding:15px 40px;background:linear-gradient(135deg,#2ecc71 0%,#27ae60 100%);color:#fff;border:none;border-radius:25px;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003;width:100%;max-width:300px}.retry-wrong-button{padding:15px 40px;background:linear-gradient(135deg,#ff6b6b 0%,#ee5a6f 25%,#c44569 50%,#feca57 75%,#ff9ff3 100%);background-size:200% 200%;color:#fff;border:none;border-radius:25px;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003;width:100%;max-width:300px;position:relative;animation:retryButtonAppear .5s ease-out,retryButtonPulse 2s ease-in-out infinite,retryButtonGradient 3s ease infinite;margin:20px auto;text-shadow:0 2px 4px rgba(0,0,0,.3)}@media (max-width: 768px){.flashcard-quiz{max-width:100%;padding:60px 10px 10px;height:auto;min-height:0;max-height:calc(100vh - 80px);justify-content:flex-start}.quiz-header{margin-bottom:15px;flex-shrink:0;margin-top:10px}.quiz-info{font-size:.8rem;flex-wrap:wrap;gap:5px}.flashcard-single{max-height:min(calc(100vh - 220px),75vh);padding:16px 14px;gap:14px}.section-word .section-content{font-size:clamp(1.75rem,10vw,2.75rem)}.answer-buttons{flex-direction:row;flex-wrap:nowrap;gap:10px;margin-top:15px;width:100%;min-width:0}.answer-btn{flex:1;min-width:0;padding:14px 10px;font-size:.85rem;white-space:nowrap!important;word-break:keep-all;overflow:hidden;text-overflow:ellipsis}.result-message{font-size:1rem;margin-top:15px;padding:12px}}@media (max-width: 480px){.flashcard-quiz{padding:55px 8px 8px;max-height:calc(100vh - 70px)}.quiz-header{margin-bottom:12px;margin-top:8px}.quiz-info{font-size:.75rem}.flashcard-single{max-height:min(calc(100vh - 200px),70vh);padding:12px 10px;gap:12px}.section-word .section-content{font-size:clamp(1.5rem,8vw,2.25rem)}.add-to-notes-btn{margin-top:4px;padding:8px 14px;font-size:.8rem}.answer-btn{padding:12px 8px;font-size:.8rem;white-space:nowrap!important;word-break:keep-all}}@media (max-width: 360px){.answer-btn{font-size:.75rem;padding:10px;white-space:nowrap!important}}.multiple-choice-quiz{width:100%;max-width:800px;margin:0 auto;padding:10px;display:flex;flex-direction:column;height:calc(100% - 60px);max-height:calc(100% - 60px);overflow:hidden;box-sizing:border-box;justify-content:center}.quiz-header{margin-bottom:15px;flex-shrink:0}.quiz-header-controls{display:flex;justify-content:flex-start;margin-bottom:10px}.always-reading-toggle{display:inline-flex;align-items:center;gap:8px;cursor:pointer;color:#fff;font-size:.85rem;font-weight:600;-webkit-user-select:none;user-select:none}.always-reading-toggle input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}.toggle-box{width:18px;height:18px;border-radius:4px;border:2px solid #667eea;background:rgba(255,255,255,.95);display:inline-flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #00000026}.always-reading-toggle input:checked+.toggle-box{background:#667eea;border-color:#667eea}.always-reading-toggle input:checked+.toggle-box:after{content:"✓";color:#fff;font-size:12px;font-weight:700;line-height:1}.toggle-label{color:#fff}.progress-bar{width:100%;height:8px;background:rgba(255,255,255,.3);border-radius:4px;overflow:hidden;margin-bottom:15px}.progress-fill{height:100%;background:white;transition:width .3s ease;border-radius:4px}.quiz-info{display:flex;justify-content:space-between;color:#fff;font-size:.9rem;flex-wrap:wrap;gap:10px}.report-button{position:absolute;top:15px;right:15px;background:rgba(255,255,255,.9);border:2px solid rgba(0,0,0,.1);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;transition:all .2s;z-index:100;box-shadow:0 2px 8px #00000026}.report-button:hover{background:rgba(255,255,255,1);border-color:#0003;transform:scale(1.1);box-shadow:0 4px 12px #0003}.question-card{position:relative;background:white;border-radius:20px;padding:20px;margin-bottom:15px;box-shadow:0 10px 30px #0000004d;flex-shrink:0}.question-header{margin-bottom:10px}.question-label{font-size:1.2rem;color:#666;font-weight:500}.word-display{text-align:center;margin-top:10px}.word-kanji{font-size:clamp(2.5rem,8vw,4rem);font-weight:700;margin-bottom:10px;color:#333;line-height:1.2}.word-reading{font-size:clamp(1.2rem,4vw,2rem);color:#666;margin-bottom:10px;line-height:1.4}.show-reading-btn{margin-top:10px;padding:6px 16px;background:#667eea;color:#fff;border:none;border-radius:20px;font-size:.85rem;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 5px #0003}.show-reading-btn:hover{background:#5568d3;transform:translateY(-2px);box-shadow:0 4px 8px #0000004d}.options-container{display:flex;flex-direction:column;gap:10px;margin-bottom:15px;flex:1;min-height:0;overflow-y:auto}.option-button{display:flex;align-items:center;gap:12px;padding:12px 20px;background:white;border:2px solid #e0e0e0;border-radius:15px;font-size:clamp(.95rem,2.5vw,1.1rem);cursor:pointer;transition:all .3s ease;text-align:left;width:100%;box-shadow:0 2px 5px #0000001a;flex-shrink:0}.option-button:hover:not(:disabled){border-color:#667eea;transform:translateY(-2px);box-shadow:0 4px 10px #0003}.option-button:disabled{cursor:not-allowed;opacity:.6}.option-button.correct{background:#d4edda;border-color:#2ecc71;color:#155724}.option-button.wrong{background:#f8d7da;border-color:#e74c3c;color:#721c24}.option-button.disabled{opacity:.5}.option-number{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#667eea;color:#fff;border-radius:50%;font-weight:700;font-size:1.1rem;flex-shrink:0}.option-button.correct .option-number{background:#2ecc71}.option-button.wrong .option-number{background:#e74c3c}.option-text{flex:1;line-height:1.5;word-break:break-word}.result-icon{font-size:1.5rem;flex-shrink:0}.result-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .3s ease-out;overflow-y:auto}.result-message-top{background:white;border-radius:20px;padding:25px;box-shadow:0 10px 40px #0000004d;flex-shrink:0;width:100%;max-width:600px;animation:slideDown .3s ease-out;margin:auto}.result-content{text-align:center;margin-bottom:15px}.correct-message-top{color:#2ecc71;font-weight:700;font-size:clamp(1.1rem,3vw,1.4rem);display:flex;align-items:center;justify-content:center;gap:10px;margin:0}.wrong-message-top{color:#e74c3c;font-weight:700;font-size:clamp(1.1rem,3vw,1.4rem);display:flex;align-items:center;justify-content:center;gap:10px;margin:0}.result-icon-large{font-size:1.8rem}.example-section{margin-top:20px;padding-top:20px;border-top:2px solid #f0f0f0}.example-label{font-size:.9rem;color:#666;font-weight:600;margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}.example-content{text-align:left}.example-japanese{font-size:clamp(1.1rem,3vw,1.3rem);color:#333;line-height:1.8;margin-bottom:4px;font-weight:500}.example-hiragana{font-size:clamp(.85rem,2.2vw,1rem);color:#888;line-height:1.6;margin-top:0;margin-bottom:12px;font-style:italic;font-weight:400}.example-meaning-text{font-size:clamp(.95rem,2.5vw,1.05rem);color:#666;line-height:1.6;margin-top:8px;padding:8px 12px;background:#f9f9f9;border-radius:8px;font-style:italic}.next-button{width:100%;padding:15px 30px;margin-top:20px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #667eea66}.next-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99;background:linear-gradient(135deg,#5568d3 0%,#6a3d8f 100%)}.next-button:active{transform:translateY(0)}.add-to-notes-button{width:100%;padding:12px 20px;margin-top:15px;background:#667eea;color:#fff;border:none;border-radius:10px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #667eea4d}.add-to-notes-button:hover:not(:disabled){background:#5568d3;transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.add-to-notes-button:disabled{opacity:.6;cursor:not-allowed}.add-to-notes-button.added{background:#2ecc71}.add-to-notes-button.added:hover{background:#27ae60}.result-message{text-align:center;color:#fff;font-size:clamp(1rem,3vw,1.2rem);margin-top:10px;padding:15px;background:rgba(255,255,255,.2);border-radius:15px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-shrink:0}.correct-message{color:#2ecc71;font-weight:700;margin-bottom:10px}.wrong-message{color:#e74c3c;font-weight:700;margin-bottom:10px}.example-hint{margin-top:15px;font-size:1rem;color:#ffffffe6;font-style:italic}.quiz-complete{text-align:center;background:white;padding:40px;border-radius:20px;box-shadow:0 10px 30px #0000004d;max-width:600px;margin:0 auto}.completion-message{margin-bottom:30px;padding:20px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:15px;color:#fff}.message-title{font-size:2.5rem;margin-bottom:15px;font-weight:700}.message-description{font-size:1.2rem;line-height:1.6;opacity:.95}.final-stats{display:flex;justify-content:space-around;margin:30px 0;flex-wrap:wrap;gap:20px}.stat-item{display:flex;flex-direction:column;align-items:center;gap:10px}.stat-label{font-size:1rem;color:#666;font-weight:500}.stat-value{font-size:2rem;font-weight:700;color:#333}.stat-value.correct{color:#2ecc71}.stat-value.wrong{color:#e74c3c}.quiz-actions{display:flex;flex-direction:column;gap:15px;margin-top:30px;align-items:center}.restart-button{padding:15px 40px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;border-radius:25px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003;width:100%;max-width:300px}.restart-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}.next-day-button{padding:15px 40px;background:linear-gradient(135deg,#2ecc71 0%,#27ae60 100%);color:#fff;border:none;border-radius:25px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003;width:100%;max-width:300px}.next-day-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}.retry-wrong-button{padding:15px 40px;background:linear-gradient(135deg,#ff6b6b 0%,#ee5a6f 25%,#c44569 50%,#feca57 75%,#ff9ff3 100%);background-size:200% 200%;color:#fff;border:none;border-radius:25px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003;width:100%;max-width:300px;position:relative;animation:retryButtonAppear .5s ease-out,retryButtonPulse 2s ease-in-out infinite,retryButtonGradient 3s ease infinite;margin:20px auto;text-shadow:0 2px 4px rgba(0,0,0,.3)}.retry-wrong-button:before{content:"";position:absolute;top:-8px;left:-8px;right:-8px;bottom:-8px;border-radius:33px;background:linear-gradient(135deg,#ff6b6b,#ee5a6f,#c44569,#feca57,#ff9ff3,#48dbfb,#0abde3,#ff6b6b);background-size:300% 300%;z-index:-1;animation:retryButtonGlow 2s ease-in-out infinite,retryButtonGradient 4s ease infinite;opacity:.7;filter:blur(8px)}.retry-wrong-button:after{content:"";position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;border-radius:28px;background:linear-gradient(135deg,rgba(255,107,107,.5),rgba(238,90,111,.5),rgba(196,69,105,.5),rgba(254,202,87,.5),rgba(255,159,243,.5));background-size:200% 200%;z-index:-1;animation:retryButtonRing 2s ease-in-out infinite,retryButtonGradient 3s ease infinite}.retry-wrong-button:active{transform:translateY(0) scale(.98)}@keyframes retryButtonAppear{0%{opacity:0;transform:translateY(20px) scale(.9) rotate(-5deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}@keyframes retryButtonPulse{0%,to{box-shadow:0 4px 6px #0003,0 0 #ff6b6bb3,0 0 #ff9ff380,0 0 #48dbfb66}25%{box-shadow:0 4px 6px #0003,0 0 0 8px #ff6b6b00,0 0 #ff9ff380,0 0 #48dbfb66}50%{box-shadow:0 4px 6px #0003,0 0 #ff6b6b00,0 0 0 12px #ff9ff300,0 0 #48dbfb66}75%{box-shadow:0 4px 6px #0003,0 0 #ff6b6b00,0 0 #ff9ff300,0 0 0 16px #48dbfb00}}@keyframes retryButtonGlow{0%,to{opacity:.6;transform:scale(1) rotate(0)}50%{opacity:.9;transform:scale(1.08) rotate(180deg)}}@keyframes retryButtonGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes retryButtonRing{0%,to{opacity:.5;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}}@media (max-width: 768px){.multiple-choice-quiz{padding:60px 15px 15px;height:auto;min-height:100vh;max-height:none;justify-content:flex-start}.quiz-header{margin-bottom:15px;margin-top:10px}.question-card{padding:25px}.word-kanji{font-size:3rem}.word-reading{font-size:1.5rem}.option-button{padding:15px 20px;font-size:1rem}.option-number{width:35px;height:35px;font-size:1rem}.quiz-info{font-size:.8rem;flex-wrap:wrap;gap:5px}.result-overlay{padding:15px;align-items:center}.result-message-top{padding:20px;margin:auto}.example-hiragana{font-size:.8rem}.example-meaning-text{font-size:.9rem;padding:6px 10px}.next-button{padding:12px 25px;font-size:1rem}}@media (max-width: 480px){.multiple-choice-quiz{padding:55px 8px 8px}.quiz-header{margin-bottom:12px;margin-top:8px}}.kana-typing-game{width:100%;max-width:900px;margin:0 auto;padding:1rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.game-info{display:flex;justify-content:space-around;align-items:center;background:rgba(255,255,255,.95);padding:1rem;border-radius:12px;margin-bottom:1rem;box-shadow:0 2px 8px #0000001a;flex-wrap:wrap;gap:1rem}.info-item{display:flex;flex-direction:column;align-items:center;gap:.25rem}.info-label{font-size:.85rem;color:#666;font-weight:500}.info-value{font-size:1.5rem;font-weight:700;color:#333}.info-value.lives{color:#e74c3c}.game-area{position:relative;width:100%;height:500px;background:linear-gradient(180deg,#f8f9fa 0%,#e9ecef 100%);border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #00000026;border:2px solid #dee2e6}.game-start-screen,.game-end-screen{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;background:rgba(255,255,255,.98);padding:2rem;border-radius:16px;box-shadow:0 8px 24px #0003;z-index:10;min-width:300px;width:min(640px,92%);max-height:calc(100% - 1.5rem);overflow-y:auto;box-sizing:border-box}.game-start-screen h2,.game-end-screen h2{margin:0 0 1rem;font-size:1.6rem;color:#333}.game-start-screen p,.game-end-screen p{margin:.4rem 0;color:#666;line-height:1.6}.game-description{font-size:1rem;margin-bottom:1rem!important;color:#444;font-weight:500}.game-instructions{margin:1rem 0;text-align:left;background:rgba(102,126,234,.05);padding:1rem;border-radius:12px;border-left:4px solid #667eea}.game-instructions h3{margin:0 0 .75rem;font-size:1rem;color:#667eea;font-weight:700}.game-instructions ul{margin:0;padding-left:1.25rem;list-style-type:none}.game-instructions li{margin:.35rem 0;color:#555;line-height:1.6;position:relative;padding-left:1.25rem}.game-instructions li:before{content:"✓";position:absolute;left:0;color:#667eea;font-weight:700}.final-score,.final-time{font-size:1.2rem;font-weight:700;color:#333;margin:.75rem 0}.start-button,.restart-button{margin-top:1rem;padding:.65rem 1.6rem;font-size:1rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea66}.start-button:hover,.restart-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #667eea80}.start-button:active,.restart-button:active{transform:translateY(0)}.falling-item{position:absolute;display:flex;align-items:center;justify-content:center;z-index:5;transition:none}.falling-kana{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-size:2.5rem;font-weight:700;padding:1rem 1.5rem;border-radius:12px;box-shadow:0 4px 12px #0000004d;text-shadow:0 2px 4px rgba(0,0,0,.2);min-width:80px;text-align:center;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.input-container{margin-top:1rem;text-align:center}.game-input{width:100%;max-width:400px;padding:1rem 1.5rem;font-size:1.5rem;text-align:center;border:3px solid #667eea;border-radius:12px;outline:none;transition:all .3s ease;font-weight:700;box-shadow:0 4px 12px #667eea33}.game-input:not([data-korean=true]){text-transform:lowercase}.game-input:focus{border-color:#764ba2;box-shadow:0 6px 16px #667eea4d;transform:scale(1.02)}.input-hint{margin-top:.5rem;font-size:.9rem;color:#666;font-style:italic}.missed-feedback{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10;pointer-events:none;will-change:transform}.missed-feedback-content{background:rgba(231,76,60,.95);color:#fff;padding:1.2rem 2rem;border-radius:16px;display:flex;flex-direction:column;align-items:center;gap:.75rem;box-shadow:0 8px 24px #e74c3c80;min-width:150px;animation:missedFadeInOut 1.5s ease-out forwards;transform-origin:center}.missed-feedback-kana{font-size:2rem;font-weight:700}.missed-feedback-pronunciation{font-size:1.1rem;opacity:.9;font-weight:500}.missed-feedback-lives{font-size:1rem;font-weight:700;margin-top:.25rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.3);width:100%;text-align:center}@keyframes missedFadeInOut{0%{opacity:0;transform:scale(.3)}20%{opacity:1;transform:scale(1)}80%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.correct-feedback{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10;pointer-events:none;will-change:transform}.correct-message{background:linear-gradient(135deg,#27ae60 0%,#2ecc71 100%);color:#fff;padding:1.2rem 2rem;border-radius:16px;display:flex;align-items:center;gap:1rem;font-size:1.5rem;font-weight:700;box-shadow:0 8px 24px #27ae6080;animation:correctPop .3s ease-out,correctFadeOut .3s ease-in .5s forwards;transform-origin:center}@keyframes correctPop{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}@keyframes correctFadeOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.correct-text{font-size:2rem;text-shadow:0 2px 4px rgba(0,0,0,.2)}.correct-kana{font-size:2.5rem;background:rgba(255,255,255,.2);padding:.5rem 1rem;border-radius:8px}.correct-pronunciation{font-size:1.3rem;opacity:.9;font-weight:500}.game-error{text-align:center;padding:2rem;color:#e74c3c}@media (max-width: 768px){.kana-typing-game{padding:.5rem}.game-info{padding:.75rem;gap:.5rem}.info-label{font-size:.75rem}.info-value{font-size:1.2rem}.game-area{height:400px}.game-start-screen,.game-end-screen{padding:2rem 1.5rem;min-width:280px}.game-start-screen h2,.game-end-screen h2{font-size:1.5rem}.falling-kana{font-size:2rem;padding:.75rem 1rem;min-width:60px}.game-input{font-size:1.2rem;padding:.75rem 1rem}}.quiz-mode-selection{text-align:center;width:100%;max-width:800px;margin:0 auto;display:flex;flex-direction:column;align-items:center}.back-button{background:rgba(255,255,255,.2);border:2px solid white;color:#fff;padding:10px 20px;border-radius:25px;cursor:pointer;font-size:1rem;margin-bottom:2rem;transition:all .3s ease}.back-button:hover{background:rgba(255,255,255,.3);transform:translate(-5px)}.mode-title{font-size:2.75rem;color:#fff;margin-bottom:.75rem;text-shadow:2px 2px 8px rgba(0,0,0,.3);font-weight:800;letter-spacing:-1px}.mode-subtitle{font-size:1.1rem;color:#ffffffe6;margin-bottom:2rem}.count-selection{margin-bottom:2.5rem;background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1.5rem 2rem;border-radius:20px;border:1px solid rgba(255,255,255,.2)}.count-label{display:block;font-size:1.15rem;color:#fffffff2;margin-bottom:1.25rem;font-weight:600;letter-spacing:.5px}.count-buttons{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.count-button{background:rgba(255,255,255,.15);border:2px solid rgba(255,255,255,.4);color:#fff;padding:14px 28px;border-radius:30px;cursor:pointer;font-size:1.15rem;font-weight:700;transition:all .3s cubic-bezier(.175,.885,.32,1.275);min-width:70px;box-shadow:0 4px 12px #0000001a}.count-button:hover{background:rgba(255,255,255,.25);transform:translateY(-3px) scale(1.05);box-shadow:0 6px 16px #00000026;border-color:#fff9}.count-button.active{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border-color:#fffc;box-shadow:0 8px 20px #667eea66;transform:translateY(-2px) scale(1.05)}.mode-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;margin-top:3rem;width:100%;justify-items:center;padding:0 1rem}.mode-card{background:linear-gradient(135deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.98) 100%);border:2px solid rgba(102,126,234,.2);border-radius:24px;padding:2.5rem 2rem;cursor:pointer;transition:all .4s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 8px 20px #0000001a;text-align:center;width:100%;max-width:320px;position:relative;overflow:hidden}.mode-card:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(102,126,234,.1),transparent);transition:left .5s ease}.mode-card:hover:before{left:100%}.mode-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 16px 40px #667eea40;border-color:#667eea66}.mode-card:active{transform:translateY(-4px) scale(1)}.mode-icon{font-size:4.5rem;margin-bottom:1.5rem;display:inline-block;transition:transform .3s ease;filter:drop-shadow(0 4px 8px rgba(0,0,0,.15))}.mode-card:hover .mode-icon{transform:scale(1.1) rotate(5deg)}.mode-card h3{font-size:1.75rem;color:#333;margin-bottom:.75rem;font-weight:700;letter-spacing:-.5px}.mode-card p{font-size:1rem;color:#666;line-height:1.6;margin:0}.quiz-mode-container{width:100%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;height:calc(100vh - 20px);max-height:calc(100vh - 20px);box-sizing:border-box;justify-content:center;align-items:center;position:relative;padding-top:60px}.quiz-mode-container:has(.word-table-container){max-width:1400px;justify-content:flex-start;padding-top:60px}.quiz-mode-container .back-button{position:absolute;top:10px;left:10px;z-index:10;margin-bottom:0}@media (max-width: 768px){.quiz-mode-container{height:100vh;max-height:100vh;justify-content:flex-start;padding-top:0}.quiz-mode-container:has(.word-table-container){max-width:100%;padding-top:0}.quiz-mode-container .back-button{top:10px;left:10px;padding:8px 14px;font-size:.85rem;z-index:100;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}}@media (max-width: 768px){.mode-buttons{grid-template-columns:1fr;gap:1.5rem;padding:0 .5rem}.mode-card{max-width:100%;padding:2rem 1.5rem}.mode-icon{font-size:3.5rem;margin-bottom:1rem}.mode-card h3{font-size:1.5rem}.mode-card p{font-size:.95rem}.mode-title{font-size:2rem}.count-selection{padding:1.25rem 1.5rem;margin-bottom:2rem}.count-buttons{gap:10px}.count-button{padding:12px 24px;font-size:1.05rem;min-width:60px}.count-label{font-size:1rem;margin-bottom:1rem}}.post-list{display:flex;flex-direction:column;gap:15px}.post-item{background:white;border-radius:15px;padding:20px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 5px #0000001a}.post-item:hover{transform:translateY(-3px);box-shadow:0 4px 12px #00000026}.post-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.post-category{color:#fff;padding:4px 12px;border-radius:12px;font-size:.85rem;font-weight:700}.post-category.post-category-all{background:#9b59b6}.post-category.post-category-notice{background:#e74c3c}.post-category.post-category-general{background:#3498db}.post-category.post-category-qna{background:#2ecc71}.post-category.post-category-admin{background:#f39c12}.post-date{color:#666;font-size:.9rem}.post-title{color:#333;font-size:1.3rem;font-weight:700;margin:10px 0;line-height:1.4}.post-meta{display:flex;justify-content:space-between;align-items:center;margin-top:10px}.post-author{color:#666;font-size:.9rem}.post-list-loading,.post-list-empty{text-align:center;padding:60px 20px;color:#fff;font-size:1.1rem}@media (max-width: 768px){.post-item{padding:15px}.post-title{font-size:1.1rem}.post-header{flex-direction:column;align-items:flex-start;gap:8px}}.post-form-container{width:100%;max-width:650px;margin:0 auto;padding:10px 10px 20px;box-sizing:border-box}.post-form{background:white;border-radius:15px;padding:20px;box-shadow:0 10px 30px #0000004d;box-sizing:border-box}.post-form h2{color:#333;font-size:1.4rem;margin-bottom:12px;text-align:center}.post-form-error{background:#fee;color:#c33;padding:8px;border-radius:6px;margin-bottom:12px;text-align:center;font-size:.85rem}.form-group{margin-bottom:12px}.form-group-row{display:flex;gap:12px;margin-bottom:12px}.form-group-row .form-group{flex:1;margin-bottom:0}.form-group label{display:block;color:#333;font-weight:700;margin-bottom:4px;font-size:.9rem}.form-group select,.form-group input,.form-group textarea{width:100%;padding:8px;border:2px solid #e0e0e0;border-radius:6px;font-size:.9rem;font-family:inherit;box-sizing:border-box;transition:border-color .3s ease}.form-group select:focus,.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#667eea}.form-group textarea{resize:vertical;min-height:100px;max-height:250px}.char-count{display:block;text-align:right;color:#999;font-size:.75rem;margin-top:3px}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:15px}.btn-cancel,.btn-submit{padding:8px 20px;border:none;border-radius:15px;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .3s ease}.btn-cancel{background:#e0e0e0;color:#333}.btn-cancel:hover:not(:disabled){background:#d0d0d0}.btn-submit{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;box-shadow:0 4px 6px #0003}.btn-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}.btn-cancel:disabled,.btn-submit:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 768px){.post-form-container{padding:8px 8px 15px}.post-form{padding:15px}.post-form h2{font-size:1.3rem;margin-bottom:10px}.form-group{margin-bottom:10px}.form-group-row{flex-direction:column;gap:0;margin-bottom:10px}.form-group-row .form-group{margin-bottom:10px}.form-group textarea{min-height:80px;max-height:200px}.form-actions{flex-direction:column;margin-top:12px}.btn-cancel,.btn-submit{width:100%;padding:8px 18px}}.comment-form{background:white;border:2px solid #e0e0e0;border-radius:8px;padding:15px;margin-bottom:15px;flex-shrink:0}.comment-form-reply{background:#f9f9f9;border-color:#ccc;padding:12px;margin-top:8px}.comment-form-error{background:#fee;color:#c33;padding:10px;border-radius:5px;margin-bottom:15px;font-size:.9rem}.comment-form-reply-to{background:#e8f0fe;color:#667eea;padding:8px 12px;border-radius:5px;margin-bottom:15px;font-size:.9rem;font-weight:500}.comment-form-fields{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.comment-form-row{display:flex;gap:10px;align-items:flex-start}.comment-form-field-wrapper{display:flex;flex-direction:column;gap:4px;flex:1}.comment-char-count{text-align:right;color:#999;font-size:.75rem}.comment-form-author,.comment-form-password{padding:8px;border:1px solid #e0e0e0;border-radius:5px;font-size:.9rem;width:100%;box-sizing:border-box}.comment-form-password:focus{outline:none;border-color:#667eea}.comment-form-author:focus{outline:none;border-color:#667eea}.comment-form-content{padding:10px;border:1px solid #e0e0e0;border-radius:5px;font-size:.9rem;font-family:inherit;resize:vertical;width:100%;box-sizing:border-box;min-height:60px;max-height:120px}.comment-form-content:focus{outline:none;border-color:#667eea}.comment-form-actions{display:flex;justify-content:flex-end;gap:10px}.comment-form-cancel,.comment-form-submit{padding:8px 20px;border:none;border-radius:5px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.comment-form-cancel{background:#e0e0e0;color:#333}.comment-form-cancel:hover:not(:disabled){background:#d0d0d0}.comment-form-submit{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.comment-form-submit:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 2px 5px #0003}.comment-form-cancel:disabled,.comment-form-submit:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 768px){.comment-form{padding:15px}.comment-form-row{flex-direction:column;gap:8px}.comment-form-actions{flex-direction:column}.comment-form-cancel,.comment-form-submit{width:100%}}.password-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000}.password-modal{background:white;border-radius:15px;padding:30px;max-width:400px;width:90%;box-shadow:0 10px 30px #0000004d}.password-modal h3{margin:0 0 10px;color:#333;font-size:1.3rem}.password-modal p{margin:0 0 20px;color:#666;font-size:.95rem}.password-modal-error{background:#fee;color:#c33;padding:10px;border-radius:5px;margin-bottom:15px;font-size:.9rem}.password-modal-input{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;box-sizing:border-box;margin-bottom:20px}.password-modal-input:focus{outline:none;border-color:#667eea}.password-modal-actions{display:flex;gap:10px;justify-content:flex-end}.password-modal-cancel,.password-modal-confirm{padding:10px 20px;border:none;border-radius:8px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s ease}.password-modal-cancel{background:#e0e0e0;color:#333}.password-modal-cancel:hover{background:#d0d0d0}.password-modal-confirm{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.password-modal-confirm:hover{transform:translateY(-1px);box-shadow:0 2px 5px #0003}.comment-edit-form{margin-top:10px;padding:15px;background:#fff;border:2px solid #667eea;border-radius:8px}.comment-edit-error{background:#fee;color:#c33;padding:8px;border-radius:5px;margin-bottom:10px;font-size:.9rem}.comment-edit-content{width:100%;padding:10px;border:1px solid #e0e0e0;border-radius:5px;font-size:.95rem;font-family:inherit;resize:vertical;box-sizing:border-box;margin-bottom:10px}.comment-edit-content:focus{outline:none;border-color:#667eea}.comment-edit-char-count{display:block;text-align:right;color:#999;font-size:.75rem;margin-top:5px}.comment-edit-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:10px}.comment-edit-cancel,.comment-edit-save{padding:8px 16px;border:none;border-radius:5px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.comment-edit-cancel{background:#e0e0e0;color:#333}.comment-edit-cancel:hover{background:#d0d0d0}.comment-edit-save{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.comment-edit-save:hover{transform:translateY(-1px);box-shadow:0 2px 5px #0003}.comment-list{margin-top:0;padding-top:0;border-top:none;display:flex;flex-direction:column}.comment-list-header{margin-bottom:15px;flex-shrink:0}.comment-list-header h3{color:#333;font-size:1.5rem;font-weight:700;margin:0;padding-bottom:15px;border-bottom:2px solid #e0e0e0}.comment-list-loading,.comment-list-empty{text-align:center;padding:40px 20px;color:#666;font-size:1rem}.comment-write-button-container{margin-top:20px;display:flex;justify-content:center;flex-shrink:0}.comment-write-button{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;padding:14px 35px;border-radius:25px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea66}.comment-write-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}.comment-form-container{margin-top:20px;flex-shrink:0}.comment-items{margin-top:15px}.comment-item{background:#f9f9f9;border-radius:8px;padding:12px;margin-bottom:10px;border-left:3px solid #667eea}.comment-item-reply{background:#f5f5f5;border-left-color:#999;margin-top:8px;padding:10px}.comment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.comment-author{font-weight:700;color:#667eea;font-size:.95rem}.comment-date{color:#999;font-size:.85rem}.comment-content-wrapper{display:flex;justify-content:space-between;align-items:flex-end;gap:10px}.comment-content{color:#333;line-height:1.5;white-space:pre-wrap;word-wrap:break-word;font-size:.95rem;flex:1}.comment-actions{flex-shrink:0;margin-top:0;display:flex;gap:8px;align-items:center}.comment-edit-btn,.comment-delete-btn{background:none;border:none;color:#999;font-size:.85rem;cursor:pointer;padding:4px 8px;border-radius:4px;transition:all .2s ease}.comment-edit-btn:hover{color:#667eea;background:rgba(102,126,234,.1)}.comment-delete-btn:hover{color:#e74c3c;background:rgba(231,76,60,.1)}.comment-reply-btn{background:none;border:none;color:#667eea;font-size:.9rem;cursor:pointer;padding:5px 10px;border-radius:5px;transition:all .2s ease}.comment-reply-btn:hover{background:rgba(102,126,234,.1)}.comment-replies{margin-top:10px}.comment-reply-form{margin-top:15px;padding-top:15px;border-top:1px solid #e0e0e0}@media (max-width: 768px){.comment-item{padding:10px;margin-left:0!important}.comment-item-reply{margin-left:10px!important;padding:8px}.comment-header{flex-direction:column;align-items:flex-start;gap:5px}.comment-content-wrapper{flex-direction:column;align-items:flex-start;gap:8px}.comment-actions{align-self:flex-end}}.post-edit-form{background:#fff;border:2px solid #667eea;border-radius:15px;padding:25px;margin-top:20px}.post-edit-error{background:#fee;color:#c33;padding:12px;border-radius:8px;margin-bottom:20px;font-size:.95rem}.post-edit-form .form-group{margin-bottom:20px}.post-edit-form .form-group label{display:block;color:#333;font-weight:700;margin-bottom:8px;font-size:1rem}.post-edit-title{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1.1rem;box-sizing:border-box}.post-edit-title:focus{outline:none;border-color:#667eea}.post-edit-content{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;font-family:inherit;resize:vertical;min-height:200px;box-sizing:border-box}.post-edit-content:focus{outline:none;border-color:#667eea}.post-edit-form .char-count{display:block;text-align:right;color:#999;font-size:.85rem;margin-top:5px}.post-edit-actions{display:flex;gap:15px;justify-content:flex-end;margin-top:25px}.post-edit-cancel,.post-edit-save{padding:12px 30px;border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease}.post-edit-cancel{background:#e0e0e0;color:#333}.post-edit-cancel:hover{background:#d0d0d0}.post-edit-save{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.post-edit-save:hover{transform:translateY(-1px);box-shadow:0 2px 5px #0003}@media (max-width: 768px){.post-edit-form{padding:20px}.post-edit-actions{flex-direction:column}.post-edit-cancel,.post-edit-save{width:100%}}.post-detail{width:100%;max-width:900px;margin:0 auto;padding-top:60px;padding-bottom:20px;display:flex;flex-direction:column;min-height:calc(100vh - 80px);box-sizing:border-box}.post-detail-content{background:white;border-radius:20px;padding:30px;box-shadow:0 10px 30px #0000004d;flex-shrink:0}.post-detail-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #f0f0f0}.post-detail-category{color:#fff;padding:6px 16px;border-radius:15px;font-size:.9rem;font-weight:700}.post-detail-category.post-detail-category-all{background:#9b59b6}.post-detail-category.post-detail-category-notice{background:#e74c3c}.post-detail-category.post-detail-category-general{background:#3498db}.post-detail-category.post-detail-category-qna{background:#2ecc71}.post-detail-category.post-detail-category-admin{background:#f39c12}.post-detail-date{color:#666;font-size:.95rem}.post-detail-title-wrapper{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;margin:15px 0}.post-detail-title{color:#333;font-size:clamp(1.5rem,4vw,2rem);font-weight:700;line-height:1.4;flex:1;margin:0}.post-detail-actions{display:flex;gap:10px;flex-shrink:0}.post-edit-btn,.post-delete-btn{padding:8px 16px;border:none;border-radius:8px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.post-edit-btn{background:#667eea;color:#fff}.post-edit-btn:hover{background:#5568d3;transform:translateY(-1px)}.post-delete-btn{background:#e74c3c;color:#fff}.post-delete-btn:hover{background:#c0392b;transform:translateY(-1px)}.post-detail-meta{margin-bottom:30px;padding-bottom:15px;border-bottom:2px solid #f0f0f0}.post-detail-author{color:#666;font-size:1rem}.post-detail-body{margin-top:20px}.post-detail-text{color:#333;font-size:1.1rem;line-height:1.8;white-space:pre-wrap;word-wrap:break-word;font-family:inherit;margin:0}.post-detail-comments{margin-top:20px;flex-shrink:0;min-height:200px;background:white;border-radius:20px;padding:20px;box-shadow:0 10px 30px #0000004d}@media (max-width: 768px){.post-detail{padding-top:50px}.post-detail-content{padding:20px}.post-detail-title-wrapper{flex-direction:column;align-items:flex-start;gap:10px}.post-detail-title{font-size:1.3rem}.post-detail-actions{width:100%;justify-content:flex-end}.post-edit-btn,.post-delete-btn{flex:1}.post-detail-header{flex-direction:column;align-items:flex-start;gap:10px}.post-detail-text{font-size:.95rem}.post-detail-comments{margin-top:15px;padding:15px}}.board-container{width:100%;max-width:900px;margin:0 auto;padding:20px;min-height:calc(100vh - 40px);box-sizing:border-box}.board-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;margin-top:60px}.board-header h1{color:#fff;font-size:2.5rem;margin:0;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.write-button{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;padding:12px 30px;border-radius:25px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0003}.write-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0000004d}.board-categories{display:flex;gap:10px;margin-bottom:30px;flex-wrap:wrap}.category-button{background:rgba(255,255,255,.2);border:2px solid white;color:#fff;padding:10px 20px;border-radius:20px;font-size:1rem;cursor:pointer;transition:all .3s ease}.category-button.category-all{border-color:#9b59b6;background:rgba(155,89,182,.3)}.category-button.category-all:hover{background:rgba(155,89,182,.5)}.category-button.category-all.active{background:#9b59b6;border-color:#9b59b6;color:#fff}.category-button.category-notice{border-color:#e74c3c;background:rgba(231,76,60,.3)}.category-button.category-notice:hover{background:rgba(231,76,60,.5)}.category-button.category-notice.active{background:#e74c3c;border-color:#e74c3c;color:#fff}.category-button.category-general{border-color:#3498db;background:rgba(52,152,219,.3)}.category-button.category-general:hover{background:rgba(52,152,219,.5)}.category-button.category-general.active{background:#3498db;border-color:#3498db;color:#fff}.category-button.category-qna{border-color:#2ecc71;background:rgba(46,204,113,.3)}.category-button.category-qna:hover{background:rgba(46,204,113,.5)}.category-button.category-qna.active{background:#2ecc71;border-color:#2ecc71;color:#fff}.category-button.category-admin{border-color:#f39c12;background:rgba(243,156,18,.3)}.category-button.category-admin:hover{background:rgba(243,156,18,.5)}.category-button.category-admin.active{background:#f39c12;border-color:#f39c12;color:#fff}.category-button:hover{transform:translateY(-2px)}@media (max-width: 768px){.board-container{padding:15px}.board-header{flex-direction:column;gap:20px;align-items:flex-start}.board-header h1{font-size:2rem}.write-button{width:100%}.board-categories{gap:8px}.category-button{padding:8px 16px;font-size:.9rem}}.blog-card{background:linear-gradient(135deg,#ffffff 0%,#fafbfc 100%);border-radius:20px;padding:28px;box-shadow:0 4px 16px #00000014,0 2px 8px #0000000a;transition:all .4s cubic-bezier(.175,.885,.32,1.275);position:relative;overflow:hidden;border:1px solid rgba(102,126,234,.1)}.blog-card:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(102,126,234,.05),transparent);transition:left .5s ease}.blog-card:hover:before{left:100%}.blog-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 12px 40px #667eea33,0 4px 16px #0000001a;border-color:#667eea4d}.blog-card-featured{border:2px solid #667eea;background:linear-gradient(135deg,#f8f9ff 0%,#ffffff 100%);position:relative}.blog-card-featured:after{content:"⭐";position:absolute;top:16px;right:16px;font-size:1.5rem;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.blog-card-category-wrapper{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.blog-card-badge{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-size:.75rem;font-weight:700;padding:4px 10px;border-radius:12px;box-shadow:0 2px 4px #0003}.blog-card-link{text-decoration:none;color:inherit;display:block}.blog-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;flex-wrap:wrap;gap:8px}.blog-card-category{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-size:.85rem;font-weight:700;padding:6px 16px;border-radius:20px;box-shadow:0 2px 8px #667eea4d;letter-spacing:.3px;text-transform:uppercase}.blog-card-date{color:#666;font-size:.85rem}.blog-card-title{font-size:1.5rem;font-weight:800;color:#1a1a1a;margin:0 0 16px;line-height:1.4;transition:all .3s ease;letter-spacing:-.3px}.blog-card:hover .blog-card-title{color:#667eea;transform:translate(4px)}.blog-card-excerpt{color:#666;font-size:.95rem;line-height:1.6;margin:0 0 12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.blog-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.blog-card-tag{background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);color:#667eea;font-size:.8rem;padding:6px 14px;border-radius:16px;font-weight:600;border:1px solid rgba(102,126,234,.2);transition:all .3s ease}.blog-card-tag:hover{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}@media (max-width: 768px){.blog-card{padding:24px 20px;border-radius:16px}.blog-card-title{font-size:1.3rem;line-height:1.4}.blog-card-excerpt{font-size:.95rem;-webkit-line-clamp:2;line-height:1.6}.blog-card:hover{transform:translateY(-4px) scale(1.01)}}.blog-list-container{max-width:1200px;margin:0 auto;padding:20px}.blog-list-loading,.blog-list-empty{text-align:center;padding:60px 20px;color:#666}.blog-list-header{text-align:center;margin-bottom:40px}.blog-list-title{font-size:2.5rem;color:#fff;margin-bottom:10px;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.blog-list-subtitle{font-size:1.2rem;color:#ffffffe6}.blog-list-filters{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:30px;padding:20px;background:rgba(255,255,255,.15);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:16px;border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 16px #0000001a}.blog-filter-badge{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#ffffff 0%,#f8f9fa 100%);color:#333;padding:10px 20px;border-radius:24px;font-size:.9rem;font-weight:600;box-shadow:0 2px 8px #0000001a;transition:all .3s ease}.blog-filter-badge:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.blog-filter-remove{background:none;border:none;color:#666;cursor:pointer;font-size:1.2rem;line-height:1;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.blog-filter-remove:hover{background:#f0f0f0;color:#333}.blog-list-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:32px;margin-bottom:40px}.blog-list-categories{margin-top:40px;padding:20px;background:rgba(255,255,255,.1);border-radius:10px}.blog-list-categories h3{color:#fff;margin-bottom:15px;font-size:1.2rem}.blog-category-list{display:flex;flex-wrap:wrap;gap:10px}.blog-category-link{background:linear-gradient(135deg,#ffffff 0%,#f8f9fa 100%);color:#333;padding:10px 20px;border-radius:24px;text-decoration:none;font-size:.9rem;font-weight:600;transition:all .3s ease;box-shadow:0 2px 8px #0000001a;border:1px solid rgba(102,126,234,.1)}.blog-category-link:hover{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;transform:translateY(-3px) scale(1.05);box-shadow:0 6px 20px #667eea66}.blog-category-link.active{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;box-shadow:0 4px 16px #667eea66}@media (max-width: 768px){.blog-list-container{padding:15px}.blog-list-title{font-size:2rem;line-height:1.3}.blog-list-subtitle{font-size:1rem;line-height:1.5}.blog-list-grid{grid-template-columns:1fr;gap:24px}.blog-list-filters{padding:16px;border-radius:12px}.blog-filter-badge,.blog-category-link{padding:8px 16px;font-size:.85rem}}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub Dark
  Description: Dark theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-dark
  Current colors taken from GitHub's CSS
*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#79c0ff}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-comment,.hljs-code,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}.blog-post-container{max-width:900px;margin:0 auto;padding:20px;position:relative}.blog-post-progress-bar{position:fixed;top:60px;left:0;width:100%;height:4px;background:rgba(255,255,255,.1);z-index:999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.blog-post-progress-fill{height:100%;background:linear-gradient(90deg,#667eea 0%,#764ba2 50%,#f093fb 100%);background-size:200% 100%;animation:progressGradient 3s ease infinite;transition:width .1s ease-out;box-shadow:0 0 10px #667eea80}@keyframes progressGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.blog-post-loading,.blog-post-error{text-align:center;padding:60px 20px;color:#666}.blog-post-back-link{display:inline-block;margin-bottom:20px;color:#fff;text-decoration:none;font-size:.95rem;transition:opacity .3s ease}.blog-post-back-link:hover{opacity:.8}.blog-post{background:linear-gradient(135deg,#ffffff 0%,#fafbfc 100%);border-radius:20px;padding:50px;box-shadow:0 8px 32px #00000014,0 2px 8px #0000000a;margin-bottom:40px;border:1px solid rgba(102,126,234,.1);position:relative;overflow:hidden}.blog-post:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#667eea 0%,#764ba2 50%,#f093fb 100%);background-size:200% 100%;animation:gradientShift 3s ease infinite}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.blog-post-header{margin-bottom:40px;padding-bottom:30px;border-bottom:2px solid rgba(102,126,234,.15);position:relative}.blog-post-header:after{content:"";position:absolute;bottom:-2px;left:0;width:60px;height:2px;background:linear-gradient(90deg,#667eea 0%,#764ba2 100%);border-radius:2px}.blog-post-category{display:inline-block;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-size:.85rem;font-weight:700;padding:8px 18px;border-radius:20px;margin-bottom:20px;box-shadow:0 4px 12px #667eea4d;letter-spacing:.5px;text-transform:uppercase}.blog-post-title{font-size:2.75rem;font-weight:800;color:#1a1a1a;margin:0 0 25px;line-height:1.2;letter-spacing:-.5px;background:linear-gradient(135deg,#1a1a1a 0%,#4a4a4a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.blog-post-meta{display:flex;gap:24px;flex-wrap:wrap;margin-bottom:20px;color:#666;font-size:.95rem;align-items:center}.blog-post-author,.blog-post-date,.blog-post-reading-time{color:#666;font-size:.95rem;display:flex;align-items:center;gap:6px}.blog-post-author:before{content:"👤";font-size:1rem}.blog-post-date:before{content:"📅";font-size:1rem}.blog-post-reading-time:before{content:"⏱️";font-size:1rem}.blog-post-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.blog-post-tag{background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);color:#667eea;font-size:.85rem;padding:8px 16px;border-radius:20px;font-weight:600;border:1px solid rgba(102,126,234,.2);transition:all .3s ease}.blog-post-tag:hover{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.blog-post-content{line-height:1.9;color:#2d3748;font-size:1.1rem;font-weight:400}.blog-post-content h1,.blog-post-content h2,.blog-post-content h3,.blog-post-content h4,.blog-post-content h5,.blog-post-content h6{margin-top:40px;margin-bottom:20px;color:#1a1a1a;font-weight:800;letter-spacing:-.3px}.blog-post-content h1{font-size:2.25rem;border-bottom:3px solid rgba(102,126,234,.2);padding-bottom:15px;background:linear-gradient(135deg,#1a1a1a 0%,#4a4a4a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.blog-post-content h2{font-size:1.9rem;position:relative;padding-left:15px}.blog-post-content h2:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:24px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:2px}.blog-post-content h3{font-size:1.6rem;color:#667eea}.blog-post-content p{margin-bottom:20px}.blog-post-content ul,.blog-post-content ol{margin-bottom:20px;padding-left:30px}.blog-post-content li{margin-bottom:8px}.blog-post-content blockquote{border-left:4px solid #667eea;padding:20px 24px;margin:30px 0;color:#4a5568;font-style:italic;background:linear-gradient(135deg,#f8f9ff 0%,#ffffff 100%);border-radius:0 12px 12px 0;box-shadow:0 2px 8px #667eea1a;position:relative}.blog-post-content blockquote:before{content:'"';position:absolute;top:10px;left:10px;font-size:3rem;color:#667eea33;font-family:Georgia,serif}.blog-post-content code{background:#f4f4f4;padding:2px 6px;border-radius:4px;font-size:.9em;font-family:Courier New,monospace}.blog-post-content pre{background:#1e1e1e;color:#d4d4d4;padding:20px;border-radius:8px;overflow-x:auto;margin:20px 0}.blog-post-content pre code{background:none;padding:0;color:inherit}.blog-post-content a{color:#667eea;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .3s ease}.blog-post-content a:hover{border-bottom-color:#667eea}.blog-post-content img{max-width:100%;height:auto;border-radius:16px;margin:30px 0;box-shadow:0 8px 24px #0000001f;transition:transform .3s ease,box-shadow .3s ease}.blog-post-content img:hover{transform:scale(1.02);box-shadow:0 12px 32px #00000029}.blog-post-content table{width:100%;border-collapse:collapse;margin:30px 0;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #00000014}.blog-post-content table th,.blog-post-content table td{border:1px solid rgba(102,126,234,.1);padding:16px;text-align:left}.blog-post-content table th{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-weight:700;text-transform:uppercase;font-size:.9rem;letter-spacing:.5px}.blog-post-content table tr:nth-child(2n){background:rgba(102,126,234,.03)}.blog-post-content table tr:hover{background:rgba(102,126,234,.08);transition:background .2s ease}.blog-post-kana .blog-post-content h3+p strong{font-size:2em;font-weight:700;color:#333;letter-spacing:.1em;display:inline-block;margin:0 .2em}.blog-post-kana .blog-post-content h3+p{font-size:1.2em;line-height:2.5;margin-bottom:30px;padding:20px;background:#f8f9fa;border-radius:8px;border-left:4px solid #667eea}.blog-post-kana .blog-post-content h3~ul strong,.blog-post-kana .blog-post-content h3~ol strong{font-size:1.8em;font-weight:700;color:#333;letter-spacing:.05em}.blog-post-related{margin-top:40px}.blog-post-related-title{color:#fff;font-size:1.5rem;margin-bottom:20px}.blog-post-related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.blog-post-comments{margin-top:60px;padding:50px;background:linear-gradient(135deg,#ffffff 0%,#fafbfc 100%);border-radius:20px;box-shadow:0 8px 32px #00000014;border-top:4px solid #667eea;position:relative}.blog-post-comments:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#667eea 0%,#764ba2 50%,#f093fb 100%);border-radius:20px 20px 0 0}@media (max-width: 768px){.blog-post-container{padding:15px}.blog-post{padding:30px 20px;border-radius:16px}.blog-post-title{font-size:2rem;line-height:1.3}.blog-post-content{font-size:1.05rem;line-height:1.8}.blog-post-content h1{font-size:1.75rem}.blog-post-content h2{font-size:1.5rem}.blog-post-content h3{font-size:1.3rem}.blog-post-meta{flex-direction:column;gap:12px;align-items:flex-start}.blog-post-related-grid{grid-template-columns:1fr;gap:20px}.blog-post-comments{padding:30px 20px;margin-top:40px;border-radius:16px}.blog-post-header{padding-bottom:20px;margin-bottom:30px}}.login-container{min-height:calc(100vh - 80px);display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.login-card{background:white;border-radius:20px;padding:40px;width:100%;max-width:450px;box-shadow:0 10px 40px #0003}.login-title{font-size:2rem;font-weight:700;color:#333;text-align:center;margin-bottom:30px}.login-error{background:#fee;color:#c33;padding:12px 16px;border-radius:8px;margin-bottom:20px;font-size:.9rem;border:1px solid #fcc}.login-form{display:flex;flex-direction:column;gap:20px}.form-group label{font-size:.9rem;font-weight:600;color:#555}.form-group input{padding:12px 16px;border:2px solid #e0e0e0;border-radius:10px;font-size:1rem;transition:all .3s ease;box-sizing:border-box}.login-button{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;padding:14px 24px;border-radius:10px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;margin-top:10px;box-shadow:0 4px 6px #0000001a}.login-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 12px #00000026}.login-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.login-switch{margin-top:30px;text-align:center;color:#666;font-size:.95rem}.switch-button{background:none;border:none;color:#667eea;font-weight:700;cursor:pointer;padding:0;margin-left:4px;text-decoration:underline;font-size:inherit;transition:color .3s ease}.switch-button:hover:not(:disabled){color:#764ba2}.switch-button:disabled{opacity:.5;cursor:not-allowed}.login-info{text-align:center;margin-bottom:30px;color:#666;line-height:1.8}.login-info p{margin:10px 0}.login-info strong{color:#667eea;font-weight:600}.login-actions{display:flex;gap:10px;margin-top:20px}.login-actions .login-button{flex:1;margin-top:0}.cancel-button{background:#e0e0e0!important;color:#333!important}.cancel-button:hover:not(:disabled){background:#d0d0d0!important;transform:translateY(-2px)}@media (max-width: 768px){.login-container{padding:10px;min-height:calc(100vh - 60px)}.login-card{padding:30px 20px}.login-title{font-size:1.6rem;margin-bottom:25px}.form-group input{padding:10px 14px;font-size:.95rem}.login-button{padding:12px 20px;font-size:1rem}}.next-day-prompt{position:fixed;top:80px;left:50%;transform:translate(-50%);z-index:1000;max-width:500px;width:90%;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.next-day-prompt-content{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:12px;padding:20px;box-shadow:0 8px 24px #0003;color:#fff;display:flex;flex-direction:column;gap:15px}.next-day-prompt-icon{font-size:48px;text-align:center}.next-day-prompt-text{text-align:center}.next-day-prompt-text h3{margin:0 0 8px;font-size:20px;font-weight:600}.next-day-prompt-text p{margin:0;font-size:14px;opacity:.9;line-height:1.5}.next-day-prompt-actions{display:flex;gap:10px;justify-content:center}.next-day-prompt-button{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.next-day-prompt-button.primary{background:white;color:#667eea}.next-day-prompt-button.primary:hover{background:#f0f0f0;transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.next-day-prompt-button.secondary{background:rgba(255,255,255,.2);color:#fff;border:1px solid rgba(255,255,255,.3)}.next-day-prompt-button.secondary:hover{background:rgba(255,255,255,.3)}@media (max-width: 768px){.next-day-prompt{top:70px;width:95%}.next-day-prompt-content{padding:16px}.next-day-prompt-icon{font-size:36px}.next-day-prompt-text h3{font-size:18px}.next-day-prompt-text p{font-size:13px}.next-day-prompt-actions{flex-direction:column}.next-day-prompt-button{width:100%}}.daily-course-container{max-width:1200px;width:100%;margin:0 auto;padding:20px;min-height:calc(100vh - 80px)}.daily-course-header{margin-bottom:40px;text-align:center}.course-title{color:#fff;font-size:2.5rem;margin:20px 0;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.course-summary{color:#fff;font-size:1.2rem;margin-top:30px;background:rgba(255,255,255,.15);padding:20px 30px;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:inline-block}.course-summary p{margin:12px 0;line-height:1.6}.course-summary strong{color:#fd0;font-size:1.4rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.2)}.days-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-top:32px;justify-content:center;align-items:stretch}.day-card{--card-bg: #ffffff;--card-border: #e5e7eb;--card-accent: #4338ca;background:var(--card-bg);border:2px solid var(--card-border);border-radius:16px;padding:24px 18px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #0f172a1a;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:150px;transform:translateY(0)}.day-card:hover{transform:translateY(-4px);box-shadow:0 12px 22px #0f172a24;border-color:var(--card-accent)}.day-number{font-size:1.3rem;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--card-accent) 0%,var(--card-accent) 100%);border:none;padding:8px 16px;border-radius:999px;margin-bottom:4px;box-shadow:0 2px 8px #00000026;text-shadow:0 1px 2px rgba(0,0,0,.2)}.day-info{color:#475569;font-size:.95rem;display:flex;flex-direction:column;gap:8px;width:100%}.day-range{margin-bottom:0;color:#64748b;font-size:.85rem;font-weight:500}.day-count{font-weight:700;color:#1e293b;font-size:1.1rem;padding:8px 0 4px;border-top:1px solid #e2e8f0;margin-top:4px}.day-card:nth-child(6n+1){--card-bg: #fff7ed;--card-border: #fed7aa;--card-accent: #ea580c}.day-card:nth-child(6n+2){--card-bg: #ecfeff;--card-border: #a5f3fc;--card-accent: #0891b2}.day-card:nth-child(6n+3){--card-bg: #f0fdf4;--card-border: #bbf7d0;--card-accent: #16a34a}.day-card:nth-child(6n+4){--card-bg: #fef2f2;--card-border: #fecaca;--card-accent: #dc2626}.day-card:nth-child(6n+5){--card-bg: #eff6ff;--card-border: #bfdbfe;--card-accent: #2563eb}.day-card:nth-child(6n){--card-bg: #f5f3ff;--card-border: #ddd6fe;--card-accent: #7c3aed}@media (max-width: 768px){.days-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px}.course-title{font-size:2rem}.day-card{padding:16px}}.word-table-container{width:100%;max-width:1800px;margin:0 auto;padding:4rem 2rem 2rem;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:calc(100vh - 80px)}.quiz-mode-container .word-table-container{max-width:100%;width:100%;padding:4rem 1rem 2rem;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.word-table-controls{margin-bottom:1.5rem;display:flex;justify-content:center;align-items:center}.toggle-group{display:flex;gap:2rem;background:rgba(255,255,255,.95);padding:1rem 2rem;border-radius:12px;box-shadow:0 4px 12px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.toggle-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;color:#1f2937;font-size:1rem;font-weight:500;-webkit-user-select:none;user-select:none}.toggle-label input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:#4CAF50}.toggle-label span{font-weight:500}.word-table-wrapper{overflow-x:auto;background:rgba(255,255,255,.98);border-radius:16px;padding:2rem;box-shadow:0 8px 24px #00000026;width:100%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.word-table{width:100%;border-collapse:collapse;background:transparent;table-layout:fixed}.word-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);position:sticky;top:0;z-index:10;display:table-header-group;border-radius:12px 12px 0 0}.word-table th{padding:1.25rem 1rem;text-align:left;font-weight:700;color:#fff;border-bottom:2px solid rgba(255,255,255,.3);font-size:1.1rem;white-space:nowrap;overflow:visible;text-overflow:clip;background:transparent;text-shadow:0 1px 2px rgba(0,0,0,.2)}.word-table td{padding:1.25rem 1rem;border-bottom:1px solid rgba(0,0,0,.08);color:#1f2937;vertical-align:middle;word-wrap:break-word;overflow-wrap:break-word;background:white}.word-row{transition:all .2s ease;background:white}.word-row:nth-child(2n){background:white}.word-row:hover{background-color:#f3f4f6;transform:scale(1.01);box-shadow:0 2px 8px #667eea26}.col-id{width:5%;min-width:50px;text-align:center;font-weight:600;font-size:.95rem;color:#6b7280}.col-word{width:15%;min-width:150px;font-size:1.4rem;font-weight:600;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}.word-table-container .word-kanji{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:1.4rem;font-weight:600;color:#1f2937;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;text-align:center;margin:0 auto}.word-kanji-ruby{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:1.4rem;font-weight:600;color:#1f2937;display:inline-block;white-space:nowrap;overflow:visible;text-overflow:ellipsis;max-width:100%;line-height:2.8;ruby-align:center;ruby-position:over;text-align:center;margin:0 auto;text-align-last:center}.word-kanji-ruby rt{font-size:.65em;color:#667eea;font-weight:500;opacity:.9;padding:0;line-height:1.4;ruby-align:center;letter-spacing:0}.col-reading{width:18%;min-width:150px;font-size:1.2rem;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.word-table-container .word-reading{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:1.2rem;color:#667eea;font-weight:500;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.col-meaning{width:20%;min-width:180px;font-size:1.2rem;line-height:1.6}.word-meaning{font-size:1.2rem;color:#1f2937;font-weight:500;display:block;word-break:break-word}.col-example{width:30%;font-size:1.1rem;line-height:1.7}.col-example-meaning{width:20%;min-width:180px;font-size:1rem;line-height:1.6}.example-container{display:flex;flex-direction:column;gap:.5rem;padding:0}.example-wrapper{display:flex;flex-direction:column;gap:.3rem}.example-hiragana-above{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:.75rem;color:#667eea;font-weight:500;opacity:.85;line-height:1.4;word-break:keep-all;text-align:left}.example-text{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:1.1rem;color:#1f2937;font-weight:500;line-height:1.8;word-break:keep-all;text-align:left;padding:0;background:transparent;border-radius:0;border:none;box-shadow:none;margin:0}.example-meaning-text{font-size:1rem;color:#6b7280;font-style:italic;line-height:1.6;word-break:break-word;text-align:left;display:block;background:transparent;padding:0;border:none;border-radius:0;box-shadow:none;margin:0}.empty-state{text-align:center;padding:4rem 2rem;background:rgba(255,255,255,.95);border-radius:16px;box-shadow:0 8px 24px #00000026}.empty-message{font-size:1.2rem;color:#6b7280;font-weight:500;margin:0}@media (max-width: 768px){.word-table-container{padding:3.5rem 1rem 1rem}.quiz-mode-container .word-table-container{padding:3.5rem .5rem 1rem}.toggle-group{flex-direction:column;gap:1rem;padding:1rem}.word-table-wrapper{padding:1rem}.word-table th,.word-table td{padding:.875rem .5rem;font-size:.9rem}.col-id{width:8%;min-width:40px;font-size:.8rem}.col-word{width:18%;min-width:120px;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.word-table-container .word-kanji{font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.col-reading{width:20%;min-width:120px;font-size:.9rem}.word-table-container .word-reading{font-size:.9rem}.col-meaning{width:25%;min-width:150px;font-size:.9rem}.word-meaning{font-size:.9rem}.col-example{width:32%;font-size:.85rem}.example-text{font-size:.85rem}.example-meaning{font-size:.75rem}}.daily-words-container{max-width:1200px;margin:0 auto;padding:20px;min-height:calc(100vh - 80px)}.daily-words-header{text-align:center;margin-bottom:40px}.back-button{background:rgba(255,255,255,.2);border:2px solid white;color:#fff;padding:10px 20px;border-radius:20px;font-size:1rem;cursor:pointer;transition:all .3s ease;margin-bottom:20px}.back-button:hover{background:rgba(255,255,255,.3);transform:translateY(-2px)}.day-title{color:#fff;font-size:2.5rem;margin:20px 0;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.day-details{color:#fff;font-size:1.1rem;margin-top:20px;background:rgba(255,255,255,.15);padding:15px 25px;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:inline-block}.day-details p{margin:10px 0;line-height:1.6}.day-details strong{color:#fd0;font-size:1.3rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.2)}.mode-selection{margin-top:40px}.mode-section{margin-bottom:50px}.mode-section:last-child{margin-bottom:0}.mode-title{color:#fff;font-size:1.8rem;text-align:center;margin-bottom:20px;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.mode-description{color:#fff;font-size:1.1rem;text-align:center;margin-bottom:30px;opacity:.9;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.mode-cards{display:flex;gap:30px;justify-content:center;flex-wrap:wrap}.mode-card{background:rgba(255,255,255,.95);border:3px solid transparent;border-radius:20px;padding:40px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0000001a;text-align:center;min-width:250px;max-width:300px}.mode-card:hover{transform:translateY(-5px);box-shadow:0 8px 16px #0003;border-color:#667eea}.mode-icon{font-size:3rem;margin-bottom:15px}.mode-card h3{color:#333;font-size:1.5rem;margin-bottom:10px}.mode-card p{color:#666;font-size:1rem;margin:0}.loading,.error{text-align:center;color:#fff;font-size:1.2rem;padding:40px}.error{color:#f44}@media (max-width: 768px){.mode-cards{flex-direction:column;align-items:center}.mode-card{width:100%;max-width:100%}.day-title{font-size:2rem}}.user-notes-page{min-height:calc(100vh - 60px);padding-top:60px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);width:100%}.user-notes-container{padding:20px;max-width:100%;margin:0 auto;width:100%}.user-notes-page>.quiz-mode-container{width:100%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;height:calc(100vh - 20px);max-height:calc(100vh - 20px);box-sizing:border-box;justify-content:center;align-items:center;position:relative;padding-top:60px}@media (max-width: 768px){.user-notes-page>.quiz-mode-container{padding-top:0;height:100vh;max-height:100vh;justify-content:flex-start}}.notes-header{margin-bottom:30px;text-align:center}.notes-header .day-title{color:#fff;font-size:2.5rem;margin:20px 0;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.notes-loading,.notes-error,.notes-empty{text-align:center;padding:40px 20px;color:#fff;background:rgba(255,255,255,.15);border-radius:12px;margin:20px 0;font-size:1.2rem}.notes-loading,.notes-error{color:#fffffff2}.notes-empty-hint{margin-top:10px;font-size:.9rem;color:#fffc}.user-notes-container .word-table-wrapper{overflow-x:auto;background:rgba(255,255,255,.98);border-radius:16px;padding:2rem;box-shadow:0 8px 24px #00000026;width:100%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.user-notes-container .word-table{width:100%;border-collapse:collapse;background:transparent;table-layout:fixed}.user-notes-container .word-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);position:sticky;top:0;z-index:10;display:table-header-group;border-radius:12px 12px 0 0}.notes-table{table-layout:auto;background:transparent;width:100%}.notes-table .col-id{width:auto;min-width:50px;max-width:80px;text-align:center;font-weight:600;font-size:.95rem;color:#6b7280}.notes-table .col-word{width:auto;min-width:120px;max-width:200px;font-size:1.4rem;font-weight:600;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}.notes-table .col-meaning{width:auto;min-width:150px;font-size:1.2rem;line-height:1.6}.notes-table .col-example{width:auto;min-width:200px;font-size:1.1rem;line-height:1.7}.notes-table .col-example-meaning{width:auto;min-width:150px;font-size:1rem;line-height:1.6}.col-action{width:auto;min-width:90px;max-width:120px;text-align:center}.notes-table th{padding:1.25rem 1rem;text-align:left;font-weight:700;color:#fff;border-bottom:2px solid rgba(255,255,255,.3);font-size:1.1rem;white-space:nowrap;overflow:visible;text-overflow:clip;background:transparent;text-shadow:0 1px 2px rgba(0,0,0,.2)}.notes-table td{padding:1.25rem 1rem;border-bottom:1px solid rgba(0,0,0,.08);color:#1f2937;vertical-align:middle;word-wrap:break-word;overflow-wrap:break-word;background:white}.notes-table .word-row{transition:all .2s ease;background:white}.notes-table .word-row:nth-child(2n){background:white}.notes-table .word-row:hover{background-color:#f3f4f6;transform:scale(1.01);box-shadow:0 2px 8px #667eea26}.notes-table .word-kanji-ruby{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:1.4rem;font-weight:600;color:#1f2937;display:inline-block;white-space:nowrap;overflow:visible;text-overflow:ellipsis;max-width:100%;line-height:2.8;ruby-align:center;ruby-position:over;text-align:center;margin:0 auto;text-align-last:center}.notes-table .word-kanji-ruby rt{font-size:.65em;color:#667eea;font-weight:500;opacity:.9;padding:0;line-height:1.4;ruby-align:center;letter-spacing:0}.notes-table .word-kanji{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:1.4rem;font-weight:600;color:#1f2937;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;text-align:center;margin:0 auto}.notes-table .word-meaning{font-size:1.2rem;color:#1f2937;font-weight:500;display:block;word-break:break-word}.notes-table .example-wrapper{display:flex;flex-direction:column;gap:.3rem}.notes-table .example-hiragana-above{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:.75rem;color:#667eea;font-weight:500;opacity:.85;line-height:1.4;word-break:keep-all;text-align:left}.notes-table .example-text{font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;font-size:1.1rem;color:#1f2937;font-weight:500;line-height:1.8;word-break:keep-all;text-align:left;padding:0;background:transparent;border-radius:0;border:none;box-shadow:none;margin:0}.notes-table .example-meaning{font-size:1rem;color:#6b7280;font-style:italic;line-height:1.6;word-break:break-word;text-align:left;padding:0;margin-left:0;margin-top:.5rem}.notes-table .col-example-meaning .example-meaning-text{font-size:1rem;color:#6b7280;font-style:italic;line-height:1.6;word-break:break-word;text-align:left;display:block;padding:0;background:transparent;border:none;border-radius:0;box-shadow:none}.note-delete-button{padding:8px 16px;background:rgba(231,76,60,.8);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:.85rem;font-weight:500;transition:all .2s;white-space:nowrap}.note-delete-button:hover{background:rgba(192,57,43,.9);transform:translateY(-2px);box-shadow:0 4px 8px #e74c3c66}@media (max-width: 768px){.user-notes-container{padding:1rem}.notes-header .day-title{font-size:2rem}.col-action{min-width:70px}.note-delete-button{padding:6px 12px;font-size:.75rem}}.admin-container{max-width:100%;margin:0;padding:20px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;width:100%;box-sizing:border-box}.admin-login{max-width:400px;margin:100px auto;padding:40px;background:white;border-radius:12px;box-shadow:0 10px 30px #0000004d}.admin-login h2{margin-bottom:30px;text-align:center;color:#333}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:600;color:#555}.form-group input{width:100%;padding:12px;border:2px solid #ddd;border-radius:8px;font-size:16px;box-sizing:border-box}.form-group input:focus{outline:none;border-color:#667eea}.admin-login button{width:100%;padding:12px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:transform .2s}.admin-login button:hover{transform:translateY(-2px)}.error-message{color:#e74c3c;margin-top:10px;text-align:center}.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;background:white;padding:20px 30px;border-radius:12px;box-shadow:0 4px 15px #0000001a}.admin-header h1{margin:0;color:#333}.logout-btn{padding:10px 20px;background:#e74c3c;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.logout-btn:hover{background:#c0392b}.level-selection{background:transparent;padding:40px;border-radius:12px;text-align:center}.level-selection h2{margin-bottom:30px;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.level-buttons{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.level-btn{padding:20px 40px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;border-radius:12px;font-size:24px;font-weight:700;cursor:pointer;transition:transform .2s,box-shadow .2s;min-width:120px}.level-btn:hover{transform:translateY(-4px);box-shadow:0 8px 20px #667eea66}.words-editor{background:white;padding:30px;border-radius:12px;box-shadow:0 4px 15px #0000001a}.editor-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:20px;border-bottom:2px solid #eee}.editor-header h2{margin:0;color:#333}.editor-actions{display:flex;gap:10px}.save-btn,.reset-btn,.back-btn{padding:10px 20px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.save-btn{background:#27ae60;color:#fff}.save-btn:hover:not(:disabled){background:#229954;transform:translateY(-2px)}.save-btn:disabled{background:#95a5a6;cursor:not-allowed}.reset-btn{background:#f39c12;color:#fff}.reset-btn:hover:not(:disabled){background:#e67e22}.reset-btn:disabled{background:#bdc3c7;cursor:not-allowed}.back-btn{background:#95a5a6;color:#fff}.back-btn:hover{background:#7f8c8d}.message{padding:12px 20px;border-radius:8px;margin-bottom:20px;font-weight:600}.message.success{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.message.error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.loading{text-align:center;padding:40px;font-size:18px;color:#666}.words-table-wrapper{overflow-x:auto;max-height:calc(100vh - 300px);overflow-y:auto}.admin-words-table{width:100%;border-collapse:collapse;background:white}.admin-words-table thead{position:sticky;top:0;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;z-index:10}.admin-words-table th{padding:15px 10px;text-align:left;font-weight:600;font-size:14px;white-space:nowrap}.admin-words-table tbody tr{border-bottom:1px solid #eee;transition:background .2s}.admin-words-table tbody tr:hover{background:#f8f9fa}.admin-words-table tbody tr.modified{background:#fff3cd}.admin-words-table tbody tr.modified:hover{background:#ffeaa7}.admin-words-table td{padding:10px;vertical-align:top}.admin-words-table input,.admin-words-table textarea{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px;font-size:14px;font-family:inherit;box-sizing:border-box}.admin-words-table input:focus,.admin-words-table textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 2px #667eea33}.admin-words-table textarea{resize:vertical;min-height:40px}.col-id{width:60px;min-width:60px}.col-word{width:120px;min-width:120px}.col-hiragana{width:150px;min-width:150px}.col-meaning{width:200px;min-width:200px}.col-example{width:250px;min-width:250px}.col-example-hiragana,.col-example-meaning{width:200px;min-width:200px}.language-selector{position:relative;z-index:1000}.language-button{background:rgba(255,255,255,.1);border:none;border-radius:6px;padding:8px 12px;cursor:pointer;display:flex;align-items:center;gap:6px;font-size:.85rem;font-weight:500;color:#fff;transition:all .2s ease;white-space:nowrap}.language-button:hover{background:rgba(255,255,255,.2);transform:translateY(-1px)}.language-flag{font-size:1.5rem;line-height:1;display:inline-block;vertical-align:middle;min-width:1.5rem;min-height:1.5rem;text-align:center;font-family:inherit;-webkit-user-select:none;user-select:none}.dropdown-arrow{font-size:.6rem;transition:transform .3s ease;color:#fff;opacity:.8}.dropdown-arrow.open{transform:rotate(180deg)}.language-dropdown{position:absolute;top:calc(100% + 10px);right:0;background:white;border-radius:15px;box-shadow:0 4px 20px #00000026;overflow:hidden;min-width:150px;max-width:calc(100vw - 40px);display:flex;flex-direction:column;gap:4px;padding:8px;animation:slideDown .3s ease;z-index:1002}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.language-option{width:100%;padding:10px 12px;border:none;background:white;cursor:pointer;display:flex;align-items:center;justify-content:flex-start;gap:10px;transition:all .2s ease;border-radius:8px;text-align:left}.language-option .language-flag{font-size:1.5rem;min-width:1.5rem;min-height:1.5rem;text-align:center;line-height:1;font-family:inherit;-webkit-user-select:none;user-select:none;flex-shrink:0}.language-name{font-size:.9rem;color:#333;font-weight:500}.language-option.active .language-name{color:#fff}.language-option:hover{background:#f5f5f5;transform:scale(1.1)}.language-option.active{background:#667eea;color:#fff;font-weight:600}.language-option.active:hover{background:#5568d3}@media (max-width: 768px){.language-selector{z-index:1001}.language-button{padding:6px 10px}.language-flag{font-size:1.3rem}.dropdown-arrow{font-size:.5rem}.language-dropdown{min-width:150px;max-width:calc(100vw - 80px);padding:6px;gap:3px;right:0}.language-option{padding:8px 10px}.language-option .language-flag{font-size:1.3rem}.language-name{font-size:.85rem}}.profile-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .2s ease}.profile-modal{background:white;border-radius:12px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.profile-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e0e0e0}.profile-header h2{margin:0;font-size:1.5rem;color:#333}.profile-close{background:none;border:none;font-size:2rem;color:#999;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s}.profile-close:hover{background:#f0f0f0;color:#333}.profile-tabs{display:flex;border-bottom:1px solid #e0e0e0}.profile-tab{flex:1;padding:15px;background:none;border:none;cursor:pointer;font-size:1rem;color:#666;transition:all .2s;border-bottom:2px solid transparent}.profile-tab:hover{background:#f5f5f5;color:#333}.profile-tab.active{color:#667eea;border-bottom-color:#667eea;font-weight:600}.profile-content{padding:20px;max-height:70vh;overflow-y:auto}.profile-info{display:flex;flex-direction:column;gap:20px}.profile-field{display:flex;flex-direction:column;gap:8px}.profile-field label{font-weight:600;color:#666;font-size:.9rem}.profile-value{padding:10px;background:#f5f5f5;border-radius:6px;color:#333;font-size:1rem}.profile-actions{margin-top:20px;padding-top:20px;border-top:1px solid #e0e0e0}.logout-button{width:100%;padding:12px;background:#ff4444;color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.logout-button:hover{background:#cc0000;transform:translateY(-1px)}.password-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:600;color:#666;font-size:.9rem}.form-group input{padding:12px;border:1px solid #ddd;border-radius:6px;font-size:1rem;transition:all .2s}.form-group input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled{background:#f5f5f5;cursor:not-allowed}.profile-error{padding:12px;background:#fee;color:#c33;border-radius:6px;border:1px solid #fcc}.profile-success{padding:12px;background:#efe;color:#3c3;border-radius:6px;border:1px solid #cfc}.change-password-button{padding:12px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.change-password-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.change-password-button:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 480px){.profile-modal{width:95%;max-height:95vh}.profile-header{padding:15px}.profile-header h2{font-size:1.2rem}.profile-content{padding:15px}}.main-navigation{width:100%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);box-shadow:0 2px 8px #0000001a;position:sticky;top:0;z-index:1000;margin-bottom:20px;animation:slideDown .4s ease-out}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@media (prefers-reduced-motion: reduce){.main-navigation{animation:none}}.nav-container{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;height:60px}.nav-logo{text-decoration:none;color:#fff;font-size:1.5rem;font-weight:700;display:flex;align-items:center;transition:opacity .2s}.nav-logo:hover{opacity:.8}.logo-text{display:inline-flex;align-items:center;font-weight:700;letter-spacing:1px;text-shadow:0 2px 4px rgba(0,0,0,.2)}.logo-char{display:inline-block;transition:transform .2s ease,text-shadow .2s ease;text-shadow:0 2px 4px rgba(0,0,0,.3)}.nav-logo:hover .logo-char{transform:translateY(-2px);text-shadow:0 4px 8px rgba(0,0,0,.4)}.nav-logo:hover .logo-char:nth-child(1){animation:bounce .6s ease 0s}.nav-logo:hover .logo-char:nth-child(2){animation:bounce .6s ease .1s}.nav-logo:hover .logo-char:nth-child(3){animation:bounce .6s ease .2s}.nav-logo:hover .logo-char:nth-child(4){animation:bounce .6s ease .3s}.nav-logo:hover .logo-char:nth-child(6){animation:bounce .6s ease .4s}.nav-logo:hover .logo-char:nth-child(7){animation:bounce .6s ease .5s}.nav-logo:hover .logo-char:nth-child(8){animation:bounce .6s ease .6s}.nav-logo:hover .logo-char:nth-child(9){animation:bounce .6s ease .7s}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.nav-right-section{display:flex;align-items:center;gap:10px;flex:1;justify-content:flex-end;min-width:0}.nav-links{display:flex;gap:10px;align-items:center;position:relative;flex-wrap:wrap;flex:1;justify-content:flex-end;min-width:0}.language-selector-wrapper{flex-shrink:0;display:flex;align-items:center;position:relative}.nav-link{color:#fff;text-decoration:none;padding:10px 16px;border-radius:6px;font-weight:500;transition:all .3s cubic-bezier(.4,0,.2,1);background:rgba(255,255,255,.1);border:none;cursor:pointer;font-size:.95rem;white-space:nowrap;display:flex;align-items:center;justify-content:center;min-height:40px;box-sizing:border-box;position:relative;overflow:hidden}.nav-link:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.2);transform:translate(-50%,-50%);transition:width .6s,height .6s}.nav-link:hover:before{width:300px;height:300px}.nav-link:hover{background:rgba(255,255,255,.2);transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.nav-link.active{background:rgba(255,255,255,.25);font-weight:600}.nav-link-wrapper{display:flex;align-items:center}.user-icon-button{background:rgba(255,255,255,.1);border:none;color:#fff;padding:10px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);min-width:40px;min-height:40px;box-sizing:border-box;position:relative;overflow:hidden}.user-icon-button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.2);transform:translate(-50%,-50%);transition:width .6s,height .6s}.user-icon-button:hover:before{width:200px;height:200px}.user-icon-button:hover{background:rgba(255,255,255,.2);transform:translateY(-2px) scale(1.05);box-shadow:0 4px 8px #00000026}.user-icon-button svg{width:20px;height:20px}.login-button{background:rgba(255,255,255,.9);color:#667eea;border:1px solid rgba(255,255,255,.5);font-weight:600}.login-button:hover{background:rgba(255,255,255,1);border-color:#fffc;color:#764ba2}.mobile-menu-toggle{display:none;flex-direction:column;gap:5px;background:transparent;border:none;cursor:pointer;padding:8px;z-index:1001}.mobile-menu-toggle span{width:25px;height:3px;background:white;border-radius:3px;transition:all .3s ease}.mobile-menu-toggle:hover span{background:rgba(255,255,255,.8)}@media (max-width: 768px){.nav-container{padding:0 15px;height:50px;position:relative;display:flex;align-items:center;justify-content:space-between}.nav-logo{font-size:1.2rem}.mobile-menu-toggle{display:flex;order:2;margin-left:10px}.nav-right-section{order:1;flex:1;justify-content:flex-end;gap:10px}.nav-links{position:fixed;top:50px;left:0;right:0;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);flex-direction:column;align-items:stretch;padding:20px;gap:10px;box-shadow:0 4px 12px #00000026;transform:translateY(-100%);opacity:0;visibility:hidden;transition:all .3s ease;z-index:1000;max-height:calc(100vh - 50px);overflow-y:auto;flex-wrap:nowrap;justify-content:flex-start}.nav-links.mobile-open{transform:translateY(0);opacity:1;visibility:visible}.language-selector-wrapper{flex-shrink:0;order:3;position:relative;z-index:1001}.nav-link{padding:12px 16px;font-size:1rem;width:100%;justify-content:flex-start;min-height:44px}.nav-link-wrapper{width:100%}.user-icon-button{width:100%;justify-content:flex-start;min-height:44px;padding:12px 16px}}@media (max-width: 480px){.nav-container{padding:0 10px}.logo-text{font-size:1rem}.nav-link{padding:6px 10px;font-size:.85rem}}.app{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:0 10px 10px;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion: reduce){.app{animation:none}}@media (min-width: 769px){.app{min-height:100vh;justify-content:flex-start;overflow-y:auto;overflow-x:hidden}}.quiz-container{width:100%;max-width:800px;margin:0 auto;height:100%;display:flex;align-items:center;justify-content:center}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;color:#333}#root{min-height:100vh}