@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap";@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap";body{margin:0}#root{min-height:100vh}*{box-sizing:border-box;margin:0;padding:0}body{color:#fff;-webkit-font-smoothing:antialiased;background:linear-gradient(135deg,#0f0c29 0%,#302b63 50%,#24243e 100%) fixed;min-height:100vh;font-family:Inter,-apple-system,sans-serif}body:before,body:after{content:"";filter:blur(80px);opacity:.18;pointer-events:none;z-index:0;border-radius:50%;position:fixed}body:before{background:radial-gradient(circle,#7c3aed,#0000);width:500px;height:500px;top:-100px;left:-100px}body:after{background:radial-gradient(circle,#06b6d4,#0000);width:400px;height:400px;bottom:-80px;right:-80px}.app{z-index:1;flex-direction:column;gap:14px;max-width:600px;min-height:100vh;margin:0 auto;padding:20px 16px 48px;display:flex;position:relative}.glass{-webkit-backdrop-filter:blur(20px);background:#ffffff12;border:1px solid #ffffff1f;border-radius:16px}.header-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.logo{background:linear-gradient(90deg,#a78bfa,#60a5fa,#34d399);-webkit-text-fill-color:transparent;letter-spacing:-.5px;-webkit-background-clip:text;background-clip:text;font-size:1.8rem;font-weight:900}.header-right{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;display:flex}.streak-badge{color:#fff;white-space:nowrap;background:linear-gradient(135deg,#f59e0b,#ef4444);border-radius:20px;padding:5px 12px;font-size:.82rem;font-weight:800;box-shadow:0 4px 14px #f59e0b66}.user-name{color:#ffffffd9;font-size:.82rem;font-weight:600}.logout-btn{color:#ffffffa6;cursor:pointer;background:#ffffff14;border:1px solid #fff3;border-radius:20px;padding:5px 14px;font-size:.8rem;font-weight:600;transition:all .2s}.logout-btn:hover{color:#fca5a5;background:#ef444433;border-color:#ef444480}.subtitle{color:#ffffffa6;margin-top:2px;font-size:.82rem}.category-bar{flex-wrap:wrap;gap:7px;display:flex}.cat-btn{color:#ffffffd9;cursor:pointer;background:#ffffff1a;border:1px solid #ffffff40;border-radius:20px;padding:6px 14px;font-size:.78rem;font-weight:600;transition:all .2s}.cat-btn:hover{color:#c4b5fd;background:#a78bfa26;border-color:#a78bfab3}.cat-btn.active{color:#fff;background:linear-gradient(135deg,#7c3aed,#3b82f6);border-color:#0000;box-shadow:0 4px 14px #7c3aed66}.search-wrap{align-items:center;display:flex;position:relative}.search-icon{pointer-events:none;opacity:.5;font-size:.95rem;position:absolute;left:14px}.search-input{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;background:#ffffff12;border:1px solid #ffffff1f;border-radius:14px;outline:none;width:100%;padding:11px 36px;font-size:.9rem;transition:border-color .2s,background .2s}.search-input::placeholder{color:#ffffff4d}.search-input:focus{background:#ffffff1a;border-color:#a78bfa99}.search-clear{color:#ffffff59;cursor:pointer;background:0 0;border:none;padding:4px;font-size:.85rem;position:absolute;right:12px}.search-clear:hover{color:#ffffffb3}.controls-row{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff0f;border:1px solid #ffffff1a;border-radius:16px;justify-content:space-between;align-items:center;padding:16px;display:flex}.toggles{flex-direction:column;gap:14px;display:flex}.toggle-label{cursor:pointer;color:#ffffffe6;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;font-size:.85rem;font-weight:600;display:flex}.toggle-switch{cursor:pointer;background:#ffffff26;border-radius:12px;flex-shrink:0;width:44px;height:24px;transition:background .25s;position:relative}.toggle-switch.on{background:linear-gradient(135deg,#7c3aed,#3b82f6)}.toggle-thumb{background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .25s;position:absolute;top:3px;left:3px;box-shadow:0 2px 6px #0000004d}.toggle-switch.on .toggle-thumb{transform:translate(20px)}.ring-section{flex-direction:column;align-items:center;gap:4px;display:flex}.ring-wrap{width:80px;height:80px;position:relative}.ring-label{flex-direction:column;justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;inset:0}.ring-num{background:linear-gradient(135deg,#a78bfa,#60a5fa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.4rem;font-weight:900}.ring-sub{color:#ffffffa6;font-size:.62rem;font-weight:600}.ring-caption{color:#ffffffa6;text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;font-weight:700}.stats-row{justify-content:space-between;font-size:.82rem;font-weight:700;display:flex}.stat.known{color:#34d399}.stat.learning{color:#fbbf24}.stat.remaining{color:#ffffffb3}.progress-bar-wrap{background:#ffffff1a;border-radius:4px;height:5px;overflow:hidden}.progress-bar{background:linear-gradient(90deg,#7c3aed,#3b82f6,#06b6d4);border-radius:4px;height:100%;transition:width .4s;box-shadow:0 0 8px #7c3aed99}.resume-banner{color:#93c5fd;background:#60a5fa1f;border:1px solid #60a5fa4d;border-radius:12px;justify-content:space-between;align-items:center;padding:10px 16px;font-size:.82rem;font-weight:500;animation:.3s fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.reset-link{color:#f87171;cursor:pointer;white-space:nowrap;background:0 0;border:none;font-size:.8rem;font-weight:700}.reset-link:hover{text-decoration:underline}.flashcard{perspective:1200px;cursor:pointer;-webkit-user-select:none;user-select:none;height:320px}.flashcard.border-known .card-front{border-color:#34d39980;box-shadow:0 0 0 1px #34d3994d,0 20px 60px #0006}.flashcard.border-learning .card-front{border-color:#fbbf2480;box-shadow:0 0 0 1px #fbbf244d,0 20px 60px #0006}.card-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.4,0,.2,1);position:relative}.flashcard.flipped .card-inner{transform:rotateY(180deg)}.card-front,.card-back{backface-visibility:hidden;border-radius:24px;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:28px 24px;display:flex;position:absolute;inset:0}.card-front{-webkit-backdrop-filter:blur(30px);background:#ffffff1a;border:1px solid #ffffff2e;box-shadow:0 20px 60px #0006,inset 0 1px #ffffff1a}.card-back{color:#fff;background:linear-gradient(135deg,#7c3aed 0%,#3b82f6 60%,#06b6d4 100%);border:1px solid #ffffff26;transform:rotateY(180deg);box-shadow:0 20px 60px #7c3aed80}.card-top-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.card-category{text-transform:uppercase;letter-spacing:.12em;color:#ffffffbf;background:#ffffff1f;border:1px solid #ffffff2e;border-radius:8px;padding:3px 10px;font-size:.68rem;font-weight:700}.card-badge{text-transform:uppercase;letter-spacing:.08em;border-radius:8px;padding:3px 10px;font-size:.68rem;font-weight:700}.card-badge.known{color:#34d399;background:#34d39933;border:1px solid #34d3994d}.card-badge.learning{color:#fbbf24;background:#fbbf2433;border:1px solid #fbbf244d}.card-label-small{text-transform:uppercase;letter-spacing:.1em;color:#ffffffa6;font-size:.68rem;font-weight:600}.card-word{color:#fff;text-align:center;letter-spacing:-1px;text-shadow:0 2px 20px #0000004d;font-size:2.8rem;font-weight:900;line-height:1.05}.card-ipa{color:#a78bfa;letter-spacing:.03em;font-size:1rem;font-style:italic;font-weight:500}.card-hint{color:#ffffff8c;font-size:.78rem}.card-label{text-transform:uppercase;letter-spacing:.1em;opacity:.7;font-size:.72rem;font-weight:700}.card-translation{text-align:center;letter-spacing:-.5px;font-size:2.2rem;font-weight:900;line-height:1.1}.card-ipa-back{opacity:.8;letter-spacing:.02em;font-size:.9rem;font-style:italic}.card-example{opacity:.8;text-align:center;max-width:300px;font-size:.82rem;font-style:italic;line-height:1.55}.speak-btn{cursor:pointer;color:#fff;background:#ffffff1a;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.1rem;transition:all .2s;display:flex}.speak-btn:hover{background:#ffffff38;transform:scale(1.1)}.action-row{gap:12px;display:flex}.action-btn{cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #0000;border-radius:16px;flex:1;padding:15px;font-size:.92rem;font-weight:800;transition:all .2s}.action-btn.learning{color:#fbbf24;background:#fbbf2426;border-color:#fbbf2459}.action-btn.learning:hover{background:#fbbf2447;transform:translateY(-3px);box-shadow:0 8px 24px #fbbf2440}.action-btn.known{color:#34d399;background:#34d39926;border-color:#34d39959}.action-btn.known:hover{background:#34d39947;transform:translateY(-3px);box-shadow:0 8px 24px #34d39940}.tap-hint{text-align:center;color:#ffffff8c;font-size:.82rem}.key-hint{text-align:center;color:#ffffff59;font-size:.72rem}.done-screen{flex:1;justify-content:center;align-items:center;display:flex}.done-card{-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);text-align:center;background:#ffffff12;border:1px solid #ffffff1f;border-radius:24px;flex-direction:column;gap:18px;width:100%;padding:40px 28px;display:flex;box-shadow:0 24px 64px #0006}.done-card h2{background:linear-gradient(90deg,#a78bfa,#60a5fa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.7rem;font-weight:900}.done-card p{color:#ffffff80;font-size:.9rem}.done-stats{justify-content:center;gap:12px;display:flex}.done-stat{border-radius:16px;flex-direction:column;flex:1;align-items:center;gap:6px;padding:18px;font-size:.8rem;font-weight:700;display:flex}.done-stat.green{color:#34d399;background:#34d39926;border:1px solid #34d3994d}.done-stat.yellow{color:#fbbf24;background:#fbbf241f;border:1px solid #fbbf244d}.done-num{font-size:2.2rem;font-weight:900}.done-actions{flex-direction:column;gap:10px;display:flex}.btn{cursor:pointer;border:none;border-radius:14px;padding:14px;font-size:.92rem;font-weight:800;transition:all .2s}.btn.primary{color:#fff;background:linear-gradient(135deg,#7c3aed,#3b82f6);box-shadow:0 8px 24px #7c3aed66}.btn.primary:hover{opacity:.9;transform:translateY(-2px)}.btn.secondary{color:#fff9;background:#ffffff14;border:1px solid #ffffff1f}.btn.secondary:hover{background:#ffffff21}.no-cards{text-align:center;color:#ffffff4d;padding:40px}.app-loading{color:#fff9;background:linear-gradient(135deg,#0f0c29 0%,#302b63 50%,#24243e 100%);flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:100vh;font-size:.9rem;display:flex}.loading-ring{border:3px solid #ffffff1a;border-top-color:#a78bfa;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.nav-btn{cursor:pointer;background:#ffffff14;border:1px solid #ffffff1f;border-radius:10px;justify-content:center;align-items:center;width:34px;height:34px;font-size:1rem;transition:all .2s;display:flex}.nav-btn:hover{background:#ffffff29;transform:translateY(-1px)}.card-actions-row{align-items:center;gap:10px;display:flex}.mic-btn{cursor:pointer;color:#fff;background:#ffffff1a;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1rem;transition:all .2s;display:flex}.mic-btn:hover{background:#fff3;transform:scale(1.08)}.mic-btn.listening{color:#a78bfa;border-color:#a78bfa;animation:1s infinite pulse-mic}.mic-btn.correct{border-color:#34d399}.mic-btn.close{border-color:#fbbf24}.mic-btn.wrong{border-color:#f87171}@keyframes pulse-mic{0%,to{box-shadow:0 0 #a78bfa80}50%{box-shadow:0 0 0 8px #a78bfa00}}.rec-result{border-radius:8px;padding:3px 10px;font-size:.78rem;font-weight:700}.rec-result.correct{color:#34d399;background:#34d39933}.rec-result.close{color:#fbbf24;background:#fbbf2433}.rec-result.wrong{color:#f87171;background:#f8717133}@media (width<=400px){.card-word{font-size:2.1rem}.card-translation{font-size:1.8rem}.logo{font-size:1.5rem}}.auth-page{background:linear-gradient(135deg,#0f0c29 0%,#302b63 50%,#24243e 100%) fixed;justify-content:center;align-items:center;min-height:100vh;padding:24px 16px;display:flex;position:relative;overflow:hidden}.auth-page:before,.auth-page:after{content:"";filter:blur(80px);opacity:.2;pointer-events:none;border-radius:50%;position:absolute}.auth-page:before{background:radial-gradient(circle,#7c3aed,#0000);width:400px;height:400px;top:-80px;left:-80px}.auth-page:after{background:radial-gradient(circle,#06b6d4,#0000);width:350px;height:350px;bottom:-60px;right:-60px}.auth-card{z-index:1;-webkit-backdrop-filter:blur(30px);background:#ffffff12;border:1px solid #ffffff21;border-radius:28px;flex-direction:column;gap:20px;width:100%;max-width:420px;padding:40px 36px;display:flex;position:relative;box-shadow:0 24px 64px #00000080,inset 0 1px #ffffff14}.auth-logo{text-align:center;background:linear-gradient(90deg,#a78bfa,#60a5fa,#34d399);-webkit-text-fill-color:transparent;letter-spacing:-.5px;-webkit-background-clip:text;background-clip:text;font-size:2.2rem;font-weight:900}.auth-tagline{text-align:center;color:#fff6;margin-top:-12px;font-size:.875rem}.auth-tabs{background:#ffffff0f;border:1px solid #ffffff1a;border-radius:14px;gap:4px;padding:4px;display:flex}.auth-tab{color:#fff6;cursor:pointer;background:0 0;border:none;border-radius:10px;flex:1;padding:10px;font-family:Inter,sans-serif;font-size:.875rem;font-weight:700;transition:all .2s}.auth-tab.active{color:#fff;background:linear-gradient(135deg,#7c3aed,#3b82f6);box-shadow:0 4px 14px #7c3aed66}.auth-form{flex-direction:column;gap:14px;display:flex}.field{flex-direction:column;gap:6px;display:flex}.field label{color:#ffffff8c;letter-spacing:.02em;font-size:.82rem;font-weight:700}.field input{color:#fff;background:#ffffff12;border:1px solid #ffffff1f;border-radius:12px;outline:none;width:100%;padding:12px 14px;font-family:Inter,sans-serif;font-size:.95rem;transition:border-color .2s,background .2s}.field input::placeholder{color:#ffffff40}.field input:focus{background:#ffffff1a;border-color:#a78bfa99}.password-wrap{position:relative}.password-wrap input{padding-right:70px}.toggle-pw{color:#a78bfa;cursor:pointer;background:0 0;border:none;padding:4px;font-family:Inter,sans-serif;font-size:.78rem;font-weight:700;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.auth-error{color:#fca5a5;background:#ef44441f;border:1px solid #ef44444d;border-radius:10px;padding:10px 14px;font-size:.85rem;font-weight:500}.auth-submit{color:#fff;cursor:pointer;background:linear-gradient(135deg,#7c3aed,#3b82f6);border:none;border-radius:14px;margin-top:4px;padding:14px;font-family:Inter,sans-serif;font-size:.95rem;font-weight:800;transition:all .2s;box-shadow:0 8px 24px #7c3aed66}.auth-submit:hover:not(:disabled){opacity:.9;transform:translateY(-2px)}.auth-submit:disabled{opacity:.5;cursor:not-allowed}.auth-switch{text-align:center;color:#ffffff59;font-size:.85rem}.auth-switch button{color:#a78bfa;cursor:pointer;background:0 0;border:none;padding:0;font-family:Inter,sans-serif;font-size:.85rem;font-weight:700}.auth-switch button:hover{text-decoration:underline}@media (width<=400px){.auth-card{padding:32px 20px}}.lb-page{background:linear-gradient(135deg,#0f0c29 0%,#302b63 50%,#24243e 100%) fixed;min-height:100vh;padding:24px 16px 48px;font-family:Inter,sans-serif}.lb-container{flex-direction:column;gap:16px;max-width:680px;margin:0 auto;display:flex}.lb-back{color:#ffffffb3;cursor:pointer;background:#ffffff12;border:1px solid #ffffff1f;border-radius:10px;width:fit-content;padding:8px 16px;font-size:.85rem;font-weight:600;transition:all .2s}.lb-back:hover{color:#fff;background:#ffffff1f}.lb-title{background:linear-gradient(90deg,#a78bfa,#60a5fa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2rem;font-weight:900}.lb-subtitle{color:#ffffff73;font-size:.875rem}.lb-loading{color:#ffffff80;flex-direction:column;align-items:center;gap:12px;padding:40px;display:flex}.lb-error{color:#fca5a5;background:#ef44441f;border:1px solid #ef44444d;border-radius:12px;padding:14px;font-size:.875rem}.lb-empty{color:#fff6;text-align:center;padding:40px}.lb-table-wrap{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:16px;overflow:hidden}.lb-table{border-collapse:collapse;width:100%;font-size:.875rem}.lb-table th{text-align:left;text-transform:uppercase;letter-spacing:.08em;color:#fff6;border-bottom:1px solid #ffffff14;padding:12px 16px;font-size:.75rem;font-weight:700}.lb-table td{color:#ffffffd9;border-bottom:1px solid #ffffff0d;padding:13px 16px}.lb-table tr:last-child td{border-bottom:none}.lb-table tr.lb-me{background:#a78bfa1a}.lb-table tr.lb-me td{color:#fff}.lb-rank{width:48px;font-size:1rem;font-weight:800}.lb-name{font-weight:600}.lb-you{color:#a78bfa;background:#a78bfa40;border-radius:6px;margin-left:8px;padding:2px 7px;font-size:.68rem;font-weight:700}.lb-known{color:#34d399;font-weight:700}.lb-learning{color:#fbbf24;font-weight:700}.lb-streak{color:#f97316;font-weight:700}.admin-stats{gap:12px;display:flex}.admin-stat{text-align:center;color:#ffffff8c;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:14px;flex-direction:column;flex:1;gap:4px;padding:16px;font-size:.78rem;font-weight:600;display:flex}.admin-num{background:linear-gradient(90deg,#a78bfa,#60a5fa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.8rem;font-weight:900}.admin-search{color:#fff;background:#ffffff12;border:1px solid #ffffff1f;border-radius:12px;outline:none;width:100%;padding:11px 16px;font-family:Inter,sans-serif;font-size:.9rem}.admin-search::placeholder{color:#ffffff4d}.admin-search:focus{border-color:#a78bfa80}.lb-note{color:#ffffff59;text-align:center;padding:8px;font-size:.8rem}.lb-note strong{color:#ffffff8c}