:root{--twitter-bg: #15202B;--twitter-bg-secondary: #1E2A38;--twitter-text: #FFFFFF;--twitter-text-secondary: #8899A6;--twitter-accent: #1DA1F2;--twitter-accent-hover: #1A91DA;--twitter-border: #2F3E4A;--twitter-shadow: rgba(0, 0, 0, .2);--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--twitter-bg);color:var(--twitter-text);font-family:var(--font-family);font-size:16px;line-height:1.5}.app{min-height:100vh;width:100%;display:flex;flex-direction:column}.main-content{flex:1;padding:20px;background-color:var(--twitter-bg);min-height:100vh}.page-container{margin:0 auto}.roadmap-container{background-color:var(--twitter-bg-secondary);border-radius:8px;box-shadow:0 2px 4px var(--twitter-shadow)}.roadmap-header h1{color:var(--twitter-text)}.roadmap-description{color:var(--twitter-text-secondary)}.back-button{color:var(--twitter-accent)}.back-button:hover{color:var(--twitter-accent-hover)}.roadmap-tree,.roadmap-resources{background-color:var(--twitter-bg-secondary)}.roadmap-node,.node-title{color:var(--twitter-text)}.node-description,.toggle-icon,.resource-icon{color:var(--twitter-text-secondary)}.node-header:hover{background-color:var(--twitter-bg)}.current{border-left-color:var(--twitter-accent)}.loading-container p{color:var(--twitter-text-secondary)}.spinner{border-top-color:var(--twitter-accent)}.deepseek-widget{background-color:var(--twitter-bg-secondary)}.widget-header h3{color:var(--twitter-text)}.ai-icon,.bullet-icon{color:var(--twitter-accent)}.loading-state p,.empty-state p{color:var(--twitter-text-secondary)}.error-state{color:#f4212e}.recommendation-section h4{color:var(--twitter-text)}.recommendation-section li{color:var(--twitter-text-secondary)}.resource-card{background-color:var(--twitter-bg-secondary)}.resource-header,.resource-type{color:var(--twitter-text)}.resource-link{color:var(--twitter-accent)}.resource-link:hover{color:var(--twitter-accent-hover)}.resource-source,.resource-price{color:var(--twitter-text-secondary)}.resource-icon{color:var(--twitter-accent)}@media (max-width: 768px){.main-content{padding:15px}.page-container{max-width:100%}}@media (max-width: 480px){.main-content{padding:10px}}.navbar{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:10px 20px;background-color:#fff;border-bottom:1px solid #e1e8ed;z-index:5}.search-container{position:relative;flex:1;max-width:500px}.search-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:#657786}.search-input{width:100%;padding:12px 20px 12px 45px;border-radius:9999px;border:1px solid #e1e8ed;background-color:#f7f9fa;font-size:15px;transition:all .2s}.search-input:focus{outline:none;background-color:#fff;border-color:#1da1f2;box-shadow:0 0 0 2px #1da1f233}.nav-actions{display:flex;align-items:center;gap:15px}.nav-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:none;border:none;cursor:pointer;transition:background-color .2s}.nav-btn:hover{background-color:#f7f9fa}.nav-icon{width:22px;height:22px;color:#0f1419}.profile-btn{display:flex;align-items:center;gap:10px;padding:5px 10px 5px 5px;border-radius:9999px;background:none;border:none;cursor:pointer;text-decoration:none;color:#0f1419;transition:background-color .2s}.profile-btn:hover{background-color:#f7f9fa}.profile-icon{width:32px;height:32px;color:#1da1f2}@media (max-width: 768px){.navbar{flex-direction:column;gap:10px;padding:10px}.search-container{width:100%}.profile-btn span{display:none}}.sidebar{width:250px;height:100vh;position:fixed;left:0;top:0;padding:20px 10px;display:flex;flex-direction:column;background-color:#fff;border-right:1px solid #e1e8ed;z-index:10}.sidebar-logo{display:flex;align-items:center;gap:10px;padding:0 10px 20px;margin-bottom:20px;border-bottom:1px solid #e1e8ed}.logo-icon{font-size:1.8rem}.sidebar-logo h1{font-size:1.3rem;color:#1da1f2;margin:0}.sidebar-nav{flex:1;display:flex;flex-direction:column;gap:5px}.nav-item{display:flex;align-items:center;gap:15px;padding:12px 15px;border-radius:9999px;color:#0f1419;text-decoration:none;font-weight:500;transition:background-color .2s}.nav-item:hover{background-color:#f7f9fa}.nav-item.active{color:#1da1f2;font-weight:600}.nav-icon{width:24px;height:24px}.sidebar-footer{padding:20px 10px 0;border-top:1px solid #e1e8ed}.logout-btn{display:flex;align-items:center;gap:15px;width:100%;padding:12px 15px;border-radius:9999px;background:none;border:none;color:#0f1419;font-weight:500;cursor:pointer;transition:background-color .2s}.logout-btn:hover{background-color:#f7f9fa}@media (max-width: 1000px){.sidebar{width:80px;align-items:center}.sidebar-logo h1,.nav-item span,.logout-btn span{display:none}.nav-item{justify-content:center;padding:12px}}@media (max-width: 500px){.sidebar{width:100%;height:auto;position:static;flex-direction:row;padding:10px;border-right:none;border-bottom:1px solid #e1e8ed}.sidebar-logo,.sidebar-footer{display:none}.sidebar-nav{flex-direction:row;justify-content:space-around}.nav-item{padding:8px 12px}}.home-container{max-width:1300px;margin:0 auto;padding:20px;background-color:var(--twitter-bg);color:var(--twitter-text)}.hero-section{text-align:center;padding:40px 20px;background:linear-gradient(180deg,var(--twitter-bg-secondary),var(--twitter-bg));border-radius:12px;margin-bottom:30px;box-shadow:0 2px 4px var(--twitter-shadow)}.hero-title{font-size:2.5rem;font-weight:700;color:var(--twitter-text);margin-bottom:15px}.hero-subtitle{font-size:1.2rem;color:var(--twitter-text-secondary);max-width:600px;margin:0 auto 20px}.practice-now-banner{background-color:var(--twitter-bg-secondary);border-radius:8px;padding:20px;margin:30px 0;box-shadow:0 2px 4px var(--twitter-shadow)}.practice-now-banner h3{color:var(--twitter-text)}.practice-now-banner p{color:var(--twitter-text-secondary)}.practice-now-banner button{background-color:var(--twitter-accent);color:var(--twitter-text);border:none;padding:10px 20px;border-radius:20px;cursor:pointer;transition:background-color .2s}.trending-section{margin-bottom:40px}.section-title{font-size:1.8rem;color:var(--twitter-text);margin-bottom:20px;display:flex;align-items:center;gap:10px}.section-icon{color:var(--twitter-accent);font-size:1.5rem}.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}.skill-card{background-color:var(--twitter-bg-secondary);border-radius:8px;padding:20px;text-align:center;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 4px var(--twitter-shadow)}.skill-card:hover{transform:translateY(-5px);box-shadow:0 4px 8px var(--twitter-shadow)}.skill-card h3{font-size:1.3rem;color:var(--twitter-text);margin-bottom:10px}.skill-category{font-size:.95rem;color:var(--twitter-text-secondary);margin-bottom:5px}.skill-growth{font-size:.9rem;color:#0f8}.stories-section{margin-bottom:40px}.stories-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.story-card{background-color:var(--twitter-bg-secondary);border-radius:8px;padding:20px;box-shadow:0 2px 4px var(--twitter-shadow);transition:transform .2s}.story-card:hover{transform:translateY(-5px)}.story-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}.avatar-placeholder{width:40px;height:40px;background-color:var(--twitter-accent);color:var(--twitter-text);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700}.story-header h4{font-size:1.1rem;color:var(--twitter-text)}.story-skill{font-size:.9rem;color:var(--twitter-text-secondary)}.story-project{font-size:.95rem;color:var(--twitter-text);display:flex;align-items:flex-start;gap:8px}.project-icon{color:var(--twitter-accent);margin-top:2px}.how-it-works{margin-bottom:40px}.steps-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}.step{background-color:var(--twitter-bg-secondary);border-radius:8px;padding:20px;text-align:center;box-shadow:0 2px 4px var(--twitter-shadow)}.step-number{width:40px;height:40px;background-color:var(--twitter-accent);color:var(--twitter-text);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;margin:0 auto 10px}.step h3{font-size:1.2rem;color:var(--twitter-text);margin-bottom:10px}.step p{font-size:.95rem;color:var(--twitter-text-secondary)}@media (max-width: 768px){.home-container{padding:15px}.hero-section{padding:30px 15px}.hero-title{font-size:2rem}.hero-subtitle{font-size:1.1rem}.skills-grid,.stories-grid,.steps-container{grid-template-columns:1fr}}@media (max-width: 480px){.home-container{padding:10px}.hero-title{font-size:1.8rem}.section-title{font-size:1.6rem}.skill-card,.story-card,.step{padding:15px}}.skill-card{transition:transform .2s ease,box-shadow .2s ease}.skill-card:hover{transform:translateY(-3px);box-shadow:0 4px 8px #0000001a}:root{--twitter-bg: #15202B;--twitter-bg-secondary: #1E2A38;--twitter-text: #FFFFFF;--twitter-text-secondary: #8899A6;--twitter-accent: #1DA1F2;--twitter-accent-hover: #1A91DA;--twitter-border: #2F3E4A;--twitter-shadow: rgba(0, 0, 0, .2)}.search-container{align-self:center;justify-self:center}.search-form{display:flex;align-items:center;gap:10px;background-color:var(--twitter-bg);border:1px solid var(--twitter-border);border-radius:25px;padding:8px 15px;box-shadow:0 2px 4px var(--twitter-shadow);transition:border-color .2s}.sach-input{background:transparent;border:none;color:var(--twitter-text);font-size:1rem;width:100%;outline:none}.search-input-container{flex:1;display:flex;align-items:center;gap:10px}.search-icon{width:20px;height:20px;fill:var(--twitter-text-secondary);transition:fill .2s}.search-input::placeholder{color:var(--twitter-text-secondary);font-size:.95rem}.search-button{background-color:var(--twitter-accent);color:var(--twitter-text);border:none;border-radius:20px;padding:8px 20px;font-size:1rem;cursor:pointer;transition:background-color .2s}.search-button:hover{background-color:var(--twitter-accent-hover)}.quick-searches{margin-top:10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--twitter-text-secondary);font-size:.9rem}.quick-search-chip{background-color:var(--twitter-bg-secondary);color:var(--twitter-text);border:1px solid var(--twitter-border);border-radius:15px;padding:6px 12px;font-size:.9rem;cursor:pointer;transition:background-color .2s,border-color .2s}.quick-search-chip:hover{background-color:var(--twitter-bg);border-color:var(--twitter-accent)}@media (max-width: 768px){.search-container{justify-self:center;padding:8px}.search-form{padding:6px 12px}.search-input{font-size:.95rem}.search-button{padding:6px 15px;font-size:.95rem}}@media (max-width: 480px){.search-container{padding:5px;justify-self:center}.search-form{border-radius:20px}.search-icon{width:18px;height:18px}}.practice-banner{background-color:#1e2a38;border-radius:8px;padding:1rem;margin:1.5rem 0;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 10px #0003;border-left:4px solid #1DA1F2}.banner-content{display:flex;align-items:center;gap:1rem;flex:1}.idea-icon{font-size:1.5rem;color:#1da1f2}.idea-text h3{margin:0 0 .25rem;color:#fff}.idea-text p{margin:0;color:#8899a6}.idea{margin-left:.5rem;font-weight:500;color:#fff;display:inline-block;transition:opacity .5s ease,transform .5s ease}.idea.fade-out{opacity:0;transform:translateY(-10px)}.idea.fade-in{opacity:1;transform:translateY(0)}.banner-actions{display:flex;gap:.5rem}.control-btn{background:none;border:none;color:#8899a6;cursor:pointer;font-size:1rem;padding:.5rem;border-radius:4px;transition:all .2s ease}.control-btn:hover{color:#fff;background-color:#ffffff1a}.dismiss-btn:hover{color:#e0245e;background-color:#e0245e1a}.donate-container{align-self:center;justify-self:center;position:relative}.donate-button{background-color:var(--twitter-accent);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:50px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .3s ease;box-shadow:0 2px 10px #1da1f24d}.donate-button:hover{background-color:var(--twitter-accent-hover);transform:translateY(-2px);box-shadow:0 4px 15px #1da1f266}.heart-icon{transition:all .3s ease}.heart-icon.active{transform:scale(1.2)}.donate-card{position:absolute;justify-self:center;top:100%;width:300px;background-color:var(--twitter-bg-secondary);border-radius:12px;box-shadow:0 5px 20px #0000004d;z-index:100;overflow:hidden;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.donate-card-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background-color:var(--twitter-accent);color:#fff}.donate-card-header h3{margin:0;font-size:1.1rem}.close-button{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:0 .5rem}.donate-card-body{padding:1rem}.bank-info{margin-bottom:1rem}.info-row{margin-bottom:.75rem}.info-label{display:block;font-size:.9rem;color:var(--twitter-text-secondary);margin-bottom:.25rem}.info-value{font-weight:500}.account-row{display:flex;justify-content:space-evenly;align-items:center}.copy-button{background-color:var(--twitter-bg);color:var(--twitter-accent);border:1px solid var(--twitter-accent);border-radius:4px;padding:.25rem .5rem;font-size:.8rem;cursor:pointer;transition:all .2s ease}.copy-button:hover{background-color:var(--twitter-accent);color:#fff}.thank-you{text-align:center;padding:1rem 0;border-top:1px solid var(--twitter-border);margin-top:1rem}.thank-you p{margin:0 0 .5rem;font-size:.9rem}.emoji-stars{font-size:1.2rem;letter-spacing:.5rem}.resource-card{background:var(--twitter-bg-secondary);border-radius:8px;padding:20px;box-shadow:0 2px 4px var(--twitter-shadow);margin-bottom:20px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--twitter-text);transition:box-shadow .2s ease}.resource-card:hover{box-shadow:0 0 8px #1d9bf033}.resource-header{font-size:1.5rem;font-weight:700;margin-bottom:20px;background:linear-gradient(135deg,var(--twitter-accent) 0%,#17bfcb 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.resource-section{background:var(--twitter-bg);border-radius:5px;padding:15px;border:1px solid var(--twitter-border);margin-bottom:20px;transition:box-shadow .2s ease}.resource-section:hover{box-shadow:0 0 8px #1d9bf033}.resource-type{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:1.3rem;font-weight:600;color:var(--twitter-text)}.resource-icon{font-size:1.2rem;transition:transform .2s ease}.resource-icon:hover{transform:scale(1.2)}.docs-icon{color:#17bf63}.free-icon{color:#f55}.paid-icon{color:#a77ee6}.resource-list{list-style:none;padding:0}.resource-item{padding:8px 0;border-bottom:1px solid var(--twitter-border);display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:1rem;color:var(--twitter-text);transition:background-color .2s ease}.resource-item:hover{background:#1d9bf01a}.resource-link{color:var(--twitter-accent);text-decoration:none;display:flex;align-items:center;gap:4px;flex-grow:1;font-weight:500;transition:color .2s ease}.resource-link:hover{color:var(--twitter-accent-hover);text-decoration:underline}.external-icon{font-size:.8rem;opacity:.7;color:var(--twitter-text);transition:transform .2s ease}.external-icon:hover{transform:scale(1.2)}.resource-source{color:var(--twitter-text);font-size:.9rem;font-weight:400;line-height:1.5}.resource-price{background:linear-gradient(135deg,var(--twitter-accent) 0%,#17bfcb 100%);padding:4px 10px;border-radius:999px;font-size:.9rem;color:var(--twitter-text);font-weight:500;transition:transform .2s ease,box-shadow .2s ease}.resource-price:hover{transform:translateY(-1px);box-shadow:0 2px 8px var(--twitter-shadow)}@media (max-width: 768px){.resource-card{padding:15px}.resource-header{font-size:1.3rem}.resource-type{font-size:1.2rem}.resource-icon{font-size:1rem}.resource-section{padding:12px}.resource-item{font-size:.95rem}}@media (max-width: 480px){.resource-card{padding:12px}.resource-header{font-size:1.2rem}.resource-type{font-size:1.1rem}.resource-item{flex-direction:column;align-items:flex-start;font-size:.9rem}.resource-link,.resource-source,.resource-price{font-size:.85rem}.resource-icon,.external-icon{font-size:.9rem}}:root{--twitter-bg: #0F1419;--twitter-bg-secondary: #1A2028;--twitter-text: #FFFFFF;--twitter-accent: #1D9BF0;--twitter-accent-hover: #1871CA;--twitter-border: #2F3336;--twitter-shadow: rgba(0, 0, 0, .3)}.deepseek-widget{background:var(--twitter-bg-secondary);border-radius:8px;padding:20px;box-shadow:0 2px 4px var(--twitter-shadow);margin-bottom:20px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--twitter-text)}.widget-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.widget-header h3{font-size:1.5rem;font-weight:700;color:var(--twitter-text)}.ai-icon{font-size:1.5rem;color:var(--twitter-accent);transition:transform .2s ease}.ai-icon:hover{transform:scale(1.2)}.loading-state,.error-state,.empty-state{text-align:center;padding:20px;color:var(--twitter-text);font-size:1.1rem}.loading-state p,.error-state p,.empty-state p{margin:10px 0}.spinner{font-size:2rem;color:var(--twitter-accent);animation:spin .8s ease-in-out infinite,fade .8s ease-in-out infinite alternate}@keyframes fade{0%{opacity:1}to{opacity:.7}}.recommendations-container{display:flex;flex-direction:column;gap:20px}.recommendation-section{background:var(--twitter-bg);border-radius:5px;padding:15px;border:1px solid var(--twitter-border);transition:box-shadow .2s ease}.recommendation-section:hover{box-shadow:0 0 8px #1d9bf033}.recommendation-section h4{font-size:1.3rem;font-weight:600;color:var(--twitter-text);margin-bottom:12px}.recommendation-section ul{list-style:none;padding:0}.recommendation-section li{display:flex;align-items:flex-start;gap:8px;padding:8px 0;font-size:1rem;color:var(--twitter-text);transition:background-color .2s ease}.recommendation-section li:hover{background:#1d9bf01a}.bullet-icon{font-size:1rem;color:var(--twitter-accent);margin-top:4px;transition:transform .2s ease}.bullet-icon:hover{transform:scale(1.2)}.tutorial-section{background:var(--twitter-bg);border-radius:5px;padding:20px;border:1px solid var(--twitter-border);transition:box-shadow .2s ease}.tutorial-section:hover{box-shadow:0 0 8px #1d9bf033}.tutorial-section h4{font-size:1.4rem;font-weight:700;color:var(--twitter-text);margin-bottom:15px;background:linear-gradient(135deg,var(--twitter-accent) 0%,#17bfcb 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.tutorial-intro{font-size:1.1rem;color:var(--twitter-text);margin-bottom:20px;line-height:1.6}.tutorial-steps{padding-left:25px;margin-bottom:20px;font-size:1rem;color:var(--twitter-text)}.tutorial-steps li{margin-bottom:12px;line-height:1.5;position:relative;padding-left:12px;transition:background-color .2s ease}.tutorial-steps li:before{content:counter(step);counter-increment:step;position:absolute;left:-20px;top:2px;font-size:.9rem;color:var(--twitter-accent);font-weight:600}.tutorial-steps li:hover{background:#1d9bf01a;border-radius:4px}.tutorial-conclusion{font-size:1.1rem;color:var(--twitter-text);font-style:italic;line-height:1.6;padding-top:10px;border-top:1px solid var(--twitter-border)}@media (max-width: 768px){.deepseek-widget{padding:15px}.widget-header h3{font-size:1.3rem}.recommendation-section h4{font-size:1.2rem}.tutorial-section h4{font-size:1.3rem}.tutorial-intro,.tutorial-steps,.tutorial-conclusion{font-size:.95rem}.tutorial-steps li{padding-left:10px}}@media (max-width: 480px){.deepseek-widget{padding:12px}.widget-header h3{font-size:1.2rem}.recommendation-section h4{font-size:1.1rem}.recommendation-section li{font-size:.9rem}.tutorial-section h4{font-size:1.2rem}.tutorial-intro,.tutorial-steps,.tutorial-conclusion{font-size:.9rem}.tutorial-steps{padding-left:20px}.tutorial-steps li:before{left:-15px;font-size:.8rem}}.tutorial-steps{counter-reset:step}:root{--twitter-bg: #15202B;--twitter-bg-secondary: #1E2A38;--twitter-text: #FFFFFF;--twitter-text-input: #000000;--twitter-text-secondary: #8899A6;--twitter-accent: #1DA1F2;--twitter-accent-hover: #1A91DA;--twitter-border: #2F3E4A;--twitter-shadow: rgba(0, 0, 0, .2);--space-xs: .5rem;--space-sm: 1rem;--space-md: 1.5rem;--space-lg: 2rem;--space-xl: 3rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.25rem;--text-xl: 1.5rem;--text-2xl: 2rem;--text-3xl: 2.5rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--transition-fast: .15s;--transition-normal: .3s;--transition-slow: .5s}.roadmap-container{width:min(90vw,1400px);margin:0 auto;padding:var(--space-xl);background-color:var(--twitter-bg);color:var(--twitter-text);min-height:100vh}.roadmap-header{margin-bottom:var(--space-xl);display:flex;flex-direction:column;gap:var(--space-md)}.back-button{display:inline-flex;align-items:center;gap:var(--space-xs);background-color:var(--twitter-bg-secondary);color:var(--twitter-text);border:1px solid var(--twitter-border);border-radius:var(--radius-sm);padding:var(--space-xs) var(--space-sm);font-size:var(--text-lg);cursor:pointer;transition:all var(--transition-fast) ease;width:fit-content}.back-button:hover{background-color:var(--twitter-bg);color:var(--twitter-accent);border-color:var(--twitter-accent)}.roadmap-header h1{font-size:var(--text-3xl);color:var(--twitter-text);margin:var(--space-sm) 0;line-height:1.2}.roadmap-description{font-size:var(--text-lg);color:var(--twitter-text-secondary);line-height:1.5;max-width:80ch}.search-container{margin-bottom:var(--space-xl)}.roadmap-content{display:grid;grid-template-columns:minmax(300px,2fr) 3fr;gap:var(--space-xl);align-items:start}.roadmap-tree{background-color:var(--twitter-bg-secondary);border-radius:var(--radius-md);padding:var(--space-lg);box-shadow:0 2px 8px var(--twitter-shadow);position:sticky;top:var(--space-xl);max-height:calc(100vh - var(--space-xl) * 2);overflow-y:auto}.roadmap-node{margin-bottom:var(--space-sm);padding-left:calc(var(--space-md) * var(--depth, 0));cursor:pointer;transition:background-color var(--transition-fast);border-radius:var(--radius-sm)}.roadmap-node:hover{background-color:var(--twitter-bg)}.node-header{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm)}.toggle-icon,.toggle-spacer{width:22px;height:22px;color:var(--twitter-text-secondary);flex-shrink:0}.node-title{font-size:var(--text-lg);color:var(--twitter-text);flex:1;font-weight:500;line-height:1.3}.node-icons{display:flex;gap:var(--space-xs)}.resource-icon{color:var(--twitter-accent);font-size:var(--text-base)}.node-description{font-size:var(--text-sm);color:var(--twitter-text-secondary);margin:var(--space-xs) 0 0 calc(var(--space-md) + 22px);line-height:1.5}.node-children{margin-top:var(--space-sm);border-left:1px solid var(--twitter-border);margin-left:11px}.roadmap-resources{background-color:var(--twitter-bg-secondary);border-radius:var(--radius-md);padding:var(--space-lg);box-shadow:0 2px 8px var(--twitter-shadow)}.current-topic-header{margin-bottom:var(--space-lg)}.current-topic-header h2{font-size:var(--text-2xl);color:var(--twitter-text);margin-bottom:var(--space-sm);line-height:1.3}.topic-description{font-size:var(--text-base);color:var(--twitter-text-secondary);display:flex;gap:var(--space-xs);line-height:1.6}.description-icon{color:var(--twitter-accent);flex-shrink:0;margin-top:.25em}.select-topic-prompt{text-align:center;color:var(--twitter-text-secondary);font-size:var(--text-lg);padding:var(--space-xl)}.practice-now-banner{background-color:var(--twitter-bg-secondary);border-radius:var(--radius-sm);padding:var(--space-lg);margin-bottom:var(--space-lg);box-shadow:0 2px 8px var(--twitter-shadow);border:1px solid var(--twitter-accent)}.practice-now-banner h3{color:var(--twitter-text);font-size:var(--text-xl);margin-bottom:var(--space-xs)}.practice-now-banner p{color:var(--twitter-text-secondary);font-size:var(--text-base);margin-bottom:var(--space-md);line-height:1.5}.practice-now-banner button{background-color:var(--twitter-accent);color:var(--twitter-text-input);border:none;border-radius:var(--radius-sm);padding:var(--space-xs) var(--space-md);cursor:pointer;font-size:var(--text-base);font-weight:600;transition:background-color var(--transition-fast)}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;color:var(--twitter-text-secondary);gap:var(--space-md)}.spinner{width:50px;height:50px;border:5px solid var(--twitter-bg-secondary);border-top:5px solid var(--twitter-accent);border-radius:50%;animation:spin 1s linear infinite}@media (max-width: 1024px){.roadmap-container{width:95vw;padding:var(--space-lg)}.roadmap-content{grid-template-columns:1fr;gap:var(--space-lg)}.roadmap-tree{position:static;max-height:none}}@media (max-width: 768px){:root{--space-xl: 2rem;--space-lg: 1.5rem;--space-md: 1rem}.roadmap-header h1{font-size:var(--text-2xl)}}@media (max-width: 480px){:root{--space-xl: 1.5rem}.roadmap-container{padding:var(--space-md)}.roadmap-header h1{font-size:var(--text-xl)}.node-title{font-size:var(--text-base)}}@media (prefers-reduced-motion){.spinner{animation:none;border-top-color:transparent}.back-button,.roadmap-node,.practice-now-banner button{transition:none}}button:focus-visible,.roadmap-node:focus-visible{outline:2px solid var(--twitter-accent);outline-offset:2px}.roadmap-tree::-webkit-scrollbar,.roadmap-resources::-webkit-scrollbar{width:8px;height:8px}.roadmap-tree::-webkit-scrollbar-track,.roadmap-resources::-webkit-scrollbar-track{background:var(--twitter-bg-secondary);border-radius:4px}.roadmap-tree::-webkit-scrollbar-thumb,.roadmap-resources::-webkit-scrollbar-thumb{background:var(--twitter-border);border-radius:4px}.roadmap-tree::-webkit-scrollbar-thumb:hover,.roadmap-resources::-webkit-scrollbar-thumb:hover{background:var(--twitter-accent)}.roadmap-tree,.roadmap-resources{scrollbar-width:thin;scrollbar-color:var(--twitter-border) var(--twitter-bg-secondary)}.roadmap-tree{scroll-behavior:smooth;overscroll-behavior:contain}@media (prefers-reduced-motion: no-preference){html{scroll-behavior:smooth}}.roadmap-node{scroll-margin:var(--space-sm)}.current{box-shadow:inset 3px 0 0 var(--twitter-accent);background-color:color-mix(in srgb,var(--twitter-accent) 8%,transparent)}.roadmap-node:focus-within{outline:2px solid var(--twitter-accent);outline-offset:2px}:root{--twitter-bg: #15202B;--twitter-bg-secondary: #1E2A38;--twitter-text: #FFFFFF;--twitter-text-input: #000000;--twitter-text-secondary: #8899A6;--twitter-accent: #1DA1F2;--twitter-accent-hover: #1A91DA;--twitter-border: #2F3E4A;--twitter-shadow: rgba(0, 0, 0, .2)}.roadmap-container{max-width:3000px;width:90vw;margin:0 auto;padding:30px;background-color:var(--twitter-bg);color:var(--twitter-text)}.roadmap-header{margin-bottom:40px}.back-button{display:flex;align-items:center;gap:10px;background-color:var(--twitter-bg-secondary);color:var(--twitter-text-input);border:1px solid var(--twitter-border);border-radius:5px;padding:10px 20px;font-size:1.1rem;cursor:pointer;transition:background-color .2s,color .2s}.back-button:hover{background-color:var(--twitter-bg);color:var(--twitter-accent)}.roadmap-header h1{font-size:2.2rem;color:var(--twitter-text);margin:15px 0}.roadmap-description{font-size:1.2rem;color:var(--twitter-text-secondary)}.search-container{margin-bottom:30px}.roadmap-content{display:grid;grid-template-columns:2fr 3fr;gap:30px}.roadmap-tree{background-color:var(--twitter-bg-secondary);border-radius:8px;padding:30px;box-shadow:0 2px 4px var(--twitter-shadow)}.roadmap-node{margin-bottom:20px;padding-left:calc(25px * var(--depth, 0));cursor:pointer;transition:background-color .2s}.roadmap-node:hover{background-color:var(--twitter-bg);border-radius:5px}.node-header{display:flex;align-items:center;gap:12px;padding:12px}.toggle-icon,.toggle-spacer{width:22px;height:22px;color:var(--twitter-text-secondary)}.node-title{font-size:1.3rem;color:var(--twitter-text);flex:1}.node-icons{display:flex;gap:10px}.resource-icon{color:var(--twitter-accent);font-size:1.1rem}.node-description{font-size:1rem;color:var(--twitter-text-secondary);margin:8px 0 0 35px}.node-children{margin-top:15px}.current{border-left:4px solid var(--twitter-accent);background-color:var(--twitter-bg)}.roadmap-resources{background-color:var(--twitter-bg-secondary);border-radius:8px;padding:30px;box-shadow:0 2px 4px var(--twitter-shadow)}.current-topic-header h2{font-size:1.8rem;color:var(--twitter-text);margin-bottom:15px}.topic-description{font-size:1.1rem;color:var(--twitter-text-secondary);display:flex;align-items:flex-start;gap:10px}.description-icon{color:var(--twitter-accent);margin-top:2px}.select-topic-prompt{text-align:center;color:var(--twitter-text-secondary);font-size:1.1rem;padding:30px}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;color:var(--twitter-text-secondary)}.spinner{width:50px;height:50px;border:5px solid var(--twitter-bg-secondary);border-top:5px solid var(--twitter-accent);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.practice-now-banner{background-color:var(--twitter-bg-secondary);border-radius:5px;padding:25px;margin-bottom:25px;box-shadow:0 2px 4px var(--twitter-shadow)}.practice-now-banner h3{color:var(--twitter-text);font-size:1.4rem}.practice-now-banner p{color:var(--twitter-text-secondary);font-size:1rem}.practice-now-banner button{background-color:var(--twitter-accent);color:var(--twitter-text-input);border:none;border-radius:5px;padding:12px 25px;cursor:pointer;font-size:1.1rem;transition:background-color .2s}.practice-now-banner button:hover{background-color:var(--twitter-accent-hover)}@media (max-width: 1024px){.roadmap-container{width:95vw;padding:20px}.roadmap-content{grid-template-columns:1fr;gap:20px}.roadmap-tree,.roadmap-resources{padding:20px}.roadmap-header h1{font-size:2rem}.back-button{padding:8px 15px;font-size:1rem}}@media (max-width: 768px){.roadmap-container,.roadmap-tree,.roadmap-resources{padding:15px}.node-title{font-size:1.2rem}.node-description{font-size:.95rem}.current-topic-header h2{font-size:1.6rem}}@media (max-width: 480px){.roadmap-container{padding:10px}.roadmap-header h1{font-size:1.8rem}.node-title{font-size:1.1rem}.node-description{font-size:.9rem}.back-button{padding:6px 12px;font-size:.95rem}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.app-container{display:flex;flex-direction:column;min-height:100vh;text-align:center;justify-content:center;margin:0 auto}