@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Space+Mono&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#141827;--bg-light:#1e2438;--card-bg:#0d1019;--text:#f5f5f5;--text-dim:#6b7280;--accent:#ff6b35;--accent-glow:rgba(255,107,53,.3);--success:#10b981;--border:hsla(0,0%,100%,.08)}body{background:var(--bg);color:var(--text);font-family:Outfit,sans-serif;overflow-x:hidden}.container,body{min-height:100vh}.container{display:flex;flex-direction:column;margin:0 auto;max-width:600px;padding:24px;position:relative}.grid-overlay{background-image:linear-gradient(hsla(0,0%,100%,.02) 1px,transparent 0),linear-gradient(90deg,hsla(0,0%,100%,.02) 1px,transparent 0);background-size:60px 60px;inset:0;pointer-events:none;position:fixed;z-index:0}.meta{color:var(--text-dim);font-family:Space Mono,monospace;font-size:10px;letter-spacing:.5px;position:fixed;z-index:1}.meta-tl{left:20px;top:20px}.meta-tr{right:20px;text-align:right;top:20px}.meta-bl{left:20px}.meta-bl,.meta-br{bottom:20px;line-height:1.4}.meta-br{right:20px;text-align:right}.deco{color:var(--text-dim);font-size:14px;position:fixed;z-index:1}.deco-1{left:15px;top:30%}.deco-2{right:15px;top:60%}.deco-3{color:var(--accent);right:20px;top:45%}.main{display:flex;flex:1;flex-direction:column;padding-top:40px;position:relative;z-index:2}.header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:32px}.title-block{flex:1}.label{color:var(--accent);display:block;font-family:Space Mono,monospace;font-size:10px;letter-spacing:2px;margin-bottom:8px}.title{font-size:32px;font-weight:600;letter-spacing:-1px;line-height:1.1}.stats-block{display:flex;gap:24px}.stat{text-align:right}.stat-value{color:var(--accent);display:block;font-size:28px;font-weight:600}.stat-label{color:var(--text-dim);font-family:Space Mono,monospace;font-size:9px;letter-spacing:1px}.progress-section{margin-bottom:24px}.progress-bar{background:var(--border);border-radius:2px;height:3px;margin-bottom:8px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,var(--accent),#ff8f35);height:100%;transition:width .4s ease}.progress-text{color:var(--text-dim);font-family:Space Mono,monospace;font-size:10px}.mode-selector{display:flex;gap:12px;margin-bottom:32px}.mode-btn{background:transparent;border:1px solid var(--border);border-radius:6px;color:var(--text-dim);cursor:pointer;flex:1;font-family:Space Mono,monospace;font-size:10px;letter-spacing:1px;padding:12px;transition:all .2s ease}.mode-btn:hover{border-color:var(--text-dim)}.mode-btn.active{background:#ff6b350d;border-color:var(--accent);color:var(--accent)}.card-wrapper{align-items:center;display:flex;flex:1;justify-content:center;margin-bottom:32px;min-height:280px;perspective:1200px}.card{cursor:pointer;height:280px;width:100%}.card-inner{height:100%;position:relative;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.4,0,.2,1);width:100%}.card.flipped .card-inner{transform:rotateY(180deg)}.card-face{backface-visibility:hidden;background:var(--card-bg);border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;height:100%;padding:24px;position:absolute;width:100%}.card-front{border-left:3px solid var(--text-dim)}.card-back{border-left:3px solid var(--accent);transform:rotateY(180deg)}.card.mastered .card-back,.card.mastered .card-front{border-left-color:var(--success)}.card-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.card-type{color:var(--text-dim);font-family:Space Mono,monospace;font-size:10px;letter-spacing:2px}.card-type-answer{color:var(--accent)}.card-num{color:var(--text-dim);font-family:Space Mono,monospace;font-size:10px}.card-body{align-items:center;display:flex;flex:1}.card-body p{font-size:17px;font-weight:400;line-height:1.6}.card-footer{color:var(--text-dim);font-family:Space Mono,monospace;font-size:10px;opacity:.6;text-align:center}.controls{display:flex;gap:12px}.ctrl{background:transparent;border:1px solid var(--border);border-radius:6px;color:var(--text);cursor:pointer;flex:1;font-family:Space Mono,monospace;font-size:10px;letter-spacing:1px;padding:14px 12px;transition:all .2s ease}.ctrl:hover:not(:disabled){border-color:var(--text-dim)}.ctrl:disabled{cursor:not-allowed;opacity:.3}.ctrl.master{border-color:var(--accent);color:var(--accent)}.ctrl.master:hover{background:#ff6b351a}.ctrl.master.active{background:var(--success);border-color:var(--success);color:var(--bg)}.footer{align-items:center;display:flex;justify-content:space-between;margin-top:auto;padding-top:24px;position:relative;z-index:2}.reset{background:transparent;border:none;color:var(--text-dim);cursor:pointer;font-family:Space Mono,monospace;font-size:10px;letter-spacing:1px;padding:8px 0}.reset:hover{color:#ef4444}.credit{color:var(--text-dim);font-family:Space Mono,monospace;font-size:9px;letter-spacing:1px}@media(max-width:500px){.deco,.meta{display:none}.title{font-size:26px}.stat-value{font-size:24px}.card{height:260px}.card-body p{font-size:15px}}