:root{--primary-color:#2563eb;--secondary-color:#7c3aed;--success-color:#10b981;--glass-bg:rgba(255,255,255,0.1);--glass-border:rgba(255,255,255,0.2);--shadow-lg:0 20px 60px rgba(0,0,0,0.3);--shadow-sm:0 10px 30px rgba(0,0,0,0.1);--transition-smooth:all 0.4s cubic-bezier(0.4,0,0.2,1);--site-header-height:60px;--tech-navbar-height:38px;--tech-panel-top-gap:calc(var(--site-header-height) + var(--tech-navbar-height));--tech-sticky-offset:calc(var(--site-header-height) + var(--tech-navbar-height));--tech-panel-max-height:calc(100dvh - var(--site-header-height) - var(--tech-navbar-height) - 1.5rem);--tech-sidebar-width:280px}.dark-theme{--glass-bg:rgba(0,0,0,0.2);--glass-border:rgba(255,255,255,0.1)}body,html{margin:0;padding:0;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:color .6s cubic-bezier(.4,0,.2,1);box-sizing:border-box;scroll-behavior:smooth;scroll-padding-top:var(--tech-sticky-offset);background:linear-gradient(135deg,var(--bg-start,#f0ebe3) 0,var(--bg-end,#e4ddd3) 100%)}.dark-theme body{background:linear-gradient(135deg,var(--bg-start,#0f172a) 0,var(--bg-end,#1e293b) 100%)}*,:after,:before{box-sizing:inherit}.nav-link,.navbar-nav .nav-link,a[href^="#"],nav a{scroll-behavior:smooth;scroll-margin-top:var(--tech-sticky-offset)}.nav-link,.navbar-nav .nav-link,nav a{transition:all .3s cubic-bezier(.4,0,.2,1)}.scroll-to,[data-scroll],[href*="#"]{scroll-behavior:smooth;scroll-margin-top:var(--tech-sticky-offset);transition:scroll-behavior .3s ease}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bs-light,#f1f1f1);border-radius:5px}.dark-theme ::-webkit-scrollbar-track{background:var(--bs-dark,#2d3748)}::-webkit-scrollbar-thumb{background:var(--primary-color,#2563eb);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--secondary-color,#7c3aed)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes glow{0%,to{box-shadow:0 0 20px rgba(59,130,246,.5)}50%{box-shadow:0 0 40px rgba(59,130,246,.8)}}@keyframes slideInFromBottom{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.float-animation{animation:float 6s ease-in-out infinite}.glow-animation{animation:glow 2s ease-in-out infinite}.gradient-text{color:var(--primary-color,#2563eb)}.glass-effect{background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border)}.hover-lift{transition:var(--transition-smooth)}.hover-lift:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}.progress-bar{position:fixed;top:0;left:0;right:0;height:3px;background:var(--primary-color,#2563eb);transform-origin:0;z-index:9999}.sandpack-container{border-radius:12px;overflow:hidden;box-shadow:var(--shadow-lg);transition:var(--transition-smooth)}.sandpack-container:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.quiz-item{transition:var(--transition-smooth);border-radius:10px;overflow:hidden}.quiz-item:hover{transform:scale(1.02);box-shadow:var(--shadow-sm)}.nav-link-hover{position:relative;overflow:hidden}.nav-link-hover:after{content:"";position:absolute;bottom:0;left:-100%;width:100%;height:2px;background:var(--primary-color,#2563eb);transition:left .3s ease}.nav-link-hover:hover:after{left:100%}.btn-gradient{background:var(--primary-color,#2563eb);border:none;color:white;transition:var(--transition-smooth);position:relative;overflow:hidden}.btn-gradient:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(59,130,246,.3)}.table-hover-glow tbody tr{transition:var(--transition-smooth)}.table-hover-glow tbody tr:hover{background:var(--primary-color,#2563eb);opacity:.06;transform:translateX(5px)}.skeleton{background:linear-gradient(90deg,var(--bs-secondary-bg) 25%,var(--bs-tertiary-bg) 50%,var(--bs-secondary-bg) 75%);background-size:200% 100%;animation:loading 1.5s infinite}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}@media (max-width:768px){.glass-effect{backdrop-filter:none;-webkit-backdrop-filter:none}}@media (prefers-reduced-motion:reduce){*,:after,:before{transition:none!important;animation:none!important}}:root{--tech-sidebar-bg:#f8fafc;--section-card-bg:#f8fafc;--code-inline-bg:rgba(100,116,139,0.16);--sidebar-group-hover:rgba(59,130,246,0.08);--sidebar-active-bg:rgba(59,130,246,0.14);--sidebar-border:rgba(100,116,139,0.22);--sidebar-scroll-thumb:rgba(100,116,139,0.4);--nav-card-bg:#f8fafc;--nav-next-grad-a:#3b82f6;--nav-next-grad-b:#7c3aed;--toc-border:rgba(100,116,139,0.18)}.dark-theme{--tech-sidebar-bg:#1e293b;--section-card-bg:#1f2937;--code-inline-bg:rgba(148,163,184,0.22);--sidebar-group-hover:rgba(59,130,246,0.15);--sidebar-active-bg:rgba(59,130,246,0.22);--sidebar-border:rgba(148,163,184,0.2);--sidebar-scroll-thumb:rgba(148,163,184,0.4);--nav-card-bg:#1e293b;--toc-border:rgba(148,163,184,0.18)}.reading-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:1100;transform-origin:0 50%;transform:scaleX(0);will-change:transform;pointer-events:none}.back-to-top-btn{position:fixed;bottom:1.5rem;right:1.5rem;z-index:1050;width:44px;height:44px;border-radius:50%;border:none;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s ease,transform .25s ease,visibility .25s}.back-to-top-btn.is-visible{opacity:1;visibility:visible;transform:translateY(0)}.tech-sidebar{position:sticky;top:var(--tech-panel-top-gap);z-index:40;width:var(--tech-sidebar-width);min-width:var(--tech-sidebar-width);max-width:var(--tech-sidebar-width);height:var(--tech-panel-max-height);overflow-y:auto;overflow-x:hidden;padding:.9rem .75rem 1.5rem;transition:width .25s ease,min-width .25s ease,max-width .25s ease,padding .25s ease,opacity .2s ease;scrollbar-gutter:stable}.tech-sidebar.is-collapsed{width:0;min-width:0;max-width:0;padding-left:0;padding-right:0;opacity:0;border-right-width:0!important;overflow:hidden}.tech-sidebar::-webkit-scrollbar{width:6px}.tech-sidebar::-webkit-scrollbar-thumb{background:var(--sidebar-scroll-thumb);border-radius:999px}.tech-sidebar::-webkit-scrollbar-track{background:transparent}.tech-sidebar--drawer{position:fixed;left:0;transform:translateX(-100%);visibility:hidden;width:var(--tech-sidebar-width);min-width:var(--tech-sidebar-width);max-width:var(--tech-sidebar-width);height:var(--tech-panel-max-height);padding:0 0 1.5rem;box-shadow:16px 0 40px rgba(0,0,0,.18);transition:transform .3s ease,visibility .3s}.tech-sidebar--drawer.is-open{transform:translateX(0);visibility:visible}.tech-sidebar__drawer-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.85rem 1rem;position:sticky;top:0;z-index:2;background:var(--tech-sidebar-bg);border-bottom:1px solid var(--sidebar-border)}.tech-sidebar__close{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;border:1px solid var(--sidebar-border);background:var(--sidebar-group-hover);color:inherit;cursor:pointer;transition:background-color .2s ease}.tech-sidebar__close:hover{background:var(--sidebar-active-bg)}.tech-sidebar__header{border-radius:14px;padding:1rem;margin-bottom:.85rem}.tech-sidebar__progress{position:relative;width:58px;height:58px;flex-shrink:0}.tech-sidebar__progress span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700}.tech-sidebar__overview{margin-bottom:.35rem}.sidebar-group{margin-bottom:.2rem}.sidebar-group__header{display:flex;align-items:center;gap:.5rem;width:100%;padding:.55rem .6rem;border:none;background:transparent;border-radius:10px;font-size:.85rem;font-weight:600;cursor:pointer;text-align:left;transition:background-color .2s ease}.sidebar-group__header:hover{background:var(--sidebar-group-hover)}.sidebar-group__chevron{flex-shrink:0;transition:transform .2s ease}.sidebar-group__chevron.is-open{transform:rotate(90deg)}.sidebar-group__title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-group__count{flex-shrink:0;font-size:.68rem;font-weight:700;line-height:1;padding:.25rem .45rem;border-radius:999px}.sidebar-group__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease}.sidebar-group__body.is-expanded{grid-template-rows:1fr}.sidebar-group__list{overflow:hidden;min-height:0;margin:0;padding:0;list-style:none}.tech-topic-item{position:relative;display:flex;align-items:center;gap:.55rem;padding:.5rem .6rem .5rem .75rem;border-radius:8px;font-size:.84rem;line-height:1.35;text-decoration:none;color:var(--tech-sidebar-text,inherit);transition:background-color .2s ease,color .2s ease,transform .2s ease}.tech-topic-item:hover{background:var(--sidebar-group-hover);transform:translateX(2px);text-decoration:none}.tech-topic-item__icon{flex-shrink:0;color:var(--tech-accent,#3b82f6);opacity:.7}.tech-topic-item__name{min-width:0;overflow:hidden;text-overflow:ellipsis}.tech-topic-item.is-active{background:var(--sidebar-active-bg);font-weight:600;color:var(--tech-accent,#3b82f6)}.tech-topic-item.is-active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:55%;border-radius:999px;background:var(--tech-accent,#3b82f6)}.sidebar-overlay{position:fixed;inset:0;z-index:1055;background:rgba(2,6,23,.55);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .3s ease}.sidebar-overlay.is-visible{opacity:1;pointer-events:auto}@media (max-width:991.98px){.tech-sidebar:not(.tech-sidebar--drawer){display:none}}@media (max-width:575.98px){:root{--tech-sidebar-width:min(85vw,300px)}}.topic-nav{border-top:1px solid var(--toc-border)}.topic-nav__grid{display:flex;flex-direction:column;gap:.85rem}@media (min-width:576px){.topic-nav__grid{flex-direction:row}}.topic-nav-card{flex:1 1 0;display:flex;flex-direction:column;gap:.4rem;padding:1rem 1.25rem;border:1px solid var(--toc-border);border-radius:14px;cursor:pointer;text-align:left;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.topic-nav-card:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.08)}.topic-nav-card--next{position:relative;text-align:right}.topic-nav-card--next:before{content:"";position:absolute;top:0;left:1.25rem;right:1.25rem;height:3px;border-radius:0 0 6px 6px;background:linear-gradient(90deg,var(--nav-next-grad-a),var(--nav-next-grad-b))}.topic-nav-card.is-disabled{opacity:.45;cursor:not-allowed}.topic-nav-card__label{display:inline-flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.topic-nav-card__label--next{justify-content:flex-end}.topic-nav-card__title{font-size:.95rem;font-weight:600;line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.tutorial-content{font-size:1rem}.tutorial-content p{line-height:1.8}.tutorial-content ol,.tutorial-content ul{padding-left:1.5rem;line-height:1.8}.tutorial-content li{margin-bottom:.3rem}.tutorial-content code{background:var(--code-inline-bg);padding:.12rem .4rem;border-radius:6px;font-size:.9em}.tutorial-content h2:first-of-type{font-size:clamp(1.65rem,4vw,2.35rem);line-height:1.2;font-weight:800;margin-bottom:.5rem}.tutorial-content table{border-collapse:separate;border-spacing:0;border-radius:12px;overflow:hidden;width:100%;font-size:.92rem}.hdr-action{display:inline-flex!important;align-items:center!important;gap:.5rem;padding:.6rem 1.4rem!important;border-radius:999px!important;font-weight:600;font-size:.92rem;line-height:1;background-color:var(--primary-color,#2563eb)!important;border:1px solid transparent!important;box-shadow:0 6px 18px rgba(99,102,241,.22);transition:transform .25s ease,box-shadow .25s ease}.hdr-action,.hdr-action:hover{color:#ffffff!important;text-decoration:none}.hdr-action:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(99,102,241,.4)}.hdr-action--outline{color:var(--primary-color,#2563eb)!important;background-color:transparent!important;border:1px solid var(--border-color,#dbd4c9)!important;box-shadow:none!important}.hdr-action--outline:hover{color:var(--primary-color,#2563eb)!important;background:var(--card-bg,#ffffff);border-color:var(--primary-color,#2563eb)!important;box-shadow:0 8px 20px rgba(37,99,235,.16)}.dark-theme .hdr-action--outline,.dark-theme .hdr-action--outline:hover{color:var(--primary-color,#60a5fa)!important}.hdr-action--block{width:100%;justify-content:center;border-radius:14px;padding:.78rem;box-shadow:none}.hdr-mobile{animation:hp-fade-in .22s ease both}.site-logo{z-index:0;border-radius:14px}.site-logo:after{content:"";position:absolute;inset:-4px;border-radius:18px;background:var(--primary-color,#2563eb);opacity:.25;filter:blur(8px);z-index:-1;transition:opacity .3s ease}.site-brand:hover .site-logo:after{opacity:.5}.site-hamburger,.site-theme-toggle{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.site-theme-toggle:hover{transform:rotate(12deg);box-shadow:0 0 0 4px rgba(99,102,241,.14)}.site-hamburger:hover,.site-theme-toggle:hover{border-color:var(--primary-color,#2563eb)!important}.site-hamburger:hover{transform:translateY(-1px)}.tech-item{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem 1rem;border-radius:999px;font-weight:500;font-size:.8rem;line-height:1.2;white-space:nowrap;flex-shrink:0;color:var(--text-color,#1e293b);background:var(--card-bg,#ffffff);border:1px solid var(--border-color,#dbd4c9);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background-color .22s ease,color .22s ease}.tech-item:hover{transform:translateY(-1px);border-color:var(--cat-color,var(--primary-color,#2563eb));box-shadow:0 6px 16px color-mix(in srgb,var(--cat-color,var(--primary-color)) 22%,transparent);text-decoration:none}.tech-item__dot{width:8px;height:8px;border-radius:50%;background:var(--cat-color,var(--primary-color,#2563eb));flex-shrink:0;transition:transform .22s ease,box-shadow .22s ease}.tech-item:hover .tech-item__dot{box-shadow:0 0 0 3px color-mix(in srgb,var(--cat-color,var(--primary-color)) 18%,transparent)}.tech-item[aria-current=page]{color:#ffffff;background:var(--cat-color,var(--primary-color));border-color:transparent;box-shadow:0 6px 16px color-mix(in srgb,var(--cat-color,var(--primary-color)) 32%,transparent)}.dark-theme .tech-item[aria-current=page]{color:#0f172a}.tech-item[aria-current=page] .tech-item__dot{background:#ffffff}.dark-theme .tech-item[aria-current=page] .tech-item__dot{background:#0f172a}.tech-nav-arrow{width:34px;height:34px;min-width:34px;flex-shrink:0;border-radius:50%;border:1px solid var(--border-color,#dbd4c9);background:var(--card-bg,#ffffff);color:var(--text-muted,#64748b);position:relative;z-index:4;cursor:pointer;transition:background-color .22s ease,color .22s ease,border-color .22s ease,transform .22s ease}.dark-theme .tech-nav-arrow{color:#94a3b8}.tech-nav-arrow:hover{background:var(--primary-color,#2563eb);border-color:var(--primary-color,#2563eb);color:#ffffff;transform:scale(1.06)}.tech-scroll-wrap{position:relative;display:flex;flex:1 1 auto;min-width:0}.tech-scroll-fade{position:absolute;top:2px;bottom:2px;width:30px;pointer-events:none;z-index:3}.tech-scroll-fade--left{left:0;background:linear-gradient(to right,var(--background-color,#ffffff),transparent)}.tech-scroll-fade--right{right:0;background:linear-gradient(to left,var(--background-color,#ffffff),transparent)}.dark-theme .tech-scroll-fade--left{background:linear-gradient(to right,var(--background-color,#0f172a),transparent)}.dark-theme .tech-scroll-fade--right{background:linear-gradient(to left,var(--background-color,#0f172a),transparent)}.sidebar-group__header{transition:background-color .2s ease,transform .2s ease}.sidebar-group__header:hover{transform:translateX(2px)}.sidebar-group__header:hover .sidebar-group__title{color:var(--tech-accent,var(--primary-color))}.sidebar-group__title{transition:color .2s ease}.sidebar-group__chevron{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--sidebar-group-hover,rgba(59,130,246,.08));transition:transform .2s ease,background-color .2s ease,color .2s ease}.sidebar-group__header:hover .sidebar-group__chevron{color:var(--tech-accent,var(--primary-color));background:color-mix(in srgb,var(--tech-accent,var(--primary-color)) 16%,transparent)}.sidebar-group__count{background:var(--sidebar-group-hover,rgba(59,130,246,.08));color:var(--tech-accent,var(--primary-color))}.tech-topic-item:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%) scaleY(0);width:3px;height:16px;border-radius:3px;background:var(--primary-color,#2563eb);transition:transform .22s ease}.tech-topic-item.is-active:before,.tech-topic-item:hover:before{transform:translateY(-50%) scaleY(1)}.tech-topic-item.is-active .tech-topic-item__icon{opacity:1}.tech-sidebar__progress{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--tech-accent,#3b82f6) 30%,transparent))}.tech-sidebar__close{transition:background-color .2s ease,transform .2s ease}.tech-sidebar__close:hover{transform:rotate(90deg)}.tech-sidebar::-webkit-scrollbar{width:8px}.tech-sidebar::-webkit-scrollbar-thumb{border-radius:8px}.footer{border-top:none!important}.footer:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--primary-color,#2563eb);z-index:1}.footer .social-icon{box-shadow:0 4px 12px rgba(2,6,23,.08);transition:box-shadow .25s ease,transform .25s ease}.footer .social-icon:hover{box-shadow:0 10px 22px rgba(99,102,241,.3)}.footer a:not(.btn){transition:color .2s ease,transform .2s ease}@media (min-width:992px) and (max-width:1279.98px){.hdr-action{padding:.32rem .8rem!important;font-size:.78rem!important;gap:.3rem!important;letter-spacing:-.01em}.hdr-action i,.hdr-action svg{font-size:.78rem}.tech-item{padding:.28rem .6rem!important;font-size:.7rem!important;letter-spacing:-.01em}.tech-item__dot{width:6px;height:6px}.tech-nav-arrow{width:28px;height:28px;min-width:28px}.site-logo{width:36px;height:36px}.site-logo:after{inset:-3px;border-radius:14px}.site-hamburger,.site-theme-toggle{width:34px!important;height:34px!important}}@media (min-width:768px) and (max-width:991.98px){.hdr-action{padding:.28rem .65rem!important;font-size:.72rem!important;gap:.25rem!important}.tech-item{padding:.25rem .5rem!important;font-size:.68rem!important}.tech-item__dot{width:5px;height:5px}.tech-nav-arrow{width:26px;height:26px;min-width:26px}}@media (max-width:575.98px){.hdr-action{padding:.25rem .55rem!important;font-size:.7rem!important;gap:.2rem!important}.tech-item{padding:.22rem .45rem!important;font-size:.65rem!important}.tech-item__dot{width:5px;height:5px}}.py-kw{color:#3b82f6;font-weight:600}.py-str{color:#10b981}.py-cmt{color:#6b7280;font-style:italic}.py-num{color:#f59e0b}.py-bi{color:#8b5cf6}.py-dec{color:#ec4899}.dark-theme .py-kw{color:#60a5fa}.dark-theme .py-str{color:#34d399}.dark-theme .py-cmt{color:#6b7280}.dark-theme .py-num{color:#fbbf24}.dark-theme .py-bi{color:#a78bfa}.dark-theme .py-dec{color:#f472b6}.py-syn-kw{color:#3b82f6;font-weight:600}.py-syn-str{color:#10b981}.py-syn-cmt{color:#6b7280;font-style:italic}.py-syn-num{color:#f59e0b}.py-syn-bi{color:#8b5cf6}.py-syn-dec{color:#ec4899}.dark-theme .py-syn-kw{color:#60a5fa}.dark-theme .py-syn-str{color:#34d399}.dark-theme .py-syn-cmt{color:#6b7280}.dark-theme .py-syn-num{color:#fbbf24}.dark-theme .py-syn-bi{color:#a78bfa}.dark-theme .py-syn-dec{color:#f472b6}.py-jupyter-line:hover{background:rgba(59,130,246,.04)}.dark-theme .py-jupyter-line:hover{background:rgba(59,130,246,.08)}.py-jupyter-btn:hover{filter:brightness(1.1)}.py-jupyter-code::-webkit-scrollbar{width:6px;height:6px}.py-jupyter-code::-webkit-scrollbar-thumb{border-radius:3px;background:rgba(128,128,128,.3)}.py-jupyter-output pre::-webkit-scrollbar{width:6px}.py-jupyter-output pre::-webkit-scrollbar-thumb{border-radius:3px;background:rgba(128,128,128,.3)}@keyframes hp-fade-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.footer .social-icon,.hdr-action,.hdr-action:hover,.site-hamburger,.site-theme-toggle,.tech-item,.tech-item:hover,.tech-nav-arrow,.tech-topic-item{transform:none!important}}