:root{--lesson-primary:#3B82F6;--lesson-primary-dark:#1E40AF;--lesson-secondary:#8B5CF6;--lesson-secondary-dark:#6D28D9;--lesson-success:#10B981;--lesson-success-light:#ECFDF5;--lesson-success-dark:#047857;--lesson-warning:#F59E0B;--lesson-warning-light:#FFFBEB;--lesson-warning-dark:#D97706;--lesson-error:#EF4444;--lesson-error-light:#FEF2F2;--lesson-error-dark:#DC2626;--glass-overlay-light:rgba(255,255,255,0.12);--glass-overlay-strong:rgba(255,255,255,0.18);--glass-border-light:rgba(255,255,255,0.15);--glass-border-strong:rgba(255,255,255,0.25);--glass-backdrop-blur:20px;--glass-backdrop-blur-strong:32px;--glass-overlay-dark-light:rgba(17,25,40,0.65);--glass-overlay-dark-strong:rgba(17,25,40,0.85);--glass-border-dark:rgba(255,255,255,0.08);--glass-border-dark-strong:rgba(255,255,255,0.15);--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--line-height-none:1;--line-height-tight:1.25;--line-height-snug:1.375;--line-height-normal:1.5;--line-height-relaxed:1.625;--line-height-loose:2;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--shadow-1:0 1px 3px 0 rgba(0,0,0,0.08),0 1px 2px 0 rgba(0,0,0,0.04);--shadow-2:0 4px 6px -1px rgba(0,0,0,0.08),0 2px 4px -1px rgba(0,0,0,0.04);--shadow-3:0 10px 15px -3px rgba(0,0,0,0.08),0 4px 6px -2px rgba(0,0,0,0.03);--shadow-4:0 25px 50px -12px rgba(0,0,0,0.12),0 8px 16px -4px rgba(0,0,0,0.04);--shadow-1-dark:0 1px 3px 0 rgba(0,0,0,0.3),0 1px 2px 0 rgba(0,0,0,0.2);--shadow-2-dark:0 4px 6px -1px rgba(0,0,0,0.4),0 2px 4px -1px rgba(0,0,0,0.3);--shadow-3-dark:0 10px 15px -3px rgba(0,0,0,0.5),0 4px 6px -2px rgba(0,0,0,0.4);--shadow-4-dark:0 25px 50px -12px rgba(0,0,0,0.7),0 8px 16px -4px rgba(0,0,0,0.5);--space-1:0.25rem;--space-2:0.5rem;--space-3:0.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;--space-20:5rem;--radius-xs:0.125rem;--radius-sm:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-full:9999px;--transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--transition-normal:250ms cubic-bezier(0.4,0,0.2,1);--transition-slow:350ms cubic-bezier(0.4,0,0.2,1);--transition-spring:500ms cubic-bezier(0.175,0.885,0.32,1.275);--content-width-sm:640px;--content-width-md:768px;--content-width-lg:1024px;--z-dropdown:1000;--z-sticky:1020;--z-fixed:1030;--z-modal-backdrop:1040;--z-modal:1050;--z-popover:1060;--z-tooltip:1070;--z-toast:1080}.glass-card{background:var(--glass-overlay-light);backdrop-filter:blur(var(--glass-backdrop-blur));-webkit-backdrop-filter:blur(var(--glass-backdrop-blur));border:1px solid var(--glass-border-light);border-radius:var(--radius-2xl);box-shadow:var(--shadow-2)}.glass-card,.glass-card-strong{transition:all var(--transition-normal)}.glass-card-strong{background:var(--glass-overlay-strong);backdrop-filter:blur(var(--glass-backdrop-blur-strong));-webkit-backdrop-filter:blur(var(--glass-backdrop-blur-strong));border:1px solid var(--glass-border-strong);border-radius:var(--radius-2xl);box-shadow:var(--shadow-3)}.glass-card-strong:hover,.glass-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-4);background:var(--glass-overlay-strong)}.dark .glass-card{background:var(--glass-overlay-dark-light);border:1px solid var(--glass-border-dark);box-shadow:var(--shadow-2-dark)}.dark .glass-card-strong{background:var(--glass-overlay-dark-strong);border:1px solid var(--glass-border-dark-strong);box-shadow:var(--shadow-3-dark)}.dark .glass-card-strong:hover,.dark .glass-card:hover{box-shadow:var(--shadow-4-dark);background:var(--glass-overlay-dark-strong)}.elevation-0{box-shadow:none}.elevation-1{box-shadow:var(--shadow-1)}.elevation-2{box-shadow:var(--shadow-2)}.elevation-3{box-shadow:var(--shadow-3)}.elevation-4{box-shadow:var(--shadow-4)}.dark .elevation-1{box-shadow:var(--shadow-1-dark)}.dark .elevation-2{box-shadow:var(--shadow-2-dark)}.dark .elevation-3{box-shadow:var(--shadow-3-dark)}.dark .elevation-4{box-shadow:var(--shadow-4-dark)}.elevation-hover-1:hover{box-shadow:var(--shadow-2)}.elevation-hover-2:hover{box-shadow:var(--shadow-3)}.elevation-hover-3:hover{box-shadow:var(--shadow-4)}.dark .elevation-hover-1:hover{box-shadow:var(--shadow-2-dark)}.dark .elevation-hover-2:hover{box-shadow:var(--shadow-3-dark)}.dark .elevation-hover-3:hover{box-shadow:var(--shadow-4-dark)}.text-lesson-xs{font-size:var(--font-size-xs);line-height:var(--line-height-tight);font-weight:var(--font-weight-medium)}.text-lesson-sm{font-size:var(--font-size-sm);line-height:var(--line-height-normal)}.text-lesson-base,.text-lesson-sm{font-weight:var(--font-weight-normal)}.text-lesson-base{font-size:var(--font-size-base);line-height:var(--line-height-relaxed)}.text-lesson-lg{font-size:var(--font-size-lg);line-height:var(--line-height-normal)}.text-lesson-lg,.text-lesson-xl{font-weight:var(--font-weight-medium)}.text-lesson-xl{font-size:var(--font-size-xl);line-height:var(--line-height-snug)}.text-lesson-2xl{font-size:var(--font-size-2xl)}.text-lesson-2xl,.text-lesson-3xl{line-height:var(--line-height-tight);font-weight:var(--font-weight-semibold)}.text-lesson-3xl{font-size:var(--font-size-3xl)}.text-lesson-4xl{font-size:var(--font-size-4xl);line-height:var(--line-height-none);font-weight:var(--font-weight-bold);letter-spacing:-.025em}.text-success{color:var(--lesson-success)}.bg-success{background-color:var(--lesson-success)}.bg-success-light{background-color:var(--lesson-success-light)}.border-success{border-color:var(--lesson-success)}.text-warning{color:var(--lesson-warning)}.bg-warning{background-color:var(--lesson-warning)}.bg-warning-light{background-color:var(--lesson-warning-light)}.border-warning{border-color:var(--lesson-warning)}.text-error{color:var(--lesson-error)}.bg-error{background-color:var(--lesson-error)}.bg-error-light{background-color:var(--lesson-error-light)}.border-error{border-color:var(--lesson-error)}.text-primary{color:var(--lesson-primary)}.bg-primary{background-color:var(--lesson-primary)}.border-primary{border-color:var(--lesson-primary)}.text-secondary{color:var(--lesson-secondary)}.bg-secondary{background-color:var(--lesson-secondary)}.border-secondary{border-color:var(--lesson-secondary)}.lesson-container{max-width:var(--content-width-md);margin:0 auto;padding:var(--space-6)}.lesson-section{margin-bottom:var(--space-12)}.lesson-section:last-child{margin-bottom:0}.lesson-header{text-align:center;margin-bottom:var(--space-16)}.lesson-content{display:flex;flex-direction:column;gap:var(--space-8)}.content-card{padding:var(--space-8);border-radius:var(--radius-2xl);margin-bottom:var(--space-6)}.content-card-sm{padding:var(--space-6);border-radius:var(--radius-xl)}.content-card-lg{padding:var(--space-10);border-radius:var(--radius-3xl)}.interactive-element{transition:all var(--transition-normal);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.interactive-element:hover{transform:translateY(-1px)}.interactive-element:active{transform:translateY(0);transition:all var(--transition-fast)}.lesson-button{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-3) var(--space-6);border-radius:var(--radius-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);line-height:var(--line-height-none);transition:all var(--transition-normal);border:none;cursor:pointer;position:relative;overflow:hidden}.lesson-button-primary{background:linear-gradient(135deg,var(--lesson-primary) 0,var(--lesson-primary-dark) 100%);color:white;box-shadow:var(--shadow-2)}.lesson-button-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-3)}.lesson-button-secondary{background:var(--glass-overlay-light);backdrop-filter:blur(var(--glass-backdrop-blur));-webkit-backdrop-filter:blur(var(--glass-backdrop-blur));border:1px solid var(--glass-border-light);color:var(--lesson-primary)}.lesson-button-secondary:hover{background:var(--glass-overlay-strong);transform:translateY(-1px);box-shadow:var(--shadow-2)}.progress-container{width:100%;height:8px;background-color:var(--glass-overlay-light);overflow:hidden}.progress-bar,.progress-container{position:relative;border-radius:var(--radius-full)}.progress-bar{height:100%;background:linear-gradient(90deg,var(--lesson-primary) 0,var(--lesson-secondary) 100%);transition:width var(--transition-spring)}.progress-bar:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3) 50%,transparent);animation:progress-shine 2s infinite}@keyframes progress-shine{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}.progress-ring{width:120px;height:120px;position:relative}.progress-ring-background{fill:none;stroke:var(--glass-overlay-light);stroke-width:8}.progress-ring-progress{fill:none;stroke:url(#progressGradient);stroke-width:8;stroke-linecap:round;stroke-dasharray:283;stroke-dashoffset:283;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset var(--transition-spring)}.clause-highlight{position:relative;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);transition:all var(--transition-normal);margin:0 var(--space-1);display:inline-block}.clause-highlight:hover{transform:translateY(-1px);box-shadow:var(--shadow-2)}.clause-independent{background:linear-gradient(135deg,rgba(59,130,246,.15),rgba(59,130,246,.05));border-left:4px solid var(--lesson-primary);border-bottom:2px solid var(--lesson-primary)}.clause-independent:hover{background:linear-gradient(135deg,rgba(59,130,246,.25),rgba(59,130,246,.15));box-shadow:0 4px 12px rgba(59,130,246,.3)}.clause-dependent{background:linear-gradient(135deg,rgba(139,92,246,.15),rgba(139,92,246,.05));border-left:4px solid var(--lesson-secondary);border-bottom:2px solid var(--lesson-secondary)}.clause-dependent:hover{background:linear-gradient(135deg,rgba(139,92,246,.25),rgba(139,92,246,.15));box-shadow:0 4px 12px rgba(139,92,246,.3)}.punctuation-choice{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:var(--space-2) var(--space-3);border-radius:var(--radius-xl);border:2px solid var(--glass-border-light);background:var(--glass-overlay-light);backdrop-filter:blur(var(--glass-backdrop-blur));-webkit-backdrop-filter:blur(var(--glass-backdrop-blur));cursor:pointer;transition:all var(--transition-normal);font-weight:var(--font-weight-bold);font-size:var(--font-size-lg);position:relative;overflow:hidden}.punctuation-choice:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left var(--transition-slow)}.punctuation-choice:hover{transform:scale(1.05) translateY(-2px);box-shadow:var(--shadow-3)}.punctuation-choice:hover:before{left:100%}.punctuation-choice.selected{background:linear-gradient(135deg,var(--lesson-primary) 0,var(--lesson-primary-dark) 100%);border-color:var(--lesson-primary-dark);color:white;transform:scale(1.02);box-shadow:var(--shadow-2)}.punctuation-choice.correct{background:linear-gradient(135deg,var(--lesson-success) 0,var(--lesson-success-dark) 100%);border-color:var(--lesson-success-dark);color:white;animation:success-glow .6s ease-out}.punctuation-choice.incorrect{background:linear-gradient(135deg,var(--lesson-error) 0,var(--lesson-error-dark) 100%);border-color:var(--lesson-error-dark);color:white;animation:error-shake .5s ease-out}.grammar-element{position:relative;display:inline-block;padding:var(--space-1) var(--space-2);margin:0 1px;border-radius:var(--radius-sm);transition:all var(--transition-normal);cursor:pointer}.grammar-element:hover{transform:translateY(-1px) scale(1.01);z-index:10}.grammar-element.subject{background:linear-gradient(135deg,rgba(34,197,94,.15),rgba(34,197,94,.05));border-bottom:3px solid var(--lesson-success);color:var(--lesson-success-dark)}.grammar-element.subject:hover{background:linear-gradient(135deg,rgba(34,197,94,.25),rgba(34,197,94,.15));box-shadow:0 4px 12px rgba(34,197,94,.3)}.grammar-element.predicate{background:linear-gradient(135deg,rgba(59,130,246,.15),rgba(59,130,246,.05));border-bottom:3px solid var(--lesson-primary);color:var(--lesson-primary-dark)}.grammar-element.predicate:hover{background:linear-gradient(135deg,rgba(59,130,246,.25),rgba(59,130,246,.15));box-shadow:0 4px 12px rgba(59,130,246,.3)}.grammar-element.modifier{background:linear-gradient(135deg,rgba(245,158,11,.15),rgba(245,158,11,.05));border-bottom:3px solid var(--lesson-warning);color:var(--lesson-warning-dark)}.grammar-element.modifier:hover{background:linear-gradient(135deg,rgba(245,158,11,.25),rgba(245,158,11,.15));box-shadow:0 4px 12px rgba(245,158,11,.3)}.grammar-element.conjunction{background:linear-gradient(135deg,rgba(139,92,246,.15),rgba(139,92,246,.05));border-bottom:3px solid var(--lesson-secondary);color:var(--lesson-secondary)}.grammar-element.conjunction:hover{background:linear-gradient(135deg,rgba(139,92,246,.25),rgba(139,92,246,.15));box-shadow:0 4px 12px rgba(139,92,246,.3)}.text-morph{position:relative;display:inline-block;overflow:hidden}.text-morph-enter{opacity:0;transform:translateY(10px) scale(.95);filter:blur(2px)}.text-morph-enter-active{transition:all var(--transition-slow) ease-out}.text-morph-enter-active,.text-morph-exit{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}.text-morph-exit-active{opacity:0;transform:translateY(-10px) scale(.95);filter:blur(2px);transition:all var(--transition-slow) ease-in}.pattern-match{position:relative;background:linear-gradient(135deg,var(--lesson-success-light) 0,rgba(34,197,94,.1) 100%);border:2px solid var(--lesson-success);border-radius:var(--radius-lg);animation:pattern-glow 1.5s ease-in-out infinite}.pattern-mismatch{background:linear-gradient(135deg,var(--lesson-error-light) 0,rgba(239,68,68,.1) 100%);border:2px solid var(--lesson-error);border-radius:var(--radius-lg);animation:error-pulse 2s ease-in-out infinite}.sentence-transformation{position:relative;padding:var(--space-4);border-radius:var(--radius-xl);overflow:hidden}.sentence-transformation:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(59,130,246,.1) 20%,rgba(139,92,246,.1) 50%,rgba(34,197,94,.1) 80%,transparent);animation:transformation-sweep 3s ease-in-out infinite}@keyframes success-glow{0%{transform:scale(1);box-shadow:0 0 0 0 rgba(34,197,94,.7)}50%{transform:scale(1.05);box-shadow:0 0 0 10px rgba(34,197,94,0)}to{transform:scale(1);box-shadow:0 0 0 0 rgba(34,197,94,0)}}@keyframes error-shake{0%,to{transform:translateX(0)}10%{transform:translateX(-3px) rotate(-1deg)}20%{transform:translateX(3px) rotate(1deg)}30%{transform:translateX(-3px) rotate(-1deg)}40%{transform:translateX(3px) rotate(1deg)}50%{transform:translateX(-2px) rotate(-.5deg)}60%{transform:translateX(2px) rotate(.5deg)}70%{transform:translateX(-1px) rotate(-.25deg)}80%{transform:translateX(1px) rotate(.25deg)}90%{transform:translateX(-.5px)}}@keyframes pattern-glow{0%,to{box-shadow:0 0 5px rgba(34,197,94,.5)}50%{box-shadow:0 0 15px rgba(34,197,94,.8)}}@keyframes error-pulse{0%,to{border-color:var(--lesson-error);background:linear-gradient(135deg,var(--lesson-error-light) 0,rgba(239,68,68,.1) 100%)}50%{border-color:var(--lesson-error-dark);background:linear-gradient(135deg,rgba(239,68,68,.2),rgba(239,68,68,.05))}}@keyframes transformation-sweep{0%{left:-100%}50%{left:0}to{left:100%}}.feedback-enter{opacity:0;transform:translateY(20px) scale(.9)}.feedback-enter-active{opacity:1;transform:translateY(0) scale(1);transition:all var(--transition-spring)}.feedback-slide-up{animation:slideUpFeedback var(--transition-slow) ease-out}@keyframes slideUpFeedback{0%{opacity:0;transform:translateY(30px) scale(.95);filter:blur(3px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}.completeness-indicator{position:relative;display:inline-block;width:12px;height:12px;border-radius:50%;margin:0 var(--space-1);transition:all var(--transition-normal)}.completeness-indicator.complete{background:var(--lesson-success);box-shadow:0 0 0 3px rgba(34,197,94,.2);animation:completeness-pulse 2s infinite}.completeness-indicator.incomplete{background:var(--lesson-error);box-shadow:0 0 0 3px rgba(239,68,68,.2)}.completeness-indicator.fragment{background:var(--lesson-warning);box-shadow:0 0 0 3px rgba(245,158,11,.2)}@keyframes completeness-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}}.comparison-container{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);margin:var(--space-8) 0}.comparison-side{padding:var(--space-6);border-radius:var(--radius-xl);position:relative}.comparison-before{background:var(--lesson-error-light);border:2px solid var(--lesson-error)}.comparison-after{background:var(--lesson-success-light);border:2px solid var(--lesson-success)}.comparison-label{position:absolute;top:var(--space-2);left:var(--space-4);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.05em}.comparison-before .comparison-label{background:var(--lesson-error);color:white}.comparison-after .comparison-label{background:var(--lesson-success);color:white}@media (max-width:480px){:root{--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.375rem;--font-size-3xl:1.625rem;--font-size-4xl:1.875rem;--space-mobile-xs:0.25rem;--space-mobile-sm:0.5rem;--space-mobile-md:0.75rem;--space-mobile-lg:1rem;--space-mobile-xl:1.5rem;--space-mobile-2xl:2rem;--touch-target-min:44px;--touch-area-padding:12px}.lesson-container{padding:var(--space-mobile-md);padding-left:var(--space-mobile-lg);padding-right:var(--space-mobile-md)}.content-card{padding:var(--space-mobile-lg);border-radius:var(--radius-lg);box-shadow:var(--shadow-1)}.content-card-sm{padding:var(--space-mobile-md)}.content-card-lg{padding:var(--space-mobile-xl)}.lesson-button{padding:var(--space-mobile-md) var(--space-mobile-xl);font-size:var(--font-size-base);min-height:var(--touch-target-min);transform-origin:center;transition:all .1s cubic-bezier(.34,1.56,.64,1)}.lesson-button:active{transform:scale(.96);transition:all .05s ease-out}.text-lesson-4xl{font-size:var(--font-size-4xl);line-height:1.15;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}.text-lesson-3xl{font-size:var(--font-size-3xl);line-height:1.2}.text-lesson-2xl{font-size:var(--font-size-2xl);line-height:1.25}.comparison-container{grid-template-columns:1fr;gap:var(--space-mobile-lg)}.progress-container{height:8px;border-radius:var(--radius-full);box-shadow:inset 0 1px 3px rgba(0,0,0,.1)}.progress-ring{width:80px;height:80px}.punctuation-choice{min-width:var(--touch-target-min);min-height:var(--touch-target-min);font-size:var(--font-size-lg);touch-action:manipulation}.punctuation-choice:active{transform:scale(.94) translateY(1px)}.clause-highlight,.grammar-element{padding:var(--space-mobile-sm) var(--space-mobile-md);margin:0 var(--space-mobile-xs);min-height:32px;display:inline-flex;align-items:center}.glass-card{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.glass-card-strong{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}}@media (min-width:481px) and (max-width:768px){.lesson-container{padding:var(--space-5);max-width:90vw}.content-card{padding:var(--space-6)}.content-card-lg{padding:var(--space-8)}.text-lesson-4xl{font-size:2.25rem}.text-lesson-3xl{font-size:1.875rem}.comparison-container{grid-template-columns:1fr 1fr;gap:var(--space-6)}.progress-ring{width:100px;height:100px}}@media (min-width:769px){.lesson-container{padding:var(--space-6)}.lesson-header{margin-bottom:var(--space-16)}.interactive-element:hover{transform:translateY(-2px)}.lesson-button:hover{transform:translateY(-1px)}}@media (min-resolution:2dppx){.glass-card,.glass-card-strong{border-width:.5px}.progress-bar,.progress-ring-progress{background-image:linear-gradient(90deg,var(--lesson-primary) 0,var(--lesson-secondary) 50%,var(--lesson-primary) 100%)}}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.progress-bar:after{animation:none}.glass-card,.glass-card-strong{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(255,255,255,.9)!important}.dark .glass-card,.dark .glass-card-strong{background:rgba(17,25,40,.9)!important}}.glass-card,.interactive-element,.lesson-button,.progress-bar,.progress-ring,.punctuation-choice{will-change:transform,opacity;transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0)}@media (max-width:768px){.interactive-element,.lesson-button,.punctuation-choice{transition-property:transform,opacity,box-shadow;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.glass-card{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.glass-card-strong{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}}@media (max-width:480px){.elevation-2,.elevation-3,.elevation-4{box-shadow:0 2px 8px rgba(0,0,0,.1)}.lesson-button:hover,.punctuation-choice:hover{transform:none;box-shadow:inherit}.lesson-button:active,.punctuation-choice:active{transform:scale(.96);transition-duration:.05s}}@media (min-resolution:120dpi) and (min-width:769px){.interactive-element,.lesson-button,.punctuation-choice{transition-duration:.2s;transition-timing-function:cubic-bezier(.23,1,.32,1)}}.loading-skeleton{background:linear-gradient(90deg,rgba(255,255,255,.1) 25%,rgba(255,255,255,.2) 50%,rgba(255,255,255,.1) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:var(--radius-lg)}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.lazy-load-trigger{min-height:1px;opacity:0;transform:translateY(20px);transition:all .3s ease-out}.lazy-load-trigger.loaded{opacity:1;transform:translateY(0)}.optimistic-update{opacity:.7;transition:opacity .2s ease-out}.optimistic-update.confirmed{opacity:1}@media (prefers-reduced-motion:reduce) and (max-width:768px){.glass-card,.glass-card-strong{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,255,255,.95);border:1px solid rgba(0,0,0,.1)}.dark .glass-card,.dark .glass-card-strong{background:rgba(17,25,40,.95);border:1px solid rgba(255,255,255,.1)}.lesson-button,.punctuation-choice{box-shadow:none;background:var(--lesson-primary);color:white}.lesson-button:active,.punctuation-choice:active{opacity:.8;transform:none}}.focus-visible:focus-visible{outline:2px solid var(--lesson-primary);outline-offset:2px;border-radius:var(--radius-sm)}.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}.space-y-2>*+*{margin-top:var(--space-2)}.space-y-4>*+*{margin-top:var(--space-4)}.space-y-6>*+*{margin-top:var(--space-6)}.space-y-8>*+*{margin-top:var(--space-8)}.flex-center{justify-content:center}.flex-between,.flex-center{display:flex;align-items:center}.flex-between{justify-content:space-between}.flex-start{display:flex;align-items:center;justify-content:flex-start}.animate-fade-in{opacity:0;animation:fadeIn var(--transition-normal) ease-out forwards}.animate-slide-up{transform:translateY(20px);opacity:0;animation:slideUp var(--transition-normal) ease-out forwards}.animate-scale-in{transform:scale(.9);opacity:0;animation:scaleIn var(--transition-normal) ease-out forwards}@keyframes fadeIn{to{opacity:1}}@keyframes slideUp{to{transform:translateY(0);opacity:1}}@keyframes scaleIn{to{transform:scale(1);opacity:1}}::selection{background-color:var(--lesson-primary);color:white}::-moz-selection{background-color:var(--lesson-primary);color:white}