*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0f1419;color:#e5e7eb}code{font-family:Fira Code,Monaco,Consolas,Courier New,monospace}button,input,textarea{font-family:inherit}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#1a1f2e;border-radius:10px}::-webkit-scrollbar-thumb{background:#0ea5e9;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#0284c7}.app{min-height:100vh;display:flex;flex-direction:column;background:#0f1419}.app-header{background:#1a1f2e;padding:1.5rem 2rem;box-shadow:0 2px 8px #0000004d;display:flex;justify-content:center;align-items:center;border-bottom:1px solid #2a3342}.header-left{text-align:center}.logo-container{display:flex;align-items:center;gap:1rem}.logo{font-size:2.5rem;border:none;outline:none}.title-group h1{margin:0;font-size:2.2rem;color:#fff;font-weight:800;letter-spacing:-.02em}.subtitle{margin:0;color:#9ca3af;font-size:.95rem;font-weight:500}.nav-tabs{display:flex;gap:1rem;align-items:center}.nav-tab{padding:.75rem 2rem;font-size:1.1rem;font-weight:600;border:none;background:#2a3342;color:#9ca3af;border-radius:8px;cursor:pointer;transition:all .3s ease}.nav-tab:hover{background:#374151;color:#e5e7eb}.nav-tab.active{background:#0ea5e9;color:#fff;box-shadow:0 2px 4px #0ea5e933}.main-content{flex:1;padding:2rem;max-width:1400px;width:100%;margin:0 auto}@media(max-width:968px){.app-header{flex-direction:column;align-items:flex-start;gap:1.5rem}.header-left{width:100%}.app-header h1{font-size:1.5rem}.subtitle{font-size:.9rem}.nav-tabs{width:100%;justify-content:flex-start;flex-wrap:wrap}.nav-tab{padding:.6rem 1.5rem;font-size:.95rem}.main-content{padding:1rem}}.lesson-container{max-width:1000px;margin:0 auto;padding:2rem}.decision-tree{background:#0f1419;border-radius:12px;padding:1.5rem;border:1px solid #2a3342}.decision-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;margin-bottom:.75rem;border-radius:8px;background:#1a1f2e;border:1px solid #374151}.decision-item.highlight{background:#0ea5e91a;border-color:#0ea5e9}.decision-item:last-child{margin-bottom:0}.condition{color:#d1d5db;font-family:Fira Code,monospace;font-size:.95rem}.action{color:#0ea5e9;font-weight:600;font-size:.95rem}.self-check-section{padding:2rem 2rem 1rem!important;background:#1a1f2e;border-radius:12px;border:1px solid #2a3342}.answer{color:#d1d5db;line-height:1.7;font-size:1.05rem;margin-bottom:1rem}.answer-explanation{background:#0ea5e91a;border-radius:8px;padding:1rem;border-left:3px solid #0ea5e9}.answer-explanation p{color:#d1d5db;line-height:1.6;margin-bottom:.5rem}.answer-explanation p:last-child{margin-bottom:0}.lesson-navigation{display:flex;justify-content:space-between;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #2a3342}.answer-input fieldset{border:none;padding:0;margin-bottom:1.5rem}.answer-input legend{font-size:1.05rem;color:#e5e7eb;margin-bottom:1.5rem;line-height:1.7}.self-check-section fieldset{border:none!important;outline:none!important;box-shadow:none!important;background:transparent!important;padding:0;margin:0 0 1.5rem;min-inline-size:0;display:block}.self-check-section legend{all:unset;display:block;color:#e5e7eb;font-size:1.05rem;line-height:1.7;margin-bottom:1.5rem}@media(max-width:768px){.lesson-container{padding:1rem}.lesson-header h1{font-size:2rem}.lesson-content{padding:1.5rem}.content-section h2{font-size:1.5rem}.decision-item{flex-direction:column;align-items:flex-start;gap:.5rem}.lesson-navigation{flex-direction:column;gap:1rem}}.lesson-content{display:flex;flex-direction:column;gap:1.5rem}.content-section{background:#1a1f2e;padding:2rem;border-radius:12px;border:1px solid #2a3342}.content-section h2{color:#0ea5e9;margin-bottom:1.5rem;font-size:1.5rem;font-weight:600}.content-section p{color:#e5e7eb;line-height:1.7;margin-bottom:1rem;font-size:1.05rem}.fibonacci-intro{background:linear-gradient(135deg,#3b82f61a,#8b5cf61a);border:2px solid rgba(59,130,246,.3);box-shadow:0 8px 24px #3b82f61a}.fibonacci-sequence{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin:2rem 0;padding:2rem;background:linear-gradient(135deg,#0ea5e926,#8b5cf626);border-radius:12px;border:2px solid rgba(14,165,233,.3);justify-content:center}.fib-number{background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;padding:.75rem 1rem;border-radius:8px;font-weight:700;font-size:1.2rem;min-width:3rem;text-align:center;box-shadow:0 4px 12px #3b82f666;transition:all .3s ease}.fib-number:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 6px 20px #3b82f699}.fib-anim-1{animation:fadeInScale .6s ease .1s both}.fib-anim-2{animation:fadeInScale .6s ease .2s both}.fib-anim-3{animation:fadeInScale .6s ease .3s both}.fib-anim-4{animation:fadeInScale .6s ease .4s both}.fib-anim-5{animation:fadeInScale .6s ease .5s both}.fib-anim-6{animation:fadeInScale .6s ease .6s both}.fib-anim-7{animation:fadeInScale .6s ease .7s both}.fib-anim-8{animation:fadeInScale .6s ease .8s both}.fib-anim-9{animation:fadeInScale .6s ease .9s both}@keyframes fadeInScale{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.fib-arrow{color:#8b5cf6;font-size:1.3rem;font-weight:700}.fib-ellipsis{color:#8b5cf6;font-size:1.5rem;font-weight:700;padding:.5rem}.formula-highlight{background:linear-gradient(135deg,#fbbf2426,#f59e0b26);border-left:4px solid #fbbf24;border-radius:12px;padding:1.5rem;margin:2rem 0;box-shadow:0 4px 12px #fbbf2433}.formula-label{color:#fbbf24;font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:.75rem}.formula-content{display:flex;justify-content:center;padding:1rem;background:#0003;border-radius:8px;margin-bottom:.75rem}.formula-text{font-family:Monaco,Menlo,monospace;font-size:1.5rem;font-weight:700;color:#fbbf24;text-shadow:0 2px 4px rgba(0,0,0,.3)}.formula-note{color:#d1d5db;font-size:.95rem;font-style:italic;text-align:center}.fibonacci-question{background:#10b9811a;border-left:4px solid #10b981;padding:1rem 1.5rem;border-radius:8px;margin-top:1.5rem}.fibonacci-question strong{color:#10b981}.self-check-section h2{color:#fff;margin-bottom:1.5rem;font-size:1.75rem!important;font-weight:600!important}.answer-actions{display:flex;justify-content:center}.user-feedback{margin-bottom:1.5rem!important;padding:1rem 1rem .25rem!important;border-radius:8px;background:#10b9811a;border-left:4px solid #10b981}.user-choice{font-size:1.1rem;font-weight:600;margin-bottom:.5rem!important}.code-section{background:#1a1f2e;padding:2rem;border-radius:12px;border:1px solid #2a3342}.code-section h2{color:#fff;margin-bottom:1.5rem;font-size:1.75rem!important;font-weight:600!important}.code-section p{color:#e5e7eb;line-height:1.7;margin-bottom:1rem;font-size:1.05rem}.animation-container{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto;gap:1.5rem;margin-top:2rem}.code-comparison{margin:1.5rem 0}.code-comparison .code-block{background:#0f172a;border-radius:8px;padding:1rem;border:1px solid #334155;font-family:Monaco,Menlo,Ubuntu Mono,monospace;margin-bottom:1rem}.code-comparison .code-line{display:flex;align-items:center;padding:.25rem 0}.code-comparison .line-number{color:#64748b;margin-right:1rem;min-width:2rem;font-size:.9rem}.code-comparison .line-content{color:#e2e8f0;font-size:.95rem;white-space:pre}.code-display{grid-column:1;grid-row:1}.memoization-display{grid-column:2;grid-row:1}.explanation-display{grid-column:1 / -1;grid-row:2}.animation-controls{grid-column:1 / -1;grid-row:3;display:flex;justify-content:center;align-items:center;gap:1rem}.code-display h3,.memoization-display h3,.explanation-display h3{color:#0ea5e9;margin-bottom:1rem;font-size:1.2rem;font-weight:600}.code-block{background:#0f172a;border-radius:8px;padding:1.5rem;border:1px solid #334155;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.code-line{display:flex;align-items:center;padding:.5rem 0;transition:all .3s ease}.code-line.highlighted{background:#0ea5e933;border-radius:4px;padding:.5rem .75rem;margin:0 -.75rem;border-left:3px solid #0ea5e9}.line-number{color:#64748b;margin-right:1rem;min-width:2rem;font-size:.9rem}.line-content{color:#e2e8f0;font-size:.95rem;white-space:pre}.fib-dict{background:#0f172a;border-radius:8px;padding:1rem;border:1px solid #334155}.dict-label{color:#0ea5e9;font-weight:600;margin-bottom:.75rem;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.9rem}.dict-content{display:flex;flex-wrap:wrap;gap:.4rem}.dict-entry{background:#1e293b;color:#e2e8f0;padding:.4rem .6rem;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.8rem;border:1px solid #475569}.explanation-display .explanation-text{background:#0f172a;border-radius:8px;padding:1.5rem;border:1px solid #334155;color:#e2e8f0;line-height:1.6;font-size:1.1rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Arial,sans-serif}.step-indicator{color:#9ca3af;font-size:.9rem;font-weight:500}.nav-button.primary{background-color:#0284c7;color:#fff}.nav-button.primary:hover{background-color:#0369a1}@media(max-width:768px){.animation-container{grid-template-columns:1fr;grid-template-rows:auto auto auto auto}.code-display{grid-column:1;grid-row:1}.memoization-display{grid-column:1;grid-row:2}.explanation-display{grid-column:1;grid-row:3}.animation-controls{grid-column:1;grid-row:4}.lesson-container{padding:1rem}.content-section,.self-check-section,.code-section{padding:1.5rem}.fibonacci-sequence{padding:1.5rem 1rem;gap:.5rem}.fib-number{padding:.5rem .75rem;font-size:1rem;min-width:2.5rem}.fib-arrow{font-size:1rem}.formula-text{font-size:1.2rem}.formula-highlight{padding:1rem}}.homework-problem-intro{background:linear-gradient(135deg,#fbbf2414,#f59e0b14);border:2px solid rgba(251,191,36,.3);box-shadow:0 8px 24px #fbbf241a}.problem-statement-card{display:flex;gap:1.5rem;background:linear-gradient(135deg,#10b9811f,#0ea5e91f);border-radius:12px;padding:2rem;border-left:4px solid #10b981;margin:2rem 0;box-shadow:0 4px 12px #10b98126}.problem-icon{font-size:3rem;flex-shrink:0}.problem-statement-content{flex:1}.statement-label{color:#10b981;font-size:.95rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:.75rem}.statement-text{color:#e5e7eb;line-height:1.8;font-size:1.05rem;margin:0}.problem-specs{background:linear-gradient(135deg,#3b82f61a,#8b5cf61a);border-radius:12px;padding:2rem;border:2px solid rgba(59,130,246,.3);margin:2rem 0;box-shadow:0 4px 12px #3b82f61a}.specs-header{display:flex;align-items:center;gap:1rem;margin-bottom:2rem}.specs-icon{font-size:1.8rem}.problem-specs h3{color:#3b82f6;margin:0;font-size:1.4rem;font-weight:700}.specs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.spec-card{background:#0000004d;border-radius:12px;padding:1.5rem;border:2px solid transparent;transition:all .3s ease;text-align:center}.spec-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #3b82f633}.spec-budget{border-color:#fbbf2480}.spec-budget:hover{border-color:#fbbf24;box-shadow:0 8px 20px #fbbf244d}.spec-input{border-color:#10b98180}.spec-input:hover{border-color:#10b981;box-shadow:0 8px 20px #10b9814d}.spec-output{border-color:#ef444480}.spec-output:hover{border-color:#ef4444;box-shadow:0 8px 20px #ef44444d}.spec-icon{font-size:2.5rem;margin-bottom:1rem}.spec-label{color:#0ea5e9;font-size:1.1rem;font-weight:700;margin-bottom:1rem;text-transform:uppercase;letter-spacing:.5px}.spec-value{color:#fbbf24;font-size:1.8rem;font-weight:700;font-family:Monaco,Menlo,monospace}.spec-list{list-style:none;padding:0;margin:0;text-align:left;color:#d1d5db}.spec-list li{margin-bottom:0rem;line-height:1.6;font-size:.95rem;padding-left:1.5rem;position:relative}.spec-list li:before{content:"→";position:absolute;left:0;color:#3b82f6;font-weight:700}.spec-list strong{color:#0ea5e9;font-weight:700}.self-check-section h2{color:#0ea5e9;margin-bottom:1.5rem}.question-group fieldset{border:none!important;outline:none!important;box-shadow:none!important;background:transparent!important;padding:0;margin:0 0 1.5rem!important;min-inline-size:0;display:block;clip-path:inset(0 round 0)}.question-group legend{all:unset;display:block;color:#e5e7eb;line-height:1.7;margin-bottom:1.5rem;font-size:1.05rem}@media(max-width:768px){.lesson-container{padding:1rem}.lesson-content,.content-section,.self-check-section,.example-box{padding:1.5rem}.data-row{flex-direction:column;align-items:flex-start;gap:.5rem}.data-label{min-width:auto;margin-right:0}.lesson-header h1{font-size:2rem}.content-section h2{font-size:1.5rem}.problem-statement-card{flex-direction:column;padding:1.5rem;gap:1rem}.problem-icon{font-size:2.5rem;text-align:center}.specs-grid{grid-template-columns:1fr;gap:1rem}.spec-card{padding:1.25rem}.spec-icon{font-size:2rem}.spec-value{font-size:1.5rem}}.content-section em{font-style:italic;color:#e5e7eb}.content-section strong em{color:inherit;font-style:italic}.content-section a{color:#0ea5e9;text-decoration:underline;transition:color .3s ease}.content-section a:hover{color:#0284c7}.memoization-table-container{margin:2rem 0;padding:2.5rem;background:#0f172a80;border-radius:12px;border:1px solid #334155;overflow-x:auto;display:flex;flex-direction:column;align-items:center}.table-instruction{color:#d1d5db;margin-bottom:1.5rem;font-size:1.05rem;font-style:italic}.memoization-table{display:table;border-collapse:separate;border-spacing:0;font-family:Monaco,Menlo,Ubuntu Mono,monospace;box-shadow:0 4px 12px #0000004d}.table-header,.table-row{display:table-row}.header-cell{display:table-cell;min-width:60px;min-height:60px;padding:1rem;background:#1e293b;border:1px solid #475569;color:#0ea5e9;font-weight:600;text-align:center;vertical-align:middle;font-size:1.1rem}.header-cell.corner{background:#0f172a;border:1px solid #475569;line-height:1.3;font-size:1rem}.header-cell.ellipsis{color:#6b7280;font-size:1.2rem}.table-cell{display:table-cell;min-width:60px;min-height:60px;padding:1rem;border:1px solid #475569;background:#2a3647;color:#e2e8f0;text-align:center;vertical-align:middle;font-size:1.1rem;cursor:default}.table-cell.base-case{background:#0ea5e933;border-color:#0ea5e9;color:#0ea5e9;font-weight:700}.table-cell.filled{background:#10b98133;border-color:#10b981;color:#10b981;font-weight:700}.table-cell.empty{background:#2a3647;color:#6b7280}.table-cell.ellipsis{color:#6b7280;font-size:1.2rem}.table-cell.current-cell{background:#fbbf244d;border-color:#f59e0b;animation:pulse 1.5s ease-in-out infinite}.walkthrough-container{margin:2rem 0}.walkthrough-table{display:flex;justify-content:center;margin-bottom:1.5rem}.walkthrough-controls{display:flex;justify-content:center;align-items:center;gap:2rem;margin-top:2rem}.formula-explanation{color:#9ca3af;font-size:.95rem;font-style:italic;margin:.25rem 0 .75rem}.traceback-card{background:linear-gradient(135deg,#10b98114,#34d3990d);border-color:#10b98140}.traceback-card .recurrence-header{color:#10b981;border-bottom-color:#10b9814d}.traceback-card .formula-case{border-left-color:#10b981}.traceback-card .formula-case:hover{border-left-color:#34d399}.traceback-card .explanation-label{color:#10b981}.inline-comment{color:#6b7280;font-size:.9rem;font-style:italic;font-weight:400}.problem-specs{background:#0ea5e91a;border-radius:12px;padding:2rem;border:1px solid rgba(14,165,233,.2);margin:2rem 0}.problem-specs h3{color:#0ea5e9;margin-bottom:1.5rem;font-size:1.3rem;font-weight:600}.spec-item{margin-bottom:1.5rem;color:#e5e7eb}.spec-item strong{color:#0ea5e9;font-weight:600}.spec-item ul{margin:.5rem 0 0 1.5rem;color:#d1d5db}.spec-item li{margin-bottom:.5rem;line-height:1.6}.example-box{background:#0f172a;border-radius:12px;padding:2rem;border:1px solid #334155;margin:1.5rem 0}.example-header{color:#0ea5e9;font-size:1.2rem;font-weight:600;margin-bottom:1.5rem;text-align:center}.example-data{margin-bottom:1.5rem}.data-row{display:flex;align-items:center;margin-bottom:1rem;padding:.75rem;background:#1e293b;border-radius:8px;border:1px solid #475569}.data-label{color:#0ea5e9;font-weight:600;min-width:80px;margin-right:1rem}.data-value{color:#e2e8f0;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:1.1rem;background:#0f172a;padding:.5rem 1rem;border-radius:6px;border:1px solid #334155}.example-solution{background:#10b9811a;border-radius:8px;padding:1rem;border-left:4px solid #10b981;margin-bottom:1rem;color:#10b981;font-weight:600;font-size:1.1rem}.example-explanation{color:#d1d5db;line-height:1.6;font-style:italic;background:#3b82f61a;padding:1rem;border-radius:8px;border-left:4px solid #3b82f6}.self-check-section h3{color:#0ea5e9;margin-top:2rem;margin-bottom:1.5rem;font-size:1.3rem;font-weight:600}.self-check-section p{color:#d1d5db;line-height:1.8;font-size:1.1rem;margin-bottom:1.5rem}.answer-display{margin-top:1.5rem}.selected-option{color:#f59e0b;font-size:1rem;font-style:italic;margin:0 0 .5rem!important}.calculation-breakdown{margin-top:1.5rem;padding:1.5rem;background:#3b82f61a;border-radius:8px;border-left:4px solid #3b82f6}.calculation-breakdown h4{color:#3b82f6;margin-bottom:1rem;font-size:1.1rem;font-weight:600}.calculation-breakdown ul{margin:.5rem 0 1rem 1.5rem;color:#d1d5db}.calculation-breakdown li{margin-bottom:.5rem;line-height:1.6}.calculation-breakdown li strong{color:#0ea5e9}@media(max-width:768px){.lesson-container{padding:1rem}.lesson-content,.content-section,.self-check-section,.example-box{padding:1.5rem}.data-row{flex-direction:column;align-items:flex-start;gap:.5rem}.data-label{min-width:auto;margin-right:0}.lesson-header h1{font-size:2rem}.content-section h2{font-size:1.5rem}.memoization-table-container{padding:1rem}.table-cell,.header-cell{min-width:40px;min-height:40px;padding:.5rem;font-size:.9rem}.formula-box{padding:1rem 1.25rem}.formula-box p{font-size:1rem}.formula-indent{margin-left:1rem;padding-left:.75rem}.formula-line{font-size:.95rem;padding:.5rem .75rem}.formula-explanation{font-size:.85rem}.recurrence-card{padding:1.5rem}.formula-main{font-size:1.1rem}.formula-cases{margin-left:0}.formula-case{grid-template-columns:1fr;gap:.5rem;padding:1rem}.case-condition{font-size:.9rem}.case-arrow{display:none}.case-result{font-size:1rem}.explanation-item{flex-direction:column;gap:.5rem}.explanation-label{min-width:auto}.explanation-text{font-size:.9rem}}.lesson-container{max-width:1200px;margin:0 auto;padding:2rem;color:#e5e7eb}.lesson-header{margin-bottom:2rem;text-align:center}.lesson-header h1{color:#fff;font-size:2.5rem;margin-bottom:1rem;font-weight:700}.lesson-progress{display:flex;align-items:center;gap:1rem;justify-content:center}.lesson-number{color:#9ca3af;font-size:1rem;font-weight:500}.progress-bar{width:200px;height:8px;background:#2a3342;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:#0ea5e9;transition:width .5s ease}.lesson-content{background:#1a1f2e;border-radius:16px;padding:2.5rem;box-shadow:0 4px 12px #0000004d;border:1px solid #2a3342}.content-section{margin-bottom:1.5rem}.content-section:last-child{margin-bottom:0}.content-section h2{color:#fff;font-size:1.8rem;margin-bottom:1.5rem;font-weight:600}.content-section p{color:#d1d5db;line-height:1.8;font-size:1.1rem;margin-bottom:1.5rem}.content-section p:last-child{margin-bottom:0}.content-section strong{color:#0ea5e9;font-weight:600}.content-section em{font-style:italic;color:inherit}.dna-bases{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.5rem;margin:2rem 0}.base-card{background:#1e293b80;border-radius:12px;padding:1.5rem;text-align:center;border:2px solid #334155;transition:all .3s ease}.base-card:hover{transform:translateY(-4px);border-color:#0ea5e9;box-shadow:0 8px 16px #0ea5e933}.base-letter{font-size:3rem;font-weight:700;font-family:Monaco,Menlo,monospace;margin-bottom:.5rem}.base-letter.a{color:#10b981}.base-letter.t{color:#f59e0b}.base-letter.c{color:#3b82f6}.base-letter.g{color:#ef4444}.base-name{color:#9ca3af;font-size:.95rem;font-weight:500}.sequence-alignment-intro{background:linear-gradient(135deg,#10b98114,#0ea5e914);border:2px solid rgba(16,185,129,.3);box-shadow:0 8px 24px #10b9811a}.alignment-types{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:2rem 0}.alignment-type{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem;background:#0000004d;border-radius:16px;border:2px solid transparent;transition:all .3s ease;text-align:center}.alignment-type:hover{transform:translateY(-4px);box-shadow:0 8px 20px #3b82f633}.type-match{border-color:#10b98180}.type-match:hover{border-color:#10b981;box-shadow:0 8px 20px #10b9814d}.type-mismatch{border-color:#ef444480}.type-mismatch:hover{border-color:#ef4444;box-shadow:0 8px 20px #ef44444d}.type-gap{border-color:#9ca3af80}.type-gap:hover{border-color:#9ca3af;box-shadow:0 8px 20px #9ca3af4d}.type-icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:700;flex-shrink:0;box-shadow:0 4px 12px #0000004d;transition:all .3s ease}.alignment-type:hover .type-icon{transform:scale(1.1)}.type-icon.match{background:linear-gradient(135deg,#10b9814d,#10b98133);color:#10b981;border:3px solid #10b981}.type-icon.mismatch{background:linear-gradient(135deg,#ef44444d,#ef444433);color:#ef4444;border:3px solid #ef4444}.type-icon.gap{background:linear-gradient(135deg,#9ca3af4d,#9ca3af33);color:#9ca3af;border:3px solid #9ca3af;font-size:3.5rem;line-height:.8}.type-info{flex:1}.type-name{color:#0ea5e9;font-size:1.4rem;font-weight:700;margin-bottom:.75rem;text-transform:uppercase;letter-spacing:.5px}.type-desc{color:#d1d5db;font-size:1rem;margin-bottom:1rem;line-height:1.5}.type-example{display:flex;align-items:center;justify-content:center;gap:.75rem;font-family:Monaco,Menlo,monospace;font-size:1.8rem;padding:.75rem;background:#0000004d;border-radius:8px}.seq{padding:.5rem 1rem;background:#1e293b;border-radius:8px;font-weight:700;transition:all .3s ease;min-width:40px;display:inline-flex;align-items:center;justify-content:center;text-align:center}.seq:hover{transform:scale(1.1)}.match-highlight{background:linear-gradient(135deg,#10b9814d,#10b98133);color:#10b981;border:2px solid #10b981;box-shadow:0 2px 8px #10b98166}.mismatch-highlight{background:linear-gradient(135deg,#ef44444d,#ef444433);color:#ef4444;border:2px solid #ef4444;box-shadow:0 2px 8px #ef444466}.gap-highlight{background:linear-gradient(135deg,#9ca3af4d,#9ca3af33);color:#9ca3af;border:2px solid #9ca3af;box-shadow:0 2px 8px #9ca3af66}.sequence-display{background:#0f172a80;border-radius:12px;padding:2rem;margin:1.5rem 0;border:1px solid #334155}.sequence-row{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.sequence-row:last-child{margin-bottom:0}.sequence-label{color:#0ea5e9;font-weight:600;min-width:120px}.sequence-value{font-family:Monaco,Menlo,monospace;font-size:1.3rem;color:#e2e8f0;letter-spacing:.2em;background:#1e293b;padding:.75rem 1.5rem;border-radius:8px;border:2px solid #475569}.alignment-example{background:#3b82f614;border-radius:12px;padding:2rem;margin:1.5rem 0;border-left:4px solid #3b82f6}.alignment-header{color:#3b82f6;font-size:1.1rem;font-weight:600;margin-bottom:1rem}.aligned-sequences{font-family:Monaco,Menlo,monospace;font-size:1.4rem;line-height:2;background:#1e293b;padding:1.5rem;border-radius:8px;margin-bottom:1rem}.aligned-seq{color:#e2e8f0;letter-spacing:.3em}.alignment-marks{color:#10b981;letter-spacing:.3em;font-weight:700}.alignment-note{color:#9ca3af;font-style:italic;font-size:.95rem}.formula-box{background:#3b82f614;border-radius:8px;padding:1.5rem 2rem;border-left:3px solid #3b82f6;margin:1.5rem 0}.formula-box p{color:#e5e7eb;font-size:1.15rem;line-height:1.8;margin-bottom:.75rem}.formula-box p:last-child{margin-bottom:0}.formula-box strong{color:#0ea5e9;font-weight:600}.formula-box sub{font-size:.75em;vertical-align:sub}.formula-box em{font-style:italic;color:inherit}.formula-indent{margin-left:2rem;padding-left:1rem;border-left:2px solid #374151}.formula-line{color:#d1d5db;font-size:1.1rem;font-family:Monaco,Menlo,Courier New,monospace;background:#1e293b80;padding:.75rem 1rem;border-radius:6px;margin:.5rem 0}.formula-options{margin-left:2rem;display:flex;flex-direction:column;gap:.75rem}.formula-option{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;background:#1e293b80;border-radius:6px}.option-formula{color:#10b981;font-family:Monaco,Menlo,monospace;font-size:1.05rem;flex:1}.option-comment{color:#9ca3af;font-size:.9rem;font-style:italic}.recurrence-card{background:linear-gradient(135deg,#3b82f614,#8b5cf60d);border-radius:12px;padding:2rem;border:1px solid rgba(59,130,246,.2);margin:2rem 0;box-shadow:0 4px 6px #0000001a}.recurrence-card.main-recurrence{background:linear-gradient(135deg,#8b5cf61a,#3b82f614);border-color:#8b5cf640}.recurrence-header{color:#3b82f6;font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:2px solid rgba(59,130,246,.3)}.main-recurrence .recurrence-header{color:#8b5cf6;border-bottom-color:#8b5cf64d}.recurrence-formula{display:flex;flex-direction:column;gap:1rem}.formula-main{color:#60a5fa;font-size:1.3rem;font-weight:700;font-family:Monaco,Menlo,Courier New,monospace;margin-bottom:.5rem;display:block}.formula-cases{display:flex;flex-direction:column;gap:1rem;margin-left:2rem}.formula-case{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:1rem;padding:1rem 1.5rem;background:#0f172a99;border-radius:8px;border-left:3px solid #3b82f6;transition:all .3s ease}.formula-case:hover{background:#0f172acc;border-left-color:#60a5fa;transform:translate(4px)}.case-condition{color:#fbbf24;font-size:1rem;font-weight:600;font-family:Monaco,Menlo,Courier New,monospace;white-space:nowrap}.case-arrow{color:#10b981;font-size:1.2rem;font-weight:700}.case-result{color:#e5e7eb;font-size:1.1rem;font-family:Monaco,Menlo,Courier New,monospace}.case-result sub{font-size:.75em;vertical-align:sub}.case-result em{font-style:italic;color:#a5b4fc}.recurrence-explanation{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid rgba(59,130,246,.2)}.explanation-item{display:flex;gap:1rem;margin-bottom:1rem;align-items:flex-start}.explanation-item:last-child{margin-bottom:0}.explanation-label{color:#3b82f6;font-weight:700;font-size:.9rem;min-width:90px;padding-top:.1rem;flex-shrink:0}.explanation-text{color:#9ca3af;font-size:.95rem;line-height:1.6;flex:1}.explanation-text em{color:#a5b4fc;font-style:italic}.self-check-section{margin-bottom:1.5rem;padding:2rem 2rem 0!important;background:#1a1f2e;border-radius:12px;border:1px solid #2a3342}.self-check-section:last-child{margin-bottom:0}.self-check-section h2{color:#fff;font-size:1.8rem;margin-bottom:1.5rem;font-weight:600}.question-group{margin-bottom:2rem;padding-bottom:2rem;border-bottom:1px solid #374151}.question-group:last-child{border-bottom:none;margin-bottom:0}.question{color:#e5e7eb;line-height:1.7;margin-bottom:1.5rem;font-size:1.05rem}.answer-input{margin-bottom:1.5rem}.multiple-choice{display:flex;flex-direction:column;gap:.75rem}.choice-option{display:flex;align-items:center;gap:1rem;padding:1.25rem 1.5rem;border:2px solid #374151;border-radius:12px;background:#1a1f2e;cursor:pointer;transition:all .3s ease;position:relative}.choice-option:hover{border-color:#0ea5e9;background:#0ea5e914;transform:translateY(-1px);box-shadow:0 4px 8px #0ea5e926}.choice-option input[type=radio]{width:20px;height:20px;margin:0;accent-color:#0ea5e9;cursor:pointer}.choice-option input[type=radio]:checked{accent-color:#0ea5e9}.choice-option input[type=radio]:checked+.choice-text{color:#0ea5e9;font-weight:600}.choice-option:has(input[type=radio]:checked){border-color:#0ea5e9;background:#0ea5e91f;box-shadow:0 0 0 3px #0ea5e91a}.choice-option input[type=radio]:disabled{opacity:.5;cursor:not-allowed}.choice-option:has(input[type=radio]:disabled){opacity:.7;cursor:not-allowed}.choice-option:has(input[type=radio]:disabled):hover{transform:none;box-shadow:none;border-color:#374151;background:#1a1f2e}.choice-text{color:#e5e7eb;font-size:1.05rem;line-height:1.5;flex:1;font-weight:500}.answer-actions{margin-bottom:1rem;display:flex;justify-content:center}.submit-btn{padding:1rem 2rem;font-size:1.1rem;font-weight:600;border:none;border-radius:8px;background:#0ea5e9;color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px #0ea5e933}.submit-btn:hover:not(:disabled){background:#0284c7;transform:translateY(-1px);box-shadow:0 4px 8px #0ea5e94d}.submit-btn:disabled{background:#6b7280;cursor:not-allowed;transform:none;box-shadow:none}.answer-box{background:#10b9811a;border-radius:8px;padding:1.5rem;border-left:4px solid #10b981;margin-top:1.5rem;margin-bottom:1.5rem}.user-feedback{margin-bottom:1.25rem!important;padding:1rem 1rem .25rem!important;border-radius:8px;background:#10b9811a;border-left:4px solid #10b981}.user-choice{font-size:1.1rem;font-weight:600;margin-bottom:.25rem!important}.user-choice.correct{color:#10b981}.user-choice.incorrect{color:#ef4444}.answer{color:#e5e7eb;font-size:1.05rem;margin-bottom:1rem;font-weight:500}.answer-explanation{color:#d1d5db;line-height:1.6}.answer-explanation p{margin-bottom:.5rem}.answer-explanation ul{margin:1rem 0 1rem 2rem;color:#d1d5db}.answer-explanation li{margin-bottom:.5rem;line-height:1.6}.problem-setup{background:#1e293b80;border-radius:12px;padding:2rem;margin:2rem 0;border:1px solid #334155}.problem-setup h3{color:#0ea5e9;font-size:1.2rem;font-weight:600;margin-bottom:1.5rem}.setup-row{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.setup-row:last-child{margin-bottom:0}.setup-label{color:#0ea5e9;font-weight:600;min-width:140px}.setup-value{font-family:Monaco,Menlo,monospace;font-size:1.2rem;color:#e2e8f0;background:#1e293b;padding:.5rem 1rem;border-radius:6px;border:2px solid #475569}.problem-setup .matrix-table{display:table;border-collapse:separate;border-spacing:0;margin:1.5rem auto;width:auto}.matrix-row{display:table-row}.matrix-cell{display:table-cell;width:80px;height:80px;text-align:center;vertical-align:middle;border:1px solid #475569;font-family:Monaco,Menlo,Courier New,monospace;font-size:1.1rem;font-weight:600}.matrix-cell.header-cell{background:#1e293b;color:#60a5fa;font-weight:700;font-size:1.2rem}.matrix-cell.header-cell.corner{background:#1e293b;color:#0ea5e9;font-size:1rem;font-weight:700}.matrix-cell.match-cell{background:#10b98126;color:#10b981}.matrix-cell.mismatch-cell.positive{background:#fbbf2426;color:#fbbf24}.matrix-cell.mismatch-cell.negative{background:#ef444426;color:#ef4444}.matrix-legend{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #334155}.legend-item{display:flex;align-items:center;gap:.5rem}.legend-box{width:20px;height:20px;border-radius:4px;border:1px solid}.legend-box.match-box{background:#10b98126;border-color:#10b981}.legend-box.positive-box{background:#fbbf2426;border-color:#fbbf24}.legend-box.negative-box{background:#ef444426;border-color:#ef4444}.legend-text{color:#e5e7eb;font-size:.9rem;font-weight:500}.alignment-table-container{display:flex;justify-content:center;margin:2rem 0;overflow-x:auto}.alignment-table{border-collapse:separate;border-spacing:0;box-shadow:0 4px 12px #0000004d}.alignment-table th,.alignment-table td{min-width:60px;min-height:60px;padding:.75rem;text-align:center;vertical-align:middle;border:1px solid #475569;font-family:Monaco,Menlo,monospace;font-size:1.1rem}.alignment-table th{background:#1e293b;color:#0ea5e9;font-weight:600}.alignment-table td.base-case-cell{background:#0ea5e926;border-color:#0ea5e9;color:#0ea5e9;font-weight:700}.alignment-table td.filled-cell{background:#10b98126;border-color:#10b981;color:#10b981;font-weight:700}.alignment-table td.empty-cell{background:#2a3647;color:#6b7280}.alignment-table td.current-cell{background:#fbbf244d;border-color:#f59e0b;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 #fbbf2466}50%{box-shadow:0 0 0 8px #fbbf2400}}.walkthrough-container{margin:2rem 0 0}.walkthrough-explanation{background:#3b82f61a;border-radius:8px;padding:1.5rem;border-left:3px solid #3b82f6;margin:1.5rem 0}.walkthrough-explanation p{color:#e5e7eb;font-size:1.05rem;line-height:1.6;margin-bottom:.5rem}.walkthrough-explanation p:last-child{margin-bottom:0}.walkthrough-controls{display:flex;justify-content:center;align-items:center;gap:2rem;margin-top:1.5rem;margin-bottom:0}.step-indicator{color:#9ca3af;font-size:1rem;font-weight:500;min-width:120px;text-align:center}.final-alignment{background:#10b98114;border-radius:12px;padding:2rem;margin:1.5rem 0;border-left:4px solid #10b981}.alignment-header{color:#10b981;font-size:1.2rem;font-weight:600;margin-bottom:1rem}.aligned-sequences{font-family:Monaco,Menlo,monospace;font-size:1.4rem;color:#e2e8f0;line-height:2;margin:1.5rem 0}.aligned-seq{letter-spacing:.4rem}.alignment-marks{color:#10b981;letter-spacing:.4rem}.alignment-note{color:#9ca3af;font-size:.95rem;font-style:italic;margin-top:1rem}.completion-section{margin:1.5rem 0}.completion-message{background:linear-gradient(135deg,#10b98126,#0ea5e926);border-radius:16px;padding:3rem 2rem;text-align:center;border:2px solid rgba(16,185,129,.3);box-shadow:0 8px 24px #10b9811a}.completion-icon{font-size:4rem;margin-bottom:1rem;animation:bounce 1s ease infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.completion-message h2{color:#10b981;font-size:2rem;margin-bottom:1rem;font-weight:700}.completion-message p{color:#e2e8f0;font-size:1.1rem;line-height:1.6;margin-bottom:1rem}.completion-note{color:#9ca3af!important;font-style:italic;font-size:1rem!important;margin-bottom:2rem!important}.completion-actions{margin-top:2rem}.survey-button{padding:1rem 2.5rem;font-size:1.1rem;font-weight:600;border:none;border-radius:10px;background:linear-gradient(135deg,#10b981,#0ea5e9);color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #10b9814d;margin-bottom:1rem}.survey-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #10b98166}.survey-button:active{transform:translateY(0)}.survey-note{color:#fbbf24!important;font-size:.95rem!important;font-weight:500;margin-top:1rem!important;margin-bottom:0!important}.lesson-navigation{display:flex;justify-content:space-between;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #374151}.nav-button{padding:.75rem 1.5rem;border:2px solid #374151;border-radius:8px;background:transparent;color:#e5e7eb;cursor:pointer;font-weight:600;transition:all .3s ease}.nav-button:hover:not(:disabled){border-color:#0ea5e9;background:#0ea5e91a;color:#0ea5e9}.nav-button:disabled{opacity:.5;cursor:not-allowed}.nav-button.primary{background:#0ea5e9;border-color:#0ea5e9;color:#fff}.nav-button.primary:hover:not(:disabled){background:#0284c7;border-color:#0284c7}.nav-button.disabled{background:#374151;border-color:#374151;color:#9ca3af;cursor:not-allowed}.nav-button.complete-course-button{background:linear-gradient(135deg,#10b981,#059669);border-color:#10b981;color:#fff;font-size:1.1rem;padding:1rem 2rem;box-shadow:0 4px 12px #10b9814d;animation:pulse-glow 2s ease-in-out infinite}.nav-button.complete-course-button:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857);border-color:#059669;box-shadow:0 6px 16px #10b98180;transform:translateY(-2px)}.nav-button-fixed{padding:.75rem 1.5rem;border:2px solid #374151;border-radius:8px;background:transparent;color:#e5e7eb;cursor:pointer;font-weight:600;transition:all .3s ease}.nav-button-fixed:hover:not(:disabled){border-color:#0369a1;background:#0ea5e91a;color:#0369a1}.nav-button-fixed:disabled{opacity:.5;cursor:not-allowed}.nav-button-fixed.primary{background:#0369a1;border-color:#0369a1;color:#fff}.nav-button-fixed.primary:hover:not(:disabled){background:#0369a1;border-color:#0369a1}.nav-button-fixed.disabled{background:#374151;border-color:#374151;color:#9ca3af;cursor:not-allowed}@keyframes pulse-glow{0%,to{box-shadow:0 4px 12px #10b9814d}50%{box-shadow:0 4px 20px #10b98199}}@media(max-width:768px){.lesson-container{padding:1rem}.lesson-content{padding:1.5rem}.lesson-header h1{font-size:2rem}.content-section h2{font-size:1.5rem}.dna-bases{grid-template-columns:repeat(2,1fr);gap:1rem}.base-letter{font-size:2rem}.alignment-types{grid-template-columns:1fr;gap:1rem}.alignment-type{padding:1.5rem}.type-icon{width:70px;height:70px;font-size:2rem}.type-icon.gap{font-size:3rem}.type-name{font-size:1.2rem}.type-example{font-size:1.5rem;padding:.5rem}.sequence-row{flex-direction:column;align-items:flex-start;gap:.5rem}.sequence-label{min-width:auto}.sequence-value{font-size:1rem;letter-spacing:.1em}.aligned-sequences{font-size:1rem;padding:1rem}.formula-box{padding:1rem 1.25rem}.formula-indent{margin-left:1rem;padding-left:.75rem}.formula-options{margin-left:1rem}.recurrence-card{padding:1.5rem}.formula-main{font-size:1.1rem}.formula-cases{margin-left:0}.formula-case{grid-template-columns:1fr;gap:.5rem;padding:1rem}.case-condition{font-size:.9rem}.case-arrow{display:none}.case-result{font-size:1rem}.explanation-item{flex-direction:column;gap:.5rem}.explanation-label{min-width:auto}.explanation-text{font-size:.9rem}.matrix-cell{width:60px;height:60px;font-size:.9rem}.matrix-cell.header-cell{font-size:1rem}.matrix-cell.header-cell.corner{font-size:.85rem}.matrix-legend{flex-direction:column;gap:.75rem;align-items:center}}.modal-benefit strong{color:#fbbf24;font-weight:700}.modal-overlay{position:fixed;inset:0;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:#1a1f2e;border-radius:16px;padding:2.5rem;max-width:500px;width:90%;box-shadow:0 20px 60px #00000080;border:1px solid #2a3342;animation:slideUp .3s ease;text-align:center}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-content h2{color:#fff;margin-bottom:1rem;font-size:1.8rem}.modal-description{color:#d1d5db;line-height:1.7;margin-bottom:1rem;font-size:1.05rem}.modal-description strong{color:#0ea5e9}.modal-benefit{color:#fbbf24;line-height:1.6;margin-bottom:1.5rem;font-size:1rem;font-weight:500;background:#fbbf241a;padding:.75rem 1rem;border-radius:8px;border-left:3px solid #fbbf24}.modal-actions{display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem}.btn-primary{padding:1rem 2rem;font-size:1.1rem;font-weight:600;border:none;border-radius:8px;background:#0ea5e9;color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px #0ea5e933;text-decoration:none;display:inline-block}.btn-primary:hover{background:#0284c7;transform:translateY(-1px);box-shadow:0 4px 8px #0ea5e94d}.btn-success{padding:1rem 2rem;font-size:1rem;font-weight:600;border:2px solid #10b981;border-radius:8px;background:transparent;color:#10b981;cursor:pointer;transition:all .3s ease}.btn-success:hover{background:#10b981;color:#fff}.btn-skip{background:transparent;border:none;color:#9ca3af;cursor:pointer;font-size:.95rem;padding:.5rem;transition:color .3s ease;text-decoration:underline;margin-bottom:1rem}.btn-skip:hover{color:#d1d5db}.modal-note{color:#6b7280;font-size:.9rem;margin-top:.5rem;font-style:italic}.thank-you-message{padding:2rem 0}.thank-you-icon{width:80px;height:80px;margin:0 auto 1.5rem;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:3rem;color:#fff;animation:scaleIn .5s ease}@keyframes scaleIn{0%{transform:scale(0)}to{transform:scale(1)}}.thank-you-message h2{color:#10b981;margin-bottom:.5rem}.thank-you-message p{color:#d1d5db;font-size:1.05rem}@media(max-width:600px){.modal-content{padding:2rem 1.5rem}.modal-content h2{font-size:1.5rem}.modal-description{font-size:1rem}.modal-actions{gap:.75rem}.btn-primary,.btn-success{padding:.875rem 1.5rem;font-size:1rem}}
