:root{--animation-duration-fast:150ms;--animation-duration-normal:250ms;--animation-duration-slow:400ms;--animation-easing:cubic-bezier(0.4,0,0.2,1);--animation-easing-bounce:cubic-bezier(0.68,-0.55,0.265,1.55);--animation-easing-decelerate:cubic-bezier(0,0,0.2,1);--animation-easing-accelerate:cubic-bezier(0.4,0,1,1)}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes question-slide-in{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes question-slide-out{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-20px)}}.question-enter{animation:question-slide-in var(--animation-duration-normal) var(--animation-easing)}.question-exit{animation:question-slide-out var(--animation-duration-normal) var(--animation-easing)}@keyframes option-hover{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.02)}to{transform:translateY(-2px) scale(1.02)}}@keyframes option-select{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes option-correct{0%,to{background-color:var(--success-color);transform:scale(1)}25%{background-color:rgba(34,197,94,.9);transform:scale(1.02)}75%{background-color:#22c55e;transform:scale(1.02)}}@keyframes option-incorrect{0%,to{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}.option-button{transition:all var(--animation-duration-normal) var(--animation-easing)}.option-button:hover{animation:option-hover var(--animation-duration-normal) var(--animation-easing) forwards}.option-button.selecting{animation:option-select var(--animation-duration-fast) var(--animation-easing)}.option-button.feedback-correct{animation:option-correct .6s var(--animation-easing)}.option-button.feedback-incorrect{animation:option-incorrect .4s var(--animation-easing)}@keyframes progress-fill{0%{width:0;background-position:200% 0}to{width:var(--progress-width);background-position:-200% 0}}@keyframes progress-shine{0%{transform:translateX(-100%);opacity:0}50%{opacity:1}to{transform:translateX(100%);opacity:0}}.progress-bar-fill{animation:progress-fill .8s var(--animation-easing-decelerate);background:linear-gradient(90deg,var(--info-color) 25%,hsla(0,0%,100%,.3) 50%,var(--info-color) 75%);background-size:200% 100%}.progress-bar:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.4),transparent);animation:progress-shine 2s infinite}@keyframes counter-update{0%{transform:scale(1)}50%{transform:scale(1.1);color:var(--info-color)}to{transform:scale(1)}}.hud-counter{transition:all var(--animation-duration-fast) var(--animation-easing)}.hud-counter.updating{animation:counter-update var(--animation-duration-normal) var(--animation-easing)}@keyframes streak-burst{0%{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.2);filter:brightness(1.3)}to{transform:scale(1);filter:brightness(1)}}.streak-indicator{transition:all var(--animation-duration-normal) var(--animation-easing)}.streak-indicator.burst{animation:streak-burst .5s var(--animation-easing-bounce)}@keyframes hint-appear{0%{opacity:0;transform:translateY(-10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes hint-pulse{0%,to{background-color:rgba(59,130,246,.1);border-color:rgba(59,130,246,.3)}50%{background-color:rgba(59,130,246,.15);border-color:rgba(59,130,246,.5)}}.hint-container{animation:hint-appear var(--animation-duration-normal) var(--animation-easing)}.hint-text{animation:hint-pulse 2s ease-in-out infinite}@keyframes loading-spinner{to{transform:rotate(1turn)}}@keyframes loading-dots{0%,20%{opacity:0;transform:scale(.8)}50%{opacity:1;transform:scale(1)}80%,to{opacity:0;transform:scale(.8)}}.loading-spinner{animation:loading-spinner 1s linear infinite}.loading-dots span{animation:loading-dots 1.4s ease-in-out infinite both}.loading-dots span:first-child{animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}@keyframes srs-overlay-enter{0%{opacity:0;transform:scale(.9);backdrop-filter:blur(0)}to{opacity:1;transform:scale(1);backdrop-filter:blur(8px)}}@keyframes srs-button-hover{0%{transform:scale(1) translateY(0)}50%{transform:scale(1.05) translateY(-2px)}to{transform:scale(1.05) translateY(-2px)}}.srs-overlay{animation:srs-overlay-enter var(--animation-duration-slow) var(--animation-easing)}.srs-grade-button:hover{animation:srs-button-hover var(--animation-duration-normal) var(--animation-easing) forwards}@keyframes topbar-slide-down{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes badge-notification{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.integrated-topbar{animation:topbar-slide-down var(--animation-duration-normal) var(--animation-easing)}.notification-badge{animation:badge-notification .3s var(--animation-easing-bounce)}@keyframes input-focus{0%{box-shadow:0 0 0 0 rgba(59,130,246,0)}to{box-shadow:0 0 0 3px rgba(59,130,246,.1)}}.answer-input:focus{animation:input-focus var(--animation-duration-normal) var(--animation-easing)}@keyframes success-bounce{0%{transform:scale(1)}30%{transform:scale(1.1)}50%{transform:scale(.95)}70%{transform:scale(1.02)}to{transform:scale(1)}}@keyframes error-shake{0%,to{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-2px)}20%,40%,60%,80%{transform:translateX(2px)}}.feedback-success{animation:success-bounce .6s var(--animation-easing-bounce)}.feedback-error{animation:error-shake .4s var(--animation-easing)}@media (max-width:767px){.integrated-practice-container{padding:0;height:100vh;overflow:hidden}.question-area{min-height:45vh}.answer-area,.question-area{padding:1rem;display:flex;flex-direction:column;justify-content:center}.answer-area{min-height:55vh}.option-button{min-height:70px;margin-bottom:.75rem;font-weight:500}.answer-input,.option-button{padding:1.25rem;font-size:16px;border-radius:12px}.answer-input{min-height:56px}.topbar-button .button-text{display:none}.topbar-button{min-width:44px;min-height:44px;padding:8px}.hud-display{font-size:.75rem;gap:.5rem;flex-wrap:wrap;justify-content:center}.hud-display .progress-bar{width:80px;order:-1;flex-basis:100%;margin-bottom:.5rem}.mode-selector{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:4px}.mode-selector::-webkit-scrollbar{display:none}.mode-selector .mode-button{min-width:80px;white-space:nowrap}.srs-overlay .srs-content{margin:1rem;max-height:90vh;overflow-y:auto}.srs-grade-buttons{grid-template-columns:1fr 1fr;gap:.75rem}.session-summary{margin:1rem;max-height:90vh;overflow-y:auto}.session-summary .stats-grid{grid-template-columns:1fr 1fr}.session-summary .action-buttons{flex-direction:column;gap:.75rem}}@media (min-width:768px) and (max-width:1023px){.integrated-practice-container{grid-template-columns:1fr;grid-template-rows:auto 1fr;height:100vh}.question-area{order:1;min-height:40vh;padding:1.5rem}.answer-area{order:2;min-height:60vh;padding:1.5rem}.option-button{padding:1rem;font-size:16px;min-height:60px}.hud-display{font-size:.875rem;gap:.75rem}.preference-controls{flex-direction:column;gap:.5rem}}@media (min-width:1280px){.answer-area,.question-area{padding:3rem}.option-button{padding:1.75rem;font-size:18px;min-height:80px}.question-title{font-size:3rem}.answer-input{padding:1.5rem;font-size:18px}.hud-display{font-size:1rem;gap:1.5rem}.hud-display .progress-bar{width:160px}}@media (min-width:1920px){.integrated-practice-container{max-width:1600px;margin:0 auto}.answer-area,.question-area{padding:4rem}}@media (hover:none) and (pointer:coarse){.option-button:hover{transform:none}.option-button:active{transform:scale(.98);background-color:var(--info-bg)}.touch-feedback{-webkit-tap-highlight-color:rgba(59,130,246,.2)}.action-button,.topbar-button{min-width:44px;min-height:44px}.swipe-area{touch-action:pan-x}.pinch-zoom-disabled{touch-action:manipulation}}@media (max-width:896px) and (orientation:landscape){.integrated-practice-container{grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr}.question-area{order:1}.answer-area,.question-area{min-height:calc(100vh - 64px)}.answer-area{order:2}.practice-topbar{height:56px;padding:0 1rem}.practice-topbar .mode-selector,.practice-topbar .preference-controls{display:none}.floating-controls{position:fixed;top:50%;right:1rem;transform:translateY(-50%);display:flex;flex-direction:column;gap:.5rem;z-index:40}}@media (prefers-contrast:high){.option-button{border-width:3px;font-weight:600}.option-button:focus{outline:4px solid;outline-offset:2px}.progress-bar{border:2px solid}.session-summary,.srs-overlay{border-width:3px}.status-indicator{border:2px solid}}@media (prefers-color-scheme:dark){.option-button{box-shadow:0 1px 3px rgba(0,0,0,.4)}.progress-bar-fill{background:linear-gradient(90deg,#7c3aed 25%,hsla(0,0%,100%,.2) 50%,#7c3aed 75%)}.session-summary,.srs-overlay{background:rgba(10,14,19,.95);backdrop-filter:blur(20px)}}@media (prefers-reduced-motion:reduce){.hud-counter,.option-button,.progress-bar-fill,.streak-indicator{transition:none!important;animation:none!important}.question-enter,.question-exit{animation:none!important}}@media (display-mode:standalone){.practice-topbar{padding-top:env(safe-area-inset-top)}.integrated-practice-container{height:100vh;height:100dvh}.floating-controls{bottom:calc(1rem + env(safe-area-inset-bottom))}}@media (screen-spanning:single-fold-vertical){.integrated-practice-container{grid-template-columns:1fr 1fr}}.focus-visible{outline:2px solid var(--info-color);outline-offset:2px;border-radius:4px}.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}.skip-link{position:absolute;top:-40px;left:6px;background:var(--bg-primary);color:var(--text-primary);padding:8px;text-decoration:none;border-radius:4px;z-index:1000}.skip-link:focus{top:6px}.animate-fast{animation-duration:var(--animation-duration-fast)!important}.animate-normal{animation-duration:var(--animation-duration-normal)!important}.animate-slow{animation-duration:var(--animation-duration-slow)!important}.transition-all{transition:all var(--animation-duration-normal) var(--animation-easing)}.transition-colors{transition:color,background-color,border-color var(--animation-duration-normal) var(--animation-easing)}.transition-transform{transition:transform var(--animation-duration-normal) var(--animation-easing)}.shadow-soft{box-shadow:0 2px 8px rgba(0,0,0,.1)}.shadow-medium{box-shadow:0 4px 12px rgba(0,0,0,.15)}.shadow-strong{box-shadow:0 8px 24px rgba(0,0,0,.2)}.backdrop-blur-soft{backdrop-filter:blur(4px)}.backdrop-blur-medium{backdrop-filter:blur(8px)}.backdrop-blur-strong{backdrop-filter:blur(16px)}.gradient-primary{background:linear-gradient(135deg,var(--info-color),var(--success-color))}.gradient-secondary{background:linear-gradient(135deg,var(--bg-secondary),var(--bg-card))}.gpu-accelerated{transform:translateZ(0);will-change:transform,opacity}.keyboard-practice-input,.keyboard-practice-input:-webkit-autofill,.keyboard-practice-input:-webkit-autofill:after,.keyboard-practice-input:-webkit-autofill:before,.keyboard-practice-input:after,.keyboard-practice-input:before{border-bottom:0 transparent!important;text-decoration:none!important;text-decoration-line:none!important;text-underline-offset:none!important;text-underline-position:none!important;box-shadow:none!important;outline:none!important;-webkit-box-shadow:none!important;-moz-box-shadow:none!important}