:root{--color-bg-base:#101214;--color-bg-surface:#1a1d21;--color-bg-surface-glass:rgba(26, 29, 33, 0.9);--color-primary:#00ff9d;--color-primary-dim:rgba(0, 255, 157, 0.1);--color-accent:#ff3366;--color-warning:#ffcc00;--color-border:#2d333b;--color-border-active:#00ff9d;--color-text-main:#e6edf3;--color-text-muted:#8b949e;--font-main:'Inter',system-ui,-apple-system,sans-serif;--font-mono:'JetBrains Mono',monospace;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:32px;--space-xl:64px;--sidebar-width:300px;--max-content-width:800px}:root.theme-light{--color-bg-base:#f6f8fa;--color-bg-surface:#ffffff;--color-bg-surface-glass:rgba(255, 255, 255, 0.9);--color-primary:#0969da;--color-primary-dim:rgba(9, 105, 218, 0.1);--color-accent:#cf222e;--color-warning:#9a6700;--color-border:#d0d7de;--color-border-active:#0969da;--color-text-main:#24292f;--color-text-muted:#57606a}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--color-bg-base);color:var(--color-text-main);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px;background-position:-1px -1px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-bg-base)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}a{color:var(--color-primary);text-decoration:none;transition:all .2s ease;position:relative}a:hover{color:#fff;text-shadow:0 0 5px var(--color-primary)}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes scanline{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}.app-container{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-width);background:var(--color-bg-surface);border-right:1px solid var(--color-border);padding:0;position:fixed;height:100vh;overflow-y:auto;top:0;left:0;display:flex;flex-direction:column;z-index:100;box-shadow:4px 0 20px rgba(0,0,0,.3)}.brand{font-family:var(--font-mono);font-size:1.2rem;font-weight:800;color:#fff;padding:var(--space-lg);border-bottom:1px solid var(--color-border);letter-spacing:-.5px;display:flex;align-items:center;gap:var(--space-sm);background:repeating-linear-gradient(45deg,var(--color-bg-surface),var(--color-bg-surface) 10px,#1f2428 10px,#1f2428 20px)}.brand span{color:var(--color-primary)}.nav-links{list-style:none;display:flex;flex-direction:column;padding:var(--space-md);gap:2px}.nav-item a{display:block;padding:var(--space-sm) var(--space-md);border-radius:2px;color:var(--color-text-muted);font-family:var(--font-mono);font-size:.9rem;border-left:2px solid transparent}.nav-item a:hover{background:rgba(255,255,255,.03);color:#fff}.nav-item a.active{background:var(--color-primary-dim);color:var(--color-primary);border-left:2px solid var(--color-primary);box-shadow:inset 0 0 10px var(--color-primary-dim)}.main-content{margin-left:var(--sidebar-width);flex:1;padding:var(--space-xl);max-width:100%}.content-wrapper{max-width:var(--max-content-width);margin:0 auto;animation:fadeIn .4s ease-out}h1,h2,h3,h4,h5,h6{color:#fff;font-family:var(--font-mono);letter-spacing:-.03em;margin-bottom:var(--space-md);text-wrap:balance;line-height:1.3}h1{font-size:2rem;border-bottom:2px solid var(--color-border);padding-bottom:var(--space-sm);margin-bottom:var(--space-xl);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-md)}.share-actions{display:flex;gap:var(--space-sm)}h1::before{content:'#';margin-right:var(--space-sm);color:var(--color-primary);opacity:.5}h2{font-size:1.5rem;margin-top:var(--space-xl);color:var(--color-primary);border-bottom:1px solid rgba(0,255,157,.1);padding-bottom:var(--space-xs)}h3{font-size:1.25rem;margin-top:var(--space-lg);color:#fff;font-weight:600}h4{font-size:1.1rem;margin-top:var(--space-md);color:var(--color-text-main);text-transform:uppercase;letter-spacing:1px;font-weight:600}h5{font-size:1rem;margin-top:var(--space-md);color:var(--color-primary);font-weight:400}h6{font-size:.9rem;color:var(--color-text-muted);text-transform:uppercase}.card{background:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:4px;padding:var(--space-lg);margin-bottom:var(--space-lg);box-shadow:0 4px 6px rgba(0,0,0,.1);position:relative;overflow:hidden}.card::after{content:'';position:absolute;top:0;right:0;width:20px;height:20px;border-top:2px solid var(--color-border);border-right:2px solid var(--color-border);opacity:.5}.gallery-container{width:100%;max-width:100%;overflow-x:auto;white-space:nowrap;padding:var(--space-md) 0;display:flex;gap:var(--space-md);scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--color-primary) var(--color-bg-base)}.gallery-container::-webkit-scrollbar{height:8px}.gallery-container::-webkit-scrollbar-track{background:var(--color-bg-base);border-radius:4px}.gallery-container::-webkit-scrollbar-thumb{background:var(--color-primary);border-radius:4px}.gallery-item{display:inline-block;height:300px;flex:0 0 auto;scroll-snap-align:center;border:1px solid var(--color-border);border-radius:2px;overflow:hidden;position:relative;transition:transform .2s ease,border-color .2s ease;background:var(--color-bg-surface)}@media (max-width:768px){.gallery-item{height:200px}}.gallery-item:hover{border-color:var(--color-primary);transform:scale(1.02);z-index:10}.gallery-item img{height:100%;width:auto;display:block;object-fit:cover}.gallery-caption{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.8);color:#fff;padding:var(--space-xs) var(--space-sm);font-size:.8rem;font-family:var(--font-mono);opacity:0;transition:opacity .2s ease}.gallery-item:hover .gallery-caption{opacity:1}.interactive-gallery{display:flex;flex-direction:column;gap:var(--space-md);margin-top:var(--space-lg);border:1px solid var(--color-border);padding:var(--space-md);background:rgba(0,0,0,.2)}.gallery-main-stage{width:100%;height:450px;background:#000;border:1px solid var(--color-border);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.gallery-main-image{max-width:100%;max-height:100%;object-fit:contain;opacity:1;transition:opacity .3s ease-in-out}.gallery-main-image.fade-out{opacity:0}.gallery-thumbnails-track{display:flex;gap:var(--space-sm);overflow-x:auto;padding:var(--space-xs) 0;scrollbar-width:thin;scrollbar-color:var(--color-primary) var(--color-bg-base)}.gallery-thumbnails-track::-webkit-scrollbar{height:6px}.gallery-thumbnails-track::-webkit-scrollbar-thumb{background:var(--color-primary)}.gallery-thumbnail-item{height:80px;flex:0 0 auto;border:2px solid transparent;cursor:pointer;opacity:.6;transition:all .2s ease}.gallery-thumbnail-item:hover{opacity:1;border-color:var(--color-text-muted)}.gallery-thumbnail-item.active{opacity:1;border-color:var(--color-primary);box-shadow:0 0 8px rgba(0,255,157,.3)}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--space-md)}.instruction-step{display:flex;gap:var(--space-md);margin-bottom:var(--space-md);padding:var(--space-md);background:rgba(255,255,255,.02);border-left:2px solid var(--color-border);transition:all .2s ease}.instruction-step:hover{border-left-color:var(--color-primary);background:rgba(255,255,255,.04)}.step-number{font-family:var(--font-mono);font-size:1.5rem;font-weight:700;color:var(--color-primary);opacity:.8;line-height:1}.technical-list{list-style:none;counter-reset:tech-counter;margin-top:var(--space-md)}.technical-list li{position:relative;padding-left:var(--space-xl);margin-bottom:var(--space-md);padding-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.05)}.technical-list li:last-child{border-bottom:none}.technical-list li::before{counter-increment:tech-counter;content:counter(tech-counter,decimal-leading-zero) ".";position:absolute;left:0;top:0;font-family:var(--font-mono);color:var(--color-primary);font-size:.9em;opacity:.7}.note-box{background:rgba(0,255,157,.05);border-left:3px solid var(--color-primary);padding:var(--space-md);margin:var(--space-md) 0;font-size:.95em;color:var(--color-text-main)}.note-box strong{display:block;margin-bottom:var(--space-xs);color:var(--color-primary);font-family:var(--font-mono);text-transform:uppercase;font-size:.8em;letter-spacing:1px}.warning-box{background:repeating-linear-gradient(45deg,rgba(255,183,0,.05),rgba(255,183,0,.05) 10px,rgba(0,0,0,0) 10px,rgba(0,0,0,0) 20px)!important;border:1px solid var(--color-warning)!important;color:var(--color-warning)!important;font-family:var(--font-mono);padding:var(--space-md);margin:var(--space-md) 0;border-radius:4px}@media (max-width:768px){.app-container{flex-direction:column}.sidebar{width:100%;height:auto;position:relative;padding:var(--space-md)}.main-content{margin-left:0;padding:var(--space-md)}}.project-card-compact{display:flex;flex-direction:column;padding:0;text-decoration:none;transition:all .3s cubic-bezier(.4, 0, .2, 1);background:var(--color-bg-surface);height:100%}.project-card-compact:hover{transform:translateY(-5px);border-color:var(--color-primary);box-shadow:0 10px 30px rgba(0,255,157,.1)}.project-image-preview{width:100%;height:180px;overflow:hidden;border-bottom:1px solid var(--color-border)}.project-image-preview img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.project-card-compact:hover .project-image-preview img{transform:scale(1.1)}.project-info{padding:var(--space-md);flex-grow:1;display:flex;flex-direction:column}.project-info h3{font-size:1.1rem;margin-bottom:var(--space-xs);color:#fff}.project-info p{font-size:.9rem;color:var(--color-text-muted);margin-bottom:var(--space-md);flex-grow:1}.view-project{font-family:var(--font-mono);font-size:.8rem;color:var(--color-primary);text-transform:uppercase;letter-spacing:1px;display:flex;align-items:center;gap:5px}.project-card-compact:hover .view-project{text-decoration:underline}.image-full img{width:auto!important;max-width:100%;max-height:600px;display:block;margin:0 auto;object-fit:contain}@media (max-width:768px){.image-full img{max-height:400px}}.legacy-content img:not(.gallery-main-image):not(.gallery-thumbnail-item):not(.gallery-item img):not(.project-image-preview img),.project-post img:not(.gallery-main-image):not(.gallery-thumbnail-item):not(.gallery-item img):not(.project-image-preview img),.wsite-image img:not(.gallery-main-image):not(.gallery-thumbnail-item):not(.gallery-item img):not(.project-image-preview img){max-width:800px!important;width:auto!important;height:auto!important;display:block;margin:1rem auto;border-radius:4px}pre{background:var(--color-bg-surface)!important;border:1px solid var(--color-border);border-radius:6px;padding:1.5rem;margin:1.5rem 0;overflow-x:auto;box-shadow:0 4px 12px rgba(0,0,0,.2);position:relative}code{font-family:var(--font-mono);font-size:.9rem;line-height:1.5;color:var(--color-text-main);background:0 0!important}.hljs-comment,.hljs-quote{color:var(--color-text-muted);font-style:italic}.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:var(--color-primary)}.hljs-doctag,.hljs-literal,.hljs-meta,.hljs-number,.hljs-regexp,.hljs-string{color:#79c0ff}.hljs-name,.hljs-section,.hljs-selector-class,.hljs-selector-id,.hljs-title{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-class .hljs-title,.hljs-template-variable,.hljs-type,.hljs-variable{color:#ffa657}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-subst,.hljs-symbol{color:#a5d6ff}.hljs-built_in,.hljs-deletion{color:var(--color-accent)}.hljs-formula{background-color:#eee;font-style:italic}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.legacy-content ol,.legacy-content ul{margin-top:var(--space-sm);margin-bottom:var(--space-sm);padding-left:var(--space-lg);margin-left:var(--space-md);list-style-position:outside}.legacy-content ul{list-style-type:disc}.legacy-content ol{list-style-type:decimal}.legacy-content li{margin-bottom:var(--space-xs);color:var(--color-text-main)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-muted{color:var(--color-text-muted)}.text-sm{font-size:.9em}.mt-sm{margin-top:.5rem}.mt-md{margin-top:1rem}.mt-lg{margin-top:1.5rem}.mb-sm{margin-bottom:.5rem}.mb-md{margin-bottom:1rem}.mb-lg{margin-bottom:1.5rem}.my-sm{margin-top:.5rem;margin-bottom:.5rem}.my-md{margin-top:1rem;margin-bottom:1rem}.my-lg{margin-top:1.5rem;margin-bottom:1.5rem}.text-sm{font-size:.9em}.text-lg{font-size:1.25em}.text-xl{font-size:1.5em}.img-full{width:100%;border-radius:4px;display:block}.tech-table{width:100%;border-collapse:collapse;margin:var(--space-md) 0;font-family:var(--font-mono);font-size:.9em;border:1px solid var(--color-border)}.tech-table td,.tech-table th{text-align:left;padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--color-border)}.tech-table th{background-color:var(--color-bg-surface);color:var(--color-primary);font-weight:600;border-bottom:2px solid var(--color-border-active)}.tech-table tr:hover{background-color:rgba(255,255,255,.02)}.video-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:4px;margin:2rem 0;border:1px solid var(--color-border);background:#000}.video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}.download-block{margin:10px 0;padding:10px;background:rgba(255,255,255,.05);border-radius:4px;border:1px solid var(--color-border)}.download-block a{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--color-primary);text-decoration:none}.download-block a:hover{text-decoration:underline;background:rgba(255,255,255,.05)}.download-block img{opacity:.8;width:32px;height:auto}.profile-card{display:grid;grid-template-columns:1fr 3fr;gap:40px;align-items:start;margin-bottom:var(--space-xl)}.profile-header h2{color:var(--color-primary);font-weight:300;font-size:2rem;border-bottom:none;margin-bottom:0}@media (max-width:768px){.profile-card{grid-template-columns:1fr!important;gap:20px!important}}.text-primary-dim{color:var(--color-primary);opacity:.5}.projects-header{margin-bottom:var(--space-lg);display:flex;align-items:center;gap:10px}.share-dock{margin-top:var(--space-xl);padding:var(--space-lg);background:rgba(0,255,157,.03);border:1px solid var(--color-border);border-radius:4px;display:flex;flex-direction:column;gap:var(--space-md)}.share-dock-header{font-family:var(--font-mono);font-size:.8rem;color:var(--color-primary);text-transform:uppercase;letter-spacing:2px;display:flex;align-items:center;gap:10px}.share-buttons{display:flex;gap:var(--space-md);flex-wrap:wrap}.btn-share{background:0 0;border:1px solid var(--color-border);color:var(--color-text-muted);padding:var(--space-sm) var(--space-md);font-family:var(--font-mono);font-size:.8rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px;border-radius:2px;text-decoration:none!important}.btn-share:hover{border-color:var(--color-primary);color:#fff;background:var(--color-primary-dim);box-shadow:0 0 10px var(--color-primary-dim)}.btn-share.btn-primary{border-color:var(--color-primary);color:var(--color-primary)}.share-success-msg{font-size:.7rem;color:var(--color-primary);font-style:italic;margin-left:10px;opacity:0;transition:opacity .3s ease}.share-success-msg.visible{opacity:1}@media (max-width:480px){h1{font-size:1.5rem}}@media print{#theme-toggle,.project-search,.share-dock,.sidebar{display:none!important}.main-content{margin-left:0!important;padding:0!important}.main-content,body{background:#fff!important;color:#000!important}.card,pre{border:1px solid #ccc!important;box-shadow:none!important;background:#fff!important}a{color:#000!important;text-decoration:underline!important}h1,h2,h3,h4,h5,h6{color:#000!important}}.btn-copy-code{position:absolute;top:10px;right:10px;background:var(--color-bg-surface);border:1px solid var(--color-border);color:var(--color-text-muted);border-radius:4px;padding:4px 8px;font-family:var(--font-mono);font-size:.75rem;cursor:pointer;display:flex;align-items:center;gap:5px;opacity:0;transition:all .2s;z-index:10}pre:hover .btn-copy-code{opacity:1}.btn-copy-code:hover{background:var(--color-bg-base);color:#fff;border-color:var(--color-text-muted)}.btn-back-to-top{position:fixed;bottom:30px;right:30px;width:45px;height:45px;border-radius:50%;background:var(--color-bg-surface-glass);backdrop-filter:blur(5px);border:1px solid var(--color-border);color:var(--color-primary);font-size:1.5rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(20px);transition:all .3s ease;z-index:1000;box-shadow:0 4px 12px rgba(0,0,0,.2)}.btn-back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.btn-back-to-top:hover{background:var(--color-primary);color:#000;box-shadow:0 0 15px var(--color-primary-dim)}.toc-container{background:rgba(0,255,157,.02);border:1px solid var(--color-border);border-left:3px solid var(--color-primary);border-radius:4px;padding:var(--space-md);margin-bottom:var(--space-xl);display:inline-block;min-width:300px;max-width:100%}