:root[data-theme=light]{--bg-primary:#fafafa;--bg-secondary:#fff;--bg-tertiary:#f5f5f5;--bg-quaternary:#e8e8e8;--text-primary:#1a1a1a;--text-secondary:#666;--text-tertiary:#888;--accent-primary:#2563eb;--accent-secondary:#0ea5e9;--accent-danger:#ef4444;--accent-warning:#f59e0b;--accent-success:#10b981;--border-primary:#e5e5e5;--border-secondary:#d4d4d4;--shadow:0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;--shadow-lg:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;--shadow-xl:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;--gradient-primary:linear-gradient(135deg,#667eea,#764ba2);--gradient-secondary:linear-gradient(135deg,#f093fb,#f5576c);--gradient-success:linear-gradient(135deg,#4facfe,#00f2fe);--gradient-bg-subtle:linear-gradient(135deg,#fafafa,#f0f0f0)}:root,:root[data-theme=dark]{--bg-primary:#0f172a;--bg-secondary:#1e293b;--bg-tertiary:#334155;--bg-quaternary:#475569;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-tertiary:#94a3b8;--accent-primary:#3b82f6;--accent-secondary:#06b6d4;--accent-danger:#ef4444;--accent-warning:#f59e0b;--accent-success:#10b981;--border-primary:#334155;--border-secondary:#475569;--shadow:0 1px 3px 0 #0006,0 1px 2px 0 #0000004d;--shadow-lg:0 10px 15px -3px #00000080,0 4px 6px -2px #0006;--shadow-xl:0 20px 25px -5px #0009,0 10px 10px -5px #00000080;--gradient-primary:linear-gradient(135deg,#667eea,#764ba2);--gradient-secondary:linear-gradient(135deg,#f093fb,#f5576c);--gradient-success:linear-gradient(135deg,#4facfe,#00f2fe);--gradient-bg-subtle:linear-gradient(135deg,#0f172a,#1e293b)}:root{--border-radius:12px;--border-radius-lg:16px;--border-radius-sm:8px}*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0f172a;background-color:var(--bg-primary);color:#f8fafc;color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.6;margin:0}#root{min-height:100vh}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root[data-theme=light] .w-tc-editor textarea{background-color:#fff!important;color:#1a1a1a!important}:root[data-theme=light] .w-tc-editor-text{color:#1a1a1a!important}:root[data-theme=light] .w-tc-editor{background-color:#fff!important;border:1px solid #334155!important;border:1px solid var(--border-primary)!important;border-radius:12px!important;border-radius:var(--border-radius)!important}:root .w-tc-editor textarea,:root[data-theme=dark] .w-tc-editor textarea{background-color:#1e293b!important;color:#f8fafc!important}:root .w-tc-editor-text,:root[data-theme=dark] .w-tc-editor-text{color:#f8fafc!important}:root .w-tc-editor,:root[data-theme=dark] .w-tc-editor{background-color:#1e293b!important;border:1px solid #334155!important;border:1px solid var(--border-primary)!important;border-radius:12px!important;border-radius:var(--border-radius)!important}:root[data-theme=light] .token.cdata,:root[data-theme=light] .token.comment,:root[data-theme=light] .token.doctype,:root[data-theme=light] .token.prolog{color:#6a737d}:root[data-theme=light] .token.punctuation{color:#586069}:root[data-theme=light] .token.selector,:root[data-theme=light] .token.tag{color:#d73a49}:root[data-theme=light] .token.attr-name,:root[data-theme=light] .token.boolean,:root[data-theme=light] .token.constant,:root[data-theme=light] .token.number,:root[data-theme=light] .token.property,:root[data-theme=light] .token.symbol{color:#005cc5}:root[data-theme=light] .token.attr-value,:root[data-theme=light] .token.char,:root[data-theme=light] .token.regex,:root[data-theme=light] .token.string,:root[data-theme=light] .token.variable{color:#22863a}:root[data-theme=light] .token.entity,:root[data-theme=light] .token.operator,:root[data-theme=light] .token.url{color:#005cc5}:root[data-theme=light] .token.control,:root[data-theme=light] .token.directive,:root[data-theme=light] .token.keyword,:root[data-theme=light] .token.unit{color:#d73a49}:root[data-theme=light] .token.function{color:#6f42c1}:root .token.cdata,:root .token.comment,:root .token.doctype,:root .token.prolog,:root[data-theme=dark] .token.cdata,:root[data-theme=dark] .token.comment,:root[data-theme=dark] .token.doctype,:root[data-theme=dark] .token.prolog{color:#7c7c7c}:root .token.punctuation,:root[data-theme=dark] .token.punctuation{color:#ccc}:root .token.selector,:root .token.tag,:root[data-theme=dark] .token.selector,:root[data-theme=dark] .token.tag{color:#92c5f7}:root .token.attr-name,:root .token.boolean,:root .token.constant,:root .token.number,:root .token.property,:root .token.symbol,:root[data-theme=dark] .token.attr-name,:root[data-theme=dark] .token.boolean,:root[data-theme=dark] .token.constant,:root[data-theme=dark] .token.number,:root[data-theme=dark] .token.property,:root[data-theme=dark] .token.symbol{color:#9cdcfe}:root .token.attr-value,:root .token.char,:root .token.regex,:root .token.string,:root .token.variable,:root[data-theme=dark] .token.attr-value,:root[data-theme=dark] .token.char,:root[data-theme=dark] .token.regex,:root[data-theme=dark] .token.string,:root[data-theme=dark] .token.variable{color:#ce9178}:root .token.entity,:root .token.operator,:root .token.url,:root[data-theme=dark] .token.entity,:root[data-theme=dark] .token.operator,:root[data-theme=dark] .token.url{color:#d4d4d4}:root .token.control,:root .token.directive,:root .token.keyword,:root .token.unit,:root[data-theme=dark] .token.control,:root[data-theme=dark] .token.directive,:root[data-theme=dark] .token.keyword,:root[data-theme=dark] .token.unit{color:#c586c0}:root .token.function,:root[data-theme=dark] .token.function{color:#dcdcaa}@media (max-width:768px){:root{--border-radius:6px;--border-radius-lg:8px}body{font-size:14px}.app-header{padding:15px 0!important}.app-header h1{font-size:1.5rem!important}.app-header .tagline{display:none!important}.lessons-grid{gap:15px!important;grid-template-columns:1fr!important}.lesson-card{padding:20px!important}.lesson-card-content{flex-direction:column!important;gap:15px!important}.lesson-icon{font-size:20px!important;height:40px!important;width:40px!important}.lesson-title{font-size:1.1rem!important}.lesson-meta{align-items:flex-start!important;flex-direction:column!important;gap:8px!important}.lesson-container{padding:20px 15px!important}.lesson-header h1{font-size:1.8rem!important}.lesson-tabs{overflow-x:auto;white-space:nowrap}.lesson-content{flex-direction:column!important;gap:15px!important}.lesson-sidebar{max-height:none!important;order:2;width:100%!important}.code-editor-container{order:1}}@media (max-width:480px){.app-header .container{flex-direction:column!important;gap:10px!important;text-align:center!important}.lesson-card{padding:15px!important}.lesson-difficulty-badge{font-size:10px!important;padding:1px 6px!important}.lesson-status-badge{font-size:10px!important;padding:4px 8px!important}}html{scroll-behavior:smooth}button:focus,input:focus,select:focus,textarea:focus{outline:2px solid #06b6d4;outline:2px solid var(--accent-secondary);outline-offset:2px}a{transition:color .2s ease}button{cursor:pointer;transition:all .2s ease}button:hover:not(:disabled){transform:translateY(-1px)}button:active:not(:disabled){transform:translateY(0)}.loading{opacity:.7;pointer-events:none}.text-center{text-align:center}.flex{display:flex}.flex-col{flex-direction:column}.gap-2{gap:8px}.gap-4{gap:16px}.mt-4{margin-top:16px}.mb-4{margin-bottom:16px}.p-4{padding:16px}.rounded{border-radius:12px;border-radius:var(--border-radius)}.shadow{box-shadow:0 1px 3px 0 #0006,0 1px 2px 0 #0000004d;box-shadow:var(--shadow)}.home-container{background:#0000;color:var(--text-primary);margin:0 auto;max-width:1200px;min-height:calc(100vh - 80px);padding:40px 20px}.home-hero{margin-bottom:60px;text-align:center}.home-hero__title{color:var(--text-primary);font-size:2.5rem;font-weight:700;letter-spacing:-.02em;margin:0 0 16px}.home-hero__subtitle{color:var(--text-secondary);font-size:1.125rem;line-height:1.6;margin:0 auto;max-width:600px}.home-hero__progress{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--border-radius);display:inline-block;margin-top:24px;padding:8px 16px}.progress-stat{color:var(--accent-success);font-weight:500}.home-error{background:#ef44441a;border:1px solid var(--accent-danger);border-radius:var(--border-radius);color:var(--accent-danger);margin-bottom:24px;padding:12px 16px;text-align:center}.home-lessons__title{color:var(--text-primary);font-size:1.875rem;font-weight:600;margin-bottom:40px;text-align:center}.lessons-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(400px,1fr))}.lesson-card{background:linear-gradient(135deg,var(--bg-secondary) 0,var(--bg-tertiary) 100%);border:1px solid var(--border-primary);border-radius:var(--border-radius-lg);box-shadow:var(--shadow);overflow:hidden;padding:32px;position:relative;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.lesson-card:hover{border-color:var(--accent-primary);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.lesson-card:focus-within{outline:2px solid var(--accent-primary);outline-offset:2px}.lesson-card__content{align-items:flex-start;display:flex;gap:24px}.lesson-card__icon{align-items:center;background-color:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--border-radius);color:var(--accent-primary);display:flex;flex-shrink:0;font-size:1.5rem;font-weight:600;height:48px;justify-content:center;width:48px}.lesson-card__details{flex:1 1;min-width:0}.lesson-card__header{align-items:flex-start;display:flex;gap:12px;justify-content:space-between;margin-bottom:12px}.lesson-card__title{font-size:1.25rem;font-weight:600;margin:0}.lesson-card__link{color:var(--text-primary);text-decoration:none;transition:color .2s ease}.lesson-card__link:hover{color:var(--accent-primary)}.lesson-card__difficulty{margin-bottom:16px}.lesson-card__description{color:var(--text-secondary);font-size:.9rem;line-height:1.6;margin:0 0 20px}.lesson-card__footer{align-items:center;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between}.lesson-card__time{color:var(--text-tertiary);font-size:.875rem}.lesson-card__button{background-color:var(--accent-primary);border-radius:var(--border-radius);color:#fff;font-size:.875rem;font-weight:500;padding:8px 16px;text-decoration:none;transition:background-color .2s ease,transform .2s ease}.lesson-card__button:hover{background-color:var(--accent-secondary);transform:translateY(-1px)}.lesson-card__button:focus{outline:2px solid var(--accent-secondary);outline-offset:2px}.status-badge{border-radius:6px;font-size:12px;font-weight:500;padding:4px 8px;white-space:nowrap}.status-badge--completed{background-color:var(--accent-success);color:#fff}.status-badge--in-progress{background-color:var(--accent-warning);color:#fff}.status-badge--not-started{background-color:var(--bg-tertiary);border:1px solid var(--border-primary);color:var(--text-secondary)}.difficulty-badge{border-radius:6px;display:inline-block;font-size:12px;padding:4px 8px;text-transform:capitalize}.difficulty-badge--beginner{background:#10b9811a;border:1px solid var(--accent-success);color:var(--accent-success)}.difficulty-badge--intermediate{background:#f59e0b1a;border:1px solid var(--accent-warning);color:var(--accent-warning)}.difficulty-badge--advanced{background:#ef44441a;border:1px solid var(--accent-danger);color:var(--accent-danger)}@media (max-width:768px){.home-container{padding:30px 15px}.home-hero{margin-bottom:40px}.home-hero__title{font-size:2rem}.home-hero__subtitle{font-size:1rem}.home-lessons__title{font-size:1.5rem;margin-bottom:24px}.lessons-grid{gap:16px;grid-template-columns:1fr}.lesson-card{padding:20px}.lesson-card__content{flex-direction:column;gap:16px}.lesson-card__icon{font-size:1.25rem;height:40px;width:40px}.lesson-card__header{flex-direction:column;gap:8px}.lesson-card__title{font-size:1.1rem}.lesson-card__footer{align-items:stretch;flex-direction:column;gap:12px}.lesson-card__button{padding:12px 16px;text-align:center}}@media (max-width:480px){.home-container{padding:20px 12px}.home-hero__title{font-size:1.75rem}.lesson-card{padding:16px}.lesson-card__description{font-size:.85rem}}@media (prefers-reduced-motion:reduce){.lesson-card,.lesson-card__button,.lesson-card__link{transition:none}.lesson-card:hover{transform:none}}@media (prefers-color-scheme:dark){.w-tc-editor{--color-fg-default:#c9d1d9;--color-canvas-subtle:#161b22;--color-prettylights-syntax-comment:#8b949e;--color-prettylights-syntax-entity-tag:#7ee787;--color-prettylights-syntax-entity:#d2a8ff;--color-prettylights-syntax-sublimelinter-gutter-mark:#484f58;--color-prettylights-syntax-constant:#79c0ff;--color-prettylights-syntax-string:#a5d6ff;--color-prettylights-syntax-keyword:#ff7b72;--color-prettylights-syntax-markup-bold:#c9d1d9}}@media (prefers-color-scheme:light){.w-tc-editor{--color-fg-default:#24292f;--color-canvas-subtle:#f6f8fa;--color-prettylights-syntax-comment:#6e7781;--color-prettylights-syntax-entity-tag:#116329;--color-prettylights-syntax-entity:#8250df;--color-prettylights-syntax-sublimelinter-gutter-mark:#8c959f;--color-prettylights-syntax-constant:#0550ae;--color-prettylights-syntax-string:#0a3069;--color-prettylights-syntax-keyword:#cf222e;--color-prettylights-syntax-markup-bold:#24292f}}.w-tc-editor[data-color-mode*=dark],[data-color-mode*=dark] .w-tc-editor,[data-color-mode*=dark] .w-tc-editor-var,body[data-color-mode*=dark]{--color-fg-default:#c9d1d9;--color-canvas-subtle:#161b22;--color-prettylights-syntax-comment:#8b949e;--color-prettylights-syntax-entity-tag:#7ee787;--color-prettylights-syntax-entity:#d2a8ff;--color-prettylights-syntax-sublimelinter-gutter-mark:#484f58;--color-prettylights-syntax-constant:#79c0ff;--color-prettylights-syntax-string:#a5d6ff;--color-prettylights-syntax-keyword:#ff7b72;--color-prettylights-syntax-markup-bold:#c9d1d9}.w-tc-editor[data-color-mode*=light],[data-color-mode*=light] .w-tc-editor,[data-color-mode*=light] .w-tc-editor-var,body[data-color-mode*=light]{--color-fg-default:#24292f;--color-canvas-subtle:#f6f8fa;--color-prettylights-syntax-comment:#6e7781;--color-prettylights-syntax-entity-tag:#116329;--color-prettylights-syntax-entity:#8250df;--color-prettylights-syntax-sublimelinter-gutter-mark:#8c959f;--color-prettylights-syntax-constant:#0550ae;--color-prettylights-syntax-string:#0a3069;--color-prettylights-syntax-keyword:#cf222e;--color-prettylights-syntax-markup-bold:#24292f}.w-tc-editor{background-color:var(--color-canvas-subtle);color:var(--color-fg-default);font-family:inherit;font-size:12px}.w-tc-editor-preview,.w-tc-editor-text{min-height:16px}.w-tc-editor-preview pre{font-family:inherit;font-size:inherit;margin:0;padding:0;white-space:inherit}.w-tc-editor-preview pre code{font-family:inherit}.w-tc-editor code[class*=language-] .token.cdata,.w-tc-editor code[class*=language-] .token.comment,.w-tc-editor code[class*=language-] .token.doctype,.w-tc-editor code[class*=language-] .token.prolog,.w-tc-editor pre[class*=language-] .token.cdata,.w-tc-editor pre[class*=language-] .token.comment,.w-tc-editor pre[class*=language-] .token.doctype,.w-tc-editor pre[class*=language-] .token.prolog{color:var(--color-prettylights-syntax-comment)}.w-tc-editor code[class*=language-] .token.punctuation,.w-tc-editor pre[class*=language-] .token.punctuation{color:var(--color-prettylights-syntax-sublimelinter-gutter-mark)}.w-tc-editor code[class*=language-] .namespace,.w-tc-editor pre[class*=language-] .namespace{opacity:.7}.w-tc-editor code[class*=language-] .token.boolean,.w-tc-editor code[class*=language-] .token.constant,.w-tc-editor code[class*=language-] .token.deleted,.w-tc-editor code[class*=language-] .token.number,.w-tc-editor code[class*=language-] .token.symbol,.w-tc-editor pre[class*=language-] .token.boolean,.w-tc-editor pre[class*=language-] .token.constant,.w-tc-editor pre[class*=language-] .token.deleted,.w-tc-editor pre[class*=language-] .token.number,.w-tc-editor pre[class*=language-] .token.symbol{color:var(--color-prettylights-syntax-entity-tag)}.w-tc-editor code[class*=language-] .style .token.string,.w-tc-editor code[class*=language-] .token.builtin,.w-tc-editor code[class*=language-] .token.char,.w-tc-editor code[class*=language-] .token.entity,.w-tc-editor code[class*=language-] .token.inserted,.w-tc-editor code[class*=language-] .token.operator,.w-tc-editor code[class*=language-] .token.property,.w-tc-editor code[class*=language-] .token.selector,.w-tc-editor code[class*=language-] .token.string,.w-tc-editor code[class*=language-] .token.url,.w-tc-editor pre[class*=language-] .style .token.string,.w-tc-editor pre[class*=language-] .token.builtin,.w-tc-editor pre[class*=language-] .token.char,.w-tc-editor pre[class*=language-] .token.entity,.w-tc-editor pre[class*=language-] .token.inserted,.w-tc-editor pre[class*=language-] .token.operator,.w-tc-editor pre[class*=language-] .token.property,.w-tc-editor pre[class*=language-] .token.selector,.w-tc-editor pre[class*=language-] .token.string,.w-tc-editor pre[class*=language-] .token.url{color:var(--color-prettylights-syntax-constant)}.w-tc-editor code[class*=language-] .token.atrule,.w-tc-editor code[class*=language-] .token.keyword,.w-tc-editor code[class*=language-] .token.property-access .token.method,.w-tc-editor pre[class*=language-] .token.atrule,.w-tc-editor pre[class*=language-] .token.keyword,.w-tc-editor pre[class*=language-] .token.property-access .token.method{color:var(--color-prettylights-syntax-keyword)}.w-tc-editor code[class*=language-] .token.function,.w-tc-editor pre[class*=language-] .token.function{color:var(--color-prettylights-syntax-string)}.w-tc-editor code[class*=language-] .token.important,.w-tc-editor code[class*=language-] .token.regex,.w-tc-editor code[class*=language-] .token.variable,.w-tc-editor pre[class*=language-] .token.important,.w-tc-editor pre[class*=language-] .token.regex,.w-tc-editor pre[class*=language-] .token.variable{color:var(--color-prettylights-syntax-string-regexp)}.w-tc-editor code[class*=language-] .token.bold,.w-tc-editor code[class*=language-] .token.important,.w-tc-editor pre[class*=language-] .token.bold,.w-tc-editor pre[class*=language-] .token.important{color:var(--color-prettylights-syntax-markup-bold)}.w-tc-editor code[class*=language-] .token.tag,.w-tc-editor pre[class*=language-] .token.tag{color:var(--color-prettylights-syntax-entity-tag)}.w-tc-editor code[class*=language-] .token.attr-name,.w-tc-editor code[class*=language-] .token.attr-value,.w-tc-editor pre[class*=language-] .token.attr-name,.w-tc-editor pre[class*=language-] .token.attr-value{color:var(--color-prettylights-syntax-constant)}.w-tc-editor code[class*=language-] .token.class-name,.w-tc-editor code[class*=language-] .token.selector .class,.w-tc-editor pre[class*=language-] .token.class-name,.w-tc-editor pre[class*=language-] .token.selector .class{color:var(--color-prettylights-syntax-entity)}code[class*=language-],pre[class*=language-]{word-wrap:normal;background:none;color:#f8f8f2;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;-webkit-hyphens:none;hyphens:none;line-height:1.5;tab-size:4;text-align:left;text-shadow:0 1px #0000004d;white-space:pre;word-break:normal;word-spacing:normal}pre[class*=language-]{border-radius:.3em;margin:.5em 0;overflow:auto;padding:1em}:not(pre)>code[class*=language-],pre[class*=language-]{background:#272822}:not(pre)>code[class*=language-]{border-radius:.3em;padding:.1em;white-space:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#8292a2}.token.punctuation{color:#f8f8f2}.token.namespace{opacity:.7}.token.constant,.token.deleted,.token.property,.token.symbol,.token.tag{color:#f92672}.token.boolean,.token.number{color:#ae81ff}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#a6e22e}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url,.token.variable{color:#f8f8f2}.token.atrule,.token.attr-value,.token.class-name,.token.function{color:#e6db74}.token.keyword{color:#66d9ef}.token.important,.token.regex{color:#fd971f}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.code-tester{margin-top:20px}.code-tester__actions{align-items:center;display:flex;flex-wrap:wrap;gap:12px;margin-bottom:15px}.code-tester__button{background-color:var(--accent-primary);border:none;border-radius:var(--border-radius);box-shadow:var(--shadow);color:#fff;cursor:pointer;font-size:14px;font-weight:500;padding:10px 20px;transition:background-color .2s ease,opacity .2s ease,transform .2s ease}.code-tester__button:hover:not(:disabled){background-color:var(--accent-secondary);transform:translateY(-1px)}.code-tester__button:focus{outline:2px solid var(--accent-secondary);outline-offset:2px}.code-tester__button--disabled,.code-tester__button:disabled{cursor:not-allowed;opacity:.6;transform:none}.code-tester__summary{border-radius:var(--border-radius-sm);font-size:14px;font-weight:500;padding:6px 12px}.code-tester__summary--passed{background:#10b9811a;border:1px solid var(--accent-success);color:var(--accent-success)}.code-tester__summary--failed{background:#ef44441a;border:1px solid var(--accent-danger);color:var(--accent-danger)}.code-tester__results{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--border-radius);box-shadow:var(--shadow);padding:15px}.code-tester__results-title{color:var(--text-primary);font-size:14px;font-weight:600;margin:0 0 12px}.test-result{border-left:4px solid;border-radius:var(--border-radius-sm);margin:8px 0;padding:10px 12px;transition:background-color .2s ease}.test-result--passed{background-color:#10b9811a;border-left-color:var(--accent-success)}.test-result--failed{background-color:#ef44441a;border-left-color:var(--accent-danger)}.test-result__header{align-items:center;display:flex;gap:8px}.test-result__icon{flex-shrink:0;font-size:14px;font-weight:700}.test-result--passed .test-result__icon{color:var(--accent-success)}.test-result--failed .test-result__icon{color:var(--accent-danger)}.test-result__description{color:var(--text-primary);font-size:14px}.test-result__error{background-color:#ef44441a;border-radius:var(--border-radius-sm);color:var(--accent-danger);font-family:Fira Code,Fira Mono,monospace;font-size:12px;margin-top:8px;padding:8px 10px;word-break:break-word}.test-result__error-label{font-weight:600}@media (max-width:768px){.code-tester__actions{align-items:stretch;flex-direction:column}.code-tester__button{text-align:center;width:100%}.code-tester__summary{text-align:center}.code-tester__results{padding:12px}.test-result{padding:8px 10px}.test-result__description{font-size:13px}}@media (prefers-reduced-motion:reduce){.code-tester__button,.test-result{transition:none}.code-tester__button:hover:not(:disabled){transform:none}}.lesson-not-found{align-items:center;background:var(--bg-primary);display:flex;flex-direction:column;gap:1rem;justify-content:center;min-height:50vh;padding:2rem;text-align:center}.lesson-container{background:#0000;color:var(--text-primary);margin:0 auto;max-width:1200px;min-height:100vh;padding:1.5rem;transition:background-color .5s ease}.lesson-container.error-pulse{animation:errorPulse 3s ease-in-out}@keyframes errorPulse{0%,to{background:var(--gradient-bg-subtle)}25%,75%{background:linear-gradient(135deg,#ef44441a,var(--bg-primary))}50%{background:linear-gradient(135deg,#ef444433,var(--bg-secondary))}}.lesson-header{border-bottom:1px solid var(--border-primary);margin-bottom:2rem;padding-bottom:1.5rem}.back-link{color:var(--accent-primary);font-weight:500;text-decoration:none;transition:color .2s ease}.back-link:hover{color:var(--accent-secondary);text-decoration:underline}.lesson-title{color:var(--text-primary);font-size:2rem;font-weight:700;margin:1rem 0 .5rem}.lesson-description{color:var(--text-secondary);font-size:1.1rem;line-height:1.5;margin:0}.lesson-meta{display:flex;flex-wrap:wrap;gap:1.5rem;margin-top:1rem}.meta-item{background:var(--bg-secondary);border:1px solid var(--border-secondary);border-radius:var(--border-radius);color:var(--text-tertiary);font-size:.9rem;padding:.25rem .75rem}.tab-navigation{margin-bottom:2rem}.tab-container{border-bottom:1px solid var(--border-primary);display:flex;gap:.5rem;overflow-x:auto;padding-bottom:0}.tab-button{background:#0000;border:none;border-bottom:2px solid #0000;color:var(--text-secondary);cursor:pointer;font-weight:500;padding:.75rem 1.5rem;position:relative;transition:all .2s ease;white-space:nowrap}.tab-button:hover{background:var(--bg-secondary);color:var(--text-primary)}.tab-button.active{background:var(--accent-primary);border-bottom-color:var(--accent-primary);border-radius:var(--border-radius) var(--border-radius) 0 0;color:var(--bg-primary)}.lesson-content{min-height:500px}.theory-content{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--border-radius-lg);box-shadow:var(--shadow);padding:2rem}.content-text{color:var(--text-primary);font-size:1rem;line-height:1.6;white-space:pre-wrap}.example-content{display:flex;gap:1.5rem;width:100%}.example-panel{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--border-radius-lg);box-shadow:var(--shadow);flex:1 1;padding:2rem}.panel-title{color:var(--text-primary);font-size:1.25rem;font-weight:600;margin-bottom:1rem}.code-example{background:var(--bg-quaternary);border:1px solid var(--border-secondary);border-radius:var(--border-radius);color:var(--text-primary);font-family:Fira code,Fira Mono,monospace;font-size:.9rem;line-height:1.4;overflow:auto;padding:1.5rem}.exercise-content{display:flex;gap:1.5rem;position:relative;width:100%}.mobile-sidebar-toggle{background:var(--accent-primary);border:none;border-radius:var(--border-radius);box-shadow:var(--shadow);color:#fff;cursor:pointer;display:none;font-size:.875rem;font-weight:500;margin-bottom:1rem;padding:1rem;transition:all .2s ease;width:100%}.mobile-sidebar-toggle:hover{background:var(--accent-secondary);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.instructions-panel{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--border-radius-lg);box-shadow:var(--shadow);flex-shrink:0;max-height:80vh;overflow-y:auto;padding:1.5rem;width:320px}.panel-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem}.mobile-close-btn{background:none;border:none;border-radius:var(--border-radius);color:var(--text-secondary);cursor:pointer;display:none;font-size:1.25rem;padding:.25rem;transition:all .2s ease}.mobile-close-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.instruction-text{color:var(--text-primary);line-height:1.6;margin-bottom:1.5rem}.action-buttons{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1.5rem}.btn{border:none;border-radius:var(--border-radius);box-shadow:var(--shadow);cursor:pointer;font-size:.875rem;font-weight:500;padding:.75rem 1.25rem;transition:all .2s ease}.btn-secondary{background:var(--bg-secondary);border:1px solid var(--border-primary);color:var(--text-primary)}.btn-secondary:hover{background:var(--bg-tertiary);border-color:var(--accent-primary);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-success{background:var(--accent-success);color:#fff}.btn-success:hover{background:var(--accent-primary);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.progress-panel{margin-top:1.5rem}.progress-title{color:var(--text-primary);font-size:1rem;font-weight:600;margin-bottom:.75rem}.progress-indicator{border:1px solid;border-radius:var(--border-radius);font-weight:500;padding:1rem}.progress-indicator.success{background:#22c55e1a;border-color:var(--accent-primary);color:var(--accent-primary)}.progress-indicator.warning{background:#fbbf241a;border-color:var(--accent-warning);color:var(--accent-warning)}.editor-panel{flex:1 1;min-width:0}.editor-header{margin-bottom:1rem}.mobile-overlay{background:#00000080;bottom:0;display:none;left:0;position:fixed;right:0;top:0;z-index:998}@media (max-width:768px){.lesson-container{padding:1rem}.lesson-title{font-size:1.5rem}.lesson-description{font-size:1rem}.lesson-meta{gap:1rem}.meta-item{font-size:.8rem}.tab-container{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none}.tab-container::-webkit-scrollbar{display:none}.tab-button{font-size:.9rem;padding:.75rem 1rem}.exercise-content{flex-direction:column;gap:0}.mobile-sidebar-toggle{display:block}.instructions-panel{border-radius:0;bottom:0;display:none;left:0;max-height:none;overflow-y:auto;padding:1.5rem;position:fixed;right:0;top:0;width:auto;z-index:999}.instructions-panel.mobile-visible,.mobile-close-btn,.mobile-overlay{display:block}.action-buttons{justify-content:center}.btn{flex:1 1;min-width:100px}.example-panel,.theory-content{padding:1.5rem}.code-example{font-size:.8rem;padding:1rem}}@media (max-width:480px){.lesson-container{padding:.75rem}.lesson-header{margin-bottom:1.5rem;padding-bottom:1rem}.lesson-title{font-size:1.25rem}.lesson-meta{flex-direction:column;gap:.5rem}.tab-button{font-size:.85rem;padding:.5rem .75rem}.example-panel,.theory-content{padding:1rem}.code-example{font-size:.75rem;padding:.75rem}.instructions-panel{padding:1rem}.action-buttons{flex-direction:column}.btn{width:100%}}@media (prefers-reduced-motion:reduce){.back-link,.btn,.mobile-close-btn,.tab-button{transition:none}}.back-link:focus,.btn:focus,.mobile-close-btn:focus,.mobile-sidebar-toggle:focus,.tab-button:focus{outline:2px solid var(--accent-primary);outline-offset:2px}.exercise-selector{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--border-radius);margin-bottom:2rem;padding:1.5rem}.exercise-selector h3{color:var(--text-primary);margin:0 0 1rem}.exercise-tabs{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.exercise-tab{align-items:center;background:var(--bg-tertiary);border:2px solid var(--border-primary);border-radius:var(--border-radius);color:var(--text-primary);cursor:pointer;display:flex;flex-direction:column;gap:.5rem;padding:1rem;transition:all .3s ease}.exercise-tab:hover{background:var(--bg-quaternary);border-color:var(--accent-primary)}.exercise-tab.active{background:var(--accent-primary);border-color:var(--accent-primary);color:#fff}.exercise-title{font-size:1rem;font-weight:600;text-align:center}.exercise-difficulty{border-radius:12px;font-size:.8rem;font-weight:500;padding:.25rem .5rem;text-transform:uppercase}.exercise-tab.difficulty-beginner .exercise-difficulty{background:#22c55e33;color:#16a34a}.exercise-tab.difficulty-intermediate .exercise-difficulty{background:#fbbf2433;color:#d97706}.exercise-tab.difficulty-expert .exercise-difficulty{background:#ef444433;color:#dc2626}.exercise-tab.active .exercise-difficulty{background:#fff3;color:#fff}.difficulty-badge{border-radius:12px;font-size:.7rem;font-weight:500;margin-left:.5rem;padding:.25rem .5rem;text-transform:uppercase}.difficulty-badge.beginner{background:#22c55e33;color:#16a34a}.difficulty-badge.intermediate{background:#fbbf2433;color:#d97706}.difficulty-badge.expert{background:#ef444433;color:#dc2626}.quiz-content{margin:0 auto;max-width:800px;padding:2rem}.quiz-content h3{color:var(--text-primary);font-size:1.5rem;margin:0 0 .5rem}.quiz-content>p{color:var(--text-secondary);margin:0 0 2rem}.question-card{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--border-radius);margin-bottom:2rem;padding:1.5rem}.question-header h4{color:var(--accent-primary);font-size:1.1rem;margin:0 0 1rem}.question-text{color:var(--text-primary);font-size:1rem;line-height:1.5;margin:0 0 1.5rem}.options-container{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem}.option-button{align-items:center;background:var(--bg-tertiary);border:2px solid var(--border-primary);border-radius:var(--border-radius);color:var(--text-primary);cursor:pointer;display:flex;gap:.75rem;padding:1rem;text-align:left;transition:all .3s ease;width:100%}.option-button:hover:not(:disabled){background:var(--bg-quaternary);border-color:var(--accent-primary)}.option-button:disabled{cursor:not-allowed;opacity:.7}.option-button.selected{background:var(--bg-quaternary);border-color:var(--accent-primary)}.option-button.correct{background:#22c55e1a;border-color:#16a34a;color:#16a34a}.option-button.incorrect{background:#ef44441a;border-color:#dc2626;color:#dc2626}.option-letter{font-weight:600;min-width:1.5rem}.option-text{flex:1 1}.result-icon{font-size:1.2rem;font-weight:700}.explanation{border-radius:var(--border-radius);margin-top:1rem;padding:1rem}.explanation.correct{background:#22c55e1a;border:1px solid #16a34a}.explanation.incorrect{background:#ef44441a;border:1px solid #dc2626}.explanation h5{color:inherit;margin:0 0 .5rem}.explanation p{color:var(--text-primary);line-height:1.5;margin:0}.quiz-summary{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--border-radius);margin-top:2rem;padding:1.5rem;text-align:center}.quiz-summary h4{color:var(--accent-primary);margin:0 0 .5rem}.quiz-summary p{color:var(--text-secondary);margin:0}@media (max-width:768px){.exercise-tabs{grid-template-columns:1fr}.exercise-tab{padding:.75rem}.question-card,.quiz-content{padding:1rem}.option-button{padding:.75rem}}.app-container{background:var(--gradient-bg-subtle);color:var(--text-primary);display:flex;flex-direction:column;min-height:100vh}.app-main{flex:1 1}.app-header{background:var(--gradient-primary);border-bottom:1px solid var(--border-primary);box-shadow:var(--shadow-lg);padding:20px 0;position:sticky;top:0;z-index:100}.header-content{align-items:center;display:flex;justify-content:space-between;margin:0 auto;max-width:1200px;padding:0 20px}.header-title{color:#fff;font-size:2rem;font-weight:700;margin:0;text-shadow:0 2px 4px #0000004d}.header-tagline{align-items:center;color:#ffffffe6;display:flex;font-size:14px;gap:15px}@media (max-width:768px){.app-header{padding:15px 0}.header-content{padding:0 15px}.header-title{font-size:1.5rem}.header-tagline{display:none}}@media (max-width:480px){.header-content{flex-direction:column;gap:10px;text-align:center}.header-title{font-size:1.25rem}}.skip-link{background:var(--accent-primary);color:#fff;left:0;padding:8px 16px;position:absolute;text-decoration:none;top:-40px;transition:top .2s ease;z-index:1000}.skip-link:focus{top:0}
/*# sourceMappingURL=main.ffc30d51.css.map*/