:root{--vt-c-white: #ffffff;--vt-c-white-soft: #f8f8f8;--vt-c-white-mute: #f2f2f2;--vt-c-black: #181818;--vt-c-black-soft: #222222;--vt-c-black-mute: #282828;--vt-c-indigo: #2c3e50;--vt-c-divider-light-1: rgba(60, 60, 60, .29);--vt-c-divider-light-2: rgba(60, 60, 60, .12);--vt-c-divider-dark-1: rgba(84, 84, 84, .65);--vt-c-divider-dark-2: rgba(84, 84, 84, .48);--vt-c-text-light-1: var(--vt-c-indigo);--vt-c-text-light-2: rgba(60, 60, 60, .66);--vt-c-text-dark-1: var(--vt-c-white);--vt-c-text-dark-2: rgba(235, 235, 235, .64)}:root{--color-background: var(--vt-c-white);--color-background-soft: var(--vt-c-white-soft);--color-background-mute: var(--vt-c-white-mute);--color-border: var(--vt-c-divider-light-2);--color-border-hover: var(--vt-c-divider-light-1);--color-heading: var(--vt-c-text-light-1);--color-text: var(--vt-c-text-light-1);--section-gap: 160px}@media(prefers-color-scheme:dark){:root{--color-background: var(--vt-c-black);--color-background-soft: var(--vt-c-black-soft);--color-background-mute: var(--vt-c-black-mute);--color-border: var(--vt-c-divider-dark-2);--color-border-hover: var(--vt-c-divider-dark-1);--color-heading: var(--vt-c-text-dark-1);--color-text: var(--vt-c-text-dark-2)}}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400}.container{max-width:600px;margin:0 auto}body{font-family:system-ui,sans-serif}body:not(:has(.page-not-found)){padding:20px}h1{text-align:center;margin-bottom:24px}.audio-btn{background:none;border:none;font-size:20px;cursor:pointer;transition:transform .2s}.audio-btn:hover{transform:scale(1.1)}.back-btn{display:inline-block;color:#38bdf8;font-weight:500;cursor:pointer}.back-btn:Hover{opacity:.8}.start-btn{width:90%;margin:0 auto;padding:18px;font-size:18px;font-weight:600;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px #667eea66}a.start-btn{text-decoration:none;margin:10px auto;display:block;text-align:center}.start-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea80}.start-btn:active{transform:translateY(0)}.box-scroll-height::-webkit-scrollbar{width:6px}.box-scroll-height::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.box-scroll-height::-webkit-scrollbar-thumb{background:#667eea;border-radius:10px}body:has(.container-homepage){background:linear-gradient(135deg,#667eea,#764ba2);color:#1f2937;font-family:system-ui,-apple-system,sans-serif;padding:20px;min-height:100vh}.container-homepage .header{text-align:center;margin-bottom:40px;color:#fff}.container-homepage .header h1{font-size:36px;margin-bottom:8px;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.container-homepage .header p{font-size:16px;opacity:.9}.container-homepage .exam-card{background:#fff;border-radius:20px;padding:24px;margin-bottom:20px;box-shadow:0 10px 30px #0003;transition:transform .3s,box-shadow .3s}.container-homepage .exam-card:hover{transform:translateY(-5px);box-shadow:0 15px 40px #0000004d}.container-homepage .exam-header{display:flex;align-items:center;gap:16px;margin-bottom:12px}.container-homepage .exam-icon{font-size:35px;width:50px;height:50px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:15px;display:flex;align-items:center;justify-content:center}.container-homepage .exam-info{font-size:28px;color:#1f2937}.container-homepage .exam-actions{display:flex;gap:12px;margin-top:16px}.container-homepage .btn{flex:1;padding:12px 20px;border:none;border-radius:12px;font-weight:600;font-size:15px;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}.container-homepage .btn-view{background:#f3f4f6;color:#4b5563}.container-homepage .btn-view:hover{background:#e5e7eb}.container-homepage .btn-practice{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.container-homepage .btn-practice:hover{transform:scale(1.05);box-shadow:0 5px 15px #667eea66}body:has(.container-alphabet){background:#020617;color:#e5e7eb}.container-alphabet .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:12px}.container-alphabet .cell{background:#0f172a;border-radius:14px;padding:14px 8px;text-align:center;cursor:pointer;border:1px solid transparent;transition:background .2s ease,border .2s ease,transform .15s ease,box-shadow .2s ease}.container-alphabet .cell:hover{background:linear-gradient(180deg,#1e293b,#0f172a);border-color:#38bdf8;transform:translateY(-2px);box-shadow:0 8px 20px #38bdf840}.container-alphabet .jp{font-size:32px;font-weight:600}.container-alphabet .romaji{font-size:13px;opacity:.75;margin-top:4px}body:has(.container-quiz){background:#020617;color:#e5e7eb}.container-quiz{width:90%;max-width:360px;margin:0 auto}.container-quiz .header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.container-quiz .score-info{display:flex;gap:20px;font-size:16px;font-weight:600}.container-quiz .timer{color:#fbbf24;font-size:18px}.container-quiz .question-card{background:#0f172a;border-radius:16px;padding:30px 20px;text-align:center;margin-bottom:25px;border:1px solid #1e293b}.container-quiz .question-text{font-size:45px;font-weight:700;margin-bottom:16px}.container-quiz .options{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:24px}.container-quiz .option-btn{background:#1e293b;border:2px solid #334155;color:#fff;padding:15px;border-radius:12px;font-size:20px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.container-quiz .option-btn:hover:not(:disabled){background:#334155;transform:scale(1.02)}.container-quiz .option-btn:disabled{cursor:not-allowed}.container-quiz .option-btn.correct{background:#16a34a;border-color:#22c55e}.container-quiz .option-btn.incorrect{background:#dc2626;border-color:#ef4444}.container-quiz .result-screen{background:#0f172a;border-radius:16px;padding:20px;border:1px solid #1e293b}.container-quiz .result-header{text-align:center;margin-bottom:20px}.container-quiz .result-score{font-size:35px;font-weight:700;color:#38bdf8;margin-bottom:10px}.container-quiz .result-time{font-size:18px;color:#94a3b8}.container-quiz .wrong-answers{margin-top:20px;max-height:400px;overflow-y:auto}.container-quiz .wrong-answers h3{color:#ef4444;margin-bottom:20px;font-size:24px}.container-quiz .wrong-item{background:#1e293b;border-left:4px solid #ef4444;padding:10px;margin-bottom:12px;border-radius:8px}.container-quiz .wrong-question{font-size:20px;font-weight:600;margin-bottom:8px}.container-quiz .wrong-answer{color:#94a3b8;margin-bottom:4px}.container-quiz .correct-answer{color:#22c55e}.container-quiz .chosen-answer{color:#ef4444}.container-quiz .no-wrong{text-align:center;color:#22c55e;font-size:20px;padding:40px}.container-quiz .restart-btn{background:#38bdf8;color:#fff;border:none;padding:12px 30px;border-radius:12px;font-size:18px;font-weight:600;cursor:pointer;transition:all .2s;display:block;margin:20px auto 0}.container-quiz .restart-btn:hover{background:#0ea5e9;transform:translateY(-2px)}.container-quiz .hidden{display:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.container-quiz .timer.warning{color:#ef4444;animation:pulse 1s infinite}@media screen and (min-width:768px){.container-quiz .container{max-width:500px}}.container-quiz .group{margin-bottom:40px}.container-quiz .group h2{margin-bottom:16px;color:#38bdf8}.container-quiz .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:14px}.container-quiz .card{background:#0f172a;border-radius:14px;padding:14px;text-align:center;cursor:pointer;border:1px solid transparent;transition:all .2s ease}.container-quiz .card:hover{transform:translateY(-4px);border-color:#38bdf8;box-shadow:0 8px 20px #38bdf840}.container-quiz .jp{font-size:22px;font-weight:600;margin-bottom:6px}.container-quiz .meaning{font-size:13px;opacity:.8}@media screen and (min-width:768px){.container-quiz{max-width:500px}}