@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap";:root{--bg: #09090b;--bg-2: #0f0f12;--bg-3: #18181b;--bg-card: #131316;--bg-hover: #1c1c20;--accent: #00ff41;--accent-dim: #00cc33;--text: #fafafa;--text-2: #a1a1aa;--text-3: #52525b;--border: #27272a;--border-2: #3f3f46;--red: #ef4444;--yellow: #eab308;--green: #22c55e;--blue: #3b82f6;--mono: "JetBrains Mono", monospace;--sans: "Inter", -apple-system, sans-serif;--sidebar-w: 280px;--radius: 6px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--sans);background:var(--bg);color:var(--text);min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased}.app-layout{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-w);background:var(--bg-2);border-right:1px solid var(--border);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:100;transform:translate(-100%);transition:transform .2s ease;overflow-y:auto}.sidebar.open{transform:translate(0)}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:99}.sidebar-top{padding:20px 20px 0}.sidebar-logo{font-family:var(--mono);font-size:1.1rem;font-weight:700;color:var(--accent);cursor:pointer;letter-spacing:1px}.sidebar-streak-box{margin:20px 16px;padding:16px;background:var(--bg-3);border:1px solid var(--border);border-radius:var(--radius);display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}.streak-number{font-family:var(--mono);font-size:2rem;font-weight:700;color:var(--accent);line-height:1}.streak-info{display:flex;flex-direction:column;font-size:.8rem;color:var(--text-2)}.streak-risk{color:var(--yellow);font-weight:600;animation:blink 1.5s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.4}}.streak-best{width:100%;font-size:.75rem;color:var(--text-3);font-family:var(--mono);border-top:1px solid var(--border);padding-top:8px;margin-top:4px}.sidebar-nav{flex:1;padding:0 8px}.nav-label{font-size:.65rem;font-weight:600;color:var(--text-3);text-transform:uppercase;letter-spacing:2px;padding:0 12px 8px}.sidebar-cat{width:100%;display:grid;grid-template-columns:8px 1fr auto;grid-template-rows:auto auto;gap:0 10px;align-items:center;padding:10px 12px;background:none;border:none;border-radius:var(--radius);cursor:pointer;color:var(--text-2);font-family:var(--sans);font-size:.85rem;text-align:left;transition:background .15s}.sidebar-cat:hover,.sidebar-cat.active{background:var(--bg-3);color:var(--text)}.cat-dot{width:8px;height:8px;border-radius:50%;grid-row:1}.cat-label{grid-row:1;grid-column:2}.cat-badge{grid-row:1;grid-column:3;font-family:var(--mono);font-size:.7rem;color:var(--text-3)}.cat-bar{grid-column:2 / 4;grid-row:2;height:2px;background:var(--border);border-radius:1px;margin-top:6px;overflow:hidden}.cat-bar-fill{height:100%;border-radius:1px;transition:width .3s ease}.sidebar-bottom{padding:16px;border-top:1px solid var(--border)}.kbd-hints{display:flex;gap:16px;font-size:.7rem;color:var(--text-3)}kbd{background:var(--bg-3);border:1px solid var(--border-2);border-radius:3px;padding:1px 5px;font-family:var(--mono);font-size:.65rem}.main{flex:1;margin-left:0;transition:margin-left .2s ease;min-height:100vh;display:flex;flex-direction:column}.topbar{padding:16px 24px;border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;align-items:center;gap:16px;background:var(--bg-2);position:sticky;top:0;z-index:50}.menu-btn{display:flex;flex-direction:column;gap:4px;background:none;border:1px solid var(--border);border-radius:var(--radius);padding:8px;cursor:pointer}.menu-btn span{display:block;width:18px;height:2px;background:var(--text-2)}.topbar-stats{display:flex;gap:20px;flex:1}.t-stat{display:flex;align-items:baseline;gap:6px}.t-val{font-family:var(--mono);font-size:1.2rem;font-weight:700;color:var(--accent)}.t-label{font-size:.75rem;color:var(--text-3);text-transform:uppercase}.topbar-progress{width:100%;height:3px;background:var(--bg-3);border-radius:2px;overflow:hidden}.topbar-progress-fill{height:100%;background:var(--accent);border-radius:2px;transition:width .4s ease}.toolbar{padding:16px 24px;display:flex;flex-wrap:wrap;align-items:center;gap:16px}.view-tabs{display:flex;background:var(--bg-3);border-radius:var(--radius);border:1px solid var(--border);overflow:hidden}.vtab{padding:8px 24px;background:none;border:none;color:var(--text-3);font-family:var(--mono);font-size:.8rem;font-weight:600;cursor:pointer;text-transform:uppercase;letter-spacing:1px;transition:all .15s}.vtab:hover{color:var(--text-2)}.vtab.active{background:var(--accent);color:var(--bg)}.search-row{display:flex;flex:1;gap:10px;min-width:200px}.search-box{flex:1;position:relative}.search-box input{width:100%;background:var(--bg-3);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);padding:8px 36px 8px 14px;font-family:var(--mono);font-size:.8rem;outline:none;transition:border-color .15s}.search-box input::placeholder{color:var(--text-3)}.search-box input:focus{border-color:var(--accent)}.search-x{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-3);font-size:1.1rem;cursor:pointer;line-height:1}.sort-sel{background:var(--bg-3);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-2);padding:8px 12px;font-family:var(--mono);font-size:.75rem;outline:none;cursor:pointer}.sort-sel:focus{border-color:var(--accent)}.content{flex:1;padding:0 24px 40px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.card{background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--accent, var(--border));border-radius:var(--radius);padding:20px;cursor:pointer;transition:all .15s ease;position:relative}.card:hover{border-color:var(--accent);background:var(--bg-hover);transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.card-cat{font-family:var(--mono);font-size:.65rem;text-transform:uppercase;letter-spacing:2px;font-weight:600}.status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.status-dot.not_started{background:var(--text-3)}.status-dot.learning{background:var(--yellow);box-shadow:0 0 6px var(--yellow)}.status-dot.mastered{background:var(--green);box-shadow:0 0 6px var(--green)}.card-title{font-size:1rem;font-weight:600;margin-bottom:10px;line-height:1.4}.card-img-wrap{border-radius:4px;overflow:hidden;margin-bottom:10px;border:1px solid var(--border)}.card-img{width:100%;height:100px;object-fit:cover;display:block;opacity:.7;transition:opacity .2s}.card:hover .card-img{opacity:1}.card-desc{font-size:.82rem;color:var(--text-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5}.card-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}.diff{font-family:var(--mono);font-size:.65rem;padding:3px 8px;border-radius:3px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.diff.basics{color:var(--green);background:#22c55e1a}.diff.intermediate{color:var(--yellow);background:#eab3081a}.diff.advanced{color:var(--red);background:#ef44441a}.card-st{font-family:var(--mono);font-size:.65rem;font-weight:600;text-transform:uppercase}.card-st.mastered{color:var(--green)}.card-st.learning{color:var(--yellow)}.empty{text-align:center;padding:80px 20px;color:var(--text-3)}.empty-icon{font-size:3rem;margin-bottom:16px;opacity:.3}.empty h3{font-size:1.2rem;color:var(--text-2);margin-bottom:8px}.empty p{font-size:.9rem}.detail{max-width:800px}.detail-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.back-btn{background:none;border:1px solid var(--border);border-radius:var(--radius);color:var(--text-2);padding:6px 14px;font-family:var(--mono);font-size:.75rem;cursor:pointer;transition:all .15s}.back-btn:hover{border-color:var(--accent);color:var(--accent)}.detail-arrows{display:flex;gap:8px}.detail-arrows button{background:none;border:1px solid var(--border);border-radius:var(--radius);color:var(--text-3);padding:6px 12px;font-family:var(--mono);font-size:.7rem;cursor:pointer;transition:all .15s}.detail-arrows button:hover:not(:disabled){border-color:var(--accent);color:var(--text-2)}.detail-arrows button:disabled{opacity:.3;cursor:default}.detail-hero{padding:30px 0;border-bottom:1px solid var(--border);margin-bottom:30px}.detail-cat{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:2px;font-weight:600;margin-bottom:8px;display:block}.detail-title{font-size:1.8rem;font-weight:700;line-height:1.3;margin-bottom:16px}.detail-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.detail-st{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;font-weight:600}.detail-st.not_started{color:var(--text-3)}.detail-st.learning{color:var(--yellow)}.detail-st.mastered{color:var(--green)}.detail-terms{display:flex;gap:6px;flex-wrap:wrap;margin-left:8px}.term-tag{font-family:var(--mono);font-size:.65rem;padding:2px 8px;background:var(--bg-3);border:1px solid var(--border);border-radius:3px;color:var(--text-2)}.detail-body{margin-bottom:30px}.rich-content{color:var(--text-2);line-height:1.8;font-size:.92rem}.rc-p{margin-bottom:16px}.rich-content strong{color:var(--text)}.rich-content em{color:var(--text-2);font-style:italic}.rc-h2{font-size:1.4rem;color:var(--text);margin:32px 0 16px;padding-bottom:8px;border-bottom:1px solid var(--border);font-weight:700}.rc-h3{font-size:1.15rem;color:var(--text);margin:28px 0 12px;font-weight:600}.rc-h4{font-size:1rem;color:var(--text-2);margin:24px 0 10px;font-weight:600}.rc-h5{font-size:.9rem;color:var(--text-2);margin:20px 0 8px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.rc-code{background:var(--bg-3);padding:2px 7px;border-radius:3px;font-family:var(--mono);font-size:.82em;color:var(--accent);border:1px solid var(--border)}.rc-pre{background:var(--bg-3);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:16px;overflow-x:auto}.rc-pre code{font-family:var(--mono);font-size:.82rem;color:var(--text-2);line-height:1.7}.rc-list,.rc-olist{padding-left:24px;margin-bottom:16px}.rc-list li,.rc-olist li{margin-bottom:6px;padding-left:4px;line-height:1.7}.rc-list li::marker{color:var(--text-3)}.rc-olist li::marker{color:var(--accent);font-family:var(--mono);font-size:.85em}.rc-list .rc-list,.rc-olist .rc-olist,.rc-list .rc-olist,.rc-olist .rc-list{margin-top:6px;margin-bottom:6px}.rc-quote{border-left:3px solid var(--accent);padding:12px 20px;margin:0 0 16px;background:#00ff4108;border-radius:0 var(--radius) var(--radius) 0}.rc-quote p{color:var(--text-2);font-style:italic;margin-bottom:8px}.rc-quote p:last-child{margin-bottom:0}.rc-link{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s}.rc-link:hover{border-bottom-color:var(--accent)}.rc-internal{cursor:pointer;border-bottom:1px dashed var(--accent)}.rc-internal:hover{border-bottom-style:solid}.rc-img{max-width:100%;border:1px solid var(--border);border-radius:var(--radius);margin:16px 0;display:block;transition:border-color .15s}.rc-img:hover{border-color:var(--accent)}.detail-images{margin-bottom:30px}.section-title{font-family:var(--mono);font-size:.8rem;color:var(--text-3);text-transform:uppercase;letter-spacing:2px;margin-bottom:16px}.images-grid{display:flex;flex-direction:column;gap:12px}.diagram-link{display:block;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);transition:border-color .15s}.diagram-link:hover{border-color:var(--accent)}.diagram-img{width:100%;display:block}.detail-actions{display:flex;gap:12px;margin-bottom:40px}.act-btn{padding:10px 24px;font-family:var(--mono);font-size:.8rem;font-weight:600;border:1px solid var(--border-2);border-radius:var(--radius);background:var(--bg-3);color:var(--text-2);cursor:pointer;transition:all .15s;text-transform:uppercase;letter-spacing:.5px}.act-btn:hover{border-color:var(--accent);color:var(--accent)}.act-btn.primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}.act-btn.primary:hover{background:var(--accent-dim)}.act-btn.current{opacity:.6}.related{margin-bottom:40px}.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}.related-card{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--bg-3);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--radius);cursor:pointer;transition:all .15s;text-align:left}.related-card:hover{background:var(--bg-hover);border-color:var(--accent)}.related-title{font-size:.85rem;font-weight:500;color:var(--text)}.detail-bottom-nav{display:flex;justify-content:space-between;padding-top:24px;border-top:1px solid var(--border)}.bottom-nav-btn{background:none;border:1px solid var(--border);border-radius:var(--radius);color:var(--text-2);padding:10px 20px;font-family:var(--mono);font-size:.8rem;cursor:pointer;transition:all .15s}.bottom-nav-btn:hover{border-color:var(--accent);color:var(--accent)}.quiz{max-width:700px;margin:0 auto}.quiz-loading{text-align:center;padding:60px;color:var(--text-3);font-family:var(--mono);animation:blink 1.5s infinite}.quiz-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.quiz-topic{color:var(--text-3);font-family:var(--mono);font-size:.75rem;text-transform:uppercase;letter-spacing:1px}.quiz-tally{color:var(--accent);font-family:var(--mono);font-size:.85rem;font-weight:700}.quiz-bar{height:3px;background:var(--bg-3);border-radius:2px;margin-bottom:8px;overflow:hidden}.quiz-bar-fill{height:100%;background:var(--accent);border-radius:2px;transition:width .3s ease}.quiz-count{font-size:.7rem;color:var(--text-3);font-family:var(--mono);margin-bottom:30px}.quiz-q{font-size:1.3rem;font-weight:600;margin-bottom:28px;line-height:1.5}.quiz-opts{display:flex;flex-direction:column;gap:10px}.q-opt{display:flex;align-items:center;gap:14px;padding:14px 18px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .15s;text-align:left;font-family:var(--sans);font-size:.9rem;color:var(--text)}.q-opt:hover:not(:disabled){border-color:var(--accent);background:var(--bg-hover)}.q-letter{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--bg-3);border:1px solid var(--border-2);font-family:var(--mono);font-size:.75rem;font-weight:700;flex-shrink:0;transition:all .15s}.q-opt:hover:not(:disabled) .q-letter{border-color:var(--accent);color:var(--accent)}.q-text{flex:1}.q-opt.right{border-color:var(--green);background:#22c55e14}.q-opt.right .q-letter{background:var(--green);color:var(--bg);border-color:var(--green)}.q-opt.wrong{border-color:var(--red);background:#ef444414}.q-opt.wrong .q-letter{background:var(--red);color:#fff;border-color:var(--red)}.quiz-feedback{margin-top:24px}.fb-banner{padding:12px 16px;border-radius:var(--radius);font-family:var(--mono);font-weight:600;font-size:.85rem;margin-bottom:16px}.fb-banner.right{background:#22c55e1f;color:var(--green);border:1px solid rgba(34,197,94,.3)}.fb-banner.wrong{background:#ef44441f;color:var(--red);border:1px solid rgba(239,68,68,.3)}.fb-explain{padding:16px;background:var(--bg-3);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px}.fb-text{font-size:.85rem;color:var(--text-2);line-height:1.6;margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.fb-study{background:none;border:none;color:var(--accent);font-family:var(--mono);font-size:.75rem;font-weight:600;cursor:pointer;text-transform:uppercase;letter-spacing:1px}.fb-study:hover{text-decoration:underline}.fb-next{width:100%}.quiz-done{text-align:center;padding:60px 20px;max-width:500px;margin:0 auto}.done-ring{position:relative;width:160px;height:160px;margin:0 auto 24px}.done-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.done-ring circle{fill:none;stroke-width:6;cx:50;cy:50;r:45}.done-ring circle:first-child{stroke:var(--bg-3)}.done-ring circle:last-child{stroke:var(--accent);stroke-linecap:round;transition:stroke-dasharray .8s ease}.done-pct{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:2.2rem;font-weight:700;color:var(--accent)}.quiz-done h2{font-size:1.5rem;margin-bottom:24px}.done-stats{display:flex;justify-content:center;gap:40px;margin-bottom:32px}.done-stats div{display:flex;flex-direction:column;align-items:center;gap:4px}.done-val{font-family:var(--mono);font-size:2rem;font-weight:700}.done-val.correct{color:var(--green)}.done-val.incorrect{color:var(--red)}.done-stats span:last-child{font-size:.75rem;color:var(--text-3);text-transform:uppercase}.load-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:20px}.load-logo{font-family:var(--mono);font-size:1.5rem;font-weight:700;color:var(--accent)}.load-bar{width:200px;height:3px;background:var(--bg-3);border-radius:2px;overflow:hidden}.load-bar-fill{height:100%;width:40%;background:var(--accent);border-radius:2px;animation:load-slide 1.2s ease infinite}@keyframes load-slide{0%{transform:translate(-100%)}to{transform:translate(350%)}}.load-text{font-size:.8rem;color:var(--text-3);font-family:var(--mono)}.fade-in{animation:fadeIn .25s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-3)}@media (min-width: 769px){.sidebar.open+.main{margin-left:var(--sidebar-w)}.sidebar-overlay{display:none}}@media (max-width: 768px){.sidebar{width:280px}.topbar-stats{gap:12px}.t-val{font-size:1rem}.grid{grid-template-columns:1fr}.toolbar{flex-direction:column;align-items:stretch}.search-row{flex-direction:column}.detail-title{font-size:1.4rem}.detail-hero{padding:20px 0}.detail-actions{flex-direction:column}.act-btn{width:100%;text-align:center}.related-grid{grid-template-columns:1fr}}@media (max-width: 480px){.content{padding:0 16px 32px}.topbar,.toolbar{padding:12px 16px}.topbar-stats{gap:8px}.t-val{font-size:.9rem}.t-label{font-size:.6rem}.quiz-q{font-size:1.1rem}.detail-title{font-size:1.2rem}}