:root{--brand-primary:#5f56fe;--brand-primary-light:#eeecff;--brand-primary-medium:#d4d0ff;--text-gray:#64748b;--text-light:#717171;--state-strong:#10b981;--state-strong-bg:#d1fae5;--state-strong-border:#6ee7b7;--state-fragile:#f59e0b;--state-fragile-bg:#fef3c7;--state-weak:#ef4444;--state-weak-bg:#fee2e2;--state-weak-border:#fca5a5;--green-bg:#dcfce7;--outcome-gradual:#3b82f6;--cyan-bg:#cffafe;--lavender-bg:#ede9fe;--peach-bg:#ffedd5;--blue-bg:#dbeafe;--bg-white:#fff;--bg-off-white:#fafafa;--bg-subtle:#f8fafc;--border-light:rgba(95,86,254,.08);--border-medium:rgba(95,86,254,.15);--shadow-sm:0 1px 2px rgba(0,0,0,.04);--shadow-md:0 4px 12px rgba(0,0,0,.06);--shadow-lg:0 12px 40px rgba(0,0,0,.08);--sidebar-width:280px;--sidebar-header-height:60px}html{scroll-behavior:smooth}body,html{overflow-x:hidden}body{background:var(--bg-off-white);min-height:100vh;-webkit-font-smoothing:antialiased;color:var(--text-dark)}::selection{background:var(--brand-primary);color:#fff}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--brand-primary-medium);border-radius:3px}.app-layout{display:flex;min-height:100vh;overflow-x:hidden;max-width:100vw}.internal-links-block,.sr-only{display:none}.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-width);height:100vh;padding-bottom:48px;background:var(--bg-white);border-right:1px solid var(--border-color);z-index:200;transform:translateX(-100%);transition:transform .3s ease;overflow-y:auto}.sidebar::-webkit-scrollbar{display:none}.sidebar-header{position:-webkit-sticky;position:sticky;top:0;height:var(--sidebar-header-height);padding:0 1rem;display:flex;align-items:center;justify-content:space-between;z-index:10;background:#fff;border-bottom:1px solid var(--border-color)}.codefly-nav-toggler{border:none;display:flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:18px;color:#1f2937;background:transparent;border:1px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s;padding:0}.codefly-nav-toggler:hover{background:var(--bs-light);border:1px solid var(--border-color)}.codefly-nav-toggler svg{display:block}.sidebar-topic-header{position:-webkit-sticky;position:sticky;top:var(--sidebar-header-height);padding:.75rem 1rem;z-index:10;background:#fff;border-bottom:1px solid var(--border-color)}.sidebar-title{font-size:.75rem;font-weight:700;color:var(--text-gray);text-transform:uppercase;letter-spacing:.05em;margin-bottom:16px}.topic-info{display:flex;align-items:center;gap:.75rem}.topic-icon-large,.topic-logo{width:44px;height:44px}.topic-icon-large{background:linear-gradient(135deg,var(--brand-primary) 0,#8b7ffd 100%);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.3rem;box-shadow:0 8px 30px rgba(95,86,254,.25)}.topic-details{flex:1 1}.topic-name{font-size:1rem;font-weight:700;color:var(--text-dark)}.topic-meta-text{font-size:.75rem;color:var(--text-gray)}.chapter-group{border-bottom:1px solid var(--border-color)}.chapter-header{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1rem;cursor:pointer;transition:background .2s ease}.chapter-header:hover{background:var(--bg-subtle)}.chapter-header-left{display:flex;align-items:center;flex:1 1;gap:.6rem}.chapter-icon{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;background:var(--bg-subtle);border:1px solid var(--border-medium)}.chapter-name{font-size:.9rem;font-weight:700;color:var(--text-dark);flex:1 1}.chapter-count{font-size:.7rem;color:var(--text-gray);padding:.2rem .5rem;background:var(--bg-subtle);border-radius:50px}.chapter-chevron{width:20px;height:20px;color:var(--text-gray);transition:transform .3s ease}.chapter-group.expanded .chapter-chevron{transform:rotate(180deg)}.chapter-title{font-size:.9rem;font-weight:700;color:var(--text-dark);flex:1 1}.chapter-toggle{width:20px;height:20px;min-width:20px;color:var(--text-gray);transition:transform .3s ease}.chapter-group.expanded .chapter-toggle{transform:rotate(180deg)}.chapter-modules{max-height:0;overflow:hidden;transition:max-height .3s ease}.chapter-group.expanded .chapter-modules{max-height:500px}.module-list{max-height:0;overflow:hidden;transition:max-height .3s ease}.chapter-group.expanded .module-list{max-height:unset}.module-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem .75rem 2.75rem;cursor:pointer;transition:all .2s ease;position:relative}.module-item:before{content:"";position:absolute;left:1.5rem;top:0;bottom:0;width:2px;background:var(--border-light)}.module-item:last-child:before{bottom:50%}.module-item:hover{background:var(--hover-bg-color)}.module-item.active{background:var(--brand-primary-light)}.module-item.active:after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brand-primary)}.module-status{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.75rem;font-weight:600;transition:all .2s ease}.module-status.not-started{background:var(--bg-subtle);border:1.5px dashed var(--border-color);color:var(--text-gray)}.module-status.in-progress{background:var(--brand-primary-light);border:1.5px solid var(--brand-primary-medium);color:var(--brand-primary)}.module-status.completed{background:var(--green-bg);border:1.5px solid var(--state-strong-border);color:var(--state-strong)}.module-item.active .module-status{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}.module-info{flex:1 1;min-width:0}.module-name{font-size:.82rem;font-weight:500;color:var(--text-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.module-item.active .module-name{color:var(--brand-primary);font-weight:600}.module-progress-bar{height:4px;background:var(--border-light);border-radius:2px;overflow:hidden}.module-progress-fill{height:100%;background:var(--brand-primary);border-radius:2px;transition:width .4s ease}.module-progress-bar.completed .module-progress-fill{background:var(--state-strong)}.sidebar-toggle{position:fixed;top:1rem;left:1rem;width:44px;height:44px;background:var(--bg-white);border:1px solid var(--border-light);border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:101;transition:all .3s var(--ease-out-expo);box-shadow:var(--shadow-sm)}.sidebar-toggle:hover{border-color:var(--brand-primary);box-shadow:var(--shadow-md)}.sidebar-toggle svg{width:20px;height:20px;color:var(--text-dark)}.main-content{flex:1 1;margin-left:0;min-height:100vh;overflow-x:hidden;transition:margin-left .3s var(--ease-out-expo)}.content-container{padding:84px 32px 48px;max-width:1000px;margin:0 auto;overflow-x:hidden}.topic-header{margin-bottom:2rem;animation:fadeIn .4s var(--ease-out-expo)}.topic-meta{display:flex;align-items:center;gap:.75rem;margin-bottom:24px;flex-wrap:wrap}.meta-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .85rem;background:var(--bg-white);border:1px solid var(--border-light);border-radius:50px;font-size:.8rem;font-weight:500;color:var(--text-gray)}.meta-pill.category{background:var(--lavender-bg);border-color:transparent;color:var(--brand-primary)}.meta-pill svg{width:14px;height:14px}.topic-title{font-size:2rem;font-weight:800;color:var(--text-dark);letter-spacing:-.02em;line-height:1.2}.mode-tabs-container{margin-bottom:1.75rem;overflow:hidden}.mode-tabs-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;padding:0 .25rem}.mode-tabs-label{font-size:.9rem;font-weight:600;color:var(--text-dark)}.mode-tabs-hint{font-size:.8rem;color:var(--text-gray);background:var(--bg-subtle);padding:.3rem .75rem;border-radius:50px}.mode-tabs-wrapper{overflow-x:auto;scrollbar-width:none;padding:.5rem 0;-webkit-overflow-scrolling:touch}.mode-tabs-wrapper::-webkit-scrollbar{display:none}.mode-tabs{display:inline-flex;padding:.4rem;background:var(--bg-white);border:1px solid var(--border-light);border-radius:14px}.mode-tab,.mode-tabs{gap:.5rem;white-space:nowrap}.mode-tab{display:flex;align-items:center;padding:.8rem 1.25rem;background:transparent;border:none;border-radius:10px;font-size:.9rem;font-weight:600;color:var(--text-gray);cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative}.mode-tab:hover{background:var(--bg-subtle);color:var(--text-dark);transform:translateY(-1px)}.mode-tab:active{transform:translateY(0)}.mode-tab.active{background:var(--mode-bg);color:var(--mode-color);box-shadow:0 2px 8px rgba(0,0,0,.08)}.mode-tab svg{width:18px;height:18px;flex-shrink:0;transition:transform .2s ease}.mode-tab:hover svg{transform:scale(1.1)}.mode-tab[data-mode=learn]{--mode-color:var(--brand-primary);--mode-bg:var(--brand-primary-light)}.mode-tab[data-mode=why]{--mode-color:#8b5cf6;--mode-bg:#ede9fe}.mode-tab[data-mode=try]{--mode-color:#14b8a6;--mode-bg:#ccfbf1}.mode-tab[data-mode=challenge]{--mode-color:#ef4444;--mode-bg:#fee2e2}.mode-tab[data-mode=project]{--mode-color:#ec4899;--mode-bg:#fce7f3}.mode-tab[data-mode=recall]{--mode-color:#06b6d4;--mode-bg:#cffafe}.mode-tab[data-mode=time]{--mode-color:#10b981;--mode-bg:#d1fae5}.content-card{background:var(--bg-white);border-radius:16px;margin-bottom:1.75rem;border:1px solid var(--border-light);box-shadow:var(--shadow-sm);overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1);max-width:100%}.content-card:hover{box-shadow:0 10px 40px -10px rgba(0,0,0,.1),0 4px 12px -2px rgba(0,0,0,.05);transform:translateY(-2px)}.code-articles-card-header{padding:1rem 1.5rem;background:var(--bg-subtle);border-bottom:1px solid var(--border-light);display:flex;align-items:center;gap:.75rem}.card-icon{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:transform .2s ease}.content-card:hover .card-icon{transform:scale(1.05)}.card-icon{background:var(--cyan-bg)}.card-icon.example,.card-icon.tips,.card-icon.visual{background:var(--bs-warning-bg-subtle)}.card-icon.summary,.card-icon.time{background:var(--green-bg)}.card-icon.project{background:#fce7f3}.card-icon .material-symbols{color:var(--outcome-gradual)}.card-icon.example .material-symbols,.card-icon.tips .material-symbols,.card-icon.visual .material-symbols{color:var(--state-fragile)}.card-icon.solution .material-symbols,.card-icon.summary .material-symbols,.card-icon.time .material-symbols{color:var(--state-strong)}.card-icon.project .material-symbols{color:var(--state-weak)}.codefly-card-title{font-size:16px;font-weight:700;color:var(--text-dark)}.code-articles-card-body{padding:1.75rem 2rem;overflow-x:hidden}.code-articles-card-body p{font-size:16px;line-height:1.85;color:#374151;max-width:65ch;word-wrap:break-word}.code-articles-card-body p+p{margin-top:1.25rem}.code-articles-card-body strong{color:var(--text-dark);font-weight:600}.intro-text{font-size:16px;line-height:1.85;color:#374151;margin-bottom:1.25rem}.intro-text p{margin:0}.syntax-notes{margin-top:1.25rem;display:flex;flex-direction:column;gap:.75rem}.syntax-note{padding:.85rem 1.15rem;background:linear-gradient(135deg,var(--brand-primary-light) 0,#f8f7ff 100%);border:1px solid var(--brand-primary-medium);border-radius:10px;font-size:15px;line-height:1.65;color:var(--text-dark)}.syntax-note p{margin:0;font-size:15px}.syntax-note code{background:rgba(95,86,254,.1);padding:.15rem .4rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.85rem;color:var(--brand-primary)}.sample-program-desc{font-size:1rem;line-height:1.75;margin-bottom:1rem;padding:1rem 1.25rem;background:linear-gradient(135deg,#f0fdf4 0,var(--bg-white) 100%);border:1px solid var(--state-strong-border);border-radius:10px}.sample-program-desc p{margin:0;font-size:1rem;color:var(--text-dark)}.run-code-section{margin-top:1rem}.run-code-btn{padding:.75rem 1.5rem;background:linear-gradient(135deg,var(--state-strong) 0,#059669 100%);font-size:15px;box-shadow:0 4px 15px rgba(16,185,129,.3)}.run-code-btn:hover{box-shadow:0 6px 20px rgba(16,185,129,.4)}.run-code-btn:active{transform:translateY(0)}.run-code-btn svg{width:18px;height:18px}.run-code-btn .loading-spinner{width:18px;height:18px;border-color:#fff hsla(0,0%,100%,.3) hsla(0,0%,100%,.3)}.code-output-container{margin-top:1rem;border-radius:12px;overflow:hidden;border:1px solid var(--border-light);display:none}.code-output-container.visible{display:block;animation:slideDown .3s var(--ease-out-expo)}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.code-output-header{padding:.75rem 1.25rem;background:#1e293b;display:flex;align-items:center;justify-content:space-between}.code-output-title{font-size:.85rem;font-weight:600;color:#94a3b8;display:flex;align-items:center;gap:.5rem}.code-output-title svg{width:16px;height:16px}.code-output-status{font-size:.75rem;padding:.25rem .6rem;border-radius:50px;font-weight:600}.code-output-status.success{background:rgba(16,185,129,.2);color:#34d399}.code-output-status.error{background:rgba(239,68,68,.2);color:#f87171}.code-output-body{padding:1.25rem 1.5rem;background:#0f172a;font-family:JetBrains Mono,monospace;font-size:.9rem;line-height:1.7;color:#e2e8f0;white-space:pre-wrap;min-height:60px}.code-output-loading{display:flex;align-items:center;gap:.75rem;color:#94a3b8}.loading-spinner{width:20px;height:20px;border:2px solid #334155;border-top-color:#3b82f6;border-radius:50%;animation:spin .8s linear infinite}.output-line{display:block;color:#4ade80}.output-line:before{content:"› ";color:#64748b}.code-block{margin:1.25rem 0;border-radius:12px;background:#f6f8fa;border:1px solid #e1e4e8}.code-block:first-child{margin-top:0}.code-header{padding:.75rem 1.25rem;background:#f1f3f5;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e1e4e8}.code-title{font-size:.85rem;font-weight:600;color:var(--text-dark)}.code-copy-btn{width:32px;height:32px;background:transparent;border:1px solid #d0d7de;border-radius:6px;color:var(--text-gray);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.code-copy-btn:hover{background:var(--bg-white);border-color:var(--brand-primary);color:var(--brand-primary)}.code-copy-btn svg{width:16px;height:16px}.code-content{padding:1.25rem 1.5rem;font-family:JetBrains Mono,SF Mono,Monaco,monospace;font-size:.9rem;line-height:1.7;color:#24292f;overflow-x:auto;white-space:pre;max-width:100%}.code-block{max-width:100%;overflow:hidden}.code-block-simple{background:#f8f9fa;border-radius:0;max-width:100%}.code-block-simple .code-content{padding:1.5rem}.hl-kw{font-weight:500}.hl-fn,.hl-kw{color:#8250df}.hl-str{color:#0a3069}.hl-num{color:#cf5a00}.hl-cmt{color:#6e7781;font-style:italic}.hl-op{color:#cf222e}.pattern-highlight{background:linear-gradient(135deg,#fef3c7,#fef9c3);border:1px solid #fcd34d;border-left-width:4px;border-radius:12px;padding:1.5rem 1.75rem}.pattern-highlight p{color:var(--text-dark);font-weight:500;font-size:1.1rem;line-height:1.8;margin:0}.why-content{font-size:16px;line-height:1.85;color:var(--text-dark)}.why-content p{margin:0 0 .75rem}.why-content p:last-child{margin-bottom:0}.why-problem{padding:1.25rem 1.5rem;background:linear-gradient(135deg,#fef2f2,#fee2e2);border:1px solid #fecaca;border-left:4px solid var(--state-weak);border-radius:12px;font-size:1rem;line-height:1.75;color:#991b1b}.why-problem p{margin:0 0 .5rem}.why-problem p:last-child{margin-bottom:0}.why-solution{padding:1.25rem 1.5rem;background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:1px solid #bbf7d0;border-left:4px solid var(--state-strong);border-radius:12px;font-size:1rem;line-height:1.75;color:#166534}.why-solution p{margin:0 0 .5rem}.why-solution p:last-child{margin-bottom:0}.why-solution strong{color:#15803d}.why-enables{padding:1.25rem 1.5rem;background:linear-gradient(135deg,var(--brand-primary-light) 0,#ede9fe 100%);border:1px solid var(--brand-primary-medium);border-radius:12px;font-size:16px;line-height:1.75;color:var(--text-dark)}.why-enables p{margin:0}.why-reallife{padding:1.25rem 1.5rem;background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border:1px solid #7dd3fc;border-radius:12px;font-size:16px;line-height:1.75;color:#0c4a6e;display:flex;align-items:flex-start;gap:.75rem}.why-reallife:before{content:"💼";font-size:1.25rem;flex-shrink:0}.why-reallife p{margin:0}.use-cases-list{display:flex;flex-direction:column;gap:.75rem;margin-top:1.25rem}.use-case-tag{padding:1rem 1.25rem;background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border:1px solid #7dd3fc;border-radius:12px;font-size:1rem;font-weight:500;color:#0369a1;display:flex;align-items:center;gap:.75rem;transition:all .2s ease}.use-case-tag:hover{background:linear-gradient(135deg,#e0f2fe,#bae6fd);transform:translateX(4px)}.use-case-tag:before{content:"✦";font-size:.85rem;color:#0ea5e9}.examples-list{gap:1.5rem}.example-item,.examples-list{display:flex;flex-direction:column}.example-item{gap:.75rem}.example-desc{padding:1rem 1.25rem;font-size:1rem;font-weight:600;color:var(--text-dark);line-height:1.5;background:var(--bg-white);border:1px solid var(--border-light);border-radius:12px;display:flex;align-items:center;gap:.75rem;box-shadow:var(--shadow-sm)}.example-desc .material-symbols{color:var(--brand-primary)}.example-item .code-block{margin:0;border-radius:12px}.example-item .code-header{border-radius:12px 12px 0 0}.info-cards{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem}.info-card{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;background:var(--bg-subtle);border:1px solid var(--border-light);border-radius:10px;transition:all .2s ease}.info-card:hover{background:var(--bg-white);box-shadow:var(--shadow-sm)}.info-card-icon{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.85rem;flex-shrink:0;background:var(--state-fragile-bg)}.info-card-text{font-size:1rem;line-height:1.65;flex:1 1}.info-card-text p{margin:0;font-size:1rem}.info-card-text strong{color:var(--text-dark)}.info-card-text code{background:rgba(95,86,254,.1);padding:.15rem .4rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.85rem;color:var(--brand-primary)}.info-card.success{background:linear-gradient(135deg,#f0fdf4 0,var(--bg-white) 100%);border-color:var(--state-strong-border)}.info-card.success .info-card-icon{background:var(--state-strong-bg);color:var(--state-strong)}.info-card.error{background:linear-gradient(135deg,#fef2f2 0,var(--bg-white) 100%);border-color:var(--state-weak-border)}.info-card.error .info-card-icon{background:var(--state-weak-bg);color:var(--state-weak)}.summary-list{display:flex;flex-direction:column;gap:.85rem}.summary-item{display:flex;align-items:flex-start;gap:1rem;padding:1rem 1.25rem;background:linear-gradient(135deg,#f0fdf4 0,var(--bg-white) 100%);border:1px solid var(--state-strong-border);border-radius:10px}.summary-check{width:22px;height:22px;background:var(--state-strong);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}.summary-check svg{width:12px;height:12px}.summary-text{font-size:1rem;color:#1f2937;line-height:1.65}.summary-text p{margin:0;font-size:1rem}.summary-text code{background:rgba(16,185,129,.1);padding:.15rem .4rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.85rem;color:var(--state-strong)}.comparison-stack{display:flex;flex-direction:column;gap:1.5rem;margin-top:1.25rem}.comparison-card{border-radius:16px;overflow:hidden;background:var(--bg-white);box-shadow:var(--shadow-sm)}.comparison-card.before{border:2px solid var(--state-weak)}.comparison-card.after{border:2px solid var(--state-strong)}.comparison-header{padding:1rem 1.5rem;font-size:16px;font-weight:700;display:flex;align-items:center;gap:.5rem}.comparison-card.before .comparison-header{background:linear-gradient(135deg,#fef2f2,#fff5f5);color:var(--state-weak)}.comparison-card.after .comparison-header{background:linear-gradient(135deg,#f0fdf4,#ecfdf5);color:var(--state-strong)}.comparison-card .code-block-simple{background:var(--bg-white);border-radius:0}.comparison-card .code-block-simple .code-content{background:var(--bg-white)}.visual-steps{margin-top:1rem}.visual-step{display:flex;gap:1.15rem;padding-bottom:1.5rem;margin-bottom:1.5rem;border-bottom:1px dashed var(--border-light)}.visual-step:last-child{padding-bottom:0;margin-bottom:0;border-bottom:none}.step-num{width:36px;height:36px;background:var(--state-fragile);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;flex-shrink:0}.step-content{flex:1 1}.step-content h4{font-size:16px;font-weight:700;color:var(--text-dark);margin-bottom:.5rem}.step-content p{font-size:1rem;color:#4b5563;line-height:1.75;margin-bottom:1rem}.step-diagram{border:1px solid var(--border-light);border-radius:10px;padding:1.25rem;font-family:JetBrains Mono,monospace;font-size:15px;color:var(--text-dark);text-align:center;white-space:pre-line}.step-diagram,.task-card{background:var(--bg-subtle)}.task-card{border:1px solid var(--border-light);border-radius:12px;padding:1.5rem;margin-bottom:1.25rem;transition:all .3s ease}.task-card.correct{border-color:var(--state-strong);background:linear-gradient(135deg,#f0fdf4 0,var(--bg-white) 100%)}.task-card.incorrect{border-color:var(--state-weak);background:linear-gradient(135deg,#fef2f2 0,var(--bg-white) 100%)}.task-card.answered .task-options{pointer-events:none}.task-header{justify-content:space-between;margin-bottom:1rem}.task-badge,.task-header{display:flex;align-items:center}.task-badge{gap:.75rem}.task-number{width:32px;height:32px;border-radius:8px;background:var(--brand-primary);color:#fff;font-size:.9rem;font-weight:700;display:flex;align-items:center;justify-content:center}.task-type{font-size:.8rem;font-weight:600;color:var(--text-gray);text-transform:uppercase}.task-difficulty{font-size:.75rem;font-weight:700;padding:.35rem .75rem;border-radius:50px}.task-difficulty.easy{background:var(--green-bg);color:var(--state-strong)}.task-difficulty.intermediate,.task-difficulty.medium{background:var(--state-fragile-bg);color:var(--state-fragile)}.task-difficulty.hard{background:var(--state-weak-bg);color:var(--state-weak)}.task-difficulty.advanced{background:var(--peach-bg);color:#ea580c}.task-difficulty.expert{background:var(--lavender-bg);color:var(--brand-primary)}.try-type-tabs{display:flex;gap:.5rem;margin-bottom:1.5rem;padding:.5rem;background:var(--bg-subtle);border-radius:12px}.try-type-tab{flex:1 1;padding:.85rem 1rem;background:transparent;border:none;border-radius:10px;font-size:.9rem;font-weight:600;color:var(--text-gray);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:.5rem}.try-type-tab:hover{background:var(--bg-white);color:var(--text-dark)}.try-type-tab.active{background:var(--bg-white);color:var(--brand-primary);box-shadow:var(--shadow-sm)}.try-type-tab .tab-count{font-size:.75rem;padding:.15rem .5rem;background:var(--bg-subtle);border-radius:50px}.try-type-tab.active .tab-count{background:var(--brand-primary-light);color:var(--brand-primary)}.puzzle-nav{gap:.5rem;margin-bottom:1.25rem}.puzzle-nav,.puzzle-nav-btn{display:flex;justify-content:center}.puzzle-nav-btn{width:44px;height:44px;border-radius:10px;border:2px solid var(--border-light);background:var(--bg-white);font-size:1rem;font-weight:700;color:var(--text-gray);cursor:pointer;transition:all .2s ease;align-items:center}.puzzle-nav-btn:hover{border-color:var(--brand-primary-medium);color:var(--brand-primary)}.puzzle-nav-btn.active{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}.puzzle-nav-btn.completed{background:var(--state-strong-bg);border-color:var(--state-strong);color:var(--state-strong)}.puzzle-nav-btn.failed{background:var(--state-weak-bg);border-color:var(--state-weak);color:var(--state-weak)}.puzzle-container,.puzzle-nav-btn .difficulty-dot{display:none}.puzzle-container.active{display:block}.hint-box{margin-top:1rem;padding:1rem 1.25rem;background:linear-gradient(135deg,#fef3c7,#fef9c3);border:1px solid #fcd34d;border-radius:10px;display:none}.hint-box.visible{display:block;animation:slideDown .3s var(--ease-out-expo)}.hint-box-title{font-size:.8rem;font-weight:700;color:#b45309;text-transform:uppercase;letter-spacing:.03em;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem}.hint-box-text{font-size:15px;color:#92400e;line-height:1.6}.mistakes-box{margin-top:.75rem;padding:1rem 1.25rem;background:linear-gradient(135deg,#fef2f2,#fee2e2);border:1px solid #fecaca;border-radius:10px;display:none}.mistakes-box.visible{display:block;animation:slideDown .3s var(--ease-out-expo)}.mistakes-box-title{font-size:.8rem;font-weight:700;color:#b91c1c;text-transform:uppercase;letter-spacing:.03em;margin-bottom:.5rem}.mistakes-list{display:flex;flex-direction:column;gap:.4rem}.mistake-item{font-size:.9rem;color:#991b1b}.mistake-item:before{content:"✗";color:var(--state-weak);font-weight:700;flex-shrink:0;margin-right:8px}.attempts-counter{display:flex;align-items:center;gap:.5rem;margin-top:1rem;padding:.75rem 1rem;background:var(--bg-subtle);border-radius:8px;font-size:.85rem;color:var(--text-gray)}.attempts-counter .attempts-dots{display:flex;gap:.35rem}.attempts-counter .attempt-dot{width:10px;height:10px;border-radius:50%;background:var(--border-light)}.attempts-counter .attempt-dot.used{background:var(--state-weak)}.attempts-counter .attempt-dot.correct{background:var(--state-strong)}.learning-checkpoint{margin-top:1.5rem;padding:1.25rem 1.5rem;background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:1px solid #bbf7d0;border-radius:12px}.checkpoint-title{font-size:.85rem;font-weight:700;color:var(--state-strong);text-transform:uppercase;letter-spacing:.03em;margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem}.checkpoint-text{font-size:1rem;color:#166534;line-height:1.65}.checkpoint-text p{margin:0}.challenge-nav{gap:.5rem;margin-bottom:1.25rem}.challenge-nav,.challenge-nav-btn{display:flex;justify-content:center}.challenge-nav-btn{width:44px;height:44px;border-radius:10px;border:2px solid var(--border-light);background:var(--bg-white);font-size:1rem;font-weight:700;color:var(--text-gray);cursor:pointer;transition:all .2s ease;align-items:center}.challenge-nav-btn:hover{border-color:var(--brand-primary-medium);color:var(--brand-primary)}.challenge-nav-btn.active{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}.challenge-nav-btn.completed{background:var(--state-strong-bg);border-color:var(--state-strong);color:var(--state-strong)}.challenge-nav-btn.failed{background:var(--state-weak-bg);border-color:var(--state-weak);color:var(--state-weak)}.challenge-nav-btn.timeout{background:#fef3c7;border-color:#f59e0b;color:#b45309}.challenge-container{display:none}.challenge-container.active{display:block}.challenge-timer{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.25rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #fcd34d;border-radius:10px;margin-bottom:1rem}.challenge-timer.warning{border-color:#f87171;animation:timerPulse 1s ease-in-out infinite}.challenge-timer.expired,.challenge-timer.warning{background:linear-gradient(135deg,#fee2e2,#fecaca)}.challenge-timer.expired{border-color:var(--state-weak)}@keyframes timerPulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.timer-icon{width:20px;height:20px;color:#b45309}.challenge-timer.warning .timer-icon{color:var(--state-weak)}.timer-value{font-family:JetBrains Mono,monospace;font-size:1.1rem;font-weight:700;color:#92400e}.challenge-timer.warning .timer-value{color:var(--state-weak)}.timer-label{font-size:.85rem;color:#a16207}.challenge-timer.warning .timer-label{color:var(--state-weak)}.challenge-type-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .75rem;border-radius:6px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em}.challenge-type-badge.code_output{background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#1d4ed8}.challenge-type-badge.debug{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#b45309}.challenge-type-badge.application{background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#047857}.challenge-type-badge.conceptual{background:linear-gradient(135deg,#ede9fe,#ddd6fe);color:#6d28d9}.challenge-type-badge.syntax{background:linear-gradient(135deg,#fce7f3,#fbcfe8);color:#be185d}.challenge-attempts{display:flex;align-items:center;gap:.5rem;margin-top:.75rem;padding:.6rem 1rem;background:var(--bg-subtle);border-radius:8px;font-size:.85rem;color:var(--text-gray)}.challenge-attempts .attempt-dots{display:flex;gap:.35rem}.challenge-attempts .attempt-dot{width:10px;height:10px;border-radius:50%;background:var(--border-light)}.challenge-attempts .attempt-dot.used{background:var(--state-weak)}.challenge-attempts .attempt-dot.correct{background:var(--state-strong)}.challenge-hint{margin-top:1rem;padding:1rem 1.25rem;background:linear-gradient(135deg,#fef3c7,#fef9c3);border:1px solid #fcd34d;border-radius:10px;display:none}.challenge-hint.visible{display:block;animation:slideDown .3s var(--ease-out-expo)}.challenge-hint-title{font-size:.8rem;font-weight:700;color:#b45309;text-transform:uppercase;letter-spacing:.03em;margin-bottom:.5rem}.challenge-hint-text{font-size:15px;color:#92400e;line-height:1.6}.challenge-hint-text p{margin:0}.challenge-hint-text code{background:rgba(180,83,9,.15);padding:.1rem .4rem;border-radius:4px}.challenge-prompt{font-size:1rem;line-height:1.7;color:var(--text-dark)}.challenge-prompt p{margin:0 0 .75rem}.challenge-prompt p:last-child{margin-bottom:0}.challenge-prompt pre{background:var(--bg-subtle);padding:.75rem 1rem;border-radius:8px;font-family:JetBrains Mono,monospace;font-size:.9rem;overflow-x:auto}.challenge-prompt code{background:var(--brand-primary-light);color:var(--brand-primary);padding:.1rem .4rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.9em}.achievement-preview{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #fcd34d;border-radius:10px;margin-bottom:1.25rem}.achievement-icon{font-size:1.5rem}.achievement-info{flex:1 1}.achievement-name{font-weight:700;color:#92400e;font-size:15px}.achievement-condition{font-size:.85rem;color:#a16207}.task-option.task-option-code{flex-direction:column;align-items:flex-start;padding:.75rem 1rem}.task-option.task-option-code .task-option-key{margin-bottom:.5rem}.task-option.task-option-code .option-code{width:100%;margin:0;padding:.5rem .75rem;background:var(--bg-subtle);border-radius:6px;font-family:JetBrains Mono,monospace;font-size:.8rem;line-height:1.5;white-space:pre;overflow-x:auto}.task-option.task-option-code.correct-answer .option-code{background:rgba(16,185,129,.1)}.task-option.task-option-code.wrong-answer .option-code{background:rgba(239,68,68,.1)}.challenge-title{font-size:1.1rem;font-weight:700;color:var(--text-dark);margin-bottom:.75rem}.challenge-title p{margin:0}.project-context{display:grid;grid-template-columns:1fr 1fr;grid-gap:.75rem;gap:.75rem;margin-bottom:1.25rem}.project-context-card{padding:.85rem 1rem;background:var(--bg-subtle);border-radius:10px;border-left:3px solid var(--brand-primary)}.project-context-card.job{border-left-color:#10b981}.project-context-title{font-size:.7rem;font-weight:700;color:var(--text-gray);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.35rem}.project-context-text{font-size:.9rem;color:var(--text-dark);line-height:1.5}.project-requirements{margin-bottom:1.25rem;padding:.85rem 1rem;background:linear-gradient(135deg,#ede9fe,#ddd6fe);border-radius:10px}.project-requirements-title{font-size:.75rem;font-weight:700;color:#6d28d9;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.project-requirements-list{display:flex;flex-wrap:wrap;gap:.4rem}.project-requirement-tag{padding:.3rem .7rem;background:#fff;border-radius:16px;font-size:.8rem;color:#6d28d9;font-weight:500}.project-brief{background:var(--bg-subtle);border-radius:10px;padding:1rem 1.25rem;margin-bottom:1rem}.project-brief-item{font-size:15px;line-height:1.6;color:var(--text-dark);margin-bottom:.5rem}.project-brief-item:last-child{margin-bottom:0}.project-brief-label{font-weight:600;color:var(--text-dark)}.project-faq{margin-bottom:1rem}.project-faq-item{border:1px solid var(--border-light);border-radius:10px;margin-bottom:.5rem;overflow:hidden}.project-faq-item:last-child{margin-bottom:0}.project-faq-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--bg-white);cursor:pointer;transition:background .2s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none}.project-faq-header:hover{background:var(--bg-subtle)}.project-faq-title{display:flex;align-items:center;gap:.5rem;font-size:14px;font-weight:600;color:var(--text-dark)}.project-faq-icon{width:18px;height:18px;color:var(--text-gray);transition:transform .2s ease}.project-faq-item.open .project-faq-icon{transform:rotate(180deg)}.project-faq-body{display:none;padding:12px 1rem 1rem;background:var(--bg-white)}.project-faq-item.open .project-faq-body{display:block;animation:slideDown .2s ease}.project-req-list{display:flex;flex-direction:column;gap:.4rem}.project-req-item{font-size:14px;color:var(--text-dark);line-height:1.5}.project-req-item:before{content:"○";color:var(--brand-primary);font-weight:700;flex-shrink:0;margin-right:8px}.project-context-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:.75rem;gap:.75rem}.project-context-item{padding:.75rem;background:var(--bg-subtle);border-radius:8px;border-left:3px solid var(--brand-primary)}.project-context-item.job{border-left-color:#10b981}.project-context-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-gray);margin-bottom:8px}.project-context-value{font-size:14px;color:var(--text-dark);line-height:1.5}.project-intro-row{display:grid;grid-template-columns:1fr 1fr;grid-gap:.75rem;gap:.75rem;margin-bottom:1rem}.project-intro-card{display:flex;gap:.75rem;padding:.85rem 1rem;border-radius:10px;background:#fef9c3}.project-intro-card.goal{background:#d1fae5}.project-intro-icon{font-size:1.25rem;flex-shrink:0}.project-intro-content{flex:1 1}.project-intro-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#92400e;margin-bottom:.25rem}.project-intro-card.goal .project-intro-label{color:#047857}.project-intro-content p{margin:0;font-size:.9rem;line-height:1.5;color:var(--text-dark)}.project-intro-content strong{font-weight:600}.project-intro-content code{background:rgba(0,0,0,.08);padding:.1rem .35rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.85em}.project-step-nav{display:flex;justify-content:center;gap:.5rem;margin-bottom:1.25rem}.project-step-btn{width:44px;height:44px;border-radius:10px;border:2px solid var(--border-light);background:var(--bg-white);font-size:1rem;font-weight:700;color:var(--text-gray);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;position:relative}.project-step-btn:hover{border-color:var(--brand-primary-medium);color:var(--brand-primary)}.project-step-btn.active{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}.project-step-btn.completed{background:var(--state-strong);border-color:var(--state-strong);color:#fff}.project-step-btn.completed:after{content:"✓";position:absolute;top:-5px;right:-5px;width:16px;height:16px;background:#fff;border:2px solid var(--state-strong);border-radius:50%;font-size:.6rem;font-weight:700;color:var(--state-strong);display:flex;align-items:center;justify-content:center}.project-step-container{display:none}.project-step-container.active{display:block;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.project-step-header{display:flex;align-items:flex-start;gap:.85rem;margin-bottom:1rem}.project-step-badge{display:flex;align-items:center;justify-content:center;width:38px;height:38px;min-width:38px;background:linear-gradient(135deg,var(--brand-primary) 0,#8b5cf6 100%);color:#fff;border-radius:10px;font-size:1rem;font-weight:700}.project-step-title-wrap{flex:1 1}.project-step-title-row{display:flex;align-items:flex-start}.project-step-title{font-size:1.1rem;font-weight:700;color:var(--text-dark);line-height:1.35}.project-step-title br{display:block;content:"";margin-top:.15rem}.project-step-subtitle{font-size:.9rem;font-weight:500;color:var(--text-gray);margin-top:.15rem}.project-instruction{font-size:15px;line-height:1.65;color:var(--text-dark);margin-bottom:1rem}.project-instruction p{margin:0 0 .5rem}.project-instruction p:last-child{margin-bottom:0}.project-instruction code{background:var(--brand-primary-light);color:var(--brand-primary);padding:.1rem .4rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.85em}.project-instruction pre{background:var(--bg-subtle);padding:.6rem .85rem;border-radius:8px;font-family:JetBrains Mono,monospace;font-size:.85rem;margin:.5rem 0;overflow-x:auto}.project-code-editor{position:relative;margin-bottom:1rem}.project-code-textarea{width:100%;min-height:120px;padding:.85rem 1rem;background:var(--bg-white);border:2px solid var(--border-light);border-radius:0 0 10px 10px;font-family:JetBrains Mono,monospace;font-size:.85rem;line-height:1.6;color:var(--text-dark);resize:vertical;outline:none;transition:border-color .2s ease}.project-code-textarea:focus{border-color:var(--brand-primary)}.code-editor-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem .85rem;background:var(--bg-subtle);border:2px solid var(--border-light);border-bottom:none;border-radius:10px 10px 0 0}.code-editor-label{font-size:.75rem;font-weight:600;color:var(--text-gray);display:flex;align-items:center;gap:.35rem}.code-editor-label svg{width:12px;height:12px}.code-editor-actions{display:flex;gap:.5rem}.code-reset-btn,.code-solution-btn{padding:.25rem .6rem;background:transparent;border:1px solid var(--border-light);border-radius:5px;font-size:.7rem;font-weight:500;color:var(--text-gray);cursor:pointer;transition:all .2s ease}.code-reset-btn:hover{background:var(--bg-subtle);border-color:var(--text-gray)}.code-solution-btn{color:#b45309;border-color:#fcd34d;background:#fef9c3}.code-solution-btn:hover{background:#fde68a}.solution-reveal{margin-bottom:.75rem;padding:.75rem 1rem;background:linear-gradient(135deg,#d1fae5,#a7f3d0);border:1px solid #34d399;border-radius:8px;display:none}.solution-reveal.visible{display:block;animation:slideDown .3s ease}.solution-reveal-title{font-size:.75rem;font-weight:700;color:#047857;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.4rem}.solution-reveal-code{font-family:JetBrains Mono,monospace;font-size:.85rem;color:#065f46;white-space:pre-wrap}.project-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1rem}.run-code-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:linear-gradient(135deg,#10b981,#059669);border:none;border-radius:10px;font-size:.9rem;font-weight:600;color:#fff;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px rgba(16,185,129,.25)}.run-code-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(16,185,129,.35)}.run-code-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.run-code-btn svg{width:16px;height:16px}.run-code-btn svg.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.hint-toggle-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border:none;border-radius:10px;font-size:.9rem;font-weight:600;color:#92400e;cursor:pointer;transition:all .2s ease}.hint-toggle-btn:hover{transform:translateY(-2px)}.project-output{margin-bottom:.75rem;border-radius:10px;overflow:hidden;border:2px solid var(--border-light);display:none}.project-output.visible{display:block;animation:slideDown .3s ease}.project-output-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem .85rem;background:var(--bg-subtle);border-bottom:1px solid var(--border-light)}.project-output-title{font-size:.75rem;font-weight:600;color:var(--text-gray);display:flex;align-items:center;gap:.35rem}.project-output-title svg{width:12px;height:12px}.project-output-status{padding:.2rem .5rem;border-radius:12px;font-size:.7rem;font-weight:600}.project-output-status.running{background:var(--brand-primary-light);color:var(--brand-primary)}.project-output-status.success{background:var(--state-strong-bg);color:var(--state-strong)}.project-output-status.error{background:var(--state-weak-bg);color:var(--state-weak)}.project-output-body{padding:.75rem 1rem;background:var(--bg-white);font-family:JetBrains Mono,monospace;font-size:.85rem;line-height:1.5;color:var(--text-dark);white-space:pre-wrap;max-height:150px;overflow-y:auto}.project-run-btn{margin-top:1rem}.project-output-container{margin-top:.75rem;border-radius:10px;overflow:hidden;border:1px solid var(--border-light);display:none}.project-output-container.visible{display:block;animation:slideDown .3s ease}.project-output-container .project-output-body:empty{display:none}.project-output-container .project-output-body:empty~*{margin-top:0}.project-output-container+.project-validation{margin-top:.75rem}.project-solution-reveal{margin-top:.75rem;border-radius:10px;overflow:hidden;border:1px solid #a78bfa;background:linear-gradient(135deg,#f5f3ff,#ede9fe);display:none}.project-solution-reveal.visible{display:block;animation:slideDown .3s ease}.project-solution-reveal .solution-header{padding:.5rem 1rem;font-weight:600;color:#7c3aed;font-size:.9rem;border-bottom:1px solid #ddd6fe}.project-solution-reveal .code-block{margin:0;border:none;border-radius:0;background:transparent}.project-solution-reveal .code-block .code-header{background:#ede9fe;border-bottom:1px solid #ddd6fe}.project-solution-reveal .code-block .code-content{padding:1rem 1.25rem}.project-validation{padding:.75rem 1rem;border-radius:10px;margin-bottom:.75rem;display:none}.project-validation.visible{display:block;animation:slideDown .3s ease}.project-validation.correct{background:linear-gradient(135deg,#d1fae5,#a7f3d0);border:1px solid #34d399}.project-validation.incorrect{background:linear-gradient(135deg,#fee2e2,#fecaca);border:1px solid #f87171}.project-validation-title{font-size:.9rem;font-weight:700;margin-bottom:.25rem;display:flex;align-items:center;gap:.35rem}.project-validation.correct .project-validation-title{color:#047857}.project-validation.incorrect .project-validation-title{color:#b91c1c}.project-validation-text{font-size:.85rem;line-height:1.5}.project-validation.correct .project-validation-text{color:#065f46}.project-validation.incorrect .project-validation-text{color:#991b1b}.project-hint{padding:1rem 1.25rem;background:linear-gradient(135deg,#fef3c7,#fef9c3);border:1px solid #fcd34d;border-radius:12px;margin-bottom:1rem;display:none}.project-hint.visible{display:block;animation:slideDown .3s ease}.project-hint-title{font-size:.85rem;font-weight:700;color:#92400e;text-transform:uppercase;letter-spacing:.03em;margin-bottom:.5rem}.project-hint-text{font-size:15px;color:#78350f;line-height:1.6}.project-hint-text p{margin:0}.project-hint-text code{background:rgba(180,83,9,.15);padding:.1rem .4rem;border-radius:4px}.expected-output-box{margin-top:.75rem;padding:.75rem 1rem;background:var(--bg-subtle);border-radius:10px;border-left:3px solid var(--brand-primary)}.expected-output-title{font-size:.7rem;color:var(--text-gray);letter-spacing:.05em;margin-bottom:.35rem}.expected-output-code{font-family:JetBrains Mono,monospace;font-size:.8rem;color:var(--text-dark);white-space:pre-wrap;line-height:1.4}.project-summary-section{margin-top:2rem;padding-top:1.5rem;border-top:2px solid var(--border-light)}.project-summary-title{font-size:1.1rem;font-weight:700;color:var(--text-dark);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.project-summary-list{display:flex;flex-direction:column;gap:.5rem}.project-summary-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;background:linear-gradient(135deg,#d1fae5,#a7f3d0);border-radius:10px}.project-summary-check{width:22px;height:22px;min-width:22px;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.project-summary-check svg{width:12px;height:12px}.project-summary-text{font-size:15px;color:#065f46;line-height:1.5}.project-extensions{margin-top:1.5rem}.project-extensions-title{font-size:1rem;font-weight:700;color:var(--text-dark);margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}.project-extension-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;background:linear-gradient(135deg,#ede9fe,#ddd6fe);border-radius:10px;margin-bottom:.5rem}.project-extension-icon{font-size:1rem}.project-extension-text{font-size:15px;color:#5b21b6;line-height:1.5}.project-progress{margin-bottom:1.5rem}.project-progress-label{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:.85rem;color:var(--text-gray)}.project-progress-bar{height:8px;background:var(--bg-subtle);border-radius:4px;overflow:hidden}.project-progress-fill{height:100%;background:linear-gradient(90deg,var(--brand-primary) 0,#8b5cf6 100%);border-radius:4px;transition:width .5s ease}.celebration-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);display:none;align-items:center;justify-content:center;z-index:9999;opacity:0;transition:opacity .3s ease}.celebration-overlay.active{display:flex;opacity:1}.celebration-modal{background:#fff;border-radius:24px;padding:3rem 2.5rem;text-align:center;max-width:400px;width:90%;transform:scale(.8);transition:transform .4s cubic-bezier(.34,1.56,.64,1);box-shadow:0 25px 50px -12px rgba(0,0,0,.25);position:relative;overflow:hidden}.celebration-overlay.active .celebration-modal{transform:scale(1)}.celebration-badge{width:120px;height:120px;margin:0 auto 1.5rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:3.5rem;box-shadow:0 0 0 8px #fef9c3,0 0 0 12px #fcd34d,0 0 40px rgba(251,191,36,.4);animation:badgePop .6s cubic-bezier(.34,1.56,.64,1) .2s both,badgeGlow 2s ease-in-out .8s infinite;position:relative}.celebration-badge:before{content:"";position:absolute;top:-5px;left:-5px;right:-5px;bottom:-5px;border-radius:50%;background:linear-gradient(45deg,transparent 40%,hsla(0,0%,100%,.8) 50%,transparent 60%);animation:badgeShine 2s ease-in-out 1s infinite}@keyframes badgePop{0%{transform:scale(0) rotate(-180deg)}to{transform:scale(1) rotate(0deg)}}@keyframes badgeGlow{0%,to{box-shadow:0 0 0 8px #fef9c3,0 0 0 12px #fcd34d,0 0 40px rgba(251,191,36,.4)}50%{box-shadow:0 0 0 8px #fef9c3,0 0 0 14px #fcd34d,0 0 60px rgba(251,191,36,.6)}}@keyframes badgeShine{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.celebration-title{font-size:1.75rem;font-weight:800;color:var(--text-dark);margin-bottom:.5rem}.celebration-badge-name{font-size:1.25rem;font-weight:700;color:#b45309;background:linear-gradient(135deg,#fef3c7,#fde68a);padding:.5rem 1.25rem;border-radius:50px;display:inline-block;margin-bottom:1rem}.celebration-message{font-size:1rem;color:var(--text-gray);line-height:1.6;margin-bottom:1.5rem}.celebration-stats{display:flex;justify-content:center;gap:2rem;margin-bottom:1.5rem;padding:1rem;background:var(--bg-subtle);border-radius:12px}.celebration-stat{text-align:center}.celebration-stat-value{font-size:1.5rem;font-weight:800;color:var(--brand-primary)}.celebration-stat-value.correct{color:var(--state-strong)}.celebration-stat-label{font-size:.8rem;color:var(--text-gray);text-transform:uppercase;letter-spacing:.05em}.celebration-btn{padding:1rem 2rem;background:linear-gradient(135deg,var(--brand-primary) 0,#4f46e5 100%);border:none;border-radius:12px;font-size:1rem;font-weight:600;color:#fff;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px rgba(95,86,254,.3)}.celebration-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(95,86,254,.4)}.confetti-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10000;overflow:hidden}.confetti{position:absolute;top:-20px;animation:confettiFall linear forwards}.confetti.circle{border-radius:50%}.confetti.ribbon,.confetti.square{border-radius:2px}.confetti.ribbon{width:8px!important;height:20px!important}@keyframes confettiFall{0%{transform:translateY(0) rotate(0deg) scale(1);opacity:1}75%{opacity:1}to{transform:translateY(100vh) rotate(2turn) scale(.3);opacity:0}}@keyframes confettiShake{0%,to{transform:translateX(0)}25%{transform:translateX(15px)}75%{transform:translateX(-15px)}}.code-blank{display:inline-block;min-width:60px;padding:.15rem .5rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px dashed #f59e0b;border-radius:6px;color:#b45309;font-weight:700;text-align:center;letter-spacing:.1em;cursor:pointer;transition:all .2s ease}.code-blank:hover{background:linear-gradient(135deg,#fde68a,#fcd34d);border-color:#d97706}.code-blank.filled{background:linear-gradient(135deg,var(--brand-primary-light) 0,#e0e7ff 100%);border:2px solid var(--brand-primary);color:var(--brand-primary);letter-spacing:0}.code-blank.correct{background:linear-gradient(135deg,#dcfce7,#bbf7d0);border-color:var(--state-strong);color:var(--state-strong)}.code-blank.incorrect{background:linear-gradient(135deg,#fee2e2,#fecaca);border-color:var(--state-weak);color:var(--state-weak)}.code-blank.selected{background:linear-gradient(135deg,#dbeafe,#bfdbfe);border:2px solid #3b82f6;color:#1d4ed8;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 0 0 rgba(59,130,246,.4)}50%{box-shadow:0 0 0 6px rgba(59,130,246,0)}}.fill-options{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem;padding:1rem;background:var(--bg-subtle);border-radius:10px}.fill-option{padding:.6rem 1.1rem;background:var(--bg-white);border:2px solid var(--border-light);border-radius:8px;font-family:JetBrains Mono,monospace;font-size:.9rem;font-weight:600;color:var(--text-dark);cursor:-webkit-grab;cursor:grab;transition:all .2s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none}.fill-option:hover{border-color:var(--brand-primary);background:var(--brand-primary-light);transform:translateY(-2px)}.fill-option.selected{border-color:var(--brand-primary);background:var(--brand-primary);color:#fff}.fill-option.in-use{border-color:var(--brand-primary);background:var(--brand-primary-light);position:relative}.fill-option .option-key{display:inline-block;width:20px;height:20px;line-height:20px;text-align:center;background:var(--bg-subtle);border-radius:4px;font-size:.75rem;margin-right:.5rem}.fill-option.selected .option-key{background:hsla(0,0%,100%,.2)}.fill-option .usage-badge{position:absolute;top:-6px;right:-6px;width:20px;height:20px;background:var(--brand-primary);color:#fff;border-radius:50%;font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px rgba(0,0,0,.2)}.fill-option[draggable=true]{cursor:-webkit-grab;cursor:grab}.fill-option[draggable=true]:active{cursor:-webkit-grabbing;cursor:grabbing}.fill-option.dragging{opacity:.5;transform:scale(.95)}.code-blank.drag-over{background:linear-gradient(135deg,#dbeafe,#bfdbfe);border:2px solid #3b82f6;transform:scale(1.1);box-shadow:0 0 12px rgba(59,130,246,.4)}.drag-hint{text-align:center;font-size:.85rem;color:var(--text-gray);margin-bottom:.5rem}.drag-hint svg{width:16px;height:16px;vertical-align:middle;margin-right:.25rem}.verify-btn{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;padding:.85rem 1.75rem;background:linear-gradient(135deg,var(--brand-primary) 0,#4f46e5 100%);border:none;border-radius:10px;font-size:1rem;font-weight:600;color:#fff;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px rgba(95,86,254,.3)}.verify-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(95,86,254,.4)}.verify-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.verify-btn svg{width:18px;height:18px}.blank-selection-hint{margin-top:.75rem;padding:.6rem 1rem;background:linear-gradient(135deg,#dbeafe,#bfdbfe);border:1px solid #60a5fa;border-radius:8px;font-size:.85rem;color:#1d4ed8;display:block;text-align:center}.blank-selection-hint.hidden{display:none}.task-instruction{font-size:16px;color:var(--text-dark);margin-bottom:1rem;line-height:1.7}.task-options{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:.75rem;gap:.75rem;margin-top:1rem}.task-option{padding:.9rem 1rem;background:var(--bg-white);border:2px solid var(--border-light);border-radius:12px;font-size:15px;color:var(--text-dark);cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:.75rem}.task-option:hover{border-color:var(--brand-primary);background:var(--brand-primary-light);transform:translateX(4px);box-shadow:0 4px 12px rgba(95,86,254,.15)}.task-option:active{transform:translateX(2px)}.task-option.correct-answer{border-color:var(--state-strong)!important;background:var(--state-strong-bg)!important;transform:translateX(0)}.task-option.wrong-answer{border-color:var(--state-weak)!important;background:var(--state-weak-bg)!important;transform:translateX(0);animation:shake .4s ease}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}.task-option-key{width:30px;height:30px;border-radius:8px;background:var(--bg-subtle);border:1px solid var(--border-light);font-size:.85rem;font-weight:700;color:var(--text-gray);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s ease}.task-option:hover .task-option-key{background:var(--brand-primary);color:#fff;border-color:var(--brand-primary)}.task-option.correct-answer .task-option-key{background:var(--state-strong);color:#fff;border-color:var(--state-strong)}.task-option.wrong-answer .task-option-key{background:var(--state-weak);color:#fff;border-color:var(--state-weak)}.feedback-box{margin-top:1rem;padding:1rem 1.25rem;border-radius:10px;animation:slideIn .3s var(--ease-out-expo)}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.feedback-box.correct{background:var(--state-strong-bg);border:1px solid var(--state-strong-border)}.feedback-box.incorrect{background:var(--state-weak-bg);border:1px solid var(--state-weak-border)}.feedback-title{font-weight:700;font-size:15px;margin-bottom:.4rem}.feedback-box.correct .feedback-title{color:var(--state-strong)}.feedback-box.incorrect .feedback-title{color:var(--state-weak)}.feedback-text{font-size:.9rem;color:var(--text-light);line-height:1.6}.score-display{gap:1rem;padding:.75rem 1rem;background:var(--bg-white);border:1px solid var(--border-light);border-radius:10px;margin-bottom:1.25rem}.score-display,.score-item{display:flex;align-items:center}.score-item{gap:.4rem;font-size:.9rem;font-weight:600}.score-item.correct{color:var(--state-strong)}.score-item.incorrect{color:var(--state-weak)}.score-item.total{color:var(--text-gray)}.flashcard{background:linear-gradient(135deg,var(--cyan-bg) 0,var(--bg-white) 100%);border:2px solid var(--border-light);border-radius:16px;padding:1.5rem;margin-bottom:1rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.flashcard:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(6,182,212,.05),transparent);opacity:0;z-index:-1;transition:opacity .3s ease}.flashcard:hover:before{opacity:1}.flashcard:hover{transform:translateY(-3px);box-shadow:0 12px 40px -8px rgba(6,182,212,.25);border-color:#06b6d4}.flashcard:active{transform:translateY(-1px)}.flashcard.flipped{background:linear-gradient(135deg,#d1fae5 0,var(--bg-white) 100%);border-color:#34d399}.flashcard-front{font-size:16px;font-weight:600;color:var(--text-dark);line-height:1.6;position:relative}.flashcard-front p{margin:0}.flashcard-back code,.flashcard-front code{color:var(--bs-code-color);font-size:inherit;padding:.1rem .4rem;border-radius:4px;font-family:JetBrains Mono,monospace}.flashcard-back{display:none;margin-top:1rem;padding-top:1rem;border-top:2px dashed #34d399;font-size:15px;line-height:1.75;animation:revealAnswer .4s ease}@keyframes revealAnswer{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.flashcard-back p{margin:0 0 .5rem}.flashcard-back p:last-child{margin-bottom:0}.flashcard-back pre{width:100%;background:var(--bg-subtle);padding:.75rem 1rem;border-radius:8px;font-family:JetBrains Mono,monospace;font-size:.85rem;margin:.5rem 0;overflow-x:auto}.flashcard.flipped .flashcard-back{display:block}.flashcard.flipped .flashcard-hint{display:none}.flashcard-hint{font-size:.85rem;color:#06b6d4;margin-top:.75rem;font-weight:600;display:flex;align-items:center;gap:.35rem}.flashcard-difficulty{display:inline-block;padding:.25rem .75rem;border-radius:20px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem}.flashcard-difficulty.beginner{background:#d1fae5;color:#047857}.flashcard-difficulty.intermediate{background:#fef3c7;color:#92400e}.flashcard-difficulty.advanced{background:#fee2e2;color:#b91c1c}.recall-section-nav{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}.recall-section-btn{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;background:var(--bg-white);border:2px solid var(--border-light);border-radius:10px;font-size:.85rem;font-weight:600;color:var(--text-gray);cursor:pointer;transition:all .2s ease}.recall-section-btn:hover{border-color:var(--brand-primary-medium);color:var(--brand-primary)}.recall-section-btn.active{background:var(--brand-primary-light);border-color:var(--brand-primary);color:var(--brand-primary)}.recall-section-btn .section-count{padding:.15rem .5rem;background:var(--bg-subtle);border-radius:10px;font-size:.75rem}.recall-section-btn.active .section-count{background:var(--brand-primary);color:#fff}.recall-section{display:none}.recall-section.active{display:block;animation:fadeIn .3s ease}.recall-prompt-card{background:linear-gradient(135deg,#faf5ff 0,var(--bg-white) 100%);border:1px solid #e9d5ff;border-radius:14px;padding:1.5rem;margin-bottom:1rem}.recall-prompt-header{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1rem}.recall-prompt-number{width:32px;height:32px;min-width:32px;background:linear-gradient(135deg,#a855f7,#7c3aed);color:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:700}.recall-prompt-text{flex:1 1;margin-bottom:16px}.recall-prompt-text p{margin:0;font-size:1rem;font-weight:600;color:var(--text-dark);line-height:1.5}.recall-prompt-text code{background:rgba(168,85,247,.15);padding:.1rem .4rem;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:.9em}.recall-prompt-textarea{width:100%;min-height:100px;padding:.85rem 1rem;background:var(--bg-white);border:2px solid var(--border-light);border-radius:10px;font-size:.9rem;line-height:1.6;color:var(--text-dark);resize:vertical;outline:none;transition:border-color .2s ease}.recall-prompt-textarea:focus{border-color:#a855f7}.recall-prompt-textarea::placeholder{color:var(--text-gray)}.recall-prompt-actions{display:flex;gap:.75rem;margin-top:.75rem;flex-wrap:wrap}.recall-check-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1rem;background:linear-gradient(135deg,#a855f7,#7c3aed);border:none;border-radius:8px;font-size:.85rem;font-weight:600;color:#fff;cursor:pointer;transition:all .2s ease}.recall-check-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(168,85,247,.3)}.recall-hint-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1rem;background:#fef3c7;border:none;border-radius:8px;font-size:.85rem;font-weight:600;color:#92400e;cursor:pointer;transition:all .2s ease}.recall-hint-btn:hover{background:#fde68a}.recall-prompt-hint{display:none;margin-top:.75rem;padding:.75rem 1rem;background:#fef9c3;border:1px solid #fcd34d;border-radius:8px;font-size:.85rem;color:#92400e}.recall-prompt-hint.visible{display:block;animation:slideDown .2s ease}.recall-prompt-feedback{display:none;margin-top:.75rem;padding:.75rem 1rem;border-radius:8px}.recall-prompt-feedback.visible{display:block;animation:slideDown .2s ease}.recall-prompt-feedback.success{background:#d1fae5;border:1px solid #34d399}.recall-prompt-feedback.partial{background:#fef3c7;border:1px solid #fcd34d}.recall-prompt-feedback-title{font-weight:700;margin-bottom:.4rem;font-size:.9rem}.recall-prompt-feedback.success .recall-prompt-feedback-title{color:#047857}.recall-prompt-feedback.partial .recall-prompt-feedback-title{color:#92400e}.recall-prompt-feedback-text{font-size:.85rem;line-height:1.5}.recall-prompt-feedback.success .recall-prompt-feedback-text{color:#065f46}.recall-prompt-feedback.partial .recall-prompt-feedback-text{color:#78350f}.expected-elements-list{margin-top:.5rem;padding-left:1.25rem}.expected-elements-list li{font-size:.85rem;margin-bottom:.25rem}.expected-elements-list li.found{color:#047857}.expected-elements-list li.missing{color:#b91c1c}.tc-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.75rem;background:var(--green-bg);border:1px solid var(--state-strong-border);border-radius:12px;font-family:JetBrains Mono,monospace;font-size:1.5rem;font-weight:700;color:var(--state-strong)}.tc-growth-table,.tc-table{width:100%;border-collapse:collapse;font-size:15px;margin-top:1rem;border-radius:10px;overflow:hidden;border:1px solid var(--border-light)}.tc-growth-table td,.tc-growth-table th,.tc-table td,.tc-table th{padding:.9rem 1.25rem;text-align:left}.tc-growth-table th,.tc-table th{background:var(--bg-subtle);font-weight:700;color:var(--text-dark);border-bottom:1px solid var(--border-light)}.tc-growth-table td,.tc-table td{color:var(--text-light);border-bottom:1px solid var(--border-light)}.tc-growth-table tr:last-child td,.tc-table tr:last-child td{border-bottom:none}.tcm-section-body{font-size:15px;line-height:1.7;color:var(--text-light)}.tcm-section-body p{margin:0 0 .75rem}.tcm-section-body p:last-child{margin-bottom:0}.tcm-section-body ul{margin:.75rem 0;padding-left:1.25rem}.tcm-section-body li{margin-bottom:.5rem}.tcm-section-body pre{background:var(--bg-subtle);border:1px solid var(--border-light);border-radius:10px;padding:1rem 1.25rem;margin:.75rem 0;overflow-x:auto}.tcm-section-body code{font-family:JetBrains Mono,monospace;font-size:.9rem;color:var(--text-dark)}.tcm-section-body p code{background:var(--brand-primary-light);color:var(--brand-primary);padding:.15rem .5rem;border-radius:4px;font-size:.9em}.tcm-section-body strong{font-weight:600;color:var(--text-dark)}.tcm-section-body em{color:var(--text-gray);font-style:italic}#tc-final-complexity-content code{font-size:1.25rem;font-weight:700;background:var(--state-strong);color:#fff;padding:.25rem .75rem;border-radius:6px}#tc-common-mistake-content p{display:flex;align-items:flex-start;gap:.75rem;padding:1rem 1.25rem;border-radius:12px;margin-bottom:.75rem}#tc-common-mistake-content p:last-child{margin-bottom:0}#tc-common-mistake-content p:first-of-type{background:#fef2f2;border:1px solid #fecaca;border-left:4px solid #ef4444}#tc-common-mistake-content p:first-of-type:before{content:"✗";display:flex;align-items:center;justify-content:center;min-width:28px;height:28px;background:#fee2e2;border-radius:50%;color:#ef4444;font-weight:700;font-size:.9rem}#tc-common-mistake-content p:last-of-type{background:#f0fdf4;border:1px solid #bbf7d0;border-left:4px solid #22c55e}#tc-common-mistake-content p:last-of-type:before{content:"✓";display:flex;align-items:center;justify-content:center;min-width:28px;height:28px;background:#dcfce7;border-radius:50%;color:#22c55e;font-weight:700;font-size:.9rem}#tc-common-mistake-content p strong{color:var(--text-dark)}#tc-common-mistake-content p:first-of-type strong{color:#dc2626}#tc-common-mistake-content p:last-of-type strong{color:#16a34a}.tcm-section-body .tc-growth-table,.tcm-section-body table{width:100%;border-collapse:collapse;font-size:.9rem;margin:.75rem 0;border-radius:10px;overflow:hidden;border:1px solid var(--border-light)}.tcm-section-body .tc-growth-table td,.tcm-section-body .tc-growth-table th,.tcm-section-body table td,.tcm-section-body table th{padding:.75rem 1rem;text-align:left}.tcm-section-body .tc-growth-table th,.tcm-section-body table th{background:var(--bg-subtle);font-weight:700;color:var(--text-dark);border-bottom:1px solid var(--border-light)}.tcm-section-body .tc-growth-table td,.tcm-section-body table td{color:var(--text-light);border-bottom:1px solid var(--border-light)}.tcm-section-body .tc-growth-table tr:last-child td,.tcm-section-body table tr:last-child td{border-bottom:none}.code-articles-card-body.time-complexity-content{padding:1rem}.plrn-dashboard,.plrn-ml-metrics,.plrn-mobile-publish,.plrn-real-world,.plrn-scale-analysis,.plrn-test-framework,.plrn-time-complexity{display:flex;flex-direction:column;gap:1.25rem;padding:0}.plrn-dashboard>section,.plrn-ml-metrics>section,.plrn-mobile-publish>section,.plrn-real-world>section,.plrn-scale-analysis>section,.plrn-test-framework>section,.plrn-time-complexity>section{background:var(--bg-white);border:1px solid var(--border-light);border-radius:16px;box-shadow:var(--shadow-sm);overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.plrn-dashboard>section:hover,.plrn-ml-metrics>section:hover,.plrn-mobile-publish>section:hover,.plrn-real-world>section:hover,.plrn-scale-analysis>section:hover,.plrn-test-framework>section:hover,.plrn-time-complexity>section:hover{box-shadow:0 10px 40px -10px rgba(0,0,0,.1),0 4px 12px -2px rgba(0,0,0,.05);transform:translateY(-2px)}.plrn-dashboard>section>h2,.plrn-dashboard>section>h3,.plrn-dashboard>section>h4,.plrn-ml-metrics>section>h2,.plrn-ml-metrics>section>h3,.plrn-ml-metrics>section>h4,.plrn-mobile-publish>section>h2,.plrn-mobile-publish>section>h3,.plrn-mobile-publish>section>h4,.plrn-real-world>section>h2,.plrn-real-world>section>h3,.plrn-real-world>section>h4,.plrn-scale-analysis>section>h2,.plrn-scale-analysis>section>h3,.plrn-scale-analysis>section>h4,.plrn-test-framework>section>h2,.plrn-test-framework>section>h3,.plrn-test-framework>section>h4,.plrn-time-complexity>section>h4{padding:1rem 1.5rem;margin:0;background:var(--bg-subtle);border-bottom:1px solid var(--border-light);font-family:Plus Jakarta Sans,sans-serif;font-size:1.05rem;font-weight:700;color:var(--text-dark);display:flex;align-items:center;gap:.75rem}.plrn-dashboard>section>h2:before,.plrn-dashboard>section>h3:before,.plrn-dashboard>section>h4:before,.plrn-ml-metrics>section>h2:before,.plrn-ml-metrics>section>h3:before,.plrn-ml-metrics>section>h4:before,.plrn-mobile-publish>section>h2:before,.plrn-mobile-publish>section>h3:before,.plrn-mobile-publish>section>h4:before,.plrn-real-world>section>h2:before,.plrn-real-world>section>h3:before,.plrn-real-world>section>h4:before,.plrn-scale-analysis>section>h2:before,.plrn-scale-analysis>section>h3:before,.plrn-scale-analysis>section>h4:before,.plrn-test-framework>section>h2:before,.plrn-test-framework>section>h3:before,.plrn-test-framework>section>h4:before,.plrn-time-complexity>section>h4:before{content:"";width:8px;height:8px;border-radius:50%;flex-shrink:0}.plrn-time-complexity>section>h4:before{background:var(--brand-primary)}.plrn-ml-metrics>section>h2:before,.plrn-ml-metrics>section>h3:before,.plrn-ml-metrics>section>h4:before{background:#059669}.plrn-mobile-publish>section>h2:before,.plrn-mobile-publish>section>h3:before,.plrn-mobile-publish>section>h4:before{background:#e11d48}.plrn-scale-analysis>section>h2:before,.plrn-scale-analysis>section>h3:before,.plrn-scale-analysis>section>h4:before{background:#0891b2}.plrn-dashboard>section>h2:before,.plrn-dashboard>section>h3:before,.plrn-dashboard>section>h4:before{background:#4f46e5}.plrn-real-world>section>h2:before,.plrn-real-world>section>h3:before,.plrn-real-world>section>h4:before{background:#d97706}.plrn-test-framework>section>h2:before,.plrn-test-framework>section>h3:before,.plrn-test-framework>section>h4:before{background:#7c3aed}.plrn-dashboard>section>ol,.plrn-dashboard>section>p,.plrn-dashboard>section>pre,.plrn-dashboard>section>table,.plrn-dashboard>section>ul,.plrn-ml-metrics>section>ol,.plrn-ml-metrics>section>p,.plrn-ml-metrics>section>pre,.plrn-ml-metrics>section>table,.plrn-ml-metrics>section>ul,.plrn-mobile-publish>section>ol,.plrn-mobile-publish>section>p,.plrn-mobile-publish>section>pre,.plrn-mobile-publish>section>table,.plrn-mobile-publish>section>ul,.plrn-real-world>section>ol,.plrn-real-world>section>p,.plrn-real-world>section>pre,.plrn-real-world>section>table,.plrn-real-world>section>ul,.plrn-scale-analysis>section>ol,.plrn-scale-analysis>section>p,.plrn-scale-analysis>section>pre,.plrn-scale-analysis>section>table,.plrn-scale-analysis>section>ul,.plrn-test-framework>section>ol,.plrn-test-framework>section>p,.plrn-test-framework>section>pre,.plrn-test-framework>section>table,.plrn-test-framework>section>ul,.plrn-time-complexity>section>ol,.plrn-time-complexity>section>p,.plrn-time-complexity>section>pre,.plrn-time-complexity>section>table,.plrn-time-complexity>section>ul{margin-left:1.75rem;margin-right:1.75rem}.plrn-dashboard>section>h2+*,.plrn-dashboard>section>h3+*,.plrn-dashboard>section>h4+*,.plrn-ml-metrics>section>h2+*,.plrn-ml-metrics>section>h3+*,.plrn-ml-metrics>section>h4+*,.plrn-mobile-publish>section>h2+*,.plrn-mobile-publish>section>h3+*,.plrn-mobile-publish>section>h4+*,.plrn-real-world>section>h2+*,.plrn-real-world>section>h3+*,.plrn-real-world>section>h4+*,.plrn-scale-analysis>section>h2+*,.plrn-scale-analysis>section>h3+*,.plrn-scale-analysis>section>h4+*,.plrn-test-framework>section>h2+*,.plrn-test-framework>section>h3+*,.plrn-test-framework>section>h4+*,.plrn-time-complexity>section>h4+*{margin-top:1.25rem}.plrn-dashboard>section>:last-child,.plrn-ml-metrics>section>:last-child,.plrn-mobile-publish>section>:last-child,.plrn-real-world>section>:last-child,.plrn-scale-analysis>section>:last-child,.plrn-test-framework>section>:last-child,.plrn-time-complexity>section>:last-child{margin-bottom:1.5rem}.plrn-dashboard p,.plrn-ml-metrics p,.plrn-mobile-publish p,.plrn-real-world p,.plrn-scale-analysis p,.plrn-test-framework p,.plrn-time-complexity p{font-size:1.05rem;line-height:1.85;color:#374151;margin:0 0 .75rem;max-width:65ch;word-wrap:break-word}.plrn-dashboard p:last-child,.plrn-ml-metrics p:last-child,.plrn-mobile-publish p:last-child,.plrn-real-world p:last-child,.plrn-scale-analysis p:last-child,.plrn-test-framework p:last-child,.plrn-time-complexity p:last-child{margin-bottom:0}.plrn-dashboard ol,.plrn-dashboard ul,.plrn-ml-metrics ol,.plrn-ml-metrics ul,.plrn-mobile-publish ol,.plrn-mobile-publish ul,.plrn-real-world ol,.plrn-real-world ul,.plrn-scale-analysis ol,.plrn-scale-analysis ul,.plrn-test-framework ol,.plrn-test-framework ul,.plrn-time-complexity ol,.plrn-time-complexity ul{margin:.75rem 0;padding-left:1.25rem}.plrn-dashboard li,.plrn-ml-metrics li,.plrn-mobile-publish li,.plrn-real-world li,.plrn-scale-analysis li,.plrn-test-framework li,.plrn-time-complexity li{font-size:1rem;line-height:1.85;color:#374151;margin-bottom:.5rem}.plrn-dashboard pre,.plrn-ml-metrics pre,.plrn-mobile-publish pre,.plrn-real-world pre,.plrn-scale-analysis pre,.plrn-test-framework pre,.plrn-time-complexity pre{background:#1e293b;border:1px solid var(--border-light);border-radius:12px;padding:1.25rem 1.5rem;margin:.75rem 0;overflow-x:auto;color:#e2e8f0}.plrn-dashboard code,.plrn-ml-metrics code,.plrn-mobile-publish code,.plrn-real-world code,.plrn-scale-analysis code,.plrn-test-framework code,.plrn-time-complexity code{font-family:JetBrains Mono,monospace;font-size:.9rem}.plrn-dashboard p code,.plrn-ml-metrics p code,.plrn-mobile-publish p code,.plrn-real-world p code,.plrn-scale-analysis p code,.plrn-test-framework p code,.plrn-time-complexity p code{background:var(--brand-primary-light,#eff6ff);color:var(--brand-primary,#5f56fe);padding:.15rem .5rem;border-radius:6px;font-size:.9em}.plrn-dashboard strong,.plrn-ml-metrics strong,.plrn-mobile-publish strong,.plrn-real-world strong,.plrn-scale-analysis strong,.plrn-test-framework strong,.plrn-time-complexity strong{font-weight:600;color:var(--text-dark)}.plrn-dashboard em,.plrn-ml-metrics em,.plrn-mobile-publish em,.plrn-real-world em,.plrn-scale-analysis em,.plrn-test-framework em,.plrn-time-complexity em{color:#6b7280;font-style:italic}.plrn-dashboard table,.plrn-ml-metrics table,.plrn-mobile-publish table,.plrn-real-world table,.plrn-scale-analysis table,.plrn-test-framework table,.plrn-time-complexity table{width:100%;border-collapse:separate;border-spacing:0;margin:.75rem 0;border:1px solid var(--border-light);border-radius:12px;overflow:hidden}.plrn-dashboard th,.plrn-ml-metrics th,.plrn-mobile-publish th,.plrn-real-world th,.plrn-scale-analysis th,.plrn-test-framework th,.plrn-time-complexity th{background:var(--bg-subtle);font-weight:600;font-size:.9rem;color:var(--text-dark);padding:.75rem 1rem;text-align:left;border-bottom:1px solid var(--border-light)}.plrn-dashboard td,.plrn-ml-metrics td,.plrn-mobile-publish td,.plrn-real-world td,.plrn-scale-analysis td,.plrn-test-framework td,.plrn-time-complexity td{padding:.65rem 1rem;font-size:.95rem;color:#374151;border-bottom:1px solid var(--border-light)}.plrn-dashboard tr:last-child td,.plrn-ml-metrics tr:last-child td,.plrn-mobile-publish tr:last-child td,.plrn-real-world tr:last-child td,.plrn-scale-analysis tr:last-child td,.plrn-test-framework tr:last-child td,.plrn-time-complexity tr:last-child td{border-bottom:none}.plrn-dashboard tr:hover td,.plrn-ml-metrics tr:hover td,.plrn-mobile-publish tr:hover td,.plrn-real-world tr:hover td,.plrn-scale-analysis tr:hover td,.plrn-test-framework tr:hover td,.plrn-time-complexity tr:hover td{background:var(--bg-subtle)}@media (max-width:768px){.code-articles-card-body.time-complexity-content{padding:.5rem}.plrn-dashboard>section>p,.plrn-dashboard>section>pre,.plrn-dashboard>section>table,.plrn-dashboard>section>ul,.plrn-ml-metrics>section>p,.plrn-ml-metrics>section>pre,.plrn-ml-metrics>section>table,.plrn-ml-metrics>section>ul,.plrn-mobile-publish>section>p,.plrn-mobile-publish>section>pre,.plrn-mobile-publish>section>table,.plrn-mobile-publish>section>ul,.plrn-real-world>section>p,.plrn-real-world>section>pre,.plrn-real-world>section>table,.plrn-real-world>section>ul,.plrn-scale-analysis>section>p,.plrn-scale-analysis>section>pre,.plrn-scale-analysis>section>table,.plrn-scale-analysis>section>ul,.plrn-test-framework>section>p,.plrn-test-framework>section>pre,.plrn-test-framework>section>table,.plrn-test-framework>section>ul,.plrn-time-complexity>section>p,.plrn-time-complexity>section>pre,.plrn-time-complexity>section>table,.plrn-time-complexity>section>ul{margin-left:1rem;margin-right:1rem}}.plrn-mobile-publish>h2,.plrn-mobile-publish>h3{font-family:Plus Jakarta Sans,sans-serif;font-size:1.05rem;font-weight:700;color:var(--text-dark);margin:0;padding:1rem 1.5rem;background:var(--bg-subtle);border-top:1px solid var(--border-light);border-bottom:1px solid var(--border-light);display:flex;align-items:center;gap:.75rem}.plrn-mobile-publish>h2:first-child,.plrn-mobile-publish>h3:first-child{border-top:none;border-radius:16px 16px 0 0}.plrn-mobile-publish>h2:before,.plrn-mobile-publish>h3:before{content:"";width:8px;height:8px;border-radius:50%;background:#e11d48;flex-shrink:0}.plrn-mobile-publish>h2~ol,.plrn-mobile-publish>h2~p,.plrn-mobile-publish>h2~pre,.plrn-mobile-publish>h2~ul,.plrn-mobile-publish>h3~ol,.plrn-mobile-publish>h3~p,.plrn-mobile-publish>h3~pre,.plrn-mobile-publish>h3~ul{padding-left:1.75rem;padding-right:1.75rem}.code-articles-card-body.time-complexity-content>h2,.code-articles-card-body.time-complexity-content>h3{font-family:Plus Jakarta Sans,sans-serif;font-size:1.05rem;font-weight:700;color:var(--text-dark);margin:0;padding:1rem 1.5rem;background:var(--bg-subtle);border-top:1px solid var(--border-light);border-bottom:1px solid var(--border-light);display:flex;align-items:center;gap:.75rem}.code-articles-card-body.time-complexity-content>h2:first-child,.code-articles-card-body.time-complexity-content>h3:first-child{border-top:none}.code-articles-card-body.time-complexity-content>h2:before,.code-articles-card-body.time-complexity-content>h3:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brand-primary,#5f56fe);flex-shrink:0}.code-articles-card-body.time-complexity-content>h2~p,.code-articles-card-body.time-complexity-content>h2~pre,.code-articles-card-body.time-complexity-content>h2~ul,.code-articles-card-body.time-complexity-content>h3~p,.code-articles-card-body.time-complexity-content>h3~pre,.code-articles-card-body.time-complexity-content>h3~ul{padding-left:1.75rem;padding-right:1.75rem}.code-articles-card-body.time-complexity-content>p{font-size:1.05rem;line-height:1.85;color:#374151;margin:.5rem 1.75rem;max-width:65ch}@media (max-width:768px){.code-articles-card-body.time-complexity-content{padding:.5rem}.plrn-ml-metrics>section>p,.plrn-ml-metrics>section>pre,.plrn-ml-metrics>section>table,.plrn-ml-metrics>section>ul,.plrn-mobile-publish>section>p,.plrn-mobile-publish>section>pre,.plrn-mobile-publish>section>table,.plrn-mobile-publish>section>ul,.plrn-scale-analysis>section>p,.plrn-scale-analysis>section>pre,.plrn-scale-analysis>section>table,.plrn-scale-analysis>section>ul,.plrn-time-complexity>section>p,.plrn-time-complexity>section>pre,.plrn-time-complexity>section>table,.plrn-time-complexity>section>ul{margin-left:1rem;margin-right:1rem}}.project-step{background:var(--bg-subtle);border:1px solid var(--border-light);border-radius:12px;padding:1.5rem;margin-bottom:1.25rem}.expected-output{margin-top:1rem;background:linear-gradient(135deg,#f0fdf4 0,var(--bg-white) 100%);border:1px solid var(--state-strong-border);border-radius:10px;padding:1rem 1.25rem}.expected-output-title{font-size:.8rem;font-weight:700;color:var(--state-strong);margin-bottom:.5rem;text-transform:uppercase;display:flex;align-items:center;gap:.4rem}.expected-output pre{font-family:JetBrains Mono,monospace;font-size:.9rem;color:var(--text-dark);white-space:pre-wrap;background:hsla(0,0%,100%,.5);padding:.75rem;border-radius:6px;margin-top:.5rem}@media (max-width:991px){.mobile-toggle{display:flex}.sidebar-overlay.active{display:block}.main-content{margin-left:0}.content-container{padding:84px 24px 48px}.topic-title{font-size:1.5rem}.code-articles-card-body{padding:1.25rem 1.5rem}.sidebar-toggle{display:none}}@media (max-width:768px){.project-context,.project-intro-row,.task-options{grid-template-columns:1fr}.content-container{padding:84px 20px 48px}.v5-key-metric{font-size:16px;padding:1rem}.v5-section-title{font-size:15px}.project-goal,.project-scenario{padding:.75rem}.flow-node{min-width:140px;max-width:220px;padding:.6rem 1rem;font-size:.8rem}.flow-node-sub{font-size:.7rem}}@media (max-width:640px){.brm-comparison{grid-template-columns:1fr}.brm-arrow{transform:rotate(90deg)}.wpm-metrics{grid-template-columns:1fr}}@media (max-width:600px){.project-context-grid{grid-template-columns:1fr}}@media (max-width:480px){.project-actions{flex-direction:column}.project-actions button{width:100%;justify-content:center}.signup-gate-modal{padding:2rem 1.5rem;border-radius:16px}.signup-gate-icon{font-size:2.5rem}.signup-gate-headline{font-size:1.25rem}.signup-gate-subtext{font-size:.88rem}.signup-gate-benefits{max-width:100%}.signup-gate-cta{font-size:15px;padding:.85rem 1.25rem}}.sidebar.mobile-open{transform:translateX(0)}.sidebar.mobile-close{transform:translateX(-100%)}@media (min-width:992px){.sidebar,.sidebar.landscape-open{transform:translateX(0)}.sidebar.landscape-close{transform:translateX(-100%)}.main-content.landscape-open{margin-left:var(--sidebar-width)}}.mobile-toggle{display:none;position:fixed;bottom:1.5rem;left:1.5rem;width:54px;height:54px;background:var(--brand-primary);border:none;border-radius:50%;color:#fff;cursor:pointer;box-shadow:var(--shadow-lg);z-index:200;align-items:center;justify-content:center}.mobile-toggle svg{width:24px;height:24px}.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:99}.mode-tab[data-mode=visual]{--mode-color:#f59e0b;--mode-bg:#fef3c7}.vmc-flow-box{background:#f6f8fa;border-radius:12px;padding:1.5rem;margin-bottom:1rem;overflow-x:auto;border:1px solid #e1e4e8;display:flex;flex-direction:column;align-items:center}.vmc-ascii-flow{color:#24292e;font-family:Courier New,monospace;font-size:.78rem;line-height:1.35;white-space:pre;margin:0;max-width:100%;text-align:left}.vmc-flow-desc{font-size:.92rem;line-height:1.7;color:#4b5563;padding:.75rem 0 0}.vmc-flow-visual{display:flex;flex-direction:column;align-items:center;gap:0;padding:1rem 0}.flow-node{position:relative;padding:.75rem 1.5rem;border-radius:10px;font-size:.88rem;font-weight:600;text-align:center;min-width:180px;max-width:280px;border:2px solid;box-shadow:0 2px 8px rgba(0,0,0,.06);transition:transform .15s ease}.flow-node:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.1)}.flow-node-text{line-height:1.4}.flow-node-sub{font-size:.78rem;font-weight:400;opacity:.7;margin-top:.25rem;font-family:JetBrains Mono,monospace}.flow-node-start{background:#ede9fe;border-color:#c4b5fd;color:#5b21b6}.flow-node-condition{background:#fef3c7;border-color:#fbbf24;color:#92400e}.flow-node-execute{background:#dbeafe;border-color:#93c5fd;color:#1e40af}.flow-node-update{background:#d1fae5;border-color:#6ee7b7;color:#065f46}.flow-node-exit{background:#fee2e2;border-color:#fca5a5;color:#991b1b}.flow-node-default{background:#f3f4f6;border-color:#d1d5db;color:#374151}.flow-arrow-down{display:flex;flex-direction:column;align-items:center;gap:0;padding:.15rem 0;color:#9ca3af}.flow-arrow-icon{font-size:1.2rem;line-height:1}.flow-arrow-label{font-size:.72rem;font-weight:700;color:#6b7280;background:#f9fafb;padding:.1rem .5rem;border-radius:50px;border:1px solid #e5e7eb}.flow-branch{display:flex;align-items:center;gap:.5rem;margin-top:.5rem;padding-top:.5rem;border-top:1px dashed rgba(0,0,0,.1);font-size:.8rem;font-weight:500}.flow-branch-label{font-size:.7rem;font-weight:700;color:#ef4444;background:#fee2e2;padding:.1rem .4rem;border-radius:50px}.flow-branch-arrow{color:#9ca3af;font-size:1rem}.flow-branch-target{padding:.25rem .75rem;border-radius:6px;font-size:.78rem;font-weight:600;border:1.5px solid}.flow-loop-back{display:flex;align-items:center;gap:.5rem;margin-top:.25rem;padding:.4rem 1rem;background:#faf5ff;border:1px dashed #c4b5fd;border-radius:50px;font-size:.78rem;font-weight:600;color:#7c3aed}.flow-loop-arrow{font-size:1.1rem}.flow-loop-label{font-style:italic}.vmc-sample-desc{font-size:.92rem;line-height:1.6;color:#4b5563;margin-top:.75rem}.vmc-table-wrap{overflow-x:auto;border-radius:12px;border:1px solid var(--border-medium)}.vmc-exec-table,.vmc-var-table{width:100%;border-collapse:collapse;font-size:.88rem}.vmc-exec-table th,.vmc-var-table th{background:var(--brand-primary-light);color:var(--brand-primary);padding:.7rem 1rem;text-align:center;font-weight:600;font-size:.82rem;text-transform:uppercase;letter-spacing:.03em;border-bottom:2px solid var(--brand-primary-medium)}.vmc-exec-table td,.vmc-var-table td{padding:.65rem 1rem;border-bottom:1px solid #f3f4f6;color:#374151;text-align:center}.vmc-exec-table tbody tr:hover,.vmc-var-table tbody tr:hover{background:var(--bs-light)}.vmc-exit-row{background:var(--state-weak-bg)!important}.vmc-exit-row td{color:var(--state-weak);font-weight:600}.vmc-cell-true{color:var(--state-strong)!important;font-weight:700}.vmc-cell-false{color:var(--state-weak)!important;font-weight:700}.vmc-cell-output{font-weight:600;color:var(--brand-primary)!important}.vmc-cell-output,.vmc-var-name{font-family:Courier New,monospace}.vmc-var-name{font-weight:700;color:#0891b2!important}.vmc-exit-note{margin-top:.75rem;padding:.65rem 1rem;background:var(--brand-primary-light);border-radius:8px;font-size:.85rem;line-height:1.6;color:var(--brand-primary);border-left:3px solid var(--brand-primary)}.vmc-moment{border:1px solid var(--border-medium);border-radius:10px;margin-bottom:.65rem;overflow:hidden;transition:all .2s ease}.vmc-moment:hover{border-color:var(--brand-primary-medium)}.vmc-moment-q{padding:.85rem 1rem;font-size:.92rem;font-weight:600;color:#1f2937;cursor:pointer;display:flex;align-items:center;gap:.65rem;background:#fff;transition:background .15s ease}.vmc-moment-q:hover{background:var(--brand-primary-light)}.vmc-moment-icon{font-size:.7rem;color:var(--brand-primary);flex-shrink:0;transition:transform .2s ease}.vmc-moment-a{display:none;padding:.85rem 1rem .85rem 2.35rem;font-size:.88rem;line-height:1.7;color:#4b5563}.vmc-moment-a.visible{display:block}.vmc-snapshot-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.88rem;border-radius:12px;overflow:hidden;border:1px solid #c7d2fe}.vmc-snapshot-table thead th{background:#ede9fe;color:#4338ca;padding:.85rem 1.25rem;text-align:left;font-weight:700;font-size:.92rem;letter-spacing:.02em;border-bottom:1px solid #c7d2fe}.vmc-snapshot-table tbody td{padding:.6rem 1.25rem;border-bottom:1px solid #e0e7ff;color:#374151}.vmc-snapshot-table tbody tr:last-child td{border-bottom:none}.vmc-snapshot-table tbody tr:hover{background:#f5f3ff}.vmc-snapshot-label{font-weight:600;color:#6366f1;white-space:nowrap}.vmc-snapshot-value{font-family:Courier New,monospace;color:#1f2937;font-size:.86rem}.visual-quiz-card{background:#fff;border-radius:12px;border:1px solid #e5e7eb;padding:1.25rem;margin-bottom:1rem;transition:all .3s ease}.visual-quiz-card.answered.correct{border-color:#34d399;background:#f0fdf4}.visual-quiz-card.answered.incorrect{border-color:#f87171;background:#fef2f2}.visual-quiz-question{font-size:15px;line-height:1.6;color:#1f2937;margin-bottom:.75rem}.vmc-quiz-hidden{display:none!important}.vmc-quiz-nav{gap:.5rem;margin-bottom:1.25rem}.vmc-quiz-nav,.vmc-quiz-nav-btn{display:flex;justify-content:center}.vmc-quiz-nav-btn{width:36px;height:36px;border-radius:10px;border:2px solid #e5e7eb;background:#fff;font-size:.85rem;font-weight:600;color:#6b7280;cursor:pointer;transition:all .2s ease;align-items:center}.vmc-quiz-nav-btn:hover{border-color:#a78bfa;color:#7c3aed}.vmc-quiz-nav-btn.active{background:#7c3aed;border-color:#7c3aed;color:#fff}.vmc-quiz-nav-btn.answered.correct{background:#d1fae5;border-color:#34d399;color:#047857}.vmc-quiz-nav-btn.answered.incorrect{background:#fee2e2;border-color:#f87171;color:#dc2626}.visual-transcript-box{background:#f9fafb;border-radius:12px;padding:1.25rem;font-size:.92rem;line-height:1.8;color:#4b5563;border:1px solid #e5e7eb}.api-loading-bar{position:fixed;top:0;left:0;right:0;height:3px;background:var(--brand-primary-light);z-index:1000;overflow:hidden}.api-loading-progress{height:100%;width:30%;background:var(--brand-primary);border-radius:0 2px 2px 0;animation:apiLoadSlide 1.2s ease-in-out infinite}@keyframes apiLoadSlide{0%{transform:translateX(-100%);width:30%}50%{width:60%}to{transform:translateX(400%);width:30%}}.api-error-banner{display:flex;align-items:center;justify-content:space-between;background:#fef3c7;border:1px solid #fde68a;border-radius:10px;padding:.65rem 1rem;margin-bottom:1rem;font-size:.85rem;color:#92400e}.api-error-banner button{background:none;border:none;color:#92400e;cursor:pointer;font-size:1rem;padding:0 .25rem;opacity:.6}.api-error-banner button:hover{opacity:1}.brm-step-nav{gap:.5rem;margin-bottom:1.25rem}.brm-step-btn,.brm-step-nav{display:flex;justify-content:center}.brm-step-btn{width:36px;height:36px;border-radius:10px;border:2px solid #e5e7eb;background:#fff;font-size:.85rem;font-weight:600;color:#6b7280;cursor:pointer;transition:all .2s ease;align-items:center}.brm-step-btn:hover{border-color:#60a5fa;color:#2563eb}.brm-step-btn.active{background:#2563eb;border-color:#2563eb;color:#fff}.brm-step-card{animation:fadeInUp .3s ease}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.brm-code-added{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;margin-bottom:1rem}.brm-code-label{font-size:.8rem;font-weight:700;color:#1d4ed8;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}.brm-code-snippet{font-family:JetBrains Mono,Fira Code,monospace;font-size:.9rem;font-weight:600;color:#1e40af;background:rgba(59,130,246,.1);padding:.2rem .6rem;border-radius:6px}.brm-comparison{display:grid;grid-template-columns:1fr auto 1fr;grid-gap:.75rem;gap:.75rem;align-items:stretch;margin-bottom:1rem}.brm-after,.brm-before{border-radius:12px;overflow:hidden;border:1px solid #e5e7eb}.brm-before{border-color:#fca5a5}.brm-after{border-color:#6ee7b7}.brm-panel-header{padding:.5rem .75rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;text-align:center}.brm-before .brm-panel-header{background:#fef2f2;color:#dc2626}.brm-after .brm-panel-header{background:#f0fdf4;color:#16a34a}.brm-ascii-panel{padding:.75rem;font-family:Courier New,monospace;font-size:.72rem;line-height:1.4;white-space:pre;background:#fafafa;margin:0;min-height:60px;color:#374151}.brm-arrow{display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#9ca3af;font-weight:700}.brm-explanation{font-size:.92rem;line-height:1.7;color:#4b5563;margin-bottom:.75rem}.brm-browser-action{display:flex;align-items:flex-start;gap:.5rem;padding:.65rem 1rem;background:#f5f3ff;border-radius:8px;border-left:3px solid #7c3aed;font-size:.85rem;line-height:1.6;color:#4b5563}.brm-action-label{font-weight:700;color:#6d28d9;white-space:nowrap}.wpm-severity-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.25rem;border-radius:25px;font-size:.85rem;font-weight:700;letter-spacing:.05em;margin-bottom:.75rem}.wpm-severity-low{background:#d1fae5;color:#065f46}.wpm-severity-medium{background:#fef3c7;color:#92400e}.wpm-severity-high{background:#fee2e2;color:#991b1b}.wpm-severity-critical{background:#fecaca;color:#7f1d1d}.wpm-overview-text{font-size:15px;line-height:1.7;color:#4b5563;max-width:600px;margin:.5rem auto 0}.wpm-explanation{font-size:.92rem;line-height:1.7;color:#4b5563;margin-top:.75rem}.wpm-metrics{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:.75rem;gap:.75rem;margin-top:1rem;padding:1rem;border-radius:12px}.wpm-metrics-good{background:#f0fdf4;border:1px solid #bbf7d0}.wpm-metrics-bad{background:#fef2f2;border:1px solid #fecaca}.wpm-metric{display:flex;flex-direction:column;align-items:center;gap:.25rem;text-align:center}.wpm-metric-label{font-size:.75rem;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.03em}.wpm-metric-value{font-family:JetBrains Mono,monospace;font-size:.88rem;font-weight:600;color:#1f2937}.wpm-cell-good{color:#047857!important;font-weight:600}.wpm-cell-bad{color:#dc2626!important;font-weight:600}.wpm-comparison-table th{background:#f0f9ff!important;color:#0369a1!important;border-bottom-color:#bae6fd!important}.wpm-cwv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));grid-gap:.75rem;gap:.75rem}.wpm-cwv-card{padding:1rem;background:var(--bg-subtle);border:1px solid var(--border-light);border-radius:12px;transition:border-color .2s}.wpm-cwv-card:hover{border-color:var(--brand-primary)}.wpm-cwv-label{font-size:.8rem;font-weight:700;color:var(--brand-primary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.4rem}.wpm-cwv-text{font-size:.88rem;line-height:1.6;color:#4b5563}.wpm-tips-list{display:flex;flex-direction:column;gap:.6rem}.wpm-tip-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;background:var(--bg-subtle);border:1px solid var(--border-light);border-radius:10px;transition:all .2s}.wpm-tip-item:hover{border-color:#60a5fa;background:#eff6ff}.wpm-tip-number{width:28px;height:28px;min-width:28px;border-radius:50%;background:var(--brand-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:700}.wpm-tip-text{font-size:.9rem;line-height:1.6;color:#374151;flex:1 1}.v5-analysis-section{margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--border-light)}.v5-analysis-section:last-child{border-bottom:none;margin-bottom:0}.v5-section-title{font-size:16px;font-weight:600;color:var(--text-primary);margin:0 0 .75rem;padding-left:.5rem;border-left:3px solid var(--brand-primary)}.v5-key-metric{font-size:17px;font-weight:700;text-align:center;padding:1.25rem;background:linear-gradient(135deg,#eff6ff,#e0e7ff);border-radius:12px;color:var(--brand-primary);border:1px solid #c7d2fe}.project-step{transition:all .2s ease;cursor:pointer}.project-step.active-step{border-color:var(--brand-primary);box-shadow:0 0 0 2px rgba(79,70,229,.15)}.project-step .code-articles-card-header{cursor:pointer}.project-scenario{line-height:1.7;padding:1rem;background:#f0fdf4;border-radius:10px;border:1px solid #bbf7d0}.project-goal,.project-scenario{font-size:15px;color:#374151;margin-bottom:1rem}.project-goal{line-height:1.6;padding:.75rem 1rem;background:#eff6ff;border-radius:10px;border:1px solid #bfdbfe}.project-requirements h4{font-size:.9rem;font-weight:600;margin:0 0 .5rem;color:#6b7280}.project-requirements ul{margin:0;padding-left:1.25rem}.project-requirements li{margin-bottom:.35rem;font-size:.92rem;line-height:1.5}.step-instruction{font-size:15px;line-height:1.7;color:#374151;margin-bottom:1rem}.project-extensions h4{font-size:.9rem;font-weight:600;margin:1rem 0 .5rem;color:#6b7280}.project-extensions ul{margin:0;padding-left:1.25rem}.project-extensions li{margin-bottom:.35rem;font-size:.92rem;line-height:1.5;color:#374151}.explanation-box{margin-top:.75rem;padding:.75rem 1rem;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:10px}.explanation-title{font-weight:600;font-size:.85rem;margin-bottom:.4rem;color:#166534}.explanation-box div{font-size:.9rem;line-height:1.6;color:#374151}.vmc-snapshot-text{font-family:JetBrains Mono,Fira Code,monospace;font-size:.85rem;line-height:1.6;padding:1rem;background:#f8fafc;border-radius:10px;border:1px solid var(--border-light);white-space:pre-wrap;word-break:break-word}[data-mode=MDL]{--mode-accent:#d97706}[data-mode=UIR]{--mode-accent:#7c3aed}[data-mode=ARD]{--mode-accent:#dc2626}[data-mode=MTR]{--mode-accent:#059669}[data-mode=PUB]{--mode-accent:#e11d48}[data-mode=SCL]{--mode-accent:#0891b2}[data-mode=EXP]{--mode-accent:#059669}[data-mode=BLD]{--mode-accent:#ea580c}[data-mode=DES]{--mode-accent:#7c3aed}[data-mode=FLW]{--mode-accent:#8b5cf6}[data-mode=EXC]{--mode-accent:#0891b2}[data-mode=RWM]{--mode-accent:#0d9488}[data-mode=TFW]{--mode-accent:#b45309}[data-mode=DRW]{--mode-accent:#6366f1}[data-mode=AUT]{--mode-accent:#d97706}[data-mode] .code-articles-card-header{border-left:3px solid var(--mode-accent,var(--brand-primary))}[data-mode] .card-icon{color:var(--mode-accent,var(--brand-primary))}.mdl-pipeline{display:flex;flex-direction:column;gap:0}.mdl-stage-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem}.mdl-stage-num{width:28px;height:28px;border-radius:50%;background:#d97706;color:#fff;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;flex-shrink:0}.mdl-stage-name{font-weight:600;font-size:.95rem;color:#1f2937}.mdl-stage-body{margin-left:42px;padding:.75rem 1rem;background:#fffbeb;border:1px solid #fde68a;border-radius:10px}.mdl-shape-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-family:JetBrains Mono,Fira Code,monospace;font-size:.85rem}.mdl-shape{padding:.25rem .5rem;border-radius:6px;font-weight:500}.mdl-shape.in{background:#fef3c7;color:#92400e}.mdl-shape.out{background:#d9f99d;color:#365314}.mdl-op{color:#6b7280;font-style:italic}.mdl-arrow{color:#d97706;font-weight:700}.mdl-example{margin-top:.5rem;font-size:.85rem;color:#6b7280;line-height:1.5}.mdl-connector{text-align:center;color:#d97706;font-size:1.2rem;margin:.25rem 0 .25rem 42px}.mdl-convergence-chart{margin-bottom:1rem}.mdl-epoch-table .mdl-epoch-num{font-weight:700;color:#d97706}.mdl-epoch-table .mdl-accuracy,.mdl-epoch-table .mdl-loss{font-family:monospace}.mdl-final-epoch{background:#f0fdf4!important}.mdl-final-epoch td{font-weight:600}.mdl-pred-io{display:grid;grid-template-columns:1fr 1fr;grid-gap:.5rem;gap:.5rem;margin-bottom:.5rem;font-family:monospace;font-size:.85rem}.mdl-pred-label{font-weight:600;color:#6b7280;margin-right:.25rem}.mdl-pred-in{color:#92400e}.mdl-pred-out{color:#065f46}.mdl-pred-explain{font-size:.85rem;color:#6b7280;line-height:1.5}.uir-tree-box{padding:1rem;background:#faf5ff;border:1px solid #e9d5ff;border-radius:10px;margin-bottom:.75rem}.uir-tree-desc{font-size:.9rem;color:#6b7280;line-height:1.6}.uir-trace-detail{padding-left:.5rem}.uir-detail-label{font-weight:600;font-size:.8rem;color:#7c3aed;margin-right:.25rem}.uir-props,.uir-visual{font-size:.9rem;line-height:1.5;margin-bottom:.25rem}.uir-explain{font-size:.85rem;color:#6b7280;line-height:1.5;margin-top:.25rem}.uir-state-change{display:flex;flex-direction:column;gap:.75rem}.uir-state-trigger{padding:.5rem .75rem;background:#fef3c7;border-radius:8px;font-size:.9rem}.uir-state-label{font-weight:600;color:#92400e;margin-right:.5rem}.uir-state-compare{display:flex;align-items:stretch;gap:.5rem}.uir-state-box{flex:1 1;padding:.75rem;border-radius:10px;font-size:.9rem;line-height:1.5}.uir-state-box.before{background:#fef2f2;border:1px solid #fecaca}.uir-state-box.after{background:#f0fdf4;border:1px solid #bbf7d0}.uir-state-box-title{font-weight:700;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.35rem}.uir-state-box.before .uir-state-box-title{color:#dc2626}.uir-state-box.after .uir-state-box-title{color:#16a34a}.uir-state-arrow{display:flex;align-items:center;font-size:1.25rem;color:#7c3aed;font-weight:700;flex-shrink:0}.uir-rerender-scope{padding:.5rem .75rem;background:#faf5ff;border:1px solid #e9d5ff;border-radius:8px;font-size:.9rem}.uir-rerender-scope .uir-state-label{color:#7c3aed}.ard-diagram-box{padding:1rem;background:#fef2f2;border:1px solid #fecaca;border-radius:10px;margin-bottom:1rem}.ard-components{margin-top:1rem}.ard-comp-title{font-weight:600;font-size:.9rem;color:#6b7280;margin-bottom:.5rem}.ard-comp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-gap:.5rem;gap:.5rem}.ard-comp-card{padding:.75rem;background:#f8fafc;border-radius:8px;border:1px solid var(--border-light);border-top:3px solid #dc2626}.ard-comp-card.database{border-top-color:#059669}.ard-comp-card.cache{border-top-color:#d97706}.ard-comp-card.message_queue,.ard-comp-card.queue{border-top-color:#7c3aed}.ard-comp-card.load_balancer{border-top-color:#0891b2}.ard-comp-card.cdn{border-top-color:#ea580c}.ard-comp-name{font-weight:700;font-size:.9rem;color:#1f2937}.ard-comp-type{font-size:.75rem;color:#9ca3af;text-transform:uppercase;letter-spacing:.05em;margin:.15rem 0}.ard-comp-purpose{font-size:.85rem;color:#6b7280;line-height:1.4}.ard-flow-action{font-size:.9rem;color:#374151;margin-bottom:.25rem}.ard-flow-meta{display:flex;gap:1rem;font-size:.8rem;color:#6b7280}.ard-failure{display:flex;flex-direction:column;gap:.5rem}.ard-failure-row{padding:.6rem .75rem;border-radius:8px;font-size:.9rem;line-height:1.5}.ard-failure-row.fail{background:#fef2f2;border:1px solid #fecaca}.ard-failure-row.impact{background:#fffbeb;border:1px solid #fde68a}.ard-failure-row.fix{background:#f0fdf4;border:1px solid #bbf7d0}.ard-failure-label{font-weight:600;margin-right:.5rem}.ard-failure-row.fail .ard-failure-label{color:#dc2626}.ard-failure-row.impact .ard-failure-label{color:#d97706}.ard-failure-row.fix .ard-failure-label{color:#16a34a}.exp-setup{display:flex;flex-direction:column;gap:.5rem}.exp-setup-row{padding:.5rem .75rem;border-radius:8px;font-size:.9rem;line-height:1.5;background:#f8fafc;border:1px solid var(--border-light)}.exp-setup-row.metrics{background:#fffbeb;border-color:#fde68a;font-family:monospace}.exp-setup-row.issue{background:#fef2f2;border-color:#fecaca}.exp-setup-label{font-weight:600;color:#4b5563;margin-right:.5rem}.exp-objective{font-size:1rem;font-weight:600;color:#1f2937;padding:.75rem 1rem;background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;margin-bottom:.75rem}.exp-comparison{font-size:.95rem;line-height:1.7;margin-bottom:.75rem}.use-case-tag.exp-constraint{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-color:#fcd34d;color:#92400e}.use-case-tag.exp-constraint:before{color:#f59e0b;content:"⚠"}.bld-mockup-box{padding:1rem;background:#1e293b;border-radius:10px;margin-bottom:1rem}.bld-mockup-box.result{background:#064e3b}.bld-mockup-title{font-size:.75rem;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.bld-mockup{font-family:JetBrains Mono,Fira Code,monospace;font-size:.8rem;line-height:1.4;color:#e2e8f0;white-space:pre;overflow-x:auto;margin:0}.des-section-title{font-weight:600;font-size:.85rem;color:#6b7280;margin-bottom:.35rem}.des-hint-group{margin-bottom:1rem}.des-hint-group:last-child{margin-bottom:0}.des-hint-title{font-weight:600;font-size:.85rem;color:#374151;margin-bottom:.35rem}.des-arch-diagram{padding:1rem;background:#faf5ff;border:1px solid #e9d5ff;border-radius:10px;margin-bottom:1rem}.des-data-flow,.des-schema{margin-top:1rem}.des-flow-step{font-size:.9rem;line-height:1.6;padding:.15rem 0}.des-schema-content{font-size:.9rem;line-height:1.6;color:#374151;padding:.75rem 1rem;background:#f8fafc;border:1px solid var(--border-light);border-radius:8px;font-family:monospace;white-space:pre-wrap}.use-case-tag.des-nfr{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-color:#fcd34d;color:#92400e}.use-case-tag.des-nfr:before{color:#f59e0b;content:"⚡"}@media (max-width:768px){.mdl-shape-row{flex-direction:column;gap:.25rem}.mdl-shape-row .mdl-arrow{display:none}.mdl-connector,.mdl-stage-body{margin-left:0}.mdl-pred-io{grid-template-columns:1fr}.uir-state-compare{flex-direction:column}.uir-state-arrow{transform:rotate(90deg);align-self:center}.ard-comp-grid{grid-template-columns:1fr}.ard-flow-meta{flex-direction:column;gap:.25rem}.bld-mockup{font-size:.7rem}}[data-mode=SHT]{--mode-accent:#059669}[data-mode=SCN]{--mode-accent:#0891b2}[data-mode=DAS]{--mode-accent:#4f46e5}[data-mode=RWM]{--mode-accent:#d97706}[data-mode=TFW]{--mode-accent:#7c3aed}.sht-formula-box{background:#1e293b;border-radius:12px;padding:1rem 1.5rem;margin:.75rem 0;overflow-x:auto}.sht-formula-box code{font-family:JetBrains Mono,monospace;font-size:1.05rem;font-weight:600;color:#67e8f9;letter-spacing:.02em}[data-mode=SCN] .project-step-container.active{border-color:#0891b2;box-shadow:0 0 0 2px rgba(8,145,178,.15)}[data-mode=SCN] .project-step-badge.completed{background:#0891b2;color:#fff}[data-mode=SCN] table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--border-light);border-radius:12px;overflow:hidden;margin:.5rem 0}[data-mode=SCN] th{background:var(--bg-subtle);font-weight:600;font-size:.9rem;color:var(--text-dark);padding:.75rem 1rem;text-align:left}[data-mode=SCN] td,[data-mode=SCN] th{border-bottom:1px solid var(--border-light)}[data-mode=SCN] td{padding:.65rem 1rem;font-size:.95rem;color:#374151}[data-mode=SCN] tr:last-child td{border-bottom:none}[data-mode=SCN] tr:hover td{background:var(--bg-subtle)}.signup-gate-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;z-index:10000;opacity:0;transition:opacity .3s ease;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.signup-gate-overlay.active{display:flex;opacity:1}.signup-gate-modal{background:#fff;border-radius:20px;padding:2.5rem 2rem;text-align:center;max-width:420px;width:90%;transform:scale(.9) translateY(20px);transition:transform .35s cubic-bezier(.34,1.56,.64,1);box-shadow:0 25px 60px -12px rgba(0,0,0,.3);position:relative}.signup-gate-overlay.active .signup-gate-modal{transform:scale(1) translateY(0)}.signup-gate-close{position:absolute;top:1rem;right:1rem;width:32px;height:32px;border:none;background:var(--bg-subtle);border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.signup-gate-close:hover{background:#e2e8f0}.signup-gate-close svg{width:18px;height:18px;stroke:var(--text-gray)}.signup-gate-icon{font-size:3rem;margin-bottom:1rem;line-height:1}.signup-gate-headline{font-size:1.5rem;font-weight:800;color:var(--text-dark);margin:0 0 .5rem;line-height:1.3}.signup-gate-subtext{font-size:15px;color:var(--text-gray);margin:0 0 1.5rem;line-height:1.5}.signup-gate-benefits{text-align:left;margin:0 auto 1.5rem;max-width:300px}.signup-gate-benefit{display:flex;align-items:center;gap:.6rem;padding:.45rem 0;font-size:.9rem;color:var(--text-dark)}.signup-gate-check{color:var(--state-strong);font-weight:700;font-size:.85rem;flex-shrink:0}.signup-gate-cta{width:100%;padding:.9rem 1.5rem;background:linear-gradient(135deg,var(--brand-primary) 0,#4f46e5 100%);border:none;border-radius:12px;font-size:1rem;font-weight:700;color:#fff;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px rgba(95,86,254,.3);margin-bottom:.75rem}.signup-gate-cta:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(95,86,254,.4)}.signup-gate-cta:active{transform:translateY(0)}.signup-gate-signin{display:block;width:100%;background:none;border:none;font-size:.85rem;color:var(--text-gray);cursor:pointer;padding:.5rem 0;transition:color .2s}.signup-gate-signin:hover{color:var(--brand-primary)}.signup-gate-signin strong{color:var(--brand-primary);font-weight:600}.signup-gate-dismiss{display:block;width:100%;background:none;border:none;font-size:.8rem;color:#94a3b8;cursor:pointer;padding:.4rem 0 0;transition:color .2s}.signup-gate-dismiss:hover{color:var(--text-gray)}.skel{background:linear-gradient(90deg,var(--border-color,#e5e7eb) 25%,var(--hover-bg,#f3f4f6) 50%,var(--border-color,#e5e7eb) 75%);background-size:200% 100%;animation:skel-shimmer 1.4s infinite;border-radius:6px}@keyframes skel-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.w-30{width:30%}.w-40{width:40%}.w-50{width:50%}.w-60{width:60%}.w-75{width:75%}.w-80{width:80%}.w-85{width:85%}.w-90{width:90%}.w-100{width:100%}.skel-icon{width:48px;height:48px;border-radius:12px;flex-shrink:0}.skel-icon-sm{width:24px;height:24px;border-radius:6px;flex-shrink:0}.skel-line{height:14px;margin-bottom:10px}.skel-title{height:32px;width:60%;margin:12px 0}.skel-pill{height:26px;width:80px;border-radius:999px}.skel-tab{height:40px;width:80px;border-radius:10px;flex-shrink:0}.skel-progress{height:4px;width:100%;border-radius:2px;margin-top:4px}.skel-code-block{height:120px;width:100%;border-radius:10px;margin:12px 0}.skeleton-header{padding:16px 0 8px}.skel-pills{display:flex;gap:8px;margin-bottom:12px}.skeleton-tabs{display:flex;gap:8px;padding:12px 0}.skeleton-card,.skeleton-tabs{overflow:hidden;margin-bottom:16px}.skeleton-card{background:var(--card-bg,#fff);border:1px solid var(--border-color,#e5e7eb);border-radius:16px}.skeleton-card-header{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--border-color,#e5e7eb)}.skeleton-card-body{padding:20px}.skeleton-sidebar-header{display:flex;align-items:center;gap:12px;padding:20px 16px;border-bottom:1px solid var(--border-color,#e5e7eb);margin-bottom:8px}.skel-lines{flex:1 1}.skel-module-group{padding:12px 16px;border-bottom:1px solid var(--border-color,#e5e7eb)}.skel-module-item{padding:8px 0 8px 12px}