@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";:root{--bg: #0a0e1a;--surface: #141927;--surface-2: #1c2236;--border: #2a3050;--text: #e2e8f0;--text-muted: #8892a8;--accent: #7b2ff7;--accent-glow: rgba(123, 47, 247, .3);--green: #00ff88;--green-dim: rgba(0, 255, 136, .15);--red: #ff6b6b;--red-dim: rgba(255, 107, 107, .15);--yellow: #ffd43b;--radius: 16px;--radius-sm: 10px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden}.app{max-width:900px;margin:0 auto;padding:2rem 1.5rem}.header{text-align:center;margin-bottom:2.5rem}.header h1{font-size:2rem;font-weight:800;background:linear-gradient(135deg,#7b2ff7,#00d4ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem}.header p{color:var(--text-muted);font-size:.95rem}.stats-bar{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}.stat{flex:1;min-width:120px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:1rem;text-align:center}.stat-value{font-size:1.8rem;font-weight:700}.stat-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:.25rem}.categories{display:flex;gap:.5rem;margin-bottom:2rem;flex-wrap:wrap}.cat-btn{padding:.6rem 1.2rem;border-radius:50px;border:1px solid var(--border);background:var(--surface);color:var(--text-muted);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s;font-family:inherit}.cat-btn:hover{border-color:var(--accent);color:var(--text)}.cat-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}.filters{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}.filter-btn{padding:.4rem 1rem;border-radius:50px;border:1px solid var(--border);background:transparent;color:var(--text-muted);font-size:.8rem;cursor:pointer;transition:all .2s;font-family:inherit}.filter-btn:hover{color:var(--text)}.filter-btn.active{background:var(--surface-2);color:var(--text);border-color:var(--text-muted)}.card-container{perspective:1000px;margin-bottom:1.5rem}.flashcard{position:relative;width:100%;min-height:280px;cursor:pointer;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.4,0,.2,1)}.flashcard.flipped{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:var(--radius);padding:2rem;display:flex;flex-direction:column;justify-content:center;border:1px solid var(--border)}.card-front{background:linear-gradient(145deg,var(--surface),var(--surface-2))}.card-back{background:linear-gradient(145deg,var(--surface-2),var(--surface));transform:rotateY(180deg)}.card-cat{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:1rem;font-weight:600}.card-text{font-size:1.15rem;line-height:1.7;font-weight:400}.card-front .card-text{font-weight:500;font-size:1.25rem}.card-hint{margin-top:auto;padding-top:1rem;font-size:.75rem;color:var(--text-muted);text-align:center}.card-number{position:absolute;top:1rem;right:1.5rem;font-size:.75rem;color:var(--text-muted)}.actions{display:flex;gap:1rem;justify-content:center;margin-bottom:2rem}.action-btn{padding:.8rem 2rem;border-radius:var(--radius-sm);border:none;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s;font-family:inherit}.btn-know{background:var(--green-dim);color:var(--green);border:1px solid rgba(0,255,136,.3)}.btn-know:hover{background:#00ff8840;transform:translateY(-2px)}.btn-practice{background:var(--red-dim);color:var(--red);border:1px solid rgba(255,107,107,.3)}.btn-practice:hover{background:#ff6b6b40;transform:translateY(-2px)}.btn-skip{background:var(--surface);color:var(--text-muted);border:1px solid var(--border)}.btn-skip:hover{color:var(--text);transform:translateY(-2px)}.progress-section{margin-bottom:2rem}.progress-bar-bg{height:8px;background:var(--surface-2);border-radius:4px;overflow:hidden;display:flex}.progress-know{height:100%;background:var(--green);transition:width .3s}.progress-practice{height:100%;background:var(--red);transition:width .3s}.progress-labels{display:flex;justify-content:space-between;margin-top:.5rem;font-size:.75rem;color:var(--text-muted)}.empty-state{text-align:center;padding:3rem;color:var(--text-muted)}.empty-state .emoji{font-size:3rem;margin-bottom:1rem}.empty-state h3{color:var(--text);margin-bottom:.5rem}.reset-btn{display:block;margin:2rem auto 0;padding:.5rem 1.5rem;background:transparent;border:1px solid var(--border);color:var(--text-muted);border-radius:50px;font-size:.8rem;cursor:pointer;font-family:inherit;transition:all .2s}.reset-btn:hover{border-color:var(--red);color:var(--red)}@media(max-width:600px){.app{padding:1rem}.header h1{font-size:1.5rem}.flashcard{min-height:240px}.card-face{padding:1.5rem}.actions{flex-direction:column}.action-btn{width:100%}}