:root{--color-primary: #3b82f6;--color-secondary: #64748b;--color-background: #ffffff;--color-surface: #f8fafc;--color-text: #1e293b;--color-textSecondary: #64748b;--color-border: #e2e8f0;--color-primary-light: #dbeafe;--color-primary-dark: #1e40af;--color-success: #22c55e;--color-success-light: #dcfce7;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-xxl: 3rem;--border-radius: 8px}[data-theme=dark]{--color-primary: #60a5fa;--color-secondary: #94a3b8;--color-background: #0f172a;--color-surface: #1e293b;--color-text: #f1f5f9;--color-textSecondary: #94a3b8;--color-border: #334155;--color-primary-light: #1e40af;--color-primary-dark: #3b82f6;--color-success: #16a34a;--color-success-light: #15803d}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:Inter,Segoe UI,Roboto,sans-serif;background-color:var(--color-background);color:var(--color-text);line-height:1.6}#root{min-height:100vh;display:flex;flex-direction:column}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-md{gap:var(--spacing-md)}.gap-sm{gap:var(--spacing-sm)}.text-center{text-align:center}.mt-auto{margin-top:auto}nav a,.nav-link,.navigation-item a{color:var(--color-text)!important;opacity:1!important}[data-theme=light] nav a,[data-theme=light] .nav-link,[data-theme=light] .navigation-item a{color:#1e293b!important}[data-theme=dark] nav a,[data-theme=dark] .nav-link,[data-theme=dark] .navigation-item a{color:#f1f5f9!important}@media(max-width:768px){.container{padding:0 var(--spacing-sm)}.mobile-hidden{display:none}}@media(min-width:769px){.desktop-hidden{display:none}}.hero-section{text-align:center;padding:3rem 2rem;background:linear-gradient(135deg,#e8eaf6,#c5cae9,#9fa8da);border-radius:16px;margin-bottom:3rem;color:#fff}.hero-title{font-size:2.5rem;font-weight:800;margin-bottom:1rem;color:#1a237e!important}.hero-subtitle{font-size:1.2rem;line-height:1.8;max-width:800px;margin:0 auto;color:#283593!important}[data-theme=dark] .hero-section{background:linear-gradient(135deg,#1e3a8a,#1e40af,#3b82f6)}[data-theme=dark] .hero-title{color:#e0e7ff!important}[data-theme=dark] .hero-subtitle{color:#c7d2fe!important}@media(max-width:768px){.hero-section{padding:2rem 1rem}.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem}}@media(max-width:480px){.hero-title{font-size:1.75rem}.hero-subtitle{font-size:.95rem}}.main-content{flex:1;padding:var(--spacing-xl) 0}.hero{text-align:center;padding:var(--spacing-xl) 0;margin-bottom:var(--spacing-xl)}.hero-title{font-size:3rem;font-weight:800;color:var(--color-text);margin-bottom:var(--spacing-md);background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-description{font-size:1.25rem;color:var(--color-textSecondary);max-width:600px;margin:0 auto var(--spacing-xl);line-height:1.6}.hero-actions{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}.btn{padding:var(--spacing-md) var(--spacing-xl);border:none;border-radius:.5rem;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s ease-in-out;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.btn-primary{background-color:var(--color-primary);color:#fff}.btn-primary:hover{background-color:var(--color-primary);filter:brightness(.9);transform:translateY(-1px)}.btn-secondary{background-color:transparent;color:var(--color-primary);border:2px solid var(--color-primary)}.btn-secondary:hover{background-color:var(--color-primary);color:#fff;transform:translateY(-1px)}.features{margin-top:var(--spacing-xxl);padding:var(--spacing-xxl) 0;background:linear-gradient(135deg,var(--color-surface),var(--color-background));position:relative}.features:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--color-border),transparent)}.section-title{font-size:2.5rem;font-weight:800;text-align:center;color:var(--color-text);margin-bottom:var(--spacing-xxl);line-height:1.2;position:relative}.section-title:after{content:"";position:absolute;bottom:-var(--spacing-md);left:50%;transform:translate(-50%);width:80px;height:3px;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));border-radius:2px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--spacing-xl);margin-top:var(--spacing-lg);justify-items:center}.feature-card{background-color:var(--color-surface);padding:var(--spacing-xl);border-radius:1rem;border:1px solid var(--color-border);transition:all .3s ease-in-out;position:relative;overflow:hidden;max-width:380px;height:fit-content;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.feature-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));transform:scaleX(0);transition:transform .3s ease-in-out;transform-origin:left}.feature-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px #3b82f626;border-color:var(--color-primary)}.feature-card:hover:before{transform:scaleX(1)}.feature-card h3{font-size:1.5rem;font-weight:700;color:var(--color-text);margin-bottom:var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-sm)}.feature-card p{color:var(--color-textSecondary);line-height:1.7;margin:0;font-size:1rem}.selected-tutorial{margin:var(--spacing-xl) 0;padding:var(--spacing-lg);background:linear-gradient(135deg,var(--color-primary)10,var(--color-surface));border-radius:.75rem;border:2px solid var(--color-primary)}.tutorial-highlight h2{color:var(--color-primary);font-size:1.75rem;margin-bottom:var(--spacing-md)}.tutorial-highlight p{color:var(--color-text);font-size:1.125rem;margin-bottom:var(--spacing-md)}.tutorial-meta{display:flex;gap:var(--spacing-md);align-items:center}.difficulty{padding:var(--spacing-xs) var(--spacing-md);border-radius:1rem;font-size:.875rem;font-weight:600;text-transform:capitalize}.difficulty-beginner{background-color:#dcfce7;color:#166534}.difficulty-intermediate{background-color:#fef3c7;color:#92400e}.difficulty-advanced{background-color:#fee2e2;color:#991b1b}.estimated-time{color:var(--color-textSecondary);font-size:.875rem}@media(max-width:768px){.hero-title{font-size:2rem}.hero-description{font-size:1.125rem}.hero-actions{flex-direction:column;align-items:center}.btn{width:100%;max-width:300px}.features{padding:var(--spacing-xl) 0;margin-top:var(--spacing-xl)}.section-title{font-size:2rem;margin-bottom:var(--spacing-xl)}.section-title:after{width:60px;height:2px}.features-grid{grid-template-columns:1fr;gap:var(--spacing-lg);margin-top:var(--spacing-md)}.feature-card{max-width:100%;margin:0 auto;padding:var(--spacing-lg)}.feature-card h3{font-size:1.25rem}}@media(min-width:769px)and (max-width:1024px){.features-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-xl)}.feature-card{max-width:100%}}@media(min-width:1400px){.features-grid{grid-template-columns:repeat(3,1fr);max-width:1200px;margin:var(--spacing-lg) auto 0}}.ad-container{display:flex;justify-content:center;align-items:center;margin:var(--spacing-lg) 0;padding:var(--spacing-sm);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius);min-height:90px;position:relative;overflow:hidden}.ad-container:before{content:"";position:absolute;inset:0;background:linear-gradient(45deg,transparent 25%,rgba(var(--color-primary-rgb),.05) 25%,rgba(var(--color-primary-rgb),.05) 50%,transparent 50%,transparent 75%,rgba(var(--color-primary-rgb),.05) 75%);background-size:20px 20px;opacity:.3;pointer-events:none}.tutorial-top-ad{margin:var(--spacing-md) 0 var(--spacing-lg) 0;min-height:90px}.tutorial-bottom-ad{margin:var(--spacing-xl) 0 var(--spacing-lg) 0;min-height:90px}.sidebar-ad{margin:var(--spacing-lg) 0;min-height:250px;max-width:160px;width:100%}.in-content-ad{margin:var(--spacing-xl) auto;max-width:336px;min-height:280px}@media(max-width:768px){.ad-container{margin:var(--spacing-md) 0;padding:var(--spacing-xs);min-height:60px}.tutorial-top-ad,.tutorial-bottom-ad{min-height:60px}.sidebar-ad{display:none}.in-content-ad{max-width:300px;min-height:250px}}[data-theme=dark] .ad-container{background:var(--color-surface);border-color:var(--color-border)}[data-theme=dark] .ad-container:before{background:linear-gradient(45deg,transparent 25%,rgba(255,255,255,.03) 25%,rgba(255,255,255,.03) 50%,transparent 50%,transparent 75%,rgba(255,255,255,.03) 75%);background-size:20px 20px}.back-to-top{position:fixed;bottom:2rem;right:2rem;width:48px;height:48px;border-radius:50%;background:#1a73e8;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #1a73e84d;transition:all .3s ease;z-index:900;opacity:0;visibility:hidden;transform:translateY(20px)}.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:#1557b0;transform:translateY(-3px);box-shadow:0 6px 20px #1a73e866}.back-to-top:active{transform:translateY(-1px)}.back-to-top:focus{outline:2px solid #1a73e8;outline-offset:3px}.back-to-top svg{font-size:1.25rem}[data-theme=dark] .back-to-top{background:#8ab4f8;color:#202124;box-shadow:0 4px 12px #8ab4f84d}[data-theme=dark] .back-to-top:hover{background:#aecbfa;box-shadow:0 6px 20px #8ab4f866}[data-theme=dark] .back-to-top:focus{outline-color:#8ab4f8}@media(max-width:768px){.back-to-top{width:44px;height:44px;bottom:1.5rem;right:1.5rem}.back-to-top svg{font-size:1.1rem}}@media(max-width:480px){.back-to-top{width:40px;height:40px;bottom:1rem;right:1rem}}.interactive-code-block{--icb-primary: #1a73e8;--icb-primary-hover: #1557b0;--icb-success: #34a853;--icb-error: #ea4335;--icb-warning: #fbbc04;--icb-radius: 12px;--icb-radius-sm: 8px;--icb-transition: .2s cubic-bezier(.4, 0, .2, 1)}.interactive-code-block{font-family:Google Sans,Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif;border-radius:var(--icb-radius);overflow:hidden;margin:1.5rem 0;box-shadow:0 1px 3px #0000001f,0 1px 2px #0000003d;transition:box-shadow var(--icb-transition)}.interactive-code-block:hover{box-shadow:0 3px 6px #00000026,0 2px 4px #0000001f}.interactive-code-block.vs-dark{background:#1e1e1e;border:1px solid #333}.interactive-code-block.light{background:#fff;border:1px solid #dadce0}.icb-header{display:flex;justify-content:flex-end;align-items:center;padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.08);min-height:44px}.interactive-code-block.light .icb-header{border-bottom:1px solid #e8eaed}.icb-header-left{display:flex;align-items:center;gap:12px}.icb-header-right{display:flex;align-items:center;gap:4px}.icb-language-pill{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--lang-color, #5f6368);color:#fff;font-size:18px;flex-shrink:0;box-shadow:0 1px 2px #0000001a}.icb-lang-icon{display:flex;align-items:center;justify-content:center}.icb-lang-label{font-size:14px;font-weight:500;color:#9aa0a6;letter-spacing:.1px}.interactive-code-block.light .icb-lang-label{color:#5f6368}.icb-title{font-size:16px;font-weight:500;color:#e8eaed;margin:0;letter-spacing:.1px}.interactive-code-block.light .icb-title{color:#202124}.icb-btn{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;transition:background var(--icb-transition);position:relative}.icb-btn-icon{width:40px;height:40px;border-radius:50%;color:#9aa0a6;font-size:18px;border:none;background:transparent}.icb-btn-icon:before{content:"";position:absolute;inset:0;border-radius:50%;background:currentColor;opacity:0;transition:opacity var(--icb-transition)}.icb-btn-icon:hover:before{opacity:.08}.icb-btn-icon:active:before{opacity:.12}.interactive-code-block.vs-dark .icb-btn-icon:hover{color:#e8eaed}.interactive-code-block.light .icb-btn-icon{color:#5f6368}.interactive-code-block.light .icb-btn-icon:hover{color:#202124}.icb-btn-icon.copied{color:var(--icb-success)}.icb-editor-container{position:relative}.icb-editor-container .monaco-editor{padding-top:0!important}.icb-editor-container .monaco-editor .margin{background:transparent!important}.interactive-code-block.vs-dark .icb-editor-container{background:#1e1e1e}.interactive-code-block.light .icb-editor-container{background:#fff}.icb-input-section{padding:8px 16px;border-top:1px solid rgba(255,255,255,.08)}.interactive-code-block.light .icb-input-section{border-top:1px solid #e8eaed}.icb-input-toggle{display:inline-flex;align-items:center;gap:8px;background:transparent;border:none;color:#9aa0a6;font-size:14px;font-weight:500;cursor:pointer;padding:8px 12px;margin:-8px -12px;border-radius:var(--icb-radius-sm);transition:background var(--icb-transition),color var(--icb-transition)}.icb-input-toggle:hover{background:#ffffff14;color:#e8eaed}.interactive-code-block.light .icb-input-toggle{color:#5f6368}.interactive-code-block.light .icb-input-toggle:hover{background:#0000000a;color:#202124}.icb-input-toggle svg{font-size:16px;transition:transform var(--icb-transition)}.icb-stdin{width:100%;margin-top:12px;padding:12px;border-radius:var(--icb-radius-sm);border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:#e8eaed;font-family:Roboto Mono,Fira Code,Consolas,monospace;font-size:13px;resize:vertical;min-height:60px;transition:border-color var(--icb-transition),box-shadow var(--icb-transition)}.interactive-code-block.light .icb-stdin{background:#f8f9fa;border-color:#dadce0;color:#202124}.icb-stdin::placeholder{color:#9aa0a6}.icb-stdin:focus{outline:none;border-color:var(--icb-primary);box-shadow:0 0 0 2px #1a73e833}.icb-actions{padding:16px;display:flex;gap:12px}.icb-run-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 24px;height:40px;min-width:120px;border:none;border-radius:20px;font-size:14px;font-weight:500;letter-spacing:.25px;color:#fff;background:var(--icb-primary);cursor:pointer;transition:background var(--icb-transition),box-shadow var(--icb-transition),transform .1s ease;box-shadow:0 1px 2px #0000001a}.icb-run-btn:hover:not(:disabled){background:var(--icb-primary-hover);box-shadow:0 2px 4px #0003}.icb-run-btn:active:not(:disabled){transform:scale(.98)}.icb-run-btn:disabled{opacity:.6;cursor:not-allowed}.icb-run-btn svg{font-size:16px}.icb-spinner{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:icb-spin .8s linear infinite}@keyframes icb-spin{to{transform:rotate(360deg)}}.icb-output{border-top:1px solid rgba(255,255,255,.08);animation:icb-fadeIn .3s ease}.interactive-code-block.light .icb-output{border-top:1px solid #e8eaed}.icb-output-header{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#ffffff0a;font-size:14px;font-weight:500;color:#e8eaed}.interactive-code-block.light .icb-output-header{background:#f8f9fa;color:#202124}.icb-output-meta{font-size:12px;font-weight:400;color:#9aa0a6;padding:4px 8px;background:#ffffff14;border-radius:4px}.interactive-code-block.light .icb-output-meta{background:#0000000a;color:#5f6368}.icb-output-content{padding:16px}.icb-stdout{margin:0;padding:12px 16px;background:#34a85314;border-radius:var(--icb-radius-sm);border-left:4px solid var(--icb-success);font-family:Roboto Mono,Fira Code,Consolas,monospace;font-size:13px;color:#e8eaed;white-space:pre-wrap;word-break:break-word;overflow-x:auto}.interactive-code-block.light .icb-stdout{color:#202124;background:#34a8530f}.icb-stderr{margin-top:12px;padding:12px 16px;background:#ea433514;border-radius:var(--icb-radius-sm);border-left:4px solid var(--icb-error);color:#f28b82;font-size:13px}.interactive-code-block.light .icb-stderr{color:#c5221f;background:#ea43350f}.icb-stderr pre{margin:8px 0 0;font-family:Roboto Mono,Fira Code,Consolas,monospace;font-size:12px;white-space:pre-wrap;word-break:break-word}.icb-status{margin-top:12px;padding:8px 12px;background:#ffffff0a;border-radius:var(--icb-radius-sm);font-size:12px;color:#9aa0a6}.icb-status.success{color:var(--icb-success);background:#34a85314}.icb-comparison{display:flex;align-items:center;margin-top:12px;padding:12px 16px;border-radius:var(--icb-radius-sm);font-size:14px;font-weight:500}.icb-comparison.match{background:#34a8531a;color:var(--icb-success)}.icb-comparison.mismatch{background:#fbbc041a;color:#f9ab00}.icb-comparison-icon{margin-right:8px;font-size:18px;flex-shrink:0}.icb-comparison code{background:#00000026;padding:2px 8px;border-radius:4px;font-family:Roboto Mono,Fira Code,Consolas,monospace;font-size:13px}@keyframes icb-fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.interactive-code-block{margin:1rem 0;border-radius:var(--icb-radius-sm)}.icb-header{padding:12px;min-height:48px}.icb-language-pill{width:36px;height:36px;font-size:16px}.icb-title{font-size:14px}.icb-btn-icon{width:36px;height:36px}.icb-actions{padding:12px}.icb-run-btn{width:100%;justify-content:center}.icb-output-content{padding:12px}.icb-stdout,.icb-stderr{font-size:12px;padding:10px 12px}}.icb-btn:focus-visible,.icb-run-btn:focus-visible,.icb-input-toggle:focus-visible{outline:2px solid var(--icb-primary);outline-offset:2px}@media(prefers-contrast:high){.interactive-code-block{border-width:2px}.icb-stdout,.icb-stderr{border-left-width:6px}}@media(prefers-reduced-motion:reduce){.icb-spinner,.icb-output{animation:none}.icb-run-btn:active:not(:disabled){transform:none}*{transition-duration:.01ms!important}}.java-tutorial-navigation{background:var(--color-surface);border-bottom:1px solid var(--color-border);position:sticky;top:75px;z-index:900;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 8px #00000014;margin-bottom:5px}.java-nav-wrapper{display:flex;align-items:center;max-width:100%;position:relative}.scroll-button{background:var(--color-background);border:1px solid var(--color-border);width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;color:var(--color-text);flex-shrink:0;margin:0 8px;box-shadow:0 2px 4px #0000001a;z-index:10}.scroll-button:hover:not(.disabled){background:var(--color-primary);color:#fff;border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 4px 8px #00000026}.scroll-button.disabled{opacity:.4;cursor:not-allowed;background:var(--color-surface)}.scroll-button svg{font-size:14px}.java-nav-scroll-container{flex:1;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}.java-nav-scroll-container::-webkit-scrollbar{display:none}.java-nav-items{display:flex;align-items:center;gap:4px;padding:12px 8px;min-width:fit-content}.java-nav-item{background:transparent;border:1px solid transparent;border-radius:6px;padding:8px 16px;cursor:pointer;transition:all .2s ease;white-space:nowrap;font-size:14px;font-weight:500;color:var(--color-text);display:flex;align-items:center;min-height:36px;text-decoration:none;position:relative}.java-nav-item:hover{background:var(--color-primary-light);color:var(--color-primary);border-color:var(--color-primary-light);transform:translateY(-1px)}.java-nav-item:active{transform:translateY(0)}.nav-item-title{font-weight:500;line-height:1.4}.category-fundamentals{border-left:3px solid #10b981}.category-fundamentals:hover{background:#10b9811a;color:#10b981;border-color:#10b981}.category-core{border-left:3px solid #3b82f6}.category-core:hover{background:#3b82f61a;color:#3b82f6;border-color:#3b82f6}.category-advanced{border-left:3px solid #8b5cf6}.category-advanced:hover{background:#8b5cf61a;color:#8b5cf6;border-color:#8b5cf6}.category-frameworks{border-left:3px solid #f59e0b}.category-frameworks:hover{background:#f59e0b1a;color:#f59e0b;border-color:#f59e0b}.category-practice{border-left:3px solid #ef4444}.category-practice:hover{background:#ef44441a;color:#ef4444;border-color:#ef4444}.java-nav-item.active{background:var(--color-primary);color:#fff;font-weight:600}.java-nav-item.active.category-fundamentals{background:#10b981;border-color:#10b981}.java-nav-item.active.category-core{background:#3b82f6;border-color:#3b82f6}.java-nav-item.active.category-advanced{background:#8b5cf6;border-color:#8b5cf6}.java-nav-item.active.category-frameworks{background:#f59e0b;border-color:#f59e0b}.java-nav-item.active.category-practice{background:#ef4444;border-color:#ef4444}.container{max-width:1200px;margin:0 auto;padding:0 16px}@media(max-width:1024px){.java-tutorial-navigation{top:75px}.java-nav-item{font-size:13px;padding:7px 14px}.scroll-button{width:36px;height:36px;margin:0 6px}}@media(max-width:768px){.java-tutorial-navigation{top:75px}.container{padding:0 12px}.java-nav-items{padding:10px 4px;gap:3px}.java-nav-item{font-size:12px;padding:6px 12px;min-height:32px}.scroll-button{width:32px;height:32px;margin:0 4px}.scroll-button svg{font-size:12px}}@media(max-width:480px){.java-nav-item{font-size:11px;padding:5px 10px;min-height:28px}.java-nav-items{padding:8px 2px}.scroll-button{width:28px;height:28px}}[data-theme=dark] .java-tutorial-navigation{background:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}[data-theme=dark] .scroll-button{background:var(--color-surface);border-color:var(--color-border)}[data-theme=dark] .scroll-button:hover:not(.disabled){background:var(--color-primary);box-shadow:0 4px 8px #0000004d}.java-nav-item:focus,.scroll-button:focus{outline:2px solid var(--color-primary);outline-offset:2px}.java-nav-item.loading{opacity:.6;pointer-events:none}@media(prefers-contrast:high){.java-tutorial-navigation{border-bottom-width:2px}.java-nav-item{border-width:2px}}@media(prefers-reduced-motion:reduce){.java-nav-item,.scroll-button{transition:none}.java-nav-scroll-container{scroll-behavior:auto}}@media print{.java-tutorial-navigation{display:none}}.category-legend{display:none;position:absolute;top:100%;left:0;right:0;background:var(--color-background);border:1px solid var(--color-border);border-top:none;padding:8px 16px;font-size:11px;color:var(--color-textSecondary)}.legend-item{display:inline-flex;align-items:center;gap:4px;margin-right:12px}.legend-color{width:12px;height:3px;border-radius:1px}.java-nav-item:focus{scroll-margin:20px}.java-nav-scroll-container{transform:translateZ(0);will-change:scroll-position}.java-tutorial-page{min-height:100vh;background-color:var(--color-background)}.java-tutorial-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center;background-color:var(--color-background)}.java-tutorial-error h1{font-size:2rem;margin-bottom:1rem;color:var(--color-text)}.java-tutorial-error p{font-size:1.1rem;margin-bottom:2rem;color:var(--color-textSecondary)}.java-tutorial-error button{padding:.75rem 1.5rem;background:var(--color-primary);color:#fff;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:background-color .2s ease}.java-tutorial-error button:hover{background:var(--color-primary-dark)}.java-tutorial-layout{display:flex;flex-direction:column;min-height:100vh;background-color:var(--color-background);font-family:Inter,Segoe UI,system-ui,sans-serif}.tutorial-header{position:sticky;top:136px;z-index:800;background:var(--color-surface);border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 8px #0000001a}.sidebar-toggle{display:none;position:fixed;bottom:2rem;right:2rem;background:var(--color-primary);border:none;border-radius:50%;width:56px;height:56px;font-size:1.5rem;cursor:pointer;transition:all .3s ease;color:#fff;z-index:1000;box-shadow:0 4px 12px #00000026}.sidebar-toggle:hover{background:var(--color-primary-dark);transform:scale(1.1) rotate(90deg);box-shadow:0 6px 16px #0003}.tutorial-title{font-size:1.75rem;font-weight:700;color:var(--color-primary);margin:0;flex:1}.progress-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));transition:width .3s ease}.tutorial-sidebar{background:var(--color-surface);border-right:1px solid var(--color-border);height:calc(100vh - 136px);overflow-y:auto;position:sticky;top:136px;transition:transform .3s ease}.sidebar-content{padding:1.5rem}.nav-category-header:hover{background:var(--color-primary-light);color:var(--color-primary)}.expand-icon{font-size:1.25rem;font-weight:700;color:var(--color-primary);transition:transform .3s ease}.nav-category-header:hover .expand-icon{transform:scale(1.2)}.section-list{list-style:none;margin:0;padding:0;max-height:2000px;overflow:hidden;transition:max-height .4s ease,opacity .3s ease;opacity:1}.section-link:hover{background:var(--color-primary-light);border-color:var(--color-primary);transform:translate(4px);box-shadow:0 2px 8px #00000014}.section-link.active{background:var(--color-primary);color:#fff;font-weight:600;border-color:var(--color-primary);box-shadow:0 4px 12px #007bff4d}.section-link.active:hover{transform:translate(0);background:var(--color-primary-dark)}.section-link.current{background:var(--color-primary);color:#fff;font-weight:600}.section-link.completed.current{background:var(--color-primary)}.section-link.current .section-number{background:#fff;color:var(--color-primary)}.tutorial-main{padding:0 2rem 2rem;background:var(--color-background);min-height:calc(100vh - 136px);max-width:900px;overflow-x:hidden}.section-number,.section-time{font-size:.875rem;color:var(--color-textSecondary);padding:.25rem .75rem;background:var(--color-surface);border-radius:1rem;border:1px solid var(--color-border)}.section-navigation{display:flex;justify-content:space-between;align-items:center;padding:2rem 0;border-top:2px solid var(--color-border);margin-top:3rem}.nav-button{padding:.75rem 1.5rem;border:2px solid var(--color-primary);border-radius:.5rem;background:transparent;color:var(--color-primary);font-weight:600;cursor:pointer;transition:all .2s ease;min-width:120px}.nav-button:hover:not(:disabled){background:var(--color-primary);color:#fff;transform:translateY(-1px)}.nav-button:disabled{opacity:.5;cursor:not-allowed;border-color:var(--color-border);color:var(--color-textSecondary)}.tutorial-ads-sidebar{background:var(--color-surface);border-left:1px solid var(--color-border);height:calc(100vh - 136px);overflow-y:auto;position:sticky;top:136px}.reference-link{color:var(--color-primary);text-decoration:none;padding:.5rem;border-radius:.25rem;transition:background-color .2s ease;font-size:.875rem}.reference-link:hover{background:var(--color-primary-light);color:var(--color-primary)}.topic-list a{color:var(--color-primary);text-decoration:none;font-size:.875rem;padding:.5rem;display:block;border-radius:.25rem;transition:background-color .2s ease}.topic-list a:hover{background:var(--color-primary-light)}@media(max-width:1024px){.tutorial-body{grid-template-columns:1fr;position:relative}.tutorial-sidebar{position:fixed;top:136px;left:0;z-index:999;width:85%;max-width:380px;height:calc(100vh - 136px);transform:translate(-100%);box-shadow:4px 0 20px #00000026;transition:transform .3s cubic-bezier(.4,0,.2,1)}.tutorial-sidebar.open{transform:translate(0)}.tutorial-ads-sidebar{display:none}.sidebar-toggle{display:flex;align-items:center;justify-content:center}.tutorial-main{padding:0 1.5rem 5rem}.section-header .section-title{font-size:1.75rem}.section-navigation{flex-direction:column;gap:1rem}.nav-button{width:100%;max-width:100%}.nav-category-header{padding:1rem;font-size:1.1rem}.section-link{padding:1rem;font-size:.95rem}.tutorial-sidebar::-webkit-scrollbar{width:8px}}@media(max-width:768px){.tutorial-header-content{padding:.75rem 1rem}.tutorial-title{font-size:1.3rem}.tutorial-progress{min-width:120px}.progress-bar{width:60px}.tutorial-sidebar{width:90%;max-width:100%;top:136px}.sidebar-toggle{width:50px;height:50px;bottom:1.5rem;right:1.5rem;font-size:1.3rem}.tutorial-main{padding:0 1rem 5rem}.section-header .section-title{font-size:1.5rem}.section-meta{flex-direction:column;align-items:flex-start;gap:.5rem}.section-content{font-size:.95rem;padding-top:1rem}.sidebar-content{padding:1rem}.nav-category-header{padding:.875rem;font-size:1rem}.section-link{padding:.875rem;font-size:.9rem}}.tutorial-sidebar::-webkit-scrollbar-thumb:hover,.tutorial-ads-sidebar::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}.sidebar-toggle:focus,.section-link:focus,.nav-button:focus,.reference-link:focus,.topic-list a:focus{outline:2px solid var(--color-primary);outline-offset:2px}.code-block-wrapper{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;margin:1.5rem 0;overflow:hidden;width:100%;max-width:100%;box-sizing:border-box}.code-block-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:var(--color-background);border-bottom:1px solid var(--color-border);flex-wrap:wrap;gap:.5rem}.code-language{font-size:.875rem;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px}.code-actions{display:flex;gap:.5rem;flex-wrap:wrap}.code-action-btn{padding:.375rem .75rem;border:1px solid var(--color-border);border-radius:4px;background:var(--color-surface);color:var(--color-text);cursor:pointer;font-size:.875rem;transition:all .2s;white-space:nowrap}.code-action-btn:hover:not(:disabled){background:var(--color-primary);color:#fff;border-color:var(--color-primary);transform:translateY(-1px)}.code-action-btn:disabled{opacity:.5;cursor:not-allowed}.code-action-btn:active:not(:disabled){transform:translateY(0)}.copy-btn.copied{background:var(--color-success);color:#fff;border-color:var(--color-success)}.code-pre{margin:0;padding:1.5rem;background:#2d3748;color:#e2e8f0;overflow-x:auto;font-family:Monaco,Menlo,Consolas,Courier New,monospace;font-size:.9rem;line-height:1.6;-webkit-overflow-scrolling:touch;max-width:100%;box-sizing:border-box}.code-pre::-webkit-scrollbar{height:8px}.code-pre::-webkit-scrollbar-track{background:#1a202c;border-radius:4px}.code-pre::-webkit-scrollbar-thumb{background:#4a5568;border-radius:4px}.code-pre::-webkit-scrollbar-thumb:hover{background:#718096}.code-pre code{background:none;padding:0;color:inherit;font-family:inherit;font-size:inherit;word-break:break-all;white-space:pre-wrap}.code-output{border-top:1px solid var(--color-border);background:var(--color-background)}.output-label{padding:.5rem 1rem;font-size:.875rem;font-weight:600;color:var(--color-text);background:#68d3911a;border-bottom:1px solid var(--color-border)}.output-pre{margin:0;padding:1rem;background:#1a202c;color:#68d391;font-family:Monaco,Menlo,Consolas,Courier New,monospace;font-size:.875rem;white-space:pre-wrap;overflow-x:auto;-webkit-overflow-scrolling:touch;line-height:1.6;word-break:break-word}@media(max-width:1024px){.code-block-wrapper{margin:1.25rem 0}.code-pre{padding:1.25rem;font-size:.875rem}.output-pre{font-size:.85rem}}@media(max-width:768px){.code-block-wrapper{margin:1rem 0;border-radius:6px}.code-block-header{flex-direction:column;align-items:flex-start;padding:.75rem}.code-language{font-size:.8rem}.code-actions{width:100%;justify-content:flex-end}.code-action-btn{padding:.35rem .65rem;font-size:.8rem}.code-pre{padding:1rem;font-size:.8rem;border-radius:0}.output-label{padding:.4rem .875rem;font-size:.8rem}.output-pre{padding:.875rem;font-size:.8rem}}@media(max-width:480px){.code-block-wrapper{margin:.875rem 0}.code-block-header{padding:.625rem}.code-language{font-size:.75rem}.code-action-btn{padding:.3rem .6rem;font-size:.75rem}.code-pre{padding:.875rem;font-size:.75rem;line-height:1.5}.output-label{padding:.35rem .75rem;font-size:.75rem}.output-pre{padding:.75rem;font-size:.75rem;line-height:1.5}}@media(prefers-color-scheme:dark){.code-block-header{background:#1e293bcc}.output-label{background:#68d39126}}.tutorial-page{min-height:100vh;background-color:var(--color-background)}.tutorial-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center;background-color:var(--color-background)}.tutorial-error h1{font-size:2rem;margin-bottom:1rem;color:var(--color-text)}.tutorial-error p{font-size:1.1rem;margin-bottom:2rem;color:var(--color-textSecondary)}.tutorial-error button{padding:.75rem 1.5rem;background:var(--color-primary);color:#fff;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:background-color .2s ease}.tutorial-error button:hover{background:var(--color-primary-dark)}.tutorial-layout{display:flex;flex-direction:column;min-height:100vh;background-color:var(--color-background);font-family:Inter,Segoe UI,system-ui,sans-serif}.tutorial-header{position:sticky;top:70px;z-index:800;background:var(--color-surface);border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 8px #0000001a}.tutorial-header-content{display:flex;align-items:center;justify-content:space-between;max-width:1400px;margin:0 auto;padding:1rem 1.5rem;gap:1rem}.sidebar-toggle{display:none;position:fixed;bottom:2rem;right:2rem;background:#1a73e8;border:none;border-radius:50%;width:56px;height:56px;cursor:pointer;transition:all .3s ease;color:#fff;z-index:1000;box-shadow:0 4px 12px #1a73e84d;align-items:center;justify-content:center}.sidebar-toggle svg{font-size:1.5rem}.sidebar-toggle:hover{background:#1557b0;transform:scale(1.1) rotate(90deg);box-shadow:0 6px 16px #1a73e866}.sidebar-toggle:active{transform:scale(.95)}.tutorial-title{font-size:1.75rem;font-weight:700;color:#1a73e8;margin:0;flex:1}.tutorial-progress{display:flex;align-items:center;gap:1rem;min-width:200px}.progress-bar{width:120px;height:8px;background:var(--color-border);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#1a73e8,#1557b0);transition:width .3s ease}.progress-text{font-size:.875rem;color:var(--color-textSecondary);white-space:nowrap}.tutorial-body{display:grid;grid-template-columns:280px 1fr 300px;flex:1;max-width:1400px;margin:0 auto;width:100%;gap:0}.tutorial-sidebar{background:var(--color-surface);border-right:1px solid var(--color-border);height:calc(100vh - 70px);overflow-y:auto;overflow-x:hidden;position:sticky;top:70px;transition:transform .3s ease}.sidebar-content{padding:1.5rem 1rem 1.5rem 1.5rem}.tutorial-overview{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border)}.tutorial-overview h2{font-size:1.25rem;font-weight:600;color:var(--color-text);margin-bottom:.75rem}.tutorial-description{font-size:.875rem;color:var(--color-textSecondary);line-height:1.6;margin-bottom:1rem}.tutorial-meta{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.difficulty-badge{padding:.25rem .75rem;border-radius:1rem;font-size:.75rem;font-weight:600;text-transform:uppercase}.difficulty-beginner{background:var(--color-success-light);color:var(--color-success)}.difficulty-intermediate{background:#fef3c7;color:#d97706}.difficulty-advanced{background:#fee2e2;color:#dc2626}.estimated-time{font-size:.75rem;color:var(--color-textSecondary);display:flex;align-items:center;gap:.25rem}.tutorial-navigation h3{font-size:1rem;font-weight:600;color:var(--color-text);margin-bottom:1rem}.nav-category{margin-bottom:1.5rem}.nav-category-header{display:flex;justify-content:space-between;align-items:center;font-size:1rem;font-weight:600;color:var(--color-text);margin-bottom:.75rem;padding:.75rem;cursor:pointer;border-radius:.5rem;transition:all .2s ease;-webkit-user-select:none;user-select:none}.nav-category-header:hover{background:#1a73e81a;color:#1a73e8}.expand-icon{display:flex;align-items:center;justify-content:center;font-size:1rem;color:#1a73e8;transition:transform .3s ease}.expand-icon svg{transition:transform .3s ease}.nav-category-header:hover .expand-icon svg{transform:scale(1.2)}.section-list{list-style:none;margin:0;padding:0 .25rem;max-height:2000px;overflow:hidden;transition:max-height .4s ease,opacity .3s ease;opacity:1}.section-list.collapsed{max-height:0;opacity:0;margin-bottom:0}.section-list.expanded{max-height:2000px;opacity:1}.section-item{margin-bottom:.25rem}.section-link{display:flex;align-items:center;width:100%;padding:.75rem;background:transparent;border:1px solid transparent;border-radius:.5rem;text-align:left;cursor:pointer;transition:all .2s ease;gap:.75rem;position:relative;color:var(--color-text);font-size:.875rem}.section-link:hover{background:#1a73e81a;border-color:#1a73e8}.section-link.active{background:#1a73e8;color:#fff;font-weight:600;border-color:#1a73e8}.section-link.active:hover{transform:translate(0);background:#1557b0}.section-link.current{background:#1a73e8;color:#fff;font-weight:600}.section-link.completed{background:var(--color-success-light);border-color:var(--color-success)}.section-link.completed.current{background:#1a73e8}.section-number{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;background:var(--color-border);border-radius:50%;font-size:.75rem;font-weight:600;color:var(--color-text);flex-shrink:0}.section-link.current .section-number{background:#fff;color:#1a73e8}.section-link.completed .section-number{background:var(--color-success);color:#fff}.section-title{flex:1;font-size:.875rem;line-height:1.4;color:inherit}.section-time{font-size:.75rem;color:var(--color-textSecondary);flex-shrink:0}.section-link.current .section-time{color:#fffc}.completed-icon{color:var(--color-success);font-weight:700;flex-shrink:0}.section-link.current .completed-icon{color:#fff}.tutorial-prerequisites,.tutorial-topics{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--color-border)}.tutorial-prerequisites h3,.tutorial-topics h3{font-size:1rem;font-weight:600;color:var(--color-text);margin-bottom:.75rem}.tutorial-prerequisites ul,.tutorial-topics ul{list-style:none;margin:0;padding:0}.tutorial-prerequisites li,.tutorial-topics li{padding:.5rem 0;font-size:.875rem;color:var(--color-textSecondary);border-bottom:1px solid var(--color-border)}.tutorial-prerequisites li:last-child,.tutorial-topics li:last-child{border-bottom:none}.tutorial-main{padding:1.25rem 2rem 2rem;background:var(--color-background);min-height:calc(100vh - 70px);max-width:900px;overflow-x:hidden}.section-header{margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid var(--color-border)}.section-header .section-title{font-size:2rem;font-weight:700;color:var(--color-text);margin-bottom:.75rem;line-height:1.3}.section-meta{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.section-content{margin-top:0;margin-bottom:3rem;padding-top:1.5rem;line-height:1.7}.section-navigation{display:flex;justify-content:space-between;align-items:center;padding:1rem 0;gap:1rem}.page-navigation{display:flex;justify-content:space-between;align-items:center;gap:1rem}.page-navigation-top{padding:1rem 0 1.25rem;margin-top:.5rem;margin-bottom:.5rem;border-bottom:1px solid var(--color-border)}.page-navigation-bottom{padding:1.5rem 0 .5rem;margin-top:2.5rem;border-top:1px solid var(--color-border)}.page-nav-btn{display:inline-flex;align-items:center;justify-content:center;gap:.375rem;padding:.5rem 1rem;border:1.5px solid #1a73e8;border-radius:6px;background:transparent;color:#1a73e8;font-weight:500;font-size:.875rem;cursor:pointer;transition:all .2s ease;min-width:100px}.page-nav-btn svg{font-size:1rem;transition:transform .2s ease}.page-nav-btn:hover:not(:disabled){background:#1a73e8;color:#fff;box-shadow:0 2px 8px #1a73e840}.page-nav-btn.prev:hover:not(:disabled) svg{transform:translate(-2px)}.page-nav-btn.next:hover:not(:disabled) svg{transform:translate(2px)}.page-nav-btn:disabled{opacity:.35;cursor:not-allowed;border-color:var(--color-border);color:var(--color-textSecondary)}.page-nav-btn:disabled:hover{background:transparent;box-shadow:none}.nav-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 1.75rem;border:2px solid #1a73e8;border-radius:.5rem;background:transparent;color:#1a73e8;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .2s ease;min-width:140px}.nav-button-compact{padding:.5rem 1rem;font-size:.875rem;min-width:110px;border-width:1.5px}.nav-button svg{font-size:1.1rem}.nav-button-compact svg{font-size:1rem}.nav-button:hover:not(:disabled){background:#1a73e8;color:#fff;transform:translateY(-1px)}.nav-button-compact:hover:not(:disabled){transform:translateY(0);box-shadow:0 2px 8px #1a73e840}.nav-button:disabled{opacity:.4;cursor:not-allowed;border-color:var(--color-border);color:var(--color-textSecondary)}.section-indicator{font-weight:600;color:var(--color-text);padding:.5rem 1rem;background:var(--color-surface);border-radius:.5rem;border:1px solid var(--color-border)}.tutorial-ads-sidebar{background:var(--color-surface);border-left:1px solid var(--color-border);height:calc(100vh - 70px);overflow-y:auto;position:sticky;top:70px}.ads-content{padding:1.5rem;display:flex;flex-direction:column;gap:2rem}.ad-section{display:flex;justify-content:center;align-items:center;min-height:250px;background:var(--color-background);border:2px dashed var(--color-border);border-radius:.5rem}.quick-reference,.related-topics{background:var(--color-background);padding:1.5rem;border-radius:.75rem;border:1px solid var(--color-border)}.quick-reference h3,.related-topics h3{font-size:1.125rem;font-weight:600;color:var(--color-text);margin-bottom:1rem}.reference-links{display:flex;flex-direction:column;gap:.5rem}.reference-link{color:#1a73e8;text-decoration:none;padding:.5rem;border-radius:.25rem;transition:background-color .2s ease;font-size:.875rem}.reference-link:hover{background:#1a73e81a;color:#1a73e8}.topic-list{list-style:none;margin:0;padding:0}.topic-list li{margin-bottom:.5rem}.topic-list a,.topic-list button{color:#1a73e8;text-decoration:none;font-size:.875rem;padding:.5rem;display:block;border-radius:.25rem;transition:background-color .2s ease;background:transparent;border:none;cursor:pointer;text-align:left;width:100%}.topic-list a:hover,.topic-list button:hover{background:#1a73e81a}@media(max-width:1024px){.tutorial-body{grid-template-columns:1fr;position:relative}.tutorial-sidebar{position:fixed;top:70px;left:0;z-index:999;width:85%;max-width:380px;height:calc(100vh - 70px);transform:translate(-100%);box-shadow:4px 0 20px #00000026;transition:transform .3s cubic-bezier(.4,0,.2,1)}.tutorial-sidebar.open{transform:translate(0)}.tutorial-ads-sidebar{display:none}.sidebar-toggle{display:flex;align-items:center;justify-content:center}.tutorial-main{padding:0 1.5rem 5rem}.section-header .section-title{font-size:1.75rem}.page-navigation{gap:.5rem}.page-nav-btn{flex:1;min-width:auto;padding:.5rem .75rem;font-size:.8125rem}.nav-category-header{padding:1rem;font-size:1.1rem}.section-link{padding:1rem;font-size:.95rem}.tutorial-sidebar::-webkit-scrollbar{width:8px}}@media(max-width:768px){.tutorial-header-content{padding:.75rem 1rem}.tutorial-title{font-size:1.3rem}.tutorial-progress{min-width:120px}.progress-bar{width:60px}.tutorial-sidebar{width:90%;max-width:100%;top:70px}.sidebar-toggle{width:50px;height:50px;bottom:1.5rem;right:1.5rem;font-size:1.3rem}.tutorial-main{padding:0 1rem 5rem}.section-header .section-title{font-size:1.5rem}.section-meta{flex-direction:column;align-items:flex-start;gap:.5rem}.section-content{font-size:.95rem;padding-top:1rem}.sidebar-content{padding:1rem}.nav-category-header{padding:.875rem;font-size:1rem}.section-link{padding:.875rem;font-size:.9rem}}@media(max-width:480px){.tutorial-sidebar{width:95%}.sidebar-toggle{width:48px;height:48px;bottom:1rem;right:1rem;font-size:1.2rem}.tutorial-main{padding:0 .75rem 4.5rem}.section-header .section-title{font-size:1.25rem}.nav-category-header{padding:.75rem;font-size:.95rem}.section-link{padding:.75rem;font-size:.875rem}.tutorial-prerequisites,.tutorial-topics{margin-top:1.5rem;padding-top:1rem}.nav-button{padding:.625rem 1.25rem;font-size:.9rem}}.sidebar-overlay{position:fixed;inset:0;background:#00000080;z-index:998;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:fadeIn .3s ease;cursor:pointer}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.tutorial-sidebar::-webkit-scrollbar,.tutorial-ads-sidebar::-webkit-scrollbar{width:6px}.tutorial-sidebar::-webkit-scrollbar-track,.tutorial-ads-sidebar::-webkit-scrollbar-track{background:var(--color-surface)}.tutorial-sidebar::-webkit-scrollbar-thumb,.tutorial-ads-sidebar::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}.tutorial-sidebar::-webkit-scrollbar-thumb:hover,.tutorial-ads-sidebar::-webkit-scrollbar-thumb:hover{background:#1a73e8}.sidebar-toggle:focus,.section-link:focus,.nav-button:focus,.page-nav-btn:focus,.reference-link:focus,.topic-list a:focus,.topic-list button:focus{outline:2px solid #1a73e8;outline-offset:2px}.tutorial-loading{display:flex;justify-content:center;align-items:center;min-height:200px;color:var(--color-textSecondary)}@media(prefers-color-scheme:dark){.tutorial-header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1e293bf2}.sidebar-overlay{background:#000000b3}.ad-section{background:var(--color-surface);border-color:var(--color-border)}}[data-theme=dark] .sidebar-toggle{background:#8ab4f8;color:#202124;box-shadow:0 4px 12px #8ab4f84d}[data-theme=dark] .sidebar-toggle:hover{background:#aecbfa;box-shadow:0 6px 16px #8ab4f866}[data-theme=dark] .tutorial-title{color:#8ab4f8}[data-theme=dark] .progress-fill{background:linear-gradient(90deg,#8ab4f8,#aecbfa)}[data-theme=dark] .nav-category-header:hover{background:#8ab4f826;color:#8ab4f8}[data-theme=dark] .expand-icon{color:#8ab4f8}[data-theme=dark] .section-link:hover{background:#8ab4f826;border-color:#8ab4f8}[data-theme=dark] .section-link.active,[data-theme=dark] .section-link.current{background:#8ab4f8;color:#202124;border-color:#8ab4f8}[data-theme=dark] .section-link.active:hover{background:#aecbfa}[data-theme=dark] .section-link.current .section-number{background:#202124;color:#8ab4f8}[data-theme=dark] .nav-button{border-color:#8ab4f8;color:#8ab4f8}[data-theme=dark] .nav-button:hover:not(:disabled){background:#8ab4f8;color:#202124}[data-theme=dark] .page-nav-btn{border-color:#8ab4f8;color:#8ab4f8}[data-theme=dark] .page-nav-btn:hover:not(:disabled){background:#8ab4f8;color:#202124;box-shadow:0 2px 8px #8ab4f840}[data-theme=dark] .page-nav-btn:disabled{border-color:var(--color-border);color:var(--color-textSecondary)}[data-theme=dark] .reference-link,[data-theme=dark] .topic-list a,[data-theme=dark] .topic-list button{color:#8ab4f8}[data-theme=dark] .reference-link:hover,[data-theme=dark] .topic-list a:hover,[data-theme=dark] .topic-list button:hover{background:#8ab4f826}[data-theme=dark] .tutorial-sidebar::-webkit-scrollbar-thumb:hover,[data-theme=dark] .tutorial-ads-sidebar::-webkit-scrollbar-thumb:hover{background:#8ab4f8}[data-theme=dark] .sidebar-toggle:focus,[data-theme=dark] .section-link:focus,[data-theme=dark] .nav-button:focus,[data-theme=dark] .page-nav-btn:focus,[data-theme=dark] .reference-link:focus,[data-theme=dark] .topic-list a:focus,[data-theme=dark] .topic-list button:focus{outline-color:#8ab4f8}.git-tutorial-layout{display:flex;flex-direction:column;min-height:100vh;background-color:var(--color-background);font-family:Inter,Segoe UI,system-ui,sans-serif}.git-tutorial-page{min-height:100vh;background-color:var(--color-background)}.git-tutorial-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center;background-color:var(--color-background)}.git-tutorial-error h1{font-size:2rem;margin-bottom:1rem;color:var(--color-text)}.git-tutorial-error p{font-size:1.1rem;margin-bottom:2rem;color:var(--color-textSecondary)}.git-tutorial-error button{padding:.75rem 1.5rem;background:var(--color-primary);color:#fff;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:background-color .2s ease}.git-tutorial-error button:hover{background:var(--color-primary-dark)}.definition-list{margin:1.5rem 0}.definition-list-default .definition-item{margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .definition-list-default .definition-item{border-bottom-color:#3c4043}.definition-list-default .definition-item:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.definition-term{font-size:.9375rem;font-weight:600;color:#202124;margin-bottom:.25rem}[data-theme=dark] .definition-term{color:#e8eaed}.definition-description{font-size:.875rem;line-height:1.6;color:#5f6368;margin:0;padding-left:1rem}[data-theme=dark] .definition-description{color:#9aa0a6}.definition-list-inline .definition-item{display:flex;align-items:baseline;gap:.75rem;padding:.5rem 0;border-bottom:1px solid #f1f3f4}[data-theme=dark] .definition-list-inline .definition-item{border-bottom-color:#3c4043}.definition-list-inline .definition-item:last-child{border-bottom:none}.definition-list-inline .definition-term{font-family:Fira Code,monospace;font-size:.8125rem;font-weight:500;color:#1a73e8;white-space:nowrap;min-width:120px}[data-theme=dark] .definition-list-inline .definition-term{color:#8ab4f8}.definition-list-inline .definition-description{padding-left:0}.definition-list-card{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.definition-list-card .definition-item{background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;padding:1rem}[data-theme=dark] .definition-list-card .definition-item{background:#292d31;border-color:#3c4043}.definition-list-card .definition-term{margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .definition-list-card .definition-term{border-bottom-color:#3c4043}.definition-list-card .definition-description{padding-left:0}.definition-description code{background:#f1f3f4;padding:.125rem .375rem;border-radius:4px;font-family:Fira Code,monospace;font-size:.8125rem;color:#d93025}[data-theme=dark] .definition-description code{background:#3c4043;color:#f28b82}:root{--c-blue: #0066CC;--c-blue-light: #3399FF;--c-blue-dark: #004C99;--c-bg-light: #FAFBFC;--c-bg-dark: #0D1117;--c-card-bg: #FFFFFF;--c-card-border: #E1E4E8;--c-text-primary: #24292F;--c-text-secondary: #57606A;--c-text-muted: #8B949E;--c-success: #2DA44E;--c-info: #0969DA;--c-warning: #BF8700;--c-error: #CF222E;--c-shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--c-shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--c-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--c-radius-sm: 6px;--c-radius-md: 10px;--c-radius-lg: 16px}[data-theme=dark]{--c-bg-light: #161B22;--c-card-bg: #21262D;--c-card-border: #30363D;--c-text-primary: #E6EDF3;--c-text-secondary: #8B949E;--c-text-muted: #6E7681}.c-intro-page{max-width:100%;padding:0}.c-hero-minimal{padding:0 0 2rem;margin-bottom:1.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .c-hero-minimal{border-bottom-color:#3c4043}.c-hero-title{font-size:2rem;font-weight:400;line-height:1.3;color:#202124;margin:0 0 .75rem}[data-theme=dark] .c-hero-title{color:#e8eaed}.c-hero-title .highlight{color:#1a73e8}[data-theme=dark] .c-hero-title .highlight{color:#8ab4f8}.c-hero-description{font-size:1rem;line-height:1.6;color:#5f6368;margin:0;max-width:600px}[data-theme=dark] .c-hero-description{color:#9aa0a6}.feature-card{background:#fff;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem;transition:box-shadow .2s ease}.feature-card:hover{box-shadow:0 4px 12px #0000001a}.feature-icon{font-size:1.5rem;color:#1a73e8;margin-bottom:.75rem}[data-theme=dark] .feature-icon{color:#8ab4f8}.commands-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem;margin:1.5rem 0}.command-card{background:#fff;border:1px solid #e8eaed;border-radius:8px;padding:1rem}[data-theme=dark] .command-card{background:#292d31;border-color:#3c4043}.command-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.command-icon{color:#1a73e8;font-size:1.125rem}[data-theme=dark] .command-icon{color:#8ab4f8}.table-icon{vertical-align:middle;margin-right:.5rem}.check-icon{color:#1e8e3e;vertical-align:middle;margin-right:.25rem}.data-type-table{overflow-x:auto;margin:1.5rem 0}.data-type-table table{width:100%;border-collapse:collapse;font-size:.9375rem}.data-type-table th,.data-type-table td{padding:.75rem 1rem;text-align:left;border:1px solid #e8eaed}[data-theme=dark] .data-type-table th,[data-theme=dark] .data-type-table td{border-color:#3c4043}.data-type-table th{background:#f8f9fa;font-weight:600;color:#202124}[data-theme=dark] .data-type-table th{background:#2d2d2d;color:#e8eaed}.data-type-table td{background:#fff;color:#3c4043}[data-theme=dark] .data-type-table td{background:#1f1f1f;color:#bdc1c6}.data-type-table tr:hover td{background:#f8f9fa}[data-theme=dark] .data-type-table tr:hover td{background:#2d2d2d}.data-type-table code{background:#e8f0fe;color:#1a73e8;padding:.125rem .375rem;border-radius:4px;font-size:.875rem}[data-theme=dark] .data-type-table code{background:#1a3352;color:#8ab4f8}.comparison-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin:1.5rem 0}.comparison-card{border-radius:8px;overflow:hidden}.comparison-header{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;font-weight:600}.comparison-icon{font-size:1.25rem}.comparison-card.valid .comparison-header{background:#e6f4ea;color:#1e8e3e}.comparison-card.invalid .comparison-header{background:#fce8e6;color:#d93025}[data-theme=dark] .comparison-card.valid .comparison-header{background:#1e3a2c;color:#81c995}[data-theme=dark] .comparison-card.invalid .comparison-header{background:#3d2323;color:#f28b82}.comparison-card ul{margin:0;padding:1rem 1rem 1rem 2rem;background:#f8f9fa;list-style-type:disc}[data-theme=dark] .comparison-card ul{background:#1f1f1f}.comparison-card li{margin-bottom:.5rem;color:#3c4043;font-size:.9375rem}[data-theme=dark] .comparison-card li{color:#bdc1c6}.comparison-card li:last-child{margin-bottom:0}@media(max-width:768px){.comparison-grid{grid-template-columns:1fr}}.anatomy-line{display:flex;align-items:flex-start;gap:1rem;padding:.75rem;background:#f8f9fa;border-left:3px solid #1a73e8;margin-bottom:.5rem;border-radius:0 4px 4px 0}[data-theme=dark] .anatomy-line{background:#292d31;border-left-color:#8ab4f8}.anatomy-code{font-family:Fira Code,monospace;font-size:.875rem;color:#d93025;white-space:nowrap;min-width:200px}[data-theme=dark] .anatomy-code{color:#f28b82}.stage-icon-wrapper.source{background:#e8f0fe;color:#1a73e8}.memory-diagram{display:flex;flex-direction:column;gap:.25rem;max-width:400px;margin:1.5rem auto;font-family:Fira Code,monospace;font-size:.875rem}.memory-section{display:flex;align-items:stretch}.memory-address{width:80px;padding:.5rem;background:#e8eaed;text-align:right;color:#5f6368;border-radius:4px 0 0 4px}[data-theme=dark] .memory-address{background:#3c4043;color:#9aa0a6}.memory-content{flex:1;padding:.5rem 1rem;text-align:center;border:1px solid #e8eaed;border-left:none;border-radius:0 4px 4px 0}[data-theme=dark] .memory-content{border-color:#3c4043}.memory-section.stack .memory-content{background:#e8f0fe;color:#1a73e8}.memory-section.heap .memory-content{background:#e6f4ea;color:#1e8e3e}.memory-section.data .memory-content{background:#fef7e0;color:#f9ab00}.memory-section.code .memory-content{background:#fce8e6;color:#d93025}[data-theme=dark] .memory-section.stack .memory-content{background:#1a3352;color:#8ab4f8}[data-theme=dark] .memory-section.heap .memory-content{background:#1e3a2c;color:#81c995}[data-theme=dark] .memory-section.data .memory-content{background:#3d3523;color:#fdd663}[data-theme=dark] .memory-section.code .memory-content{background:#3d2323;color:#f28b82}@media(max-width:768px){.c-hero-title{font-size:1.75rem}.features-grid,.commands-grid{grid-template-columns:1fr}.workflow-visualization{flex-direction:column}.workflow-arrow{transform:rotate(90deg)}.anatomy-line{flex-direction:column;gap:.5rem}.anatomy-code{min-width:auto}}.code-block-wrapper{margin:1rem 0}.code-block-title{background:#e8eaed;padding:.5rem 1rem;border-radius:8px 8px 0 0;font-size:.8125rem;font-weight:500;color:#5f6368}[data-theme=dark] .code-block-title{background:#3c4043;color:#9aa0a6}.code-block{background:#1e1e1e;border-radius:8px;overflow:hidden}.code-block-title+.code-block{border-radius:0 0 8px 8px}.code-block-header{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background:#2d2d2d;border-bottom:1px solid #3c3c3c}.code-language{font-size:.6875rem;font-weight:600;color:gray;text-transform:uppercase;letter-spacing:.5px}.code-copy-btn{display:flex;align-items:center;gap:.375rem;padding:.25rem .625rem;background:transparent;border:1px solid #4a4a4a;border-radius:4px;font-size:.75rem;color:#a0a0a0;cursor:pointer;transition:all .15s ease}.code-copy-btn:hover{background:#3c3c3c;border-color:#5a5a5a;color:#e0e0e0}.code-copy-btn svg{font-size:.875rem}.code-content{display:flex;overflow-x:auto}.code-line-numbers{display:flex;flex-direction:column;padding:1rem 0;background:#252525;border-right:1px solid #3c3c3c;-webkit-user-select:none;user-select:none}.code-line-numbers span{padding:0 .75rem;font-family:Fira Code,Consolas,monospace;font-size:.8125rem;line-height:1.5;color:#606060;text-align:right}.code-block pre{margin:0;padding:1rem;overflow-x:auto;flex:1}.code-block pre.with-line-numbers{padding-left:.75rem}.code-block code{font-family:Fira Code,Consolas,Monaco,monospace;font-size:.8125rem;line-height:1.5;color:#d4d4d4;white-space:pre;background:transparent!important;padding:0!important;border-radius:0!important}.code-block code .keyword{color:#569cd6}.code-block code .string{color:#ce9178}.code-block code .comment{color:#6a9955}.code-block code .number{color:#b5cea8}.code-block code .function{color:#dcdcaa}.code-block code .type{color:#4ec9b0}.code-output{background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;margin-top:.5rem;overflow:hidden}[data-theme=dark] .code-output{background:#1f2327;border-color:#3c4043}.output-header{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#e8eaed;font-size:.75rem;font-weight:500;color:#5f6368}[data-theme=dark] .output-header{background:#292d31;color:#9aa0a6}.output-icon{color:#1e8e3e}[data-theme=dark] .output-icon{color:#81c995}.output-content{margin:0;padding:1rem;font-family:Fira Code,Consolas,monospace;font-size:.8125rem;line-height:1.5;color:#202124;white-space:pre-wrap;word-break:break-word}[data-theme=dark] .output-content{color:#e8eaed}@media(max-width:768px){.code-block code{font-size:.75rem}.code-copy-btn span{display:none}}.step-list{list-style:none;margin:1.5rem 0;padding:0}.step-marker{flex-shrink:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center}.step-number{width:32px;height:32px;background:#1a73e8;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600}.step-list-checked .step-marker{background:#e6f4ea;border-radius:50%}[data-theme=dark] .step-list-checked .step-marker{background:#1e3a2c}.step-check{color:#1e8e3e;font-size:1rem}[data-theme=dark] .step-check{color:#81c995}.step-content{flex:1;padding-top:.25rem}.step-title{margin:0 0 .375rem;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .step-title{color:#e8eaed}.step-description{font-size:.875rem;line-height:1.6;color:#5f6368}[data-theme=dark] .step-description{color:#9aa0a6}.step-description code{background:#f1f3f4;padding:.125rem .375rem;border-radius:4px;font-family:Fira Code,monospace;font-size:.8125rem;color:#d93025}[data-theme=dark] .step-description code{background:#3c4043;color:#f28b82}:root{--cpp-primary: #00599C;--cpp-primary-light: #659AD2;--cpp-primary-dark: #004C8C;--cpp-accent: #044F88;--cpp-bg-light: #FAFBFC;--cpp-bg-dark: #0D1117;--cpp-card-bg: #FFFFFF;--cpp-card-border: #E1E4E8;--cpp-text-primary: #24292F;--cpp-text-secondary: #57606A;--cpp-text-muted: #8B949E;--cpp-success: #2DA44E;--cpp-info: #0969DA;--cpp-warning: #BF8700;--cpp-error: #CF222E;--cpp-shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--cpp-shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--cpp-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--cpp-radius-sm: 6px;--cpp-radius-md: 10px;--cpp-radius-lg: 16px}[data-theme=dark]{--cpp-bg-light: #161B22;--cpp-card-bg: #21262D;--cpp-card-border: #30363D;--cpp-text-primary: #E6EDF3;--cpp-text-secondary: #8B949E;--cpp-text-muted: #6E7681}.cpp-intro-page{max-width:100%;padding:0}.cpp-hero-minimal{padding:0 0 2rem;margin-bottom:1.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .cpp-hero-minimal{border-bottom-color:#3c4043}.cpp-hero-title{font-size:2rem;font-weight:400;line-height:1.3;color:#202124;margin:0 0 .75rem}[data-theme=dark] .cpp-hero-title{color:#e8eaed}.cpp-hero-title .highlight{color:#00599c;background:linear-gradient(135deg,#00599c,#659ad2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=dark] .cpp-hero-title .highlight{background:linear-gradient(135deg,#659ad2,#8ab4f8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.cpp-hero-description{font-size:1rem;line-height:1.6;color:#5f6368;margin:0;max-width:600px}[data-theme=dark] .cpp-hero-description{color:#9aa0a6}.content-section code{background:#f1f3f4;padding:.125rem .375rem;border-radius:4px;font-family:Fira Code,Consolas,monospace;font-size:.875rem;color:#00599c}[data-theme=dark] .content-section code{background:#3c4043;color:#659ad2}.callout-box.callout-primary{background:#e8f0fe;border:1px solid #aecbfa}[data-theme=dark] .callout-box.callout-primary{background:#1a3352;border-color:#2a4a6d}.callout-box.callout-success{background:#e6f4ea;border:1px solid #a8dab5}[data-theme=dark] .callout-box.callout-success{background:#1e3a2c;border-color:#2d5940}.callout-box.callout-danger{background:#fce8e6;border:1px solid #f5c6cb}[data-theme=dark] .callout-box.callout-danger{background:#3d2323;border-color:#5c2a2a}.callout-icon{flex-shrink:0;font-size:1.25rem;color:#00599c}.callout-box.callout-warning .callout-icon{color:#f9ab00}.callout-box.callout-info .callout-icon{color:#00599c}.callout-box.callout-success .callout-icon{color:#1e8e3e}.callout-box.callout-danger .callout-icon{color:#d93025}.try-icon{color:#00599c;font-size:1.125rem}[data-theme=dark] .try-icon{color:#659ad2}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.25rem;margin:1.5rem 0}.feature-card{background:#fff;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem;transition:box-shadow .2s ease,transform .2s ease}[data-theme=dark] .feature-card{background:#292d31;border-color:#3c4043}.feature-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.feature-icon{font-size:1.5rem;color:#00599c;margin-bottom:.75rem}[data-theme=dark] .feature-icon{color:#659ad2}.feature-card h4{margin:0 0 .5rem;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .feature-card h4{color:#e8eaed}.feature-card p{margin:0;font-size:.875rem;line-height:1.5;color:#5f6368}[data-theme=dark] .feature-card p{color:#9aa0a6}.path-number{flex-shrink:0;width:32px;height:32px;background:linear-gradient(135deg,#00599c,#659ad2);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600}[data-theme=dark] .path-number{background:linear-gradient(135deg,#659ad2,#8ab4f8);color:#202124}.code-anatomy{margin:1.5rem 0}.anatomy-line{display:flex;align-items:flex-start;gap:1rem;padding:.75rem;background:#f8f9fa;border-left:3px solid #00599C;margin-bottom:.5rem;border-radius:0 4px 4px 0}[data-theme=dark] .anatomy-line{background:#292d31;border-left-color:#659ad2}.anatomy-code{font-family:Fira Code,monospace;font-size:.875rem;color:#00599c;white-space:nowrap;min-width:220px}[data-theme=dark] .anatomy-code{color:#659ad2}.anatomy-explanation{font-size:.875rem;color:#5f6368;line-height:1.5}[data-theme=dark] .anatomy-explanation{color:#9aa0a6}.workflow-visualization{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:1rem;padding:2rem 1rem;margin:1.5rem 0;background:#f8f9fa;border-radius:8px}[data-theme=dark] .workflow-visualization{background:#292d31}.workflow-stage{text-align:center;padding:1rem;min-width:120px}.stage-icon-wrapper{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto .75rem;font-size:1.25rem}.stage-icon-wrapper.source{background:#e8f0fe;color:#00599c}.stage-icon-wrapper.preprocess{background:#fef7e0;color:#f9ab00}.stage-icon-wrapper.compile{background:#e6f4ea;color:#1e8e3e}.stage-icon-wrapper.link{background:#fce8e6;color:#d93025}.stage-icon-wrapper.execute{background:#f3e8fd;color:#9334e9}[data-theme=dark] .stage-icon-wrapper.source{background:#1a3352}[data-theme=dark] .stage-icon-wrapper.preprocess{background:#3d3523}[data-theme=dark] .stage-icon-wrapper.compile{background:#1e3a2c}[data-theme=dark] .stage-icon-wrapper.link{background:#3d2323}[data-theme=dark] .stage-icon-wrapper.execute{background:#2d1f3d}.workflow-stage h4{margin:0 0 .25rem;font-size:.875rem;font-weight:500;color:#202124}[data-theme=dark] .workflow-stage h4{color:#e8eaed}.workflow-stage p{margin:0;font-size:.75rem;color:#5f6368}[data-theme=dark] .workflow-stage p{color:#9aa0a6}.stage-tag{display:inline-block;padding:.125rem .5rem;background:#e8eaed;border-radius:4px;font-size:.6875rem;color:#5f6368;margin-top:.5rem}[data-theme=dark] .stage-tag{background:#3c4043;color:#9aa0a6}.workflow-arrow{display:flex;flex-direction:column;align-items:center;gap:.25rem;color:#5f6368}[data-theme=dark] .workflow-arrow{color:#9aa0a6}.arrow-label{font-size:.6875rem;white-space:nowrap}.arrow-icon{font-size:1rem}.comparison-table-wrapper{overflow-x:auto;margin:1.5rem 0}.comparison-table{width:100%;border-collapse:collapse;font-size:.875rem}.comparison-table th,.comparison-table td{padding:.75rem 1rem;text-align:left;border-bottom:1px solid #e8eaed}[data-theme=dark] .comparison-table th,[data-theme=dark] .comparison-table td{border-bottom-color:#3c4043}.comparison-table th{background:#f8f9fa;font-weight:500;color:#202124}[data-theme=dark] .comparison-table th{background:#292d31;color:#e8eaed}.comparison-table td{color:#3c4043}[data-theme=dark] .comparison-table td{color:#bdc1c6}.comparison-table .highlight-col{background:#e8f0fe}[data-theme=dark] .comparison-table .highlight-col{background:#1a3352}.vs-container{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;margin:1.5rem 0;align-items:start}.vs-box{background:#f8f9fa;border-radius:8px;padding:1.25rem;border:1px solid #e8eaed}[data-theme=dark] .vs-box{background:#292d31;border-color:#3c4043}.vs-box h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#00599c}[data-theme=dark] .vs-box h4{color:#659ad2}.vs-box ul{margin:0;padding-left:1.25rem}.vs-box li{margin-bottom:.5rem;font-size:.875rem;color:#3c4043}[data-theme=dark] .vs-box li{color:#bdc1c6}.vs-divider{display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:700;color:#5f6368;padding-top:2rem}[data-theme=dark] .vs-divider{color:#9aa0a6}@media(max-width:768px){.vs-container{grid-template-columns:1fr}.vs-divider{padding:0;transform:rotate(90deg)}}@media(max-width:768px){.cpp-hero-title{font-size:1.75rem}.features-grid{grid-template-columns:1fr}.workflow-visualization{flex-direction:column}.workflow-arrow{transform:rotate(90deg)}.anatomy-line{flex-direction:column;gap:.5rem}.anatomy-code{min-width:auto}}:root{--git-orange: #F05032;--git-orange-light: #FF6B4A;--git-orange-dark: #D73A28;--git-bg-light: #FAFBFC;--git-bg-dark: #0D1117;--git-card-bg: #FFFFFF;--git-card-border: #E1E4E8;--git-text-primary: #24292F;--git-text-secondary: #57606A;--git-text-muted: #8B949E;--git-success: #2DA44E;--git-info: #0969DA;--git-warning: #BF8700;--git-shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--git-shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--git-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--git-radius-sm: 6px;--git-radius-md: 10px;--git-radius-lg: 16px}[data-theme=dark]{--git-bg-light: #161B22;--git-card-bg: #21262D;--git-card-border: #30363D;--git-text-primary: #E6EDF3;--git-text-secondary: #8B949E;--git-text-muted: #6E7681}.git-intro-page{max-width:100%;padding:0}.git-hero-minimal{padding:0 0 2rem;margin-bottom:1.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .git-hero-minimal{border-bottom-color:#3c4043}.git-hero-title{font-size:2rem;font-weight:400;line-height:1.3;color:#202124;margin:0 0 .75rem}[data-theme=dark] .git-hero-title{color:#e8eaed}.git-hero-title .highlight{color:#1a73e8}[data-theme=dark] .git-hero-title .highlight{color:#8ab4f8}.git-hero-description{font-size:1rem;line-height:1.6;color:#5f6368;margin:0;max-width:600px}[data-theme=dark] .git-hero-description{color:#9aa0a6}.section-icon{font-size:1.5rem;color:var(--git-orange)}.lead-text{font-size:1.2rem;line-height:1.8;color:var(--color-text);margin-bottom:2rem}.lead-text strong{color:var(--git-orange)}.creator-card{display:flex;align-items:flex-start;gap:1.5rem;padding:1.5rem;background:var(--color-surface);border:1px solid var(--git-card-border);border-radius:var(--git-radius-md);margin-bottom:2rem}.creator-avatar{flex-shrink:0;width:60px;height:60px;background:linear-gradient(135deg,#333,#222);border-radius:50%;display:flex;align-items:center;justify-content:center}.creator-icon{font-size:2rem;color:#fcc624}.creator-info h4{margin:0 0 .5rem;font-size:1.1rem;color:var(--color-text)}.creator-info p{margin:0;color:var(--git-text-secondary);line-height:1.6}.callout-content p{margin:0;color:#5f6368;font-size:.875rem;line-height:1.6}[data-theme=dark] .callout-content p{color:#9aa0a6}.external-link,.inline-link{color:#1a73e8;text-decoration:none;font-weight:500;transition:color .2s ease}.external-link{display:inline-flex;align-items:center;gap:.25rem}.external-link svg{font-size:.875em;opacity:.7}.external-link:hover,.inline-link:hover{color:#1557b0;text-decoration:underline}[data-theme=dark] .external-link,[data-theme=dark] .inline-link{color:#8ab4f8}[data-theme=dark] .external-link:hover,[data-theme=dark] .inline-link:hover{color:#aecbfa}.workflow-visualization{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:2.5rem 1rem;background:var(--color-surface);border:1px solid var(--git-card-border);border-radius:var(--git-radius-lg);margin:2rem 0;overflow-x:auto}.workflow-stage{flex:1;max-width:200px;text-align:center;padding:1.5rem 1rem}.stage-icon-wrapper{width:64px;height:64px;margin:0 auto 1rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.75rem}.stage-icon-wrapper.working{background:#0969da1a;color:var(--git-info)}.stage-icon-wrapper.staging{background:#bf87001a;color:var(--git-warning)}.stage-icon-wrapper.repository{background:#2da44e1a;color:var(--git-success)}.workflow-stage h4{margin:0 0 .5rem;font-size:1rem;color:var(--color-text)}.workflow-stage p{margin:0 0 .75rem;font-size:.875rem;color:var(--git-text-secondary);line-height:1.5}.stage-tag{display:inline-block;padding:.25rem .75rem;background:var(--color-background);border-radius:100px;font-size:.75rem;font-weight:600;color:var(--git-text-muted)}.workflow-arrow{display:flex;flex-direction:column;align-items:center;gap:.25rem;flex-shrink:0;padding:0 .5rem}.arrow-label{font-size:.7rem;font-family:Monaco,Menlo,Consolas,monospace;color:var(--git-orange);white-space:nowrap}.arrow-icon{font-size:1.25rem;color:var(--git-text-muted)}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin:2rem 0}.feature-card{padding:1.5rem;background:var(--color-surface);border:1px solid var(--git-card-border);border-radius:var(--git-radius-md);transition:all .2s ease}.feature-card:hover{border-color:var(--git-orange);box-shadow:var(--git-shadow-md);transform:translateY(-2px)}.feature-icon-wrapper{width:48px;height:48px;border-radius:var(--git-radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:1rem}.feature-icon-wrapper.distributed{background:#0969da1a;color:var(--git-info)}.feature-icon-wrapper.fast{background:#f050321a;color:var(--git-orange)}.feature-icon-wrapper.branching{background:#2da44e1a;color:var(--git-success)}.feature-icon-wrapper.secure{background:#8250df1a;color:#8250df}.feature-icon-wrapper.staging-feature{background:#bf87001a;color:var(--git-warning)}.feature-icon-wrapper.free{background:#db3d731a;color:#db3d73}.feature-card h4{margin:0 0 .5rem;font-size:1.1rem;color:var(--color-text)}.feature-card p{margin:0;font-size:.95rem;line-height:1.6;color:var(--git-text-secondary)}.comparison-table-wrapper{overflow-x:auto;margin:2rem 0;border-radius:var(--git-radius-md);border:1px solid var(--git-card-border)}.comparison-table{width:100%;border-collapse:collapse;background:var(--color-surface)}.comparison-table th,.comparison-table td{padding:1rem 1.25rem;text-align:left;border-bottom:1px solid var(--git-card-border)}.comparison-table th{background:var(--color-background);font-weight:600;color:var(--color-text);font-size:.95rem}.comparison-table .highlight-col{background:#f050320d}.comparison-table th.highlight-col{background:#f050321a;color:var(--git-orange)}.comparison-table td{color:var(--git-text-secondary);font-size:.95rem}.comparison-table .table-icon{margin-right:.5rem;vertical-align:middle}.comparison-table .check-icon{color:var(--git-success);margin-right:.5rem}.comparison-table tr:last-child td{border-bottom:none}.comparison-table tr:hover td{background:#f0503205}.commands-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:2rem 0}.command-card{background:#fff;border:1px solid #e8eaed;border-radius:8px;overflow:hidden}[data-theme=dark] .command-card{background:#292929;border-color:#3c4043}.command-header{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;background:#f8f9fa;border-bottom:1px solid #e8eaed}[data-theme=dark] .command-header{background:#1e1e1e;border-color:#3c4043}.command-icon{font-size:1.125rem;color:#5f6368}[data-theme=dark] .command-icon{color:#9aa0a6}.command-header h4{margin:0;font-size:.9375rem;font-weight:500;color:#202124}[data-theme=dark] .command-header h4{color:#e8eaed}.command-card .code-block-wrapper{border:none;border-radius:0;margin:0}.try-it-box{background:#e8f0fe;border:1px solid #d2e3fc;border-radius:8px;padding:1.5rem;margin:1.5rem 0}[data-theme=dark] .try-it-box{background:#1a3a5c;border-color:#2d4a6f}.try-icon{font-size:1.25rem;color:#1a73e8}.try-it-box>p{margin:0 0 1rem;color:#5f6368;font-size:.9375rem}[data-theme=dark] .try-it-box>p{color:#9aa0a6}.try-commands{display:flex;flex-direction:column;gap:.5rem}.try-command{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.625rem .875rem;background:#fff;border:1px solid #dadce0;border-radius:4px}[data-theme=dark] .try-command{background:#292929;border-color:#3c4043}.try-command code{font-family:Roboto Mono,Monaco,Menlo,Consolas,monospace;font-size:.8125rem;color:#37474f}[data-theme=dark] .try-command code{color:#e8eaed}.try-description{font-size:.8125rem;color:#5f6368}.platforms-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin:2rem 0}.platform-card{text-align:center;padding:2rem 1.5rem;background:var(--color-surface);border:1px solid var(--git-card-border);border-radius:var(--git-radius-md);transition:all .2s ease}.platform-card:hover{transform:translateY(-4px);box-shadow:var(--git-shadow-lg)}.platform-icon{font-size:3rem;margin-bottom:1rem}.platform-icon.github{color:var(--color-text)}.platform-icon.gitlab{color:#fc6d26}.platform-icon.bitbucket{color:#0052cc}.platform-card h4{margin:0 0 .5rem;font-size:1.1rem;color:var(--color-text)}.platform-card p{margin:0;font-size:.9rem;color:var(--git-text-secondary);line-height:1.5}.learning-path{display:flex;flex-direction:column;gap:1.5rem;margin:2rem 0}.path-item{display:flex;gap:1.5rem;padding:1.5rem;background:var(--color-surface);border:1px solid var(--git-card-border);border-radius:var(--git-radius-md);transition:all .2s ease}.path-item:hover{border-color:#1a73e8;box-shadow:var(--git-shadow-sm)}[data-theme=dark] .path-item:hover{border-color:#8ab4f8}.path-number{flex-shrink:0;width:40px;height:40px;background:#1a73e8;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.1rem;font-weight:700}.path-content h4{display:flex;align-items:center;gap:.5rem;margin:0 0 .75rem;font-size:1.1rem;color:var(--color-text)}.path-content h4 svg{color:var(--git-orange)}.path-content ul{margin:0;padding-left:1.25rem;list-style-type:disc}.path-content li{margin-bottom:.35rem;font-size:.95rem;color:var(--git-text-secondary);line-height:1.5}@media(max-width:1024px){.git-hero-minimal{padding:0 0 1.5rem}}@media(max-width:768px){.git-hero-title{font-size:1.75rem}.git-hero-description{font-size:.95rem}.workflow-visualization{flex-direction:column;gap:1rem;padding:1.5rem}.workflow-arrow{transform:rotate(90deg);padding:.5rem 0}.workflow-stage{max-width:100%}.content-section h2{font-size:1.25rem}.features-grid,.commands-grid,.platforms-grid{grid-template-columns:1fr}.path-item{flex-direction:column;align-items:flex-start}.creator-card{flex-direction:column;text-align:center}.creator-avatar{margin:0 auto}.callout-box{flex-direction:column;text-align:center}.try-command{flex-direction:column;align-items:flex-start;gap:.5rem}}@media(max-width:480px){.git-hero-title{font-size:1.5rem}.content-section h2{font-size:1.15rem}.comparison-table th,.comparison-table td{padding:.75rem;font-size:.85rem}}.git-cheat-wrapper{max-width:1200px}.git-cheat-section{margin-bottom:1rem}.git-cheat-title{display:flex;align-items:center;gap:.75rem;font-size:1.25rem;font-weight:600;color:var(--git-text-primary);margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:2px solid var(--git-orange)}.git-cheat-icon{color:var(--git-orange);font-size:1.5rem}.git-cheat-list{display:flex;flex-direction:column;gap:.5rem}.git-cheat-item{display:grid;grid-template-columns:1fr auto;gap:1rem;padding:.75rem 1rem;background:var(--git-bg-light);border-radius:var(--git-radius-sm);transition:background .2s ease}[data-theme=dark] .git-cheat-item{background:#ffffff0d}.git-cheat-item:hover{background:#f050320d}[data-theme=dark] .git-cheat-item:hover{background:#f050321a}.git-cheat-command{display:flex;align-items:center;gap:.75rem}.git-cheat-command code{font-family:Fira Code,Monaco,Consolas,monospace;font-size:.875rem;color:var(--git-orange);background:transparent;padding:0;word-break:break-all}.git-cheat-copy{display:flex;align-items:center;justify-content:center;padding:.35rem;background:transparent;border:1px solid var(--git-card-border);border-radius:var(--git-radius-sm);color:var(--git-text-muted);cursor:pointer;transition:all .2s ease;opacity:0}.git-cheat-item:hover .git-cheat-copy{opacity:1}.git-cheat-copy:hover{background:var(--git-orange);border-color:var(--git-orange);color:#fff}.git-cheat-description{font-size:.875rem;color:var(--git-text-secondary);text-align:right;white-space:nowrap}.git-steps-list{counter-reset:steps;list-style:none;padding:0;margin:1.5rem 0}.git-steps-list li{counter-increment:steps;display:flex;align-items:flex-start;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--git-card-border)}.git-steps-list li:last-child{border-bottom:none}.git-steps-list li:before{content:counter(steps);display:flex;align-items:center;justify-content:center;min-width:28px;height:28px;background:var(--git-orange);color:#fff;font-size:.875rem;font-weight:600;border-radius:50%}.git-conclusion-card{background:linear-gradient(135deg,#f050321a,#f050320d);border:1px solid rgba(240,80,50,.2);text-align:center}.git-conclusion-card h3{font-size:2rem;margin-bottom:1rem}.git-next-steps{margin-top:2rem;text-align:left}.git-next-steps h4{font-size:1.1rem;color:var(--git-text-primary);margin-bottom:1rem}@media(max-width:768px){.git-cheat-item{grid-template-columns:1fr;gap:.5rem}.git-cheat-description{text-align:left;white-space:normal}.git-cheat-copy{opacity:1}}.status-example-box{border-radius:var(--git-radius-md);margin-bottom:1rem;overflow:hidden;border:1px solid var(--git-card-border);background:var(--git-card-bg)}.status-example-header{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;border-bottom:1px solid var(--git-card-border)}.status-example-header h4{margin:0;font-size:.95rem;font-weight:600;color:var(--git-text-primary)}.status-indicator{width:10px;height:10px;border-radius:50%;flex-shrink:0}.status-indicator.status-green{background-color:#2da44e;box-shadow:0 0 8px #2da44e66}.status-indicator.status-red{background-color:#cf222e;box-shadow:0 0 8px #cf222e66}.status-example-content{padding:1rem}.status-example-output{font-family:SF Mono,Fira Code,Consolas,monospace;font-size:.85rem;line-height:1.6;margin:0 0 1rem;padding:.875rem 1rem;border-radius:var(--git-radius-sm);overflow-x:auto;white-space:pre}.status-staged .status-example-output{background:#2da44e14;color:#1a7f37;border-left:3px solid #2da44e}.status-unstaged .status-example-output,.status-untracked .status-example-output{background:#cf222e14;color:#cf222e;border-left:3px solid #cf222e}.status-example-desc{margin:0;font-size:.9rem;color:var(--git-text-secondary);line-height:1.6}.status-example-desc code{background:#1a73e81a;color:#1a73e8;padding:.15em .4em;border-radius:4px;font-size:.85em}[data-theme=dark] .status-staged .status-example-output{background:#2da44e26;color:#3fb950}[data-theme=dark] .status-unstaged .status-example-output,[data-theme=dark] .status-untracked .status-example-output{background:#cf222e26;color:#f85149}[data-theme=dark] .status-example-desc code{background:#8ab4f826;color:#8ab4f8}@media(max-width:768px){.status-example-box{margin-bottom:.875rem}.status-example-header{padding:.75rem}.status-example-content{padding:.875rem}.status-example-output{font-size:.8rem;padding:.75rem}}.step-list{display:flex;flex-direction:column;gap:0;margin:1.5rem 0}.step-item{display:flex;gap:1rem;position:relative}.step-indicator{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:36px}.step-number{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:linear-gradient(135deg,#1a73e8,#1557b0);color:#fff;font-weight:600;font-size:.95rem;border-radius:50%;box-shadow:0 2px 8px #1a73e840;position:relative;z-index:1}.step-check{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:linear-gradient(135deg,#34a853,#2d8f47);color:#fff;font-size:1.1rem;border-radius:50%;box-shadow:0 2px 8px #34a85340;position:relative;z-index:1}.step-connector{width:2px;flex:1;min-height:20px;background:linear-gradient(180deg,#1a73e8,#1a73e833);margin-top:4px}.step-content{flex:1;padding-bottom:1.5rem}.step-title{font-size:1.05rem;font-weight:600;color:var(--color-text);margin:0 0 .5rem;padding-top:.35rem;line-height:1.4}.step-body{font-size:.95rem;color:var(--color-textSecondary);line-height:1.7}.step-body p{margin:0 0 .75rem}.step-body p:last-child{margin-bottom:0}.step-body ul{margin:.5rem 0;padding-left:1.25rem}.step-body li{margin-bottom:.5rem;color:var(--color-text)}.step-body li:last-child{margin-bottom:0}.step-body code{background:#1a73e814;color:#1a73e8;padding:.15rem .4rem;border-radius:4px;font-family:Roboto Mono,Monaco,monospace;font-size:.875em}.step-body strong{color:var(--color-text);font-weight:600}.step-body a{color:#1a73e8;text-decoration:none;font-weight:500}.step-body a:hover{text-decoration:underline}.step-item:last-child .step-content{padding-bottom:0}[data-theme=dark] .step-number{background:linear-gradient(135deg,#8ab4f8,#669df6);color:#202124;box-shadow:0 2px 8px #8ab4f840}[data-theme=dark] .step-check{background:linear-gradient(135deg,#81c995,#5bb974);color:#202124;box-shadow:0 2px 8px #81c99540}[data-theme=dark] .step-connector{background:linear-gradient(180deg,#8ab4f8,#8ab4f833)}[data-theme=dark] .step-body code{background:#8ab4f81f;color:#8ab4f8}[data-theme=dark] .step-body a{color:#8ab4f8}@media(max-width:768px){.step-indicator{width:32px}.step-number,.step-check{width:32px;height:32px;font-size:.875rem}.step-title{font-size:1rem;padding-top:.25rem}.step-body{font-size:.9rem}.step-content{padding-bottom:1.25rem}}@media(max-width:480px){.step-list{margin:1rem 0}.step-item{gap:.75rem}.step-indicator{width:28px}.step-number,.step-check{width:28px;height:28px;font-size:.8rem}.step-title{font-size:.95rem}.step-body{font-size:.875rem}.step-content{padding-bottom:1rem}}.method-card{position:relative;background:var(--color-background);border-radius:8px;margin-bottom:1rem;padding:1.25rem;border-left:3px solid #dadce0;transition:all .2s ease}.method-card:hover{background:#1a73e80a;border-left-color:#1a73e8}.method-card-recommended{border-left-color:#1a73e8;background:#1a73e80a}.method-card-recommended:hover{background:#1a73e814}.method-card-easiest{border-left-color:#34a853;background:#34a8530a}.method-card-easiest:hover{background:#34a85314}.method-header{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.875rem;flex-wrap:wrap}.method-number{font-size:.75rem;font-weight:500;color:#5f6368;text-transform:uppercase;letter-spacing:.25px}.method-title{flex:1;margin:0;font-size:1rem;font-weight:500;color:var(--color-text)}.method-tag{font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.5px;padding:.2rem .5rem;border-radius:3px;margin-left:auto}.method-tag-recommended{background:#e8f0fe;color:#1967d2}.method-tag-easiest{background:#e6f4ea;color:#1e8e3e}.method-tag-alternative{background:#f1f3f4;color:#5f6368}.method-content{padding-left:0}.method-content p{margin:0 0 .625rem;color:#5f6368;font-size:.9375rem;line-height:1.6}.method-content p:last-child{margin-bottom:0}.method-content code{background:#1a73e814;color:#1a73e8;padding:.125rem .375rem;border-radius:4px;font-family:Roboto Mono,Monaco,monospace;font-size:.8125rem}.method-content a{color:#1a73e8;text-decoration:none;font-weight:500}.method-content a:hover{text-decoration:underline}.method-content .code-block-wrapper{margin:.625rem 0 0}.method-content .code-block-wrapper:last-child{margin-bottom:0}[data-theme=dark] .method-card{background:var(--color-background);border-left-color:#5f6368}[data-theme=dark] .method-card:hover{background:#8ab4f814;border-left-color:#8ab4f8}[data-theme=dark] .method-card-recommended{border-left-color:#8ab4f8;background:#8ab4f814}[data-theme=dark] .method-card-recommended:hover{background:#8ab4f81f}[data-theme=dark] .method-card-easiest{border-left-color:#81c995;background:#81c99514}[data-theme=dark] .method-card-easiest:hover{background:#81c9951f}[data-theme=dark] .method-number{color:#9aa0a6}[data-theme=dark] .method-tag-recommended{background:#8ab4f826;color:#8ab4f8}[data-theme=dark] .method-tag-easiest{background:#81c99526;color:#81c995}[data-theme=dark] .method-tag-alternative{background:#9aa0a626;color:#9aa0a6}[data-theme=dark] .method-content p{color:#9aa0a6}[data-theme=dark] .method-content code{background:#8ab4f81f;color:#8ab4f8}[data-theme=dark] .method-content a{color:#8ab4f8}@media(max-width:768px){.method-card{padding:1rem;margin-bottom:.875rem}.method-header{gap:.375rem;margin-bottom:.75rem}.method-number{font-size:.7rem}.method-title{font-size:.9375rem}.method-tag{font-size:.625rem}.method-content p{font-size:.875rem}}@media(max-width:480px){.method-card{padding:.875rem;border-radius:6px}.method-header{flex-direction:column;align-items:flex-start;gap:.25rem}.method-tag{margin-left:0;margin-top:.25rem}}.troubleshoot-item{margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border)}.troubleshoot-item:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.troubleshoot-problem{display:flex;align-items:flex-start;gap:.625rem;margin-bottom:.75rem}.troubleshoot-icon{flex-shrink:0;font-size:1.125rem;color:#ea4335;margin-top:.125rem}.troubleshoot-problem-text{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}.troubleshoot-error{font-family:Roboto Mono,Monaco,Menlo,monospace;font-size:.9rem;font-weight:500;color:#d93025;background:#ea433514;padding:.25rem .5rem;border-radius:4px;word-break:break-word}.troubleshoot-platform{font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.3px;padding:.15rem .5rem;border-radius:3px;background:#f1f3f4;color:#5f6368}.platform-windows{background:#0078d61a;color:#0078d6}.platform-macos{background:#00000014;color:#333}.platform-linux{background:#fcc62426;color:#9a6700}.platform-all{background:#1a73e81a;color:#1a73e8}.troubleshoot-solution{padding-left:1.75rem;color:#5f6368;font-size:.9375rem;line-height:1.6}.troubleshoot-solution p{margin:0 0 .5rem}.troubleshoot-solution p:last-child{margin-bottom:0}.troubleshoot-solution strong{color:var(--color-text);font-weight:500}.troubleshoot-solution a{color:#1a73e8;text-decoration:none;font-weight:500}.troubleshoot-solution a:hover{text-decoration:underline}.troubleshoot-solution code{background:#1a73e814;color:#1a73e8;padding:.125rem .375rem;border-radius:4px;font-family:Roboto Mono,Monaco,monospace;font-size:.8125rem}.troubleshoot-solution .code-block-wrapper{margin:.625rem 0 0}[data-theme=dark] .troubleshoot-icon{color:#f28b82}[data-theme=dark] .troubleshoot-error{color:#f28b82;background:#f28b821f}[data-theme=dark] .troubleshoot-platform{background:#9aa0a626;color:#9aa0a6}[data-theme=dark] .platform-windows{background:#8ab4f826;color:#8ab4f8}[data-theme=dark] .platform-macos{background:#e8eaed1f;color:#e8eaed}[data-theme=dark] .platform-linux{background:#fdd66326;color:#fdd663}[data-theme=dark] .platform-all{background:#8ab4f826;color:#8ab4f8}[data-theme=dark] .troubleshoot-solution{color:#9aa0a6}[data-theme=dark] .troubleshoot-solution a{color:#8ab4f8}[data-theme=dark] .troubleshoot-solution code{background:#8ab4f81f;color:#8ab4f8}@media(max-width:768px){.troubleshoot-item{margin-bottom:1.25rem;padding-bottom:1.25rem}.troubleshoot-error{font-size:.8125rem}.troubleshoot-solution{padding-left:1.625rem;font-size:.875rem}}@media(max-width:480px){.troubleshoot-problem{flex-direction:column;gap:.5rem}.troubleshoot-icon{display:none}.troubleshoot-solution{padding-left:0}.troubleshoot-error{font-size:.8rem;display:block;width:fit-content}}.definition-list-default .definition-item{display:flex;align-items:baseline;gap:.5rem;padding:.625rem 0;border-bottom:1px solid var(--color-border)}.definition-list-inline .definition-term{font-weight:600;color:var(--color-text);font-size:.9375rem}.definition-list-card .definition-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1rem;transition:border-color .2s ease}[data-theme=dark] .definition-list-card .definition-item{background:var(--color-surface)}:root{--pattern-blue: #1a73e8;--pattern-blue-light: #8ab4f8;--pattern-blue-dark: #1557b0;--pattern-creational: #1565c0;--pattern-structural: #2e7d32;--pattern-behavioral: #ef6c00;--pattern-bg-light: #FAFBFC;--pattern-bg-dark: #0D1117;--pattern-card-bg: #FFFFFF;--pattern-card-border: #E1E4E8;--pattern-text-primary: #24292F;--pattern-text-secondary: #57606A;--pattern-success: #2DA44E;--pattern-info: #0969DA;--pattern-warning: #BF8700;--pattern-shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--pattern-shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--pattern-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--pattern-radius-sm: 6px;--pattern-radius-md: 10px;--pattern-radius-lg: 16px}[data-theme=dark]{--pattern-bg-light: #161B22;--pattern-card-bg: #21262D;--pattern-card-border: #30363D;--pattern-text-primary: #E6EDF3;--pattern-text-secondary: #8B949E}.pattern-intro-page{max-width:100%;padding:0}.pattern-hero-minimal{padding:0 0 2rem;margin-bottom:1.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .pattern-hero-minimal{border-bottom-color:#3c4043}.pattern-hero-title{font-size:2rem;font-weight:400;line-height:1.3;color:#202124;margin:0 0 .75rem}[data-theme=dark] .pattern-hero-title{color:#e8eaed}.pattern-hero-title .highlight{color:#1a73e8}[data-theme=dark] .pattern-hero-title .highlight{color:#8ab4f8}.pattern-hero-description{font-size:1rem;line-height:1.6;color:#5f6368;margin:0;max-width:650px}[data-theme=dark] .pattern-hero-description{color:#9aa0a6}.content-section{margin-bottom:3rem}.content-section h2{font-size:1.5rem;font-weight:400;color:#202124;margin:0 0 1rem;padding-bottom:.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .content-section h2{color:#e8eaed;border-bottom-color:#3c4043}.content-section h3{font-size:1.125rem;font-weight:500;color:#202124;margin:1.5rem 0 .75rem}[data-theme=dark] .content-section h3{color:#e8eaed}.content-section p{font-size:1rem;line-height:1.7;color:#3c4043;margin:0 0 1rem}[data-theme=dark] .content-section p{color:#bdc1c6}.content-section ul,.content-section ol{margin:.5rem 0 1rem 1.5rem;padding:0}.content-section li{font-size:1rem;line-height:1.7;color:#3c4043;margin-bottom:.5rem}[data-theme=dark] .content-section li{color:#bdc1c6}.content-section code{background:#f1f3f4;padding:.125rem .375rem;border-radius:4px;font-family:Fira Code,Consolas,monospace;font-size:.875rem;color:#d93025}[data-theme=dark] .content-section code{background:#3c4043;color:#f28b82}.callout-box{display:flex;gap:.875rem;padding:1rem 1.25rem;border-radius:8px;margin:1.25rem 0}.callout-box.callout-primary{background:#fef7e0;border:1px solid #f9e39c}[data-theme=dark] .callout-box.callout-primary{background:#3d3523;border-color:#5c4b2a}.callout-box.callout-warning{background:#fef7e0;border:1px solid #f9e39c}[data-theme=dark] .callout-box.callout-warning{background:#3d3523;border-color:#5c4b2a}.callout-box.callout-info{background:#e8f0fe;border:1px solid #aecbfa}[data-theme=dark] .callout-box.callout-info{background:#1a3352;border-color:#2a4a6d}.callout-icon{flex-shrink:0;font-size:1.25rem;color:#f9ab00}.callout-box.callout-info .callout-icon{color:#1a73e8}[data-theme=dark] .callout-box.callout-info .callout-icon{color:#8ab4f8}.callout-content h4{margin:0 0 .375rem;font-size:.9375rem;font-weight:500;color:#202124}[data-theme=dark] .callout-content h4{color:#e8eaed}.callout-content p{margin:0;font-size:.875rem;line-height:1.5;color:#3c4043}[data-theme=dark] .callout-content p{color:#bdc1c6}.callout-content .prereq-list{margin:.5rem 0 0 1rem;padding:0}.callout-content .prereq-list li{font-size:.875rem;margin-bottom:.375rem;color:#3c4043}[data-theme=dark] .callout-content .prereq-list li{color:#bdc1c6}.pattern-categories-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:1.5rem 0}.pattern-category-card{background:#fff;border:2px solid #e8eaed;border-radius:12px;padding:1.5rem;position:relative;transition:all .2s ease}[data-theme=dark] .pattern-category-card{background:#292d31;border-color:#3c4043}.pattern-category-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000001f}.pattern-category-card.creational{border-top:4px solid #1565c0}.pattern-category-card.structural{border-top:4px solid #2e7d32}.pattern-category-card.behavioral{border-top:4px solid #ef6c00}.category-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:1rem}.pattern-category-card.creational .category-icon{background:#e3f2fd;color:#1565c0}.pattern-category-card.structural .category-icon{background:#e8f5e9;color:#2e7d32}.pattern-category-card.behavioral .category-icon{background:#fff3e0;color:#ef6c00}[data-theme=dark] .pattern-category-card.creational .category-icon{background:#1a3352;color:#8ab4f8}[data-theme=dark] .pattern-category-card.structural .category-icon{background:#1b3d2e;color:#81c784}[data-theme=dark] .pattern-category-card.behavioral .category-icon{background:#3d2e1a;color:#ffb74d}.pattern-category-card h3{margin:0 0 .75rem;font-size:1.125rem;font-weight:600;color:#202124}[data-theme=dark] .pattern-category-card h3{color:#e8eaed}.pattern-category-card>p{margin:0 0 1rem;font-size:.875rem;line-height:1.5;color:#5f6368}[data-theme=dark] .pattern-category-card>p{color:#9aa0a6}.category-patterns{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:.5rem}.category-patterns li{display:inline-block;padding:.25rem .625rem;background:#f8f9fa;border-radius:4px;font-size:.75rem;color:#5f6368;margin:0}[data-theme=dark] .category-patterns li{background:#3c4043;color:#9aa0a6}.category-badge{position:absolute;top:1rem;right:1rem;padding:.25rem .625rem;border-radius:1rem;font-size:.6875rem;font-weight:600}.pattern-category-card.creational .category-badge{background:#e3f2fd;color:#1565c0}.pattern-category-card.structural .category-badge{background:#e8f5e9;color:#2e7d32}.pattern-category-card.behavioral .category-badge{background:#fff3e0;color:#ef6c00}[data-theme=dark] .pattern-category-card.creational .category-badge{background:#1a3352;color:#8ab4f8}[data-theme=dark] .pattern-category-card.structural .category-badge{background:#1b3d2e;color:#81c784}[data-theme=dark] .pattern-category-card.behavioral .category-badge{background:#3d2e1a;color:#ffb74d}.benefits-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin:1.5rem 0}.benefit-card{background:#fff;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem;transition:box-shadow .2s ease}[data-theme=dark] .benefit-card{background:#292d31;border-color:#3c4043}.benefit-card:hover{box-shadow:0 4px 12px #0000001a}.benefit-icon{font-size:1.5rem;color:#1a73e8;margin-bottom:.75rem}[data-theme=dark] .benefit-icon{color:#8ab4f8}.benefit-card h4{margin:0 0 .5rem;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .benefit-card h4{color:#e8eaed}.benefit-card p{margin:0;font-size:.875rem;line-height:1.5;color:#5f6368}[data-theme=dark] .benefit-card p{color:#9aa0a6}.pattern-anatomy{margin:1.5rem 0}.anatomy-item{display:flex;gap:1rem;padding:1rem 0;border-bottom:1px solid #e8eaed}[data-theme=dark] .anatomy-item{border-bottom-color:#3c4043}.anatomy-item:last-child{border-bottom:none}.anatomy-number{flex-shrink:0;width:32px;height:32px;background:#1a73e8;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600}[data-theme=dark] .anatomy-number{background:#8ab4f8;color:#202124}.anatomy-content h4{margin:0 0 .25rem;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .anatomy-content h4{color:#e8eaed}.anatomy-content p{margin:0;font-size:.875rem;color:#5f6368}[data-theme=dark] .anatomy-content p{color:#9aa0a6}.solid-principles{display:flex;flex-direction:column;gap:.75rem;margin:1.5rem 0}.solid-card{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;background:#f8f9fa;border-radius:8px;border-left:4px solid #1a73e8}[data-theme=dark] .solid-card{background:#292d31;border-left-color:#8ab4f8}.solid-letter{flex-shrink:0;width:40px;height:40px;background:#1a73e8;color:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:700}[data-theme=dark] .solid-letter{background:#8ab4f8;color:#202124}.solid-content h4{margin:0 0 .25rem;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .solid-content h4{color:#e8eaed}.solid-content p{margin:0;font-size:.875rem;color:#5f6368}[data-theme=dark] .solid-content p{color:#9aa0a6}.real-world-examples{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.25rem;margin:1.5rem 0}.example-card{background:#fff;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem;transition:all .2s ease}[data-theme=dark] .example-card{background:#292d31;border-color:#3c4043}.example-card:hover{border-color:#1a73e8;box-shadow:0 4px 12px #00000014}[data-theme=dark] .example-card:hover{border-color:#8ab4f8}.example-icon{font-size:1.5rem;color:#1a73e8;margin-bottom:.75rem}[data-theme=dark] .example-icon{color:#8ab4f8}.example-card h4{margin:0 0 .5rem;font-size:.9375rem;font-weight:500;color:#202124}[data-theme=dark] .example-card h4{color:#e8eaed}.example-card p{margin:0;font-size:.8125rem;line-height:1.5;color:#5f6368}[data-theme=dark] .example-card p{color:#9aa0a6}.learning-path{margin:1.5rem 0}.path-item{display:flex;gap:1rem;padding:1.25rem 0;border-bottom:1px solid #e8eaed}[data-theme=dark] .path-item{border-bottom-color:#3c4043}.path-item:last-child{border-bottom:none}.path-number{flex-shrink:0;width:32px;height:32px;background:#1a73e8;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600}[data-theme=dark] .path-number{background:#8ab4f8;color:#202124}.path-content h4{margin:0 0 .5rem;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .path-content h4{color:#e8eaed}.path-content ul{margin:0;padding-left:1.25rem}.path-content li{font-size:.875rem;color:#5f6368;margin-bottom:.25rem}[data-theme=dark] .path-content li{color:#9aa0a6}.try-it-box{background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem;margin:1.5rem 0}[data-theme=dark] .try-it-box{background:#292d31;border-color:#3c4043}.try-it-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.try-icon{color:#1a73e8;font-size:1.125rem}[data-theme=dark] .try-icon{color:#8ab4f8}.try-it-header h4{margin:0;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .try-it-header h4{color:#e8eaed}.try-commands{display:flex;flex-direction:column;gap:.625rem}.try-command{display:flex;align-items:baseline;gap:.75rem;font-size:.875rem}.try-command code{background:#e8eaed;padding:.25rem .5rem;border-radius:4px;font-family:Fira Code,monospace;font-size:.8125rem;color:#202124;white-space:nowrap}[data-theme=dark] .try-command code{background:#3c4043;color:#e8eaed}.try-description{color:#5f6368;font-size:.875rem}[data-theme=dark] .try-description{color:#9aa0a6}@media(max-width:768px){.pattern-hero-title{font-size:1.75rem}.pattern-categories-grid,.benefits-grid,.real-world-examples{grid-template-columns:1fr}.anatomy-item,.path-item{flex-direction:column;gap:.75rem}.solid-card{flex-direction:column;text-align:center}}.pattern-badge-header{margin-bottom:.75rem}.pattern-category-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .875rem;border-radius:2rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.pattern-category-badge.creational{background:#e3f2fd;color:#1565c0}.pattern-category-badge.structural{background:#e8f5e9;color:#2e7d32}.pattern-category-badge.behavioral{background:#fff3e0;color:#ef6c00}[data-theme=dark] .pattern-category-badge.creational{background:#1a3352;color:#8ab4f8}[data-theme=dark] .pattern-category-badge.structural{background:#1b3d2e;color:#81c784}[data-theme=dark] .pattern-category-badge.behavioral{background:#3d2e1a;color:#ffb74d}.pattern-category-badge.architectural{background:#f3e5f5;color:#7b1fa2}.pattern-category-badge.lld{background:#fce4ec;color:#c2185b}.pattern-category-badge.practice{background:#e0f7fa;color:#00838f}[data-theme=dark] .pattern-category-badge.architectural{background:#2d1f33;color:#ce93d8}[data-theme=dark] .pattern-category-badge.lld{background:#332027;color:#f48fb1}[data-theme=dark] .pattern-category-badge.practice{background:#1a2f33;color:#80deea}.section-icon{vertical-align:middle;margin-right:.5rem;color:#1a73e8}[data-theme=dark] .section-icon{color:#8ab4f8}.problem-solution-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem;margin:1.5rem 0}.problem-card{background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem;border-left:4px solid #1a73e8}[data-theme=dark] .problem-card{background:#292d31;border-color:#3c4043;border-left-color:#8ab4f8}.problem-card h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#202124}[data-theme=dark] .problem-card h4{color:#e8eaed}.problem-card p{margin:0;font-size:.875rem;line-height:1.6;color:#5f6368}[data-theme=dark] .problem-card p{color:#9aa0a6}.solution-steps{margin:1.5rem 0}.step-item{display:flex;gap:1rem;padding:1rem 0;border-bottom:1px solid #e8eaed}[data-theme=dark] .step-item{border-bottom-color:#3c4043}.step-item:last-child{border-bottom:none}.step-number{flex-shrink:0;width:32px;height:32px;background:#1a73e8;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600}[data-theme=dark] .step-number{background:#8ab4f8;color:#202124}.step-content{flex:1;font-size:.9375rem;line-height:1.6;color:#3c4043;padding-top:.25rem}[data-theme=dark] .step-content{color:#bdc1c6}.step-content code{background:#f1f3f4;padding:.125rem .375rem;border-radius:4px;font-family:Fira Code,Consolas,monospace;font-size:.8125rem;color:#d93025}[data-theme=dark] .step-content code{background:#3c4043;color:#f28b82}.uml-diagram{display:flex;justify-content:center;padding:2rem;margin:1.5rem 0;background:#f8f9fa;border-radius:8px;overflow-x:auto}[data-theme=dark] .uml-diagram{background:#292d31}.uml-class{background:#fff;border:2px solid #1a73e8;border-radius:4px;min-width:250px;font-family:Fira Code,monospace;font-size:.8125rem}[data-theme=dark] .uml-class{background:#1f2327;border-color:#8ab4f8}.uml-class-name{background:#1a73e8;color:#fff;padding:.75rem 1rem;text-align:center;font-weight:600;font-size:.9375rem}[data-theme=dark] .uml-class-name{background:#8ab4f8;color:#202124}.uml-class-section{padding:.75rem 1rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .uml-class-section{border-bottom-color:#3c4043}.uml-class-section:last-child{border-bottom:none}.uml-attribute,.uml-method{padding:.25rem 0;color:#3c4043}[data-theme=dark] .uml-attribute,[data-theme=dark] .uml-method{color:#bdc1c6}.pattern-list{margin:1.5rem 0}.pattern-list-item{padding:1rem;margin-bottom:.75rem;background:#f8f9fa;border-radius:8px;border-left:4px solid #e8eaed;transition:border-color .2s ease}[data-theme=dark] .pattern-list-item{background:#292d31;border-left-color:#3c4043}.pattern-list-item:hover{border-left-color:#1a73e8}[data-theme=dark] .pattern-list-item:hover{border-left-color:#8ab4f8}.pattern-list-item h4{margin:0 0 .5rem;font-size:1rem;font-weight:600;color:#202124}[data-theme=dark] .pattern-list-item h4{color:#e8eaed}.pattern-list-item p{margin:0 0 .5rem;font-size:.875rem;color:#5f6368}[data-theme=dark] .pattern-list-item p{color:#9aa0a6}.pattern-list-item code{display:block;background:#e8eaed;padding:.5rem .75rem;border-radius:4px;font-family:Fira Code,monospace;font-size:.75rem;color:#5f6368}[data-theme=dark] .pattern-list-item code{background:#3c4043;color:#9aa0a6}.pattern-badge{display:inline-block;padding:.25rem .5rem;border-radius:4px;font-size:.6875rem;font-weight:600;text-transform:uppercase}.pattern-badge.creational{background:#e3f2fd;color:#1565c0}.pattern-badge.structural{background:#e8f5e9;color:#2e7d32}.pattern-badge.behavioral{background:#fff3e0;color:#ef6c00}[data-theme=dark] .pattern-badge.creational{background:#1a3352;color:#8ab4f8}[data-theme=dark] .pattern-badge.structural{background:#1b3d2e;color:#81c784}[data-theme=dark] .pattern-badge.behavioral{background:#3d2e1a;color:#ffb74d}.exercise-list{display:flex;flex-direction:column;gap:1rem;margin:1.5rem 0}.exercise-card{background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;padding:1rem 1.25rem}[data-theme=dark] .exercise-card{background:#292d31;border-color:#3c4043}.exercise-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem}.exercise-icon{color:#1a73e8}[data-theme=dark] .exercise-icon{color:#8ab4f8}.exercise-header h4{margin:0;flex:1;font-size:1rem;font-weight:600;color:#202124}[data-theme=dark] .exercise-header h4{color:#e8eaed}.difficulty-badge{padding:.25rem .625rem;border-radius:4px;font-size:.6875rem;font-weight:600;text-transform:uppercase;color:#fff}.exercise-card p{margin:0;font-size:.875rem;color:#5f6368;line-height:1.5}[data-theme=dark] .exercise-card p{color:#9aa0a6}.qa-list{display:flex;flex-direction:column;gap:1rem;margin:1.5rem 0}.qa-card{background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem}[data-theme=dark] .qa-card{background:#292d31;border-color:#3c4043}.question{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:.75rem}.qa-icon{flex-shrink:0;color:#1a73e8;margin-top:.125rem}[data-theme=dark] .qa-icon{color:#8ab4f8}.question strong{font-size:.9375rem;color:#202124;line-height:1.5}[data-theme=dark] .question strong{color:#e8eaed}.answer{font-size:.875rem;color:#5f6368;line-height:1.6;padding-left:1.75rem}[data-theme=dark] .answer{color:#9aa0a6}.answer strong{color:#1a73e8}[data-theme=dark] .answer strong{color:#8ab4f8}.cheat-table{overflow-x:auto;margin:1.5rem 0}.cheat-table table{width:100%;border-collapse:collapse;font-size:.875rem}.cheat-table th,.cheat-table td{padding:.75rem 1rem;text-align:left;border:1px solid #e8eaed}[data-theme=dark] .cheat-table th,[data-theme=dark] .cheat-table td{border-color:#3c4043}.cheat-table th{background:#1a73e8;color:#fff;font-weight:600}[data-theme=dark] .cheat-table th{background:#1a3352;color:#8ab4f8}.cheat-table td{background:#f8f9fa;color:#3c4043}[data-theme=dark] .cheat-table td{background:#1f2327;color:#bdc1c6}.cheat-table tbody tr:hover td{background:#e8f0fe}[data-theme=dark] .cheat-table tbody tr:hover td{background:#1a3352}.cheat-table td strong{color:#1a73e8}[data-theme=dark] .cheat-table td strong{color:#8ab4f8}@media(max-width:768px){.comparison-grid,.problem-solution-grid,.career-benefits,.related-patterns,.example-row{grid-template-columns:1fr}.example-row span:first-child{border-right:none;border-bottom:1px solid #e8eaed}[data-theme=dark] .example-row span:first-child{border-bottom-color:#3c4043}.exercise-header{flex-wrap:wrap}.exercise-header h4{flex:none;width:100%;order:-1;margin-bottom:.5rem}}.junit-intro-page{padding-bottom:2rem}.junit-hero-minimal{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border)}.junit-badge-header{margin-bottom:1rem}.junit-category-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .875rem;border-radius:1rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.junit-category-badge.testing,.junit-category-badge.basics{background:#e3f2fd;color:#1565c0}.junit-category-badge.advanced{background:#fff3e0;color:#ef6c00}.junit-category-badge.practice{background:#f3e5f5;color:#7b1fa2}[data-theme=dark] .junit-category-badge.testing,[data-theme=dark] .junit-category-badge.basics{background:#1a3352;color:#8ab4f8}[data-theme=dark] .junit-category-badge.advanced{background:#3d2e1a;color:#ffb74d}[data-theme=dark] .junit-category-badge.practice{background:#3d1a3d;color:#ce93d8}.junit-hero-title{margin:0 0 1rem;font-size:2.25rem;font-weight:700;color:var(--color-text);line-height:1.2}.junit-hero-title .highlight{color:#1a73e8}[data-theme=dark] .junit-hero-title .highlight{color:#8ab4f8}.junit-hero-description{margin:0;font-size:1.125rem;color:var(--color-textSecondary);line-height:1.6;max-width:700px}.junit-content-section{margin-bottom:2.5rem}.junit-content-section h2{margin:0 0 1rem;font-size:1.5rem;font-weight:600;color:var(--color-text);display:flex;align-items:center;gap:.5rem}.junit-content-section h2 svg{color:#1a73e8}[data-theme=dark] .junit-content-section h2 svg{color:#8ab4f8}.junit-content-section h3{margin:1.5rem 0 .75rem;font-size:1.125rem;font-weight:600;color:var(--color-text)}.junit-content-section p{margin:0 0 1rem;font-size:1rem;color:var(--color-textSecondary);line-height:1.7}.junit-content-section ul,.junit-content-section ol{margin:0 0 1rem;padding-left:1.5rem}.junit-content-section li{margin-bottom:.5rem;font-size:1rem;color:var(--color-textSecondary);line-height:1.6}.junit-callout-box{display:flex;gap:1rem;padding:1.25rem;border-radius:8px;margin:1.5rem 0}.junit-callout-box.callout-info{background:#e3f2fd;border-left:4px solid #2196f3}.junit-callout-box.callout-success{background:#e8f5e9;border-left:4px solid #4caf50}.junit-callout-box.callout-warning{background:#fff3e0;border-left:4px solid #ff9800}.junit-callout-box.callout-tip{background:#f3e5f5;border-left:4px solid #9c27b0}[data-theme=dark] .junit-callout-box.callout-info{background:#1a3352;border-left-color:#8ab4f8}[data-theme=dark] .junit-callout-box.callout-success{background:#1b3d2e;border-left-color:#81c784}[data-theme=dark] .junit-callout-box.callout-warning{background:#3d2e1a;border-left-color:#ffb74d}[data-theme=dark] .junit-callout-box.callout-tip{background:#3d1a3d;border-left-color:#ce93d8}.junit-callout-icon{flex-shrink:0;font-size:1.25rem}.junit-callout-box.callout-info .junit-callout-icon{color:#2196f3}.junit-callout-box.callout-success .junit-callout-icon{color:#4caf50}.junit-callout-box.callout-warning .junit-callout-icon{color:#ff9800}.junit-callout-box.callout-tip .junit-callout-icon{color:#9c27b0}.junit-callout-content h4{margin:0 0 .5rem;font-size:1rem;font-weight:600;color:var(--color-text)}.junit-callout-content p{margin:0;font-size:.9375rem}.junit-feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:1.5rem 0}.junit-feature-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:1.5rem;transition:all .2s ease}.junit-feature-card:hover{border-color:#1a73e8;box-shadow:0 4px 12px #1a73e81a;transform:translateY(-2px)}.junit-feature-icon{width:48px;height:48px;background:#e3f2fd;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:#1a73e8;margin-bottom:1rem}[data-theme=dark] .junit-feature-icon{background:#1a3352;color:#8ab4f8}.junit-feature-card h3{margin:0 0 .5rem;font-size:1.125rem;font-weight:600;color:var(--color-text)}.junit-feature-card p{margin:0;font-size:.9375rem;color:var(--color-textSecondary);line-height:1.5}.junit-code-example{margin:1.5rem 0;border-radius:8px;overflow:hidden;border:1px solid var(--color-border)}.junit-code-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:#f1f3f4;border-bottom:1px solid var(--color-border)}[data-theme=dark] .junit-code-header{background:#292d31}.junit-code-header span{font-size:.8125rem;font-weight:500;color:var(--color-text)}.junit-code-badge{font-size:.6875rem;padding:.25rem .5rem;background:#1a73e8;color:#fff;border-radius:4px;font-weight:600;text-transform:uppercase}.junit-annotation-table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.9375rem}.junit-annotation-table th,.junit-annotation-table td{padding:.875rem 1rem;text-align:left;border-bottom:1px solid var(--color-border)}.junit-annotation-table th{background:#f1f3f4;font-weight:600;color:var(--color-text)}[data-theme=dark] .junit-annotation-table th{background:#292d31}.junit-annotation-table td{color:var(--color-textSecondary)}.junit-annotation-table code{background:#e3f2fd;color:#1565c0;padding:.125rem .375rem;border-radius:4px;font-family:Fira Code,Consolas,monospace;font-size:.875rem}[data-theme=dark] .junit-annotation-table code{background:#1a3352;color:#8ab4f8}.junit-try-it-box{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:1.5rem;margin:1.5rem 0}.junit-try-it-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.junit-try-icon{font-size:1.5rem;color:#1a73e8}[data-theme=dark] .junit-try-icon{color:#8ab4f8}.junit-try-it-header h4{margin:0;font-size:1.125rem;font-weight:600;color:var(--color-text)}.junit-try-commands{display:flex;flex-direction:column;gap:.75rem}.junit-try-command{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;background:#f1f3f4;border-radius:8px}[data-theme=dark] .junit-try-command{background:#292d31}.junit-try-command code{font-family:Fira Code,Consolas,monospace;font-size:.875rem;color:#1a73e8;font-weight:500}[data-theme=dark] .junit-try-command code{color:#8ab4f8}.junit-try-description{font-size:.875rem;color:var(--color-textSecondary)}.junit-pros-cons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:1.5rem 0}.junit-pros-section,.junit-cons-section{padding:1.25rem;border-radius:12px}.junit-pros-section{background:#e3f2fd;border:1px solid #bbdefb}.junit-cons-section{background:#ffebee;border:1px solid #ffcdd2}[data-theme=dark] .junit-pros-section{background:#1a3352;border-color:#1565c0}[data-theme=dark] .junit-cons-section{background:#3d1a1a;border-color:#c62828}.junit-pros-section h4,.junit-cons-section h4{margin:0 0 1rem;font-size:1rem;font-weight:600;display:flex;align-items:center;gap:.5rem}.junit-pros-section h4{color:#1565c0}.junit-cons-section h4{color:#c62828}[data-theme=dark] .junit-pros-section h4{color:#8ab4f8}[data-theme=dark] .junit-cons-section h4{color:#ef9a9a}.icon-green{color:#1a73e8}.icon-red{color:#f44336}.junit-pros-section ul,.junit-cons-section ul{margin:0;padding-left:1.25rem}.junit-pros-section li,.junit-cons-section li{margin-bottom:.5rem;font-size:.9375rem}.junit-pros-section li{color:#0d47a1}.junit-cons-section li{color:#b71c1c}[data-theme=dark] .junit-pros-section li{color:#90caf9}[data-theme=dark] .junit-cons-section li{color:#ef9a9a}@media(max-width:768px){.junit-hero-title{font-size:1.75rem}.junit-hero-description{font-size:1rem}.junit-content-section h2{font-size:1.25rem}.junit-feature-grid,.junit-pros-cons-grid{grid-template-columns:1fr}}:root{--mockito-accent: #1a73e8;--mockito-accent-light: #4285f4;--mockito-accent-dark: #1557b0;--mockito-bg-light: #f8f9fa;--mockito-bg-dark: #0D1117;--mockito-card-bg: #FFFFFF;--mockito-card-border: #e8eaed;--mockito-text-primary: #202124;--mockito-text-secondary: #5f6368;--mockito-text-muted: #9aa0a6;--mockito-success: #34a853;--mockito-info: #1a73e8;--mockito-warning: #f9ab00;--mockito-shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--mockito-shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--mockito-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--mockito-radius-sm: 6px;--mockito-radius-md: 8px;--mockito-radius-lg: 12px}[data-theme=dark]{--mockito-accent: #8ab4f8;--mockito-accent-light: #aecbfa;--mockito-accent-dark: #669df6;--mockito-bg-light: #1e1e1e;--mockito-card-bg: #21262D;--mockito-card-border: #3c4043;--mockito-text-primary: #e8eaed;--mockito-text-secondary: #9aa0a6;--mockito-text-muted: #6e7681}.mockito-intro-page{max-width:100%;padding:0;padding-bottom:2rem}.mockito-hero-minimal{padding:0 0 2rem;margin-bottom:1.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .mockito-hero-minimal{border-bottom-color:#3c4043}.mockito-badge-header{margin-bottom:1rem}.mockito-category-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .875rem;border-radius:1rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.mockito-category-badge.testing,.mockito-category-badge.basics,.mockito-category-badge.advanced,.mockito-category-badge.verification,.mockito-category-badge.annotations,.mockito-category-badge.best-practices{background:#1a73e81a;color:#1a73e8}[data-theme=dark] .mockito-category-badge.testing,[data-theme=dark] .mockito-category-badge.basics,[data-theme=dark] .mockito-category-badge.advanced,[data-theme=dark] .mockito-category-badge.verification,[data-theme=dark] .mockito-category-badge.annotations,[data-theme=dark] .mockito-category-badge.best-practices{background:#8ab4f826;color:#8ab4f8}.mockito-hero-title{font-size:2rem;font-weight:400;line-height:1.3;color:#202124;margin:0 0 .75rem}[data-theme=dark] .mockito-hero-title{color:#e8eaed}.mockito-hero-title .highlight{color:var(--mockito-accent)}[data-theme=dark] .mockito-hero-title .highlight{color:#8ab4f8}.mockito-hero-description{font-size:1rem;line-height:1.6;color:#5f6368;margin:0;max-width:600px}[data-theme=dark] .mockito-hero-description{color:#9aa0a6}.mockito-content-section{margin-bottom:3rem}.mockito-content-section h2{font-size:1.5rem;font-weight:400;color:#202124;margin:0 0 1rem;padding-bottom:.5rem;border-bottom:1px solid #e8eaed;display:flex;align-items:center;gap:.5rem}[data-theme=dark] .mockito-content-section h2{color:#e8eaed;border-bottom-color:#3c4043}.mockito-content-section h2 svg{color:var(--mockito-accent)}[data-theme=dark] .mockito-content-section h2 svg{color:#8ab4f8}.mockito-content-section h3{margin:1.5rem 0 .75rem;font-size:1.125rem;font-weight:500;color:#202124}[data-theme=dark] .mockito-content-section h3{color:#e8eaed}.mockito-content-section p{margin:0 0 1rem;font-size:1rem;color:#5f6368;line-height:1.7}[data-theme=dark] .mockito-content-section p{color:#9aa0a6}.mockito-content-section ul,.mockito-content-section ol{margin:0 0 1rem;padding-left:1.5rem}.mockito-content-section li{margin-bottom:.5rem;font-size:1rem;color:#5f6368;line-height:1.6}[data-theme=dark] .mockito-content-section li{color:#9aa0a6}.mockito-ordered-list{counter-reset:item;list-style:none;padding-left:0}.mockito-ordered-list li{counter-increment:item;display:flex;align-items:flex-start;gap:.75rem;margin-bottom:.75rem}.mockito-ordered-list li:before{content:counter(item);flex-shrink:0;width:24px;height:24px;background:var(--mockito-accent);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600}.mockito-callout-box{display:flex;gap:.875rem;padding:1rem 1.25rem;border-radius:8px;margin:1.25rem 0}.mockito-callout-box.callout-info{background:#e8f0fe;border:1px solid #d2e3fc}.mockito-callout-box.callout-success{background:#2da44e1a;border:1px solid rgba(45,164,78,.2)}.mockito-callout-box.callout-warning{background:#fef7e0;border:1px solid #f9e39c}.mockito-callout-box.callout-tip{background:#1a73e814;border:1px solid rgba(26,115,232,.2)}[data-theme=dark] .mockito-callout-box.callout-info{background:#1a3a5c;border-color:#2d4a6f}[data-theme=dark] .mockito-callout-box.callout-success{background:#2da44e26;border-color:#2da44e4d}[data-theme=dark] .mockito-callout-box.callout-warning{background:#3d3523;border-color:#5c4b2a}[data-theme=dark] .mockito-callout-box.callout-tip{background:#8ab4f81f;border-color:#8ab4f84d}.mockito-callout-icon{flex-shrink:0;font-size:1.25rem}.mockito-callout-box.callout-info .mockito-callout-icon{color:#1a73e8}.mockito-callout-box.callout-success .mockito-callout-icon{color:#34a853}.mockito-callout-box.callout-warning .mockito-callout-icon{color:#f9ab00}.mockito-callout-box.callout-tip .mockito-callout-icon{color:var(--mockito-accent)}[data-theme=dark] .mockito-callout-box.callout-info .mockito-callout-icon,[data-theme=dark] .mockito-callout-box.callout-tip .mockito-callout-icon{color:#8ab4f8}.mockito-callout-content h4{margin:0 0 .375rem;font-size:.9375rem;font-weight:500;color:#202124}[data-theme=dark] .mockito-callout-content h4{color:#e8eaed}.mockito-callout-content p{margin:0;color:#5f6368;font-size:.875rem;line-height:1.6}[data-theme=dark] .mockito-callout-content p{color:#9aa0a6}.mockito-callout-content ul{margin:.5rem 0 0;padding-left:1.25rem}.mockito-callout-content li{font-size:.875rem;margin-bottom:.25rem}.mockito-feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:2rem 0}.mockito-feature-card{padding:1.5rem;background:var(--color-surface);border:1px solid var(--mockito-card-border);border-radius:var(--mockito-radius-md);transition:all .2s ease}.mockito-feature-card:hover{border-color:var(--mockito-accent);box-shadow:var(--mockito-shadow-md);transform:translateY(-2px)}.mockito-feature-card .feature-icon{font-size:1.5rem;color:var(--mockito-accent);margin-bottom:1rem}[data-theme=dark] .mockito-feature-card .feature-icon{color:#8ab4f8}.mockito-feature-icon{width:48px;height:48px;border-radius:var(--mockito-radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:1rem;background:#1a73e81a;color:var(--mockito-accent)}[data-theme=dark] .mockito-feature-icon{background:#8ab4f826;color:#8ab4f8}.mockito-feature-card h3,.mockito-feature-card h4{margin:0 0 .5rem;font-size:1.1rem;font-weight:500;color:#202124}[data-theme=dark] .mockito-feature-card h3,[data-theme=dark] .mockito-feature-card h4{color:#e8eaed}.mockito-feature-card p{margin:0;font-size:.95rem;line-height:1.6;color:var(--mockito-text-secondary)}.mockito-code-example{margin:1.5rem 0;border-radius:8px;overflow:hidden;border:1px solid var(--color-border)}.mockito-code-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:#f1f3f4;border-bottom:1px solid var(--color-border)}[data-theme=dark] .mockito-code-header{background:#292d31}.mockito-code-header span{font-size:.8125rem;font-weight:500;color:var(--color-text)}.mockito-code-badge{font-size:.6875rem;padding:.25rem .5rem;background:#1a73e8;color:#fff;border-radius:4px;font-weight:600;text-transform:uppercase}.mockito-comparison-table{width:100%;border-collapse:collapse;margin:2rem 0;font-size:.95rem;border:1px solid var(--mockito-card-border);border-radius:var(--mockito-radius-md);overflow:hidden}.mockito-comparison-table th,.mockito-comparison-table td{padding:1rem 1.25rem;text-align:left;border-bottom:1px solid var(--mockito-card-border)}.mockito-comparison-table th{background:var(--mockito-bg-light);font-weight:500;color:#202124}[data-theme=dark] .mockito-comparison-table th{background:#292d31;color:#e8eaed}.mockito-comparison-table td{color:var(--mockito-text-secondary)}[data-theme=dark] .mockito-comparison-table td{color:#9aa0a6}.mockito-comparison-table tbody tr:hover{background:#1a73e80a}[data-theme=dark] .mockito-comparison-table tbody tr:hover{background:#8ab4f814}.mockito-comparison-table code{background:#1a73e81a;color:#1a73e8;padding:.2rem .5rem;border-radius:4px;font-family:Fira Code,Consolas,monospace;font-size:.85rem}[data-theme=dark] .mockito-comparison-table code{background:#8ab4f826;color:#8ab4f8}.mockito-try-it-box{background:#e8f0fe;border:1px solid #d2e3fc;border-radius:var(--mockito-radius-md);padding:1.5rem;margin:2rem 0}[data-theme=dark] .mockito-try-it-box{background:#1a2733;border-color:#394b5e}.mockito-try-it-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.mockito-try-icon{font-size:1.5rem;color:#1a73e8}[data-theme=dark] .mockito-try-icon{color:#8ab4f8}.mockito-try-it-header h4{margin:0;font-size:1.1rem;font-weight:500;color:#202124}[data-theme=dark] .mockito-try-it-header h4{color:#e8eaed}.mockito-try-commands{display:flex;flex-direction:column;gap:.75rem}.mockito-try-command{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;background:#ffffffb3;border-radius:var(--mockito-radius-sm);border:1px solid #d2e3fc}[data-theme=dark] .mockito-try-command{background:#0003;border-color:#394b5e}.mockito-try-command code{font-family:Fira Code,Consolas,monospace;font-size:.9rem;color:#1a73e8;font-weight:500}[data-theme=dark] .mockito-try-command code{color:#8ab4f8}.mockito-try-description{font-size:.9rem;color:var(--mockito-text-secondary)}.mockito-pros-cons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:2rem 0}.mockito-pros-section,.mockito-cons-section{padding:1.5rem;border-radius:var(--mockito-radius-md)}.mockito-pros-section{background:#34a85314;border:1px solid rgba(52,168,83,.2)}.mockito-cons-section{background:#ea433514;border:1px solid rgba(234,67,53,.2)}[data-theme=dark] .mockito-pros-section{background:#34a8531a;border-color:#34a8534d}[data-theme=dark] .mockito-cons-section{background:#ea43351a;border-color:#ea43354d}.mockito-pros-section h4,.mockito-cons-section h4{margin:0 0 1rem;font-size:1rem;font-weight:500;display:flex;align-items:center;gap:.5rem}.mockito-pros-section h4{color:#34a853}.mockito-cons-section h4{color:#ea4335}[data-theme=dark] .mockito-pros-section h4{color:#81c995}[data-theme=dark] .mockito-cons-section h4{color:#f28b82}.icon-green{color:#34a853}.icon-red{color:#ea4335}.mockito-pros-section ul,.mockito-cons-section ul{margin:0;padding-left:1.25rem}.mockito-pros-section li,.mockito-cons-section li{margin-bottom:.5rem;font-size:.95rem;line-height:1.5}.mockito-pros-section li{color:#137333}.mockito-cons-section li{color:#c5221f}[data-theme=dark] .mockito-pros-section li{color:#81c995}[data-theme=dark] .mockito-cons-section li{color:#f28b82}.mockito-syntax-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.25rem;margin:2rem 0}.mockito-syntax-card{background:var(--color-surface);border:1px solid var(--mockito-card-border);border-radius:var(--mockito-radius-md);padding:1.25rem;transition:border-color .2s ease}.mockito-syntax-card:hover{border-color:var(--mockito-accent)}.mockito-syntax-card h4{margin:0 0 .75rem;font-size:.95rem;font-weight:500;color:#202124}[data-theme=dark] .mockito-syntax-card h4{color:#e8eaed}.mockito-syntax-card code{display:block;background:var(--mockito-bg-light);padding:.875rem;border-radius:var(--mockito-radius-sm);font-family:Fira Code,Consolas,monospace;font-size:.85rem;color:#1a73e8;white-space:pre-wrap;line-height:1.5}[data-theme=dark] .mockito-syntax-card code{background:#1e1e1e;color:#8ab4f8}@media(max-width:768px){.mockito-hero-minimal{padding:2rem 1rem}.mockito-hero-title{font-size:1.75rem}.mockito-hero-description{font-size:1rem}.mockito-content-section{padding:0 .5rem}.mockito-content-section h2{font-size:1.25rem}.mockito-feature-grid,.mockito-pros-cons-grid,.mockito-syntax-grid{grid-template-columns:1fr}.mockito-feature-card,.mockito-callout-box,.mockito-try-it-box{padding:1.25rem}.mockito-comparison-table{font-size:.875rem}.mockito-comparison-table th,.mockito-comparison-table td{padding:.75rem}}@media(max-width:480px){.mockito-hero-title{font-size:1.5rem}.mockito-badge-row{flex-wrap:wrap}.mockito-badge{font-size:.7rem;padding:.25rem .5rem}}:root{--js-bg-light: #FAFBFC;--js-bg-dark: #0D1117;--js-card-bg: #FFFFFF;--js-card-border: #E1E4E8;--js-text-primary: #24292F;--js-text-secondary: #57606A;--js-text-muted: #8B949E;--js-success: #2DA44E;--js-info: #0969DA;--js-warning: #BF8700;--js-shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--js-shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--js-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--js-radius-sm: 6px;--js-radius-md: 10px;--js-radius-lg: 16px}[data-theme=dark]{--js-bg-light: #161B22;--js-card-bg: #21262D;--js-card-border: #30363D;--js-text-primary: #E6EDF3;--js-text-secondary: #8B949E;--js-text-muted: #6E7681}.js-intro-page{max-width:100%;padding:0}.js-intro-hero{padding:0 0 2rem;margin-bottom:1.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .js-intro-hero{border-bottom-color:#3c4043}.js-hero-content h1{font-size:2rem;font-weight:400;line-height:1.3;color:#202124;margin:0 0 .75rem}[data-theme=dark] .js-hero-content h1{color:#e8eaed}.js-hero-badge{display:inline-flex;align-items:center;gap:.5rem;background:#1a73e81a;color:#1a73e8;padding:.375rem .75rem;border-radius:100px;font-size:.8125rem;font-weight:500;margin-bottom:.75rem}[data-theme=dark] .js-hero-badge{background:#8ab4f826;color:#8ab4f8}.js-hero-badge svg{width:.875rem;height:.875rem}.js-intro-hero p{font-size:1rem;line-height:1.6;color:#5f6368;margin:0;max-width:600px}[data-theme=dark] .js-intro-hero p{color:#9aa0a6}.js-section{margin-bottom:3rem}.js-section-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .js-section-header{border-bottom-color:#3c4043}.js-section-header h2{font-size:1.5rem;font-weight:400;color:#202124;margin:0}[data-theme=dark] .js-section-header h2{color:#e8eaed}.js-section-icon{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;background:#1a73e81a;color:#1a73e8;border-radius:var(--js-radius-sm)}[data-theme=dark] .js-section-icon{background:#8ab4f826;color:#8ab4f8}.js-section-icon svg{width:1rem;height:1rem}.js-section p{font-size:1rem;line-height:1.7;color:#5f6368;margin:0 0 1rem}[data-theme=dark] .js-section p{color:#9aa0a6}.js-section p strong{color:#202124}[data-theme=dark] .js-section p strong{color:#e8eaed}.js-features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin:2rem 0}.js-feature-card{padding:1.5rem;background:var(--color-surface);border:1px solid var(--js-card-border);border-radius:var(--js-radius-md);transition:all .2s ease}.js-feature-card:hover{border-color:#1a73e8;box-shadow:var(--js-shadow-md);transform:translateY(-2px)}.js-feature-icon{width:48px;height:48px;border-radius:var(--js-radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:1rem;background:#1a73e81a;color:#1a73e8}[data-theme=dark] .js-feature-icon{background:#8ab4f826;color:#8ab4f8}.js-feature-card h3{margin:0 0 .5rem;font-size:1.1rem;font-weight:500;color:#202124}[data-theme=dark] .js-feature-card h3{color:#e8eaed}.js-feature-card p{margin:0;font-size:.95rem;line-height:1.6;color:var(--js-text-secondary)}.js-info-box{display:flex;gap:.875rem;padding:1rem 1.25rem;border-radius:8px;margin:1.25rem 0;background:#fef7e0;border:1px solid #f9e39c}[data-theme=dark] .js-info-box{background:#3d3523;border-color:#5c4b2a}.js-info-box h4{display:flex;align-items:center;gap:.5rem;margin:0 0 .375rem;font-size:.9375rem;font-weight:500;color:#202124}[data-theme=dark] .js-info-box h4{color:#e8eaed}.js-info-box h4 svg{flex-shrink:0;font-size:1.25rem;color:#f9ab00}.js-info-box p{margin:0;color:#5f6368;font-size:.875rem;line-height:1.6}[data-theme=dark] .js-info-box p{color:#9aa0a6}.js-code-example{background:var(--color-surface);border:1px solid var(--js-card-border);border-radius:var(--js-radius-md);overflow:hidden;margin:1.5rem 0}.js-code-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:#f8f9fa;border-bottom:1px solid var(--js-card-border)}[data-theme=dark] .js-code-header{background:#1e1e1e;border-bottom-color:#3c4043}.js-code-title{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:#202124}[data-theme=dark] .js-code-title{color:#e8eaed}.js-code-title svg{color:#5f6368;width:1rem;height:1rem}[data-theme=dark] .js-code-title svg{color:#9aa0a6}.js-code-badge{background:#1a73e8;color:#fff;padding:.25rem .625rem;border-radius:100px;font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.02em}[data-theme=dark] .js-code-badge{background:#8ab4f8;color:#202124}.js-code-content{padding:0}.js-code-content p{padding:1rem 1rem 0;margin:0 0 .5rem}.js-workflow-steps{display:flex;flex-direction:column;gap:.75rem;margin:1.5rem 0}.js-workflow-step{display:flex;align-items:flex-start;gap:1rem;padding:1rem 1.25rem;background:var(--color-surface);border:1px solid var(--js-card-border);border-radius:var(--js-radius-md);transition:all .2s ease}.js-workflow-step:hover{border-color:#1a73e8;box-shadow:var(--js-shadow-sm)}[data-theme=dark] .js-workflow-step:hover{border-color:#8ab4f8}.js-step-number{display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;background:#1a73e8;color:#fff;border-radius:50%;font-size:.875rem;font-weight:600;flex-shrink:0}[data-theme=dark] .js-step-number{background:#8ab4f8;color:#202124}.js-step-content h4{margin:0 0 .25rem;font-size:.9375rem;font-weight:500;color:#202124}[data-theme=dark] .js-step-content h4{color:#e8eaed}.js-step-content p{margin:0;font-size:.875rem;line-height:1.5;color:var(--js-text-secondary)}.js-step-content p code{background:#1a73e81a;color:#1a73e8;padding:.15em .4em;border-radius:4px;font-size:.85em}[data-theme=dark] .js-step-content p code{background:#8ab4f826;color:#8ab4f8}.js-learning-path{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin:1.5rem 0}.js-path-card{text-align:center;padding:1.25rem 1rem;background:var(--color-surface);border:1px solid var(--js-card-border);border-radius:var(--js-radius-md);cursor:pointer;transition:all .2s ease}.js-path-card:hover{border-color:#1a73e8;box-shadow:var(--js-shadow-md);transform:translateY(-2px)}[data-theme=dark] .js-path-card:hover{border-color:#8ab4f8}.js-path-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin:0 auto .875rem;background:#1a73e81a;color:#1a73e8;border-radius:var(--js-radius-md)}[data-theme=dark] .js-path-icon{background:#8ab4f826;color:#8ab4f8}.js-path-icon svg{width:1.5rem;height:1.5rem}.js-path-card h4{margin:0 0 .375rem;font-size:.9375rem;font-weight:500;color:#202124}[data-theme=dark] .js-path-card h4{color:#e8eaed}.js-path-card p{margin:0;font-size:.8125rem;color:var(--js-text-muted)}.js-capability-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin:2rem 0}.js-capability-card{padding:1.25rem;background:var(--color-surface);border:1px solid var(--js-card-border);border-radius:var(--js-radius-md);transition:all .2s ease}.js-capability-card:hover{border-color:#1a73e8;box-shadow:var(--js-shadow-sm)}[data-theme=dark] .js-capability-card:hover{border-color:#8ab4f8}.js-capability-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.js-capability-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--js-radius-sm);background:#0969da1a;color:var(--js-info)}[data-theme=dark] .js-capability-icon{background:#8ab4f826;color:#8ab4f8}.js-capability-icon svg{width:1.125rem;height:1.125rem}.js-capability-card h4{margin:0;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .js-capability-card h4{color:#e8eaed}.js-capability-card p{margin:0;font-size:.9rem;line-height:1.5;color:var(--js-text-secondary)}.js-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem;margin:1.5rem 0}.js-stat-card{text-align:center;padding:1.25rem 1rem;background:var(--color-surface);border:1px solid var(--js-card-border);border-radius:var(--js-radius-md);transition:all .2s ease}.js-stat-card:hover{border-color:#1a73e8;box-shadow:var(--js-shadow-sm)}.js-stat-value{font-size:1.5rem;font-weight:600;color:#1a73e8;margin-bottom:.25rem}[data-theme=dark] .js-stat-value{color:#8ab4f8}.js-stat-label{font-size:.8125rem;color:var(--js-text-muted)}.js-cta-section{background:#e8f0fe;border:1px solid #d2e3fc;border-radius:8px;padding:1.5rem;margin:2rem 0;text-align:center}[data-theme=dark] .js-cta-section{background:#1a3a5c;border-color:#2d4a6f}.js-cta-section h3{margin:0 0 .5rem;font-size:1.125rem;font-weight:500;color:#202124}[data-theme=dark] .js-cta-section h3{color:#e8eaed}.js-cta-section p{margin:0 0 1.25rem;font-size:.9375rem;color:#5f6368}[data-theme=dark] .js-cta-section p{color:#9aa0a6}.js-cta-button{display:inline-flex;align-items:center;gap:.5rem;background:#1a73e8;color:#fff;padding:.625rem 1.25rem;border-radius:4px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;transition:all .2s ease}.js-cta-button:hover{background:#1557b0;box-shadow:var(--js-shadow-md)}[data-theme=dark] .js-cta-button{background:#8ab4f8;color:#202124}[data-theme=dark] .js-cta-button:hover{background:#aecbfa}.js-cta-button svg{width:1rem;height:1rem}@media(max-width:1024px){.js-intro-hero{padding:0 0 1.5rem}}@media(max-width:768px){.js-hero-content h1{font-size:1.75rem}.js-intro-hero p{font-size:.95rem}.js-section-header h2{font-size:1.25rem}.js-features-grid,.js-capability-grid{grid-template-columns:1fr}.js-learning-path,.js-stats-grid{grid-template-columns:repeat(2,1fr)}.js-workflow-step{flex-direction:column;align-items:flex-start}.js-info-box{flex-direction:column}}@media(max-width:480px){.js-hero-content h1{font-size:1.5rem}.js-section-header h2{font-size:1.15rem}.js-learning-path,.js-stats-grid{grid-template-columns:1fr}.js-hero-badge{font-size:.75rem;padding:.25rem .625rem}}.code-block-wrapper{background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;margin:1rem 0;overflow:hidden;width:100%;max-width:100%;box-sizing:border-box}[data-theme=dark] .code-block-wrapper{background:#1e1e1e;border-color:#333}.code-block-title{padding:.5rem 1rem;background:#1a73e814;border-bottom:1px solid #e8eaed;font-size:.8125rem;font-weight:500;color:#1a73e8}[data-theme=dark] .code-block-title{background:#8ab4f81a;border-color:#333;color:#8ab4f8}.code-block-container{position:relative}.copy-btn{position:absolute;top:8px;right:8px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:4px;background:#0000000d;color:#5f6368;cursor:pointer;opacity:.7;transition:all .2s ease}.code-block-container:hover .copy-btn{opacity:1;background:#00000014}.copy-btn:hover{background:#1a73e826;color:#1a73e8}[data-theme=dark] .copy-btn{background:#ffffff14;color:#9aa0a6}[data-theme=dark] .code-block-container:hover .copy-btn{background:#ffffff1f}[data-theme=dark] .copy-btn:hover{background:#8ab4f833;color:#8ab4f8}.copy-btn.copied{color:#34a853;opacity:1;background:#34a8531a}[data-theme=dark] .copy-btn.copied{color:#81c995;background:#81c99526}.code-pre{margin:0;padding:1rem 1.25rem;background:transparent;color:#37474f;overflow-x:auto;font-family:Roboto Mono,Monaco,Menlo,Consolas,monospace;font-size:.875rem;line-height:1.6;-webkit-overflow-scrolling:touch;max-width:100%;box-sizing:border-box}[data-theme=dark] .code-pre{color:#e8eaed}.code-pre::-webkit-scrollbar{height:6px}.code-pre::-webkit-scrollbar-track{background:transparent}.code-pre::-webkit-scrollbar-thumb{background:#dadce0;border-radius:3px}[data-theme=dark] .code-pre::-webkit-scrollbar-thumb{background:#5f6368}.code-pre code{background:none;padding:0;color:inherit;font-family:inherit;font-size:inherit;white-space:pre-wrap;word-break:break-word}.code-output{border-top:1px solid #e8eaed;background:#f1f3f4}[data-theme=dark] .code-output{border-color:#333;background:#292929}.output-pre{margin:0;padding:.875rem 1.25rem;background:transparent;color:#188038;font-family:Roboto Mono,Monaco,Menlo,Consolas,monospace;font-size:.8125rem;white-space:pre-wrap;overflow-x:auto;-webkit-overflow-scrolling:touch;line-height:1.5;word-break:break-word}[data-theme=dark] .output-pre{color:#81c995}@media(max-width:768px){.code-block-wrapper{margin:.875rem 0;border-radius:6px}.code-pre{padding:.875rem 1rem;font-size:.8125rem}.output-pre{padding:.75rem 1rem;font-size:.75rem}.copy-btn{opacity:1;top:6px;right:6px;width:28px;height:28px}}@media(max-width:480px){.code-pre{padding:.75rem;font-size:.75rem}.output-pre{padding:.625rem .75rem;font-size:.7rem}}.definition-list{margin:1rem 0;padding:0}.definition-list-default .definition-item{display:flex;align-items:baseline;gap:.5rem;padding:.625rem 0;border-bottom:1px solid var(--color-border, #e8eaed)}.definition-list-default .definition-item:last-child{border-bottom:none;padding-bottom:0}.definition-list-default .definition-item:first-child{padding-top:0}.definition-list-default .definition-term{flex-shrink:0;font-family:Roboto Mono,Monaco,monospace;font-size:.875rem;font-weight:600;color:#1a73e8;background:#1a73e814;padding:.2rem .5rem;border-radius:4px}.definition-list-default .definition-description{margin:0;color:#5f6368;font-size:.9375rem;line-height:1.5}.definition-list-inline .definition-item{display:flex;align-items:baseline;gap:.375rem;padding:.5rem 0}.definition-list-inline .definition-term{font-weight:600;color:var(--color-text, #202124);font-size:.9375rem}.definition-list-inline .definition-term:after{content:" —";color:#dadce0;font-weight:400}.definition-list-inline .definition-description{margin:0;color:#5f6368;font-size:.9375rem;line-height:1.5}.definition-list-card{display:flex;flex-direction:column;gap:.75rem}.definition-list-card .definition-item{background:var(--color-surface, #fff);border:1px solid var(--color-border, #e8eaed);border-radius:8px;padding:1rem;transition:border-color .2s ease}.definition-list-card .definition-item:hover{border-color:#1a73e84d}.definition-list-card .definition-term{display:block;font-family:Roboto Mono,Monaco,monospace;font-size:.875rem;font-weight:600;color:#1a73e8;margin-bottom:.375rem}.definition-list-card .definition-description{margin:0;color:#5f6368;font-size:.875rem;line-height:1.5}[data-theme=dark] .definition-list-default .definition-term{color:#8ab4f8;background:#8ab4f81f}[data-theme=dark] .definition-list-default .definition-description,[data-theme=dark] .definition-list-inline .definition-description,[data-theme=dark] .definition-list-card .definition-description{color:#9aa0a6}[data-theme=dark] .definition-list-inline .definition-term:after{color:#5f6368}[data-theme=dark] .definition-list-card .definition-item{background:var(--color-surface, #1e1e1e)}[data-theme=dark] .definition-list-card .definition-item:hover{border-color:#8ab4f84d}[data-theme=dark] .definition-list-card .definition-term{color:#8ab4f8}@media(max-width:768px){.definition-list-default .definition-item{flex-direction:column;align-items:flex-start;gap:.25rem}.definition-list-default .definition-term{font-size:.8125rem}.definition-list-default .definition-description{font-size:.875rem;padding-left:0}.definition-list-card .definition-item{padding:.875rem}}@media(max-width:480px){.definition-list-inline .definition-item{flex-direction:column;gap:.125rem}.definition-list-inline .definition-term:after{display:none}}.quiz-container{max-width:700px;margin:0 auto}.quiz-progress{display:flex;justify-content:center;gap:8px;margin-bottom:2rem}.progress-dot{width:12px;height:12px;border-radius:50%;background:var(--color-border);transition:all .3s ease}.progress-dot.current{background:var(--color-primary);transform:scale(1.2)}.progress-dot.correct{background:#22c55e}.progress-dot.incorrect{background:#ef4444}.question-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:2rem;margin-bottom:1.5rem}.question-text{font-size:1.25rem;color:var(--color-text-primary);margin-bottom:1.5rem;line-height:1.5}.options-list{display:flex;flex-direction:column;gap:12px}.option-button{display:flex;align-items:center;gap:12px;padding:1rem 1.25rem;background:var(--color-background);border:2px solid var(--color-border);border-radius:8px;cursor:pointer;transition:all .2s ease;text-align:left;width:100%}.option-button:hover:not(:disabled){border-color:var(--color-primary);background:var(--color-primary-bg)}.option-button.selected{border-color:var(--color-primary);background:var(--color-primary-bg)}.option-button.correct{border-color:#22c55e;background:#22c55e1a}.option-button.incorrect{border-color:#ef4444;background:#ef44441a}.option-button:disabled{cursor:default}.option-letter{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--color-border);color:var(--color-text-secondary);font-weight:600;font-size:.875rem;flex-shrink:0}.option-button.selected .option-letter,.option-button:hover:not(:disabled) .option-letter{background:var(--color-primary);color:#fff}.option-button.correct .option-letter{background:#22c55e;color:#fff}.option-button.incorrect .option-letter{background:#ef4444;color:#fff}.option-text{color:var(--color-text-primary);font-size:1rem;line-height:1.4}.explanation-box{margin-top:1.5rem;padding:1rem 1.25rem;border-radius:8px;border-left:4px solid}.explanation-box.correct{background:#22c55e1a;border-color:#22c55e}.explanation-box.incorrect{background:#ef44441a;border-color:#ef4444}.explanation-result{font-weight:600;font-size:1rem;margin-bottom:.5rem}.explanation-box.correct .explanation-result{color:#22c55e}.explanation-box.incorrect .explanation-result{color:#ef4444}.explanation-text{color:var(--color-text-secondary);font-size:.9375rem;line-height:1.5;margin:0}.quiz-navigation{display:flex;justify-content:space-between;gap:1rem}.quiz-button{padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease;border:none}.quiz-button.primary{background:var(--color-primary);color:#fff}.quiz-button.primary:hover:not(:disabled){background:var(--color-primary-hover)}.quiz-button.secondary{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border)}.quiz-button.secondary:hover:not(:disabled){background:var(--color-background);border-color:var(--color-primary)}.quiz-button:disabled{opacity:.5;cursor:not-allowed}.quiz-results{text-align:center}.score-display{margin:2rem 0}.score-circle{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:150px;height:150px;border-radius:50%;background:var(--color-primary-bg);border:4px solid var(--color-primary)}.score-number{font-size:3rem;font-weight:700;color:var(--color-primary);line-height:1}.score-total{font-size:1.25rem;color:var(--color-text-secondary)}.score-percentage{font-size:1.5rem;font-weight:600;color:var(--color-text-primary);margin-top:1rem}.results-summary{margin:1.5rem 0 2rem}.result-message{font-size:1.125rem;padding:1rem;border-radius:8px}.result-message.excellent{background:#22c55e1a;color:#22c55e}.result-message.good{background:#22c55e1a;color:#16a34a}.result-message.okay{background:#eab3081a;color:#ca8a04}.result-message.needs-work{background:#ef44441a;color:#ef4444}.results-breakdown{text-align:left;margin:2rem 0;padding:1.5rem;background:var(--color-surface);border-radius:12px;border:1px solid var(--color-border)}.results-breakdown h3{margin-bottom:1rem;color:var(--color-text-primary)}.result-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 0;border-bottom:1px solid var(--color-border)}.result-item:last-child{border-bottom:none}.result-icon{font-size:1rem;font-weight:600;flex-shrink:0;width:20px}.result-item.correct .result-icon{color:#22c55e}.result-item.incorrect .result-icon{color:#ef4444}.result-question{color:var(--color-text-secondary);font-size:.9375rem;line-height:1.4}@media(max-width:600px){.question-card{padding:1.25rem}.question-text{font-size:1.125rem}.option-button{padding:.875rem 1rem}.quiz-navigation{flex-direction:column}.score-circle{width:120px;height:120px}.score-number{font-size:2.5rem}}.cheat-sheet .cheat-sheet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:1.5rem;margin-top:2rem}.cheat-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:1.25rem;overflow:hidden}.cheat-section h2{font-size:1.125rem;color:var(--color-primary);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--color-border)}.cheat-section .code-block{margin:0;background:var(--color-background)}.cheat-section .code-block pre{font-size:.8125rem;line-height:1.5;padding:.75rem;margin:0;max-height:none;overflow-x:auto}.cheat-section .code-block code{font-size:inherit}.cheat-section .code-block-header{display:none}@media(max-width:768px){.cheat-sheet .cheat-sheet-grid{grid-template-columns:1fr}}@media print{.cheat-sheet .js-hero-minimal{margin-bottom:1rem}.cheat-sheet-grid{display:block}.cheat-section{page-break-inside:avoid;margin-bottom:1rem;border:1px solid #ccc}.cheat-section pre{font-size:10px!important}}.html-code-preview{border:1px solid #e8eaed;border-radius:8px;overflow:hidden;background:#fff;margin:1.5rem 0}[data-theme=dark] .html-code-preview{background:#1f1f1f;border-color:#3c4043}.html-code-preview.fullscreen{position:fixed;inset:0;z-index:1000;border-radius:0;margin:0}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:#f8f9fa;border-bottom:1px solid #e8eaed}[data-theme=dark] .preview-header{background:#292d31;border-bottom-color:#3c4043}.preview-title{font-size:.875rem;font-weight:500;color:#5f6368}[data-theme=dark] .preview-title{color:#9aa0a6}.preview-controls{display:flex;align-items:center;gap:.25rem}.view-btn{display:flex;align-items:center;gap:.375rem;padding:.375rem .75rem;border:none;background:transparent;color:#5f6368;font-size:.8125rem;border-radius:4px;cursor:pointer;transition:all .2s ease}.view-btn:hover{background:#e8eaed;color:#202124}.view-btn.active{background:#1a73e8;color:#fff}[data-theme=dark] .view-btn{color:#9aa0a6}[data-theme=dark] .view-btn:hover{background:#3c4043;color:#e8eaed}[data-theme=dark] .view-btn.active{background:#8ab4f8;color:#202124}.preview-divider{width:1px;height:20px;background:#e8eaed;margin:0 .5rem}[data-theme=dark] .preview-divider{background:#3c4043}.action-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;color:#5f6368;border-radius:4px;cursor:pointer;transition:all .2s ease}.action-btn:hover{background:#e8eaed;color:#202124}[data-theme=dark] .action-btn{color:#9aa0a6}[data-theme=dark] .action-btn:hover{background:#3c4043;color:#e8eaed}.preview-content{display:flex;min-height:200px}.preview-content.view-code,.preview-content.view-preview{flex-direction:column}.preview-content.view-split{flex-direction:row}@media(max-width:768px){.preview-content.view-split{flex-direction:column}}.code-panel{flex:1;min-width:0;overflow:auto;background:#1f1f1f}.view-split .code-panel{border-right:1px solid #3c4043}@media(max-width:768px){.view-split .code-panel{border-right:none;border-bottom:1px solid #3c4043}}.html-code{margin:0;padding:1rem;font-family:Fira Code,Consolas,Monaco,monospace;font-size:.875rem;line-height:1.6;color:#e8eaed;overflow-x:auto}.code-line{display:flex;white-space:pre}.line-number{flex-shrink:0;width:2.5rem;text-align:right;padding-right:1rem;color:#6e7681;-webkit-user-select:none;user-select:none}.line-content{flex:1}.html-bracket{color:gray}.html-tag{color:#569cd6}.html-attr{color:#9cdcfe}.html-equals{color:#d4d4d4}.html-string{color:#ce9178}.html-comment{color:#6a9955;font-style:italic}.preview-panel{flex:1;min-width:0;display:flex;flex-direction:column;background:#fff}[data-theme=dark] .preview-panel{background:#fff}.preview-label{padding:.5rem 1rem;font-size:.75rem;font-weight:500;color:#5f6368;background:#f8f9fa;border-bottom:1px solid #e8eaed}.preview-iframe{flex:1;width:100%;min-height:150px;border:none;background:#fff}:root{--html-orange: #E34F26;--html-orange-light: #FF6B4A;--html-orange-dark: #C73D1A;--html-bg-light: #FAFBFC;--html-bg-dark: #0D1117;--html-card-bg: #FFFFFF;--html-card-border: #E1E4E8;--html-text-primary: #24292F;--html-text-secondary: #57606A;--html-text-muted: #8B949E;--html-success: #2DA44E;--html-info: #0969DA;--html-warning: #BF8700;--html-error: #CF222E;--html-shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--html-shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--html-shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--html-radius-sm: 6px;--html-radius-md: 10px;--html-radius-lg: 16px}[data-theme=dark]{--html-bg-light: #161B22;--html-card-bg: #21262D;--html-card-border: #30363D;--html-text-primary: #E6EDF3;--html-text-secondary: #8B949E;--html-text-muted: #6E7681}.html-tutorial-page{max-width:100%;padding:0}.html-hero-minimal{padding:0 0 2rem;margin-bottom:1.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .html-hero-minimal{border-bottom-color:#3c4043}.html-hero-title{font-size:2rem;font-weight:400;line-height:1.3;color:#202124;margin:0 0 .75rem}[data-theme=dark] .html-hero-title{color:#e8eaed}.html-hero-title .highlight{color:#e34f26}[data-theme=dark] .html-hero-title .highlight{color:#ff6b4a}.html-hero-description{font-size:1rem;line-height:1.6;color:#5f6368;margin:0;max-width:600px}[data-theme=dark] .html-hero-description{color:#9aa0a6}.html-content-section{margin-bottom:3rem}.html-content-section h2{font-size:1.5rem;font-weight:400;color:#202124;margin:0 0 1rem;padding-bottom:.5rem;border-bottom:1px solid #e8eaed}[data-theme=dark] .html-content-section h2{color:#e8eaed;border-bottom-color:#3c4043}.html-content-section h3{font-size:1.125rem;font-weight:500;color:#202124;margin:1.5rem 0 .75rem}[data-theme=dark] .html-content-section h3{color:#e8eaed}.html-content-section p{font-size:1rem;line-height:1.7;color:#3c4043;margin:0 0 1rem}[data-theme=dark] .html-content-section p{color:#bdc1c6}.html-content-section ul,.html-content-section ol{margin:.5rem 0 1rem 1.5rem;padding:0}.html-content-section li{font-size:1rem;line-height:1.7;color:#3c4043;margin-bottom:.5rem}[data-theme=dark] .html-content-section li{color:#bdc1c6}.html-content-section code{background:#fff4f0;padding:.125rem .375rem;border-radius:4px;font-family:Fira Code,Consolas,monospace;font-size:.875rem;color:#e34f26}[data-theme=dark] .html-content-section code{background:#3d2a25;color:#ff6b4a}.html-callout-box{display:flex;gap:.875rem;padding:1rem 1.25rem;border-radius:8px;margin:1.25rem 0}.html-callout-box.callout-primary{background:#fff4f0;border:1px solid #ffd4c7}[data-theme=dark] .html-callout-box.callout-primary{background:#3d2a25;border-color:#5c3a30}.html-callout-box.callout-warning{background:#fef7e0;border:1px solid #f9e39c}[data-theme=dark] .html-callout-box.callout-warning{background:#3d3523;border-color:#5c4b2a}.html-callout-box.callout-info{background:#e8f0fe;border:1px solid #aecbfa}[data-theme=dark] .html-callout-box.callout-info{background:#1a3352;border-color:#2a4a6d}.html-callout-box.callout-success{background:#e6f4ea;border:1px solid #a8dab5}[data-theme=dark] .html-callout-box.callout-success{background:#1e3a2c;border-color:#2d5940}.html-callout-box.callout-danger{background:#fce8e6;border:1px solid #f5c6cb}[data-theme=dark] .html-callout-box.callout-danger{background:#3d2323;border-color:#5c2a2a}.html-callout-icon{flex-shrink:0;font-size:1.25rem;color:#e34f26}.html-callout-box.callout-info .html-callout-icon{color:#1a73e8}.html-callout-box.callout-success .html-callout-icon{color:#1e8e3e}.html-callout-box.callout-warning .html-callout-icon{color:#f9ab00}.html-callout-box.callout-danger .html-callout-icon{color:#d93025}.html-callout-content h4{margin:0 0 .375rem;font-size:.9375rem;font-weight:500;color:#202124}[data-theme=dark] .html-callout-content h4{color:#e8eaed}.html-callout-content p{margin:0;font-size:.875rem;line-height:1.5;color:#3c4043}[data-theme=dark] .html-callout-content p{color:#bdc1c6}.html-takeaways-box{background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem;margin:1.5rem 0}[data-theme=dark] .html-takeaways-box{background:#292d31;border-color:#3c4043}.html-takeaways-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.html-takeaways-icon{color:#e34f26;font-size:1.125rem}[data-theme=dark] .html-takeaways-icon{color:#ff6b4a}.html-takeaways-header h4{margin:0;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .html-takeaways-header h4{color:#e8eaed}.html-takeaways-list{display:flex;flex-direction:column;gap:.625rem}.html-takeaway-item{display:flex;align-items:baseline;gap:.75rem;font-size:.875rem}.html-takeaway-item code{background:#e8eaed;padding:.25rem .5rem;border-radius:4px;font-family:Fira Code,monospace;font-size:.8125rem;color:#e34f26;white-space:nowrap}[data-theme=dark] .html-takeaway-item code{background:#3c4043;color:#ff6b4a}.html-takeaway-description{color:#5f6368;font-size:.875rem}[data-theme=dark] .html-takeaway-description{color:#9aa0a6}.html-features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.25rem;margin:1.5rem 0}.html-feature-card{background:#fff;border:1px solid #e8eaed;border-radius:8px;padding:1.25rem;transition:box-shadow .2s ease}[data-theme=dark] .html-feature-card{background:#292d31;border-color:#3c4043}.html-feature-card:hover{box-shadow:0 4px 12px #0000001a}.html-feature-icon{font-size:1.5rem;color:#e34f26;margin-bottom:.75rem}[data-theme=dark] .html-feature-icon{color:#ff6b4a}.html-feature-card h4{margin:0 0 .5rem;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .html-feature-card h4{color:#e8eaed}.html-feature-card p{margin:0;font-size:.875rem;line-height:1.5;color:#5f6368}[data-theme=dark] .html-feature-card p{color:#9aa0a6}.html-learning-path{margin:1.5rem 0}.html-path-item{display:flex;gap:1rem;padding:1.25rem 0;border-bottom:1px solid #e8eaed}[data-theme=dark] .html-path-item{border-bottom-color:#3c4043}.html-path-item:last-child{border-bottom:none}.html-path-number{flex-shrink:0;width:32px;height:32px;background:#e34f26;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600}[data-theme=dark] .html-path-number{background:#ff6b4a;color:#202124}.html-path-content h4{margin:0 0 .5rem;font-size:1rem;font-weight:500;color:#202124}[data-theme=dark] .html-path-content h4{color:#e8eaed}.html-path-content ul{margin:0;padding-left:1.25rem}.html-path-content li{font-size:.875rem;color:#5f6368;margin-bottom:.25rem}[data-theme=dark] .html-path-content li{color:#9aa0a6}.html-tag-anatomy{margin:1.5rem 0}.html-anatomy-line{display:flex;align-items:flex-start;gap:1rem;padding:.75rem;background:#f8f9fa;border-left:3px solid #E34F26;margin-bottom:.5rem;border-radius:0 4px 4px 0}[data-theme=dark] .html-anatomy-line{background:#292d31;border-left-color:#ff6b4a}.html-anatomy-code{font-family:Fira Code,monospace;font-size:.875rem;color:#e34f26;white-space:nowrap;min-width:200px}[data-theme=dark] .html-anatomy-code{color:#ff6b4a}.html-anatomy-explanation{font-size:.875rem;color:#5f6368;line-height:1.5}[data-theme=dark] .html-anatomy-explanation{color:#9aa0a6}.html-element-table{overflow-x:auto;margin:1.5rem 0}.html-element-table table{width:100%;border-collapse:collapse;font-size:.9375rem}.html-element-table th,.html-element-table td{padding:.75rem 1rem;text-align:left;border:1px solid #e8eaed}[data-theme=dark] .html-element-table th,[data-theme=dark] .html-element-table td{border-color:#3c4043}.html-element-table th{background:#f8f9fa;font-weight:600;color:#202124}[data-theme=dark] .html-element-table th{background:#2d2d2d;color:#e8eaed}.html-element-table td{background:#fff;color:#3c4043}[data-theme=dark] .html-element-table td{background:#1f1f1f;color:#bdc1c6}.html-element-table tr:hover td{background:#f8f9fa}[data-theme=dark] .html-element-table tr:hover td{background:#2d2d2d}.html-element-table code{background:#fff4f0;color:#e34f26;padding:.125rem .375rem;border-radius:4px;font-size:.875rem}[data-theme=dark] .html-element-table code{background:#3d2a25;color:#ff6b4a}.html-doc-structure{margin:1.5rem 0;padding:1.5rem;background:#f8f9fa;border-radius:8px;font-family:Fira Code,monospace;font-size:.875rem}[data-theme=dark] .html-doc-structure{background:#292d31}.html-structure-line{margin:.25rem 0;color:#3c4043}[data-theme=dark] .html-structure-line{color:#bdc1c6}.html-structure-line .tag{color:#e34f26}[data-theme=dark] .html-structure-line .tag{color:#ff6b4a}.html-structure-line .attr{color:#9334e9}[data-theme=dark] .html-structure-line .attr{color:#bb86fc}.html-structure-line .string{color:#1e8e3e}[data-theme=dark] .html-structure-line .string{color:#81c995}.html-structure-line .comment{color:#5f6368;font-style:italic}.html-browser-preview{margin:1.5rem 0;border:1px solid #e8eaed;border-radius:8px;overflow:hidden}[data-theme=dark] .html-browser-preview{border-color:#3c4043}.html-browser-header{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#f8f9fa;border-bottom:1px solid #e8eaed}[data-theme=dark] .html-browser-header{background:#292d31;border-bottom-color:#3c4043}.html-browser-dot{width:12px;height:12px;border-radius:50%}.html-browser-dot.red{background:#ff5f57}.html-browser-dot.yellow{background:#febc2e}.html-browser-dot.green{background:#28c840}.html-browser-content{padding:1rem;background:#fff;min-height:100px}[data-theme=dark] .html-browser-content{background:#fff;color:#202124}@media(max-width:768px){.html-hero-title{font-size:1.75rem}.html-features-grid{grid-template-columns:1fr}.html-anatomy-line{flex-direction:column;gap:.5rem}.html-anatomy-code{min-width:auto}}