:root,[data-theme=light]{--color-bg-primary: #fdf8f6;--color-bg-secondary: #faf0ed;--color-bg-card: #ffffff;--color-bg-card-hover: #fffbfa;--color-bg-elevated: #f3e8e4;--color-bg-glass: rgba(253, 248, 246, .9);--color-text-primary: #2d1b14;--color-text-secondary: #6b4c42;--color-text-muted: #a08478;--color-accent: #d4477a;--color-accent-hover: #bf3d6c;--color-accent-subtle: rgba(212, 71, 122, .08);--color-teal: #4a8c6f;--color-teal-hover: #3d7a5f;--color-teal-subtle: rgba(74, 140, 111, .08);--color-gold: #b8860b;--color-gold-subtle: rgba(184, 134, 11, .08);--color-purple: #7b4fa2;--color-purple-subtle: rgba(123, 79, 162, .08);--color-orange: #c4541d;--color-orange-subtle: rgba(196, 84, 29, .08);--color-correct: #2e8b57;--color-correct-bg: rgba(46, 139, 87, .08);--color-wrong: #c0392b;--color-wrong-bg: rgba(192, 57, 43, .08);--gradient-accent: linear-gradient(135deg, #d4477a, #e8739b);--gradient-teal: linear-gradient(135deg, #4a8c6f, #6db89a);--gradient-gold: linear-gradient(135deg, #b8860b, #daa520);--shadow-sm: 0 1px 3px rgba(45, 27, 20, .06);--shadow-md: 0 4px 12px rgba(45, 27, 20, .08);--shadow-lg: 0 8px 24px rgba(45, 27, 20, .1);--shadow-card: 0 1px 4px rgba(45, 27, 20, .04), 0 0 0 1px rgba(45, 27, 20, .03);--shadow-glow-accent: 0 4px 16px rgba(212, 71, 122, .12);--deco-pattern-opacity: .03;--border-subtle: rgba(45, 27, 20, .08)}[data-theme=dark]{--color-bg-primary: #1a1118;--color-bg-secondary: #241a22;--color-bg-card: #2d2029;--color-bg-card-hover: #382a34;--color-bg-elevated: #3d2e38;--color-bg-glass: rgba(26, 17, 24, .9);--color-text-primary: #f5ece9;--color-text-secondary: #c4a9b8;--color-text-muted: #8a6e7e;--color-accent: #f472a8;--color-accent-hover: #f8a4c8;--color-accent-subtle: rgba(244, 114, 168, .12);--color-teal: #6dd5a8;--color-teal-hover: #8de4be;--color-teal-subtle: rgba(109, 213, 168, .1);--color-gold: #fbbf24;--color-gold-subtle: rgba(251, 191, 36, .1);--color-purple: #c084fc;--color-purple-subtle: rgba(192, 132, 252, .1);--color-orange: #fb923c;--color-orange-subtle: rgba(251, 146, 60, .1);--color-correct: #4ade80;--color-correct-bg: rgba(74, 222, 128, .1);--color-wrong: #f87171;--color-wrong-bg: rgba(248, 113, 113, .1);--gradient-accent: linear-gradient(135deg, #f472a8, #c084fc);--gradient-teal: linear-gradient(135deg, #6dd5a8, #34d399);--gradient-gold: linear-gradient(135deg, #fbbf24, #fb923c);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--shadow-card: 0 1px 4px rgba(0, 0, 0, .2), 0 0 0 1px rgba(255, 255, 255, .04);--shadow-glow-accent: 0 4px 16px rgba(244, 114, 168, .2);--deco-pattern-opacity: .02;--border-subtle: rgba(255, 255, 255, .06)}:root{--font-sans: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-jp: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--text-4xl: 2.75rem;--text-5xl: 3.5rem;--weight-normal: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--leading-tight: 1.2;--leading-normal: 1.5;--leading-relaxed: 1.75;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.25rem;--radius-3xl: 1.5rem;--radius-full: 9999px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .4s cubic-bezier(.4, 0, .2, 1);--transition-spring: .5s cubic-bezier(.34, 1.56, .64, 1);--container-max: 1100px;--container-narrow: 680px;--blur-md: blur(16px)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);background-color:var(--color-bg-primary);color:var(--color-text-primary);line-height:var(--leading-normal);min-height:100vh;overflow-x:hidden;transition:background-color var(--transition-slow),color var(--transition-slow)}ruby,.jp,[lang=ja]{font-family:var(--font-jp)}ruby{ruby-align:center}ruby rt{font-size:.55em;color:var(--color-teal);font-weight:var(--weight-medium)}a{color:var(--color-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-accent-hover)}.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--space-6)}.container--narrow{max-width:var(--container-narrow)}h1,h2,h3,h4{font-weight:var(--weight-bold);line-height:var(--leading-tight);letter-spacing:-.02em;color:var(--color-text-primary)}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-bg-elevated);border-radius:var(--radius-full)}::selection{background:var(--color-accent-subtle);color:var(--color-accent)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:root body,[data-theme=light] body{background:radial-gradient(ellipse 800px 600px at 100% 0%,rgba(244,184,200,.22) 0%,transparent 55%),radial-gradient(ellipse 700px 500px at 0% 100%,rgba(167,200,167,.16) 0%,transparent 55%),radial-gradient(ellipse 600px 400px at 80% 100%,rgba(245,222,179,.18) 0%,transparent 55%),radial-gradient(ellipse 1200px 800px at 50% 30%,rgba(255,245,240,.6) 0%,transparent 70%),var(--color-bg-primary);background-attachment:fixed}[data-theme=dark] body{background:radial-gradient(ellipse 900px 700px at 80% 10%,rgba(244,114,168,.1) 0%,transparent 55%),radial-gradient(ellipse 800px 600px at 10% 90%,rgba(109,213,168,.07) 0%,transparent 55%),radial-gradient(ellipse 700px 500px at 50% 50%,rgba(192,132,252,.06) 0%,transparent 60%),radial-gradient(ellipse 1000px 800px at 100% 100%,rgba(251,191,36,.04) 0%,transparent 60%),var(--color-bg-primary);background-attachment:fixed}body:after{content:"";position:fixed;bottom:0;left:0;right:0;height:180px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1440' height='180' viewBox='0 0 1440 180' preserveAspectRatio='none'><path d='M 0 180 L 0 140 L 100 130 L 250 100 L 380 70 L 480 35 L 540 15 L 570 5 L 600 0 L 640 5 L 680 25 L 760 60 L 840 90 L 920 110 L 1000 95 L 1080 70 L 1160 50 L 1240 65 L 1320 90 L 1400 110 L 1440 125 L 1440 180 Z' fill='%23000' opacity='0.06'/></svg>");background-size:100% 100%;background-repeat:no-repeat;background-position:bottom center;pointer-events:none;z-index:0;opacity:.5}[data-theme=dark] body:after{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1440' height='180' viewBox='0 0 1440 180' preserveAspectRatio='none'><path d='M 0 180 L 0 140 L 100 130 L 250 100 L 380 70 L 480 35 L 540 15 L 570 5 L 600 0 L 640 5 L 680 25 L 760 60 L 840 90 L 920 110 L 1000 95 L 1080 70 L 1160 50 L 1240 65 L 1320 90 L 1400 110 L 1440 125 L 1440 180 Z' fill='%23ffffff' opacity='0.04'/></svg>");opacity:.6}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='5'/><feColorMatrix values='0 0 0 0 0.6  0 0 0 0 0.5  0 0 0 0 0.5  0 0 0 0.04 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");opacity:.04;pointer-events:none;z-index:0;mix-blend-mode:multiply}[data-theme=dark] body:before{mix-blend-mode:screen;opacity:.05}#app{position:relative;z-index:2}@media(max-width:768px){body:after{height:100px}}.sakura-container{position:fixed;top:0;left:0;width:100%;height:100vh;pointer-events:none;overflow:hidden;z-index:0}.sakura{position:absolute;top:-10vh;width:14px;height:14px;background:radial-gradient(ellipse at 30% 30%,#ffb7c5f2,#ff9ab2d9 40%,#f472a899);border-radius:80% 0;opacity:0;transform:rotate(0);animation-name:sakura-fall;animation-timing-function:ease-in-out;animation-iteration-count:infinite;filter:drop-shadow(0 1px 2px rgba(212,71,122,.15))}[data-theme=dark] .sakura{background:radial-gradient(ellipse at 30% 30%,#ffc8dcb3,#f472a88c 40%,#c084fc66);filter:drop-shadow(0 1px 3px rgba(244,114,168,.25))}@keyframes sakura-fall{0%{opacity:0;transform:translate(0) rotate(0)}10%{opacity:.9}50%{transform:translate(80px,50vh) rotate(180deg);opacity:.85}90%{opacity:.7}to{opacity:0;transform:translate(-40px,110vh) rotate(360deg)}}.sakura:nth-child(1){left:5%;animation-duration:14s;animation-delay:0s;transform:scale(.8)}.sakura:nth-child(2){left:12%;animation-duration:18s;animation-delay:3s;transform:scale(1)}.sakura:nth-child(3){left:22%;animation-duration:16s;animation-delay:7s;transform:scale(.6)}.sakura:nth-child(4){left:32%;animation-duration:20s;animation-delay:1s;transform:scale(1.2)}.sakura:nth-child(5){left:42%;animation-duration:15s;animation-delay:9s;transform:scale(.9)}.sakura:nth-child(6){left:52%;animation-duration:22s;animation-delay:4s;transform:scale(.7)}.sakura:nth-child(7){left:62%;animation-duration:17s;animation-delay:12s;transform:scale(1.1)}.sakura:nth-child(8){left:72%;animation-duration:19s;animation-delay:6s;transform:scale(.8)}.sakura:nth-child(9){left:80%;animation-duration:16s;animation-delay:10s;transform:scale(1)}.sakura:nth-child(10){left:88%;animation-duration:21s;animation-delay:2s;transform:scale(.6)}.sakura:nth-child(11){left:95%;animation-duration:18s;animation-delay:14s;transform:scale(.9)}.sakura:nth-child(12){left:38%;animation-duration:24s;animation-delay:16s;transform:scale(.5)}@media(prefers-reduced-motion:reduce){.sakura{display:none}}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.3)}50%{transform:scale(1.1)}70%{transform:scale(.9)}to{opacity:1;transform:scale(1)}}.animate-fade{animation:fadeIn var(--transition-base) ease-out}.lesson-card{animation:fadeIn var(--transition-slow) ease-out backwards}.lesson-card:nth-child(1){animation-delay:0ms}.lesson-card:nth-child(2){animation-delay:30ms}.lesson-card:nth-child(3){animation-delay:60ms}.lesson-card:nth-child(4){animation-delay:90ms}.lesson-card:nth-child(5){animation-delay:.12s}.lesson-card:nth-child(6){animation-delay:.15s}.lesson-card:nth-child(7){animation-delay:.18s}.lesson-card:nth-child(8){animation-delay:.21s}.lesson-card:nth-child(9){animation-delay:.24s}.lesson-card:nth-child(10){animation-delay:.27s}.quiz-card{animation:fadeIn var(--transition-slow) ease-out backwards}.quiz-card:nth-child(1){animation-delay:50ms}.quiz-card:nth-child(2){animation-delay:.1s}.quiz-card:nth-child(3){animation-delay:.15s}.quiz-card:nth-child(4){animation-delay:.2s}.quiz-card:nth-child(5){animation-delay:.25s}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-8);border:none;border-radius:var(--radius-full);font-size:var(--text-base);font-weight:var(--weight-semibold);cursor:pointer;transition:all var(--transition-fast);text-decoration:none;font-family:inherit}.btn--primary{background:var(--gradient-accent);color:#fff;box-shadow:var(--shadow-glow-accent)}.btn--primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px #d4477a40}.btn--primary:active{transform:translateY(0)}.btn--secondary{background:var(--color-bg-card);color:var(--color-text-primary);border:1px solid var(--border-subtle)}.btn--secondary:hover{background:var(--color-bg-elevated)}.btn--small{padding:var(--space-2) var(--space-4);font-size:var(--text-sm)}.btn--back{background:transparent;color:var(--color-text-secondary);padding:var(--space-2) var(--space-4);font-size:var(--text-sm);border-radius:var(--radius-lg)}.btn--back:hover{color:var(--color-text-primary);background:var(--color-bg-elevated)}.header{padding:var(--space-4) 0;background:var(--color-bg-glass);backdrop-filter:var(--blur-md);-webkit-backdrop-filter:var(--blur-md);border-bottom:1px solid var(--border-subtle);position:sticky;top:0;z-index:100}.header__inner{display:flex;align-items:center;justify-content:space-between}.header__logo{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--color-text-primary);display:flex;align-items:center;gap:var(--space-2);text-decoration:none}.header__logo span{background:var(--gradient-accent);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header__actions{display:flex;align-items:center;gap:var(--space-2)}.btn-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);background:var(--color-bg-card);cursor:pointer;font-size:var(--text-lg);transition:all var(--transition-fast)}.btn-icon:hover{background:var(--color-bg-elevated);transform:scale(1.05)}.hero{text-align:center;padding:var(--space-12) 0 var(--space-6)}.hero__title{font-size:var(--text-4xl);margin-bottom:var(--space-3)}.hero__subtitle{font-size:var(--text-lg);color:var(--color-text-secondary);max-width:500px;margin:0 auto}.lesson-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:var(--space-4);padding:var(--space-6) 0 var(--space-16)}.lesson-card{background:var(--color-bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-2xl);padding:var(--space-6);cursor:pointer;transition:all var(--transition-base);position:relative;overflow:hidden;text-decoration:none;color:inherit;display:block;box-shadow:var(--shadow-card)}.lesson-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-accent);opacity:0;transition:opacity var(--transition-base)}.lesson-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.lesson-card:hover:before{opacity:1}.lesson-card__number{font-size:var(--text-3xl);font-weight:var(--weight-bold);color:var(--color-accent);margin-bottom:var(--space-2)}.lesson-card__title{font-size:var(--text-sm);color:var(--color-text-secondary);font-family:var(--font-jp);line-height:var(--leading-relaxed)}.lesson-card__title-vi{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-1)}.lesson-card__progress{margin-top:var(--space-4);height:3px;background:var(--color-bg-elevated);border-radius:var(--radius-full);overflow:hidden}.lesson-card__progress-bar{height:100%;background:var(--gradient-teal);border-radius:var(--radius-full);transition:width var(--transition-slow)}.lesson-header{padding:var(--space-10) 0 var(--space-4)}.lesson-header__badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--color-accent-subtle);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--color-accent);margin-bottom:var(--space-4);font-weight:var(--weight-medium)}.lesson-header__title{font-size:var(--text-3xl);margin-bottom:var(--space-2)}.lesson-header__subtitle{color:var(--color-text-secondary);font-family:var(--font-jp)}.quiz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--space-5);padding:var(--space-6) 0 var(--space-16)}.quiz-card{background:var(--color-bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-2xl);padding:var(--space-6) var(--space-8);cursor:pointer;transition:all var(--transition-base);display:flex;flex-direction:column;gap:var(--space-3);text-decoration:none;color:inherit;position:relative;overflow:hidden;box-shadow:var(--shadow-card)}.quiz-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px}.quiz-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.quiz-card--vocab:before{background:var(--color-accent)}.quiz-card--practice:before{background:var(--color-teal)}.quiz-card--reading:before{background:var(--color-gold)}.quiz-card--grammar:before{background:var(--color-purple)}.quiz-card--kanji:before{background:var(--color-orange)}.quiz-card__icon{font-size:var(--text-2xl);width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-xl)}.quiz-card--vocab .quiz-card__icon{background:var(--color-accent-subtle)}.quiz-card--practice .quiz-card__icon{background:var(--color-teal-subtle)}.quiz-card--reading .quiz-card__icon{background:var(--color-gold-subtle)}.quiz-card--grammar .quiz-card__icon{background:var(--color-purple-subtle)}.quiz-card--kanji .quiz-card__icon{background:var(--color-orange-subtle)}.quiz-card__title{font-size:var(--text-lg);font-weight:var(--weight-semibold)}.quiz-card__desc{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.quiz-card__meta{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-xs);color:var(--color-text-muted);margin-top:auto;padding-top:var(--space-3);border-top:1px solid var(--border-subtle)}@media(max-width:768px){.lesson-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--space-3)}.quiz-grid{grid-template-columns:1fr}.hero__title{font-size:var(--text-3xl)}}.quiz-player{max-width:var(--container-narrow);margin:0 auto;padding:var(--space-8) var(--space-6)}.quiz-resume{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-6);background:var(--color-teal-subtle);border:1px solid rgba(74,140,111,.2);border-radius:var(--radius-xl);margin-bottom:var(--space-6);animation:slideUp var(--transition-base)}.quiz-resume__text{font-size:var(--text-sm);color:var(--color-teal);font-weight:var(--weight-medium)}.quiz-resume__actions{display:flex;gap:var(--space-2)}.quiz-progress{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6)}.quiz-progress__bar{flex:1;height:4px;background:var(--color-bg-elevated);border-radius:var(--radius-full);overflow:hidden}.quiz-progress__fill{height:100%;background:var(--gradient-accent);border-radius:var(--radius-full);transition:width var(--transition-base)}.quiz-progress__text{font-size:var(--text-sm);color:var(--color-text-muted);min-width:60px;text-align:right;font-variant-numeric:tabular-nums}.quiz-question{background:var(--color-bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-3xl);padding:var(--space-10) var(--space-8);margin-bottom:var(--space-6);text-align:center;box-shadow:var(--shadow-md)}.quiz-question__prompt{font-size:var(--text-3xl);font-family:var(--font-jp);font-weight:var(--weight-medium);line-height:var(--leading-relaxed);color:var(--color-text-primary)}.quiz-question__prompt ruby rt{font-size:var(--text-sm);color:var(--color-teal)}.quiz-question__tts{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:none;border-radius:var(--radius-full);background:var(--color-teal-subtle);color:var(--color-teal);cursor:pointer;transition:all .3s cubic-bezier(.34,1.56,.64,1);margin-left:var(--space-3);vertical-align:middle;font-size:1.2rem;position:relative;overflow:hidden}.quiz-question__tts:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:radial-gradient(circle,rgba(13,148,136,.2) 0%,transparent 70%);opacity:0;transition:opacity .3s}.quiz-question__tts:hover{transform:scale(1.15);background:var(--color-teal);color:#fff;box-shadow:0 4px 16px #0d94884d}.quiz-question__tts:hover:after{opacity:1}.quiz-question__tts:active{transform:scale(.9)}.quiz-question__tts--playing{background:var(--color-teal);color:#fff;animation:tts-pulse 1.2s ease-in-out infinite}@keyframes tts-pulse{0%,to{transform:scale(1);box-shadow:0 0 #0d948866}50%{transform:scale(1.08);box-shadow:0 0 0 10px #0d948800}}.quiz-question__passage{font-size:var(--text-base);font-family:var(--font-jp);line-height:2.2;text-align:left;padding:var(--space-6) var(--space-8);background:var(--color-bg-secondary, var(--color-bg-elevated));border:1px solid var(--border-subtle);border-radius:var(--radius-xl);margin-bottom:var(--space-6);color:var(--color-text-primary)}.quiz-question__sub-prompt{font-size:var(--text-base);margin-top:var(--space-4);color:var(--color-text-secondary);font-style:italic}.quiz-options{display:flex;flex-direction:column;gap:var(--space-3)}.quiz-option{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-6);background:var(--color-bg-card);border:2px solid var(--color-bg-elevated);border-radius:var(--radius-xl);cursor:pointer;transition:all var(--transition-fast);font-size:var(--text-base);text-align:left;width:100%;font-family:inherit;color:var(--color-text-primary)}.quiz-option:hover:not(.quiz-option--disabled){border-color:var(--color-accent);background:var(--color-accent-subtle);transform:translate(4px)}.quiz-option__label{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background:var(--color-bg-elevated);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-secondary);flex-shrink:0;transition:all var(--transition-fast)}.quiz-option__text{flex:1;font-family:var(--font-jp);color:var(--color-text-primary)}.quiz-option--correct{border-color:var(--color-correct)!important;background:var(--color-correct-bg)!important}.quiz-option--correct .quiz-option__label{background:var(--color-correct);color:#fff}.quiz-option--correct .quiz-option__text{color:var(--color-correct);font-weight:var(--weight-medium)}.quiz-option--wrong{border-color:var(--color-wrong)!important;background:var(--color-wrong-bg)!important}.quiz-option--wrong .quiz-option__label{background:var(--color-wrong);color:#fff}.quiz-option--disabled{cursor:default;opacity:.5;transform:none!important}.quiz-option--disabled.quiz-option--correct{opacity:1}.quiz-explanation{margin-top:var(--space-5);padding:var(--space-5) var(--space-6);background:var(--color-teal-subtle);border:1px solid rgba(74,140,111,.15);border-radius:var(--radius-xl);font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed);animation:slideUp var(--transition-base)}.result{text-align:center;padding:var(--space-16) var(--space-6)}.result__emoji{font-size:var(--text-5xl);margin-bottom:var(--space-4);animation:bounceIn var(--transition-spring)}.result__score{font-size:var(--text-5xl);font-weight:var(--weight-bold);margin-bottom:var(--space-2)}.result__score--high{color:var(--color-correct)}.result__score--mid{color:var(--color-gold)}.result__score--low{color:var(--color-wrong)}.result__label{font-size:var(--text-xl);color:var(--color-text-secondary);margin-bottom:var(--space-8)}.result__actions{display:flex;gap:var(--space-4);justify-content:center;flex-wrap:wrap}.review-list{margin-top:var(--space-10);text-align:left}.review-list h3{margin-bottom:var(--space-4)}.review-item{padding:var(--space-4) var(--space-6);background:var(--color-bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);margin-bottom:var(--space-3);border-left:3px solid var(--color-wrong);box-shadow:var(--shadow-sm)}.review-item__question{font-family:var(--font-jp);margin-bottom:var(--space-2);color:var(--color-text-primary)}.review-item__answer{font-size:var(--text-sm);color:var(--color-text-secondary)}.review-item__correct{color:var(--color-correct);font-weight:var(--weight-medium)}@media(max-width:768px){.quiz-question{padding:var(--space-6)}.quiz-question__prompt{font-size:var(--text-2xl)}}@media(max-width:480px){.quiz-option{padding:var(--space-3) var(--space-4)}}.form-section{background:var(--color-bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-2xl);padding:var(--space-6);margin-bottom:var(--space-5);box-shadow:var(--shadow-card)}.form-section__title{font-size:var(--text-lg);font-weight:var(--weight-semibold);margin-bottom:var(--space-4);display:flex;align-items:center;gap:var(--space-2)}.form-section__desc{font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-5);line-height:var(--leading-relaxed)}.form-group{margin-bottom:var(--space-4)}.form-label{display:block;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-text-primary);margin-bottom:var(--space-2)}.form-label__optional{font-weight:var(--weight-normal);color:var(--color-text-muted);font-size:var(--text-xs)}.form-input,.form-select{width:100%;padding:var(--space-3) var(--space-4);background:var(--color-bg-primary);border:1.5px solid var(--color-bg-elevated);border-radius:var(--radius-lg);font-size:var(--text-base);font-family:inherit;color:var(--color-text-primary);transition:all var(--transition-fast)}.form-input:focus,.form-select:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-subtle)}.form-input::placeholder{color:var(--color-text-muted)}.form-help{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-2);line-height:var(--leading-relaxed)}.form-help a{color:var(--color-accent)}.form-toggle{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) 0}.toggle{position:relative;width:48px;height:26px;background:var(--color-bg-elevated);border-radius:var(--radius-full);cursor:pointer;transition:background var(--transition-base);flex-shrink:0}.toggle:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;background:var(--color-bg-card);border-radius:var(--radius-full);transition:transform var(--transition-base);box-shadow:var(--shadow-sm)}.toggle--on{background:var(--color-accent)}.toggle--on:after{transform:translate(22px)}.status-msg{padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--text-sm);margin-top:var(--space-3);display:flex;align-items:center;gap:var(--space-2);animation:slideUp var(--transition-base)}.status-msg--success{background:var(--color-correct-bg);color:var(--color-correct);border:1px solid rgba(46,139,87,.2)}.status-msg--error{background:var(--color-wrong-bg);color:var(--color-wrong);border:1px solid rgba(192,57,43,.2)}.status-msg--info{background:var(--color-teal-subtle);color:var(--color-teal);border:1px solid rgba(74,140,111,.2)}.status-msg--warning{background:var(--color-gold-subtle);color:var(--color-gold);border:1px solid rgba(184,134,11,.2)}.form-actions{display:flex;gap:var(--space-3);flex-wrap:wrap;margin-top:var(--space-5)}@media(max-width:768px){.form-section{padding:var(--space-4)}.form-actions{flex-direction:column}.form-actions .btn{width:100%}}.btn--ai{background:linear-gradient(135deg,#a855f7,#ec4899,#f59e0b);background-size:200% 200%;color:#fff;border:none;padding:var(--space-3) var(--space-5);border-radius:var(--radius-full);font-weight:var(--weight-semibold);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-base);box-shadow:0 4px 16px #a855f740;animation:shimmer 4s ease-in-out infinite;white-space:nowrap}.btn--ai:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #a855f759}.btn--ai:disabled{opacity:.7;cursor:wait;animation:none}@keyframes shimmer{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.quiz-action-bar{position:sticky;bottom:0;left:0;right:0;z-index:50;display:flex;gap:var(--space-3);align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-5);margin:var(--space-4) calc(-1 * var(--space-2)) 0;background:var(--color-bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-2xl);box-shadow:0 -4px 24px #0000000f,0 0 0 1px #00000005;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:slideUp var(--transition-base)}[data-theme=dark] .quiz-action-bar{background:#1e1928d9;box-shadow:0 -4px 24px #0006}.quiz-action-bar__left,.quiz-action-bar__right{display:flex;gap:var(--space-2);align-items:center}.quiz-action-bar .btn--primary{padding:var(--space-3) var(--space-6);font-size:var(--text-base);white-space:nowrap}.hint-bubble{margin-top:var(--space-4);padding:var(--space-4) var(--space-5);background:linear-gradient(135deg,#a855f71a,#ec489914);border:1px solid rgba(168,85,247,.2);border-radius:var(--radius-xl);font-size:var(--text-sm);color:var(--color-text-primary);line-height:var(--leading-relaxed);animation:slideUp var(--transition-base);position:relative}.hint-bubble:before{content:"";position:absolute;top:-1px;left:0;right:0;height:3px;background:linear-gradient(90deg,#a855f7,#ec4899,#f59e0b);border-radius:var(--radius-xl) var(--radius-xl) 0 0}.hint-bubble strong{color:#a855f7}[data-theme=dark] .hint-bubble strong{color:#d8b4fe}.hint-bubble--loading{background:var(--color-bg-elevated);color:var(--color-text-muted);border-color:var(--border-subtle)}.hint-bubble--loading:before{display:none}@media(max-width:768px){.quiz-action-bar{padding:var(--space-3) var(--space-4);margin:var(--space-3) calc(-1 * var(--space-1)) 0;border-radius:var(--radius-xl);flex-wrap:wrap}.quiz-action-bar__left,.quiz-action-bar__right{flex:1}.quiz-action-bar__right{justify-content:flex-end}.quiz-action-bar .btn--primary,.quiz-action-bar .btn--ai{flex:1;justify-content:center}}@media(max-width:480px){.quiz-action-bar{flex-direction:column-reverse;gap:var(--space-2)}.quiz-action-bar__left,.quiz-action-bar__right{width:100%}}@media(max-width:1024px){.container{padding:0 var(--space-5)}.lesson-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}@media(max-width:768px){h1{font-size:var(--text-3xl)}h2{font-size:var(--text-xl)}.container{padding:0 var(--space-4)}.header{padding:var(--space-3) 0}.header__logo{font-size:var(--text-base)}.btn-icon{width:32px;height:32px;font-size:var(--text-base)}.btn--back{padding:var(--space-2) var(--space-3);font-size:var(--text-xs)}.hero{padding:var(--space-8) 0 var(--space-4)}.hero__title{font-size:var(--text-2xl);margin-bottom:var(--space-2)}.hero__subtitle{font-size:var(--text-sm)}.lesson-grid{grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:var(--space-3);padding:var(--space-4) 0 var(--space-12)}.lesson-card{padding:var(--space-4);border-radius:var(--radius-xl)}.lesson-card__number{font-size:var(--text-2xl)}.lesson-card__title{font-size:var(--text-xs)}.lesson-header{padding:var(--space-6) 0 var(--space-2)}.lesson-header__title{font-size:var(--text-2xl)}.quiz-grid{grid-template-columns:1fr;gap:var(--space-3)}.quiz-card{padding:var(--space-5)}.quiz-player{padding:var(--space-4) var(--space-3)}.quiz-question{padding:var(--space-6) var(--space-4);border-radius:var(--radius-2xl)}.quiz-question__prompt{font-size:var(--text-2xl);line-height:1.6}.quiz-question__passage{padding:var(--space-4);font-size:var(--text-sm);line-height:1.9}.quiz-question__sub-prompt{font-size:var(--text-sm)}.quiz-question__tts{width:38px;height:38px;font-size:1rem;margin-left:var(--space-2)}.quiz-option{padding:var(--space-3) var(--space-4);gap:var(--space-3);border-radius:var(--radius-lg)}.quiz-option__label{width:30px;height:30px;font-size:var(--text-xs)}.quiz-option:hover:not(.quiz-option--disabled){transform:none}.btn{padding:var(--space-3) var(--space-6);font-size:var(--text-sm)}.quiz-resume{flex-direction:column;gap:var(--space-3);align-items:stretch;padding:var(--space-4)}.quiz-resume__actions{justify-content:stretch}.quiz-resume__actions .btn{flex:1}.result{padding:var(--space-10) var(--space-4)}.result__emoji,.result__score{font-size:var(--text-4xl)}.result__label{font-size:var(--text-base);margin-bottom:var(--space-6)}.result__actions{flex-direction:column}.result__actions .btn{width:100%}.review-item{padding:var(--space-3) var(--space-4)}.review-item__question{font-size:var(--text-sm)}}@media(max-width:480px){.lesson-grid{grid-template-columns:repeat(auto-fill,minmax(115px,1fr));gap:var(--space-2)}.lesson-card{padding:var(--space-3)}.lesson-card__number,.quiz-question__prompt{font-size:var(--text-xl)}.quiz-option{padding:var(--space-3)}.quiz-option__text{font-size:var(--text-sm)}.header__inner{gap:var(--space-2)}.header__logo{font-size:var(--text-sm)}}@media(hover:none){.lesson-card:hover,.quiz-card:hover{transform:none}.quiz-option:hover:not(.quiz-option--disabled){transform:none}.btn--primary:hover{transform:none}}