:root{--bg: #f7f8ff;--bg-soft: #eef1ff;--card: rgba(255, 255, 255, .82);--text: #171827;--text-muted: #687087;--border: rgba(90, 108, 255, .18);--primary: #6c7cff;--secondary: #22d3ee;--accent: #ff7ac8;--success: #3ddc97;--warning: #ffb454;--danger: #ff5f7e;--code-bg: #101421;--code-text: #dbe7ff;--shadow: 0 18px 60px rgba(47, 61, 120, .14);--radius: 8px;color-scheme:light}[data-theme=dark]{--bg: #080b14;--bg-soft: #101525;--card: rgba(17, 24, 39, .78);--text: #e8ecff;--text-muted: #9ca7c7;--border: rgba(120, 144, 255, .22);--primary: #7c8cff;--secondary: #22d3ee;--accent: #ff7ac8;--code-bg: #070a12;--code-text: #dbe7ff;--shadow: 0 20px 70px rgba(0, 0, 0, .32);color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-soft) 100%),var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.7;text-rendering:optimizeLegibility}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}::selection{background:color-mix(in srgb,var(--secondary) 32%,transparent)}.background-grid,.scanline-layer{position:fixed;inset:0;pointer-events:none}.background-grid{z-index:-2;background-image:linear-gradient(color-mix(in srgb,var(--primary) 11%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--secondary) 10%,transparent) 1px,transparent 1px),linear-gradient(135deg,color-mix(in srgb,var(--accent) 9%,transparent),transparent 34%);background-size:42px 42px,42px 42px,100% 100%;mask-image:linear-gradient(180deg,rgba(0,0,0,.86),transparent 78%)}.scanline-layer{z-index:-1;opacity:.26;background-image:repeating-linear-gradient(180deg,transparent 0,transparent 7px,color-mix(in srgb,var(--secondary) 16%,transparent) 8px)}.site-shell{width:min(1180px,calc(100% - 32px));margin:0 auto}.site-header{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:14px 0;backdrop-filter:blur(18px)}.brand{display:inline-flex;align-items:center;gap:10px;min-width:0}.brand-mark{display:grid;width:38px;height:38px;place-items:center;border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb,var(--card) 86%,transparent);color:var(--secondary);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-weight:800}.brand-text{display:grid;line-height:1.15}.brand-text strong{font-size:.95rem}.brand-text span{color:var(--text-muted);font-size:.78rem}.nav-scroll{display:flex;justify-content:center;gap:6px;overflow-x:auto;scrollbar-width:none}.nav-scroll::-webkit-scrollbar{display:none}.nav-link,.theme-toggle,.button,.text-link{transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease}.nav-link{flex:0 0 auto;padding:8px 11px;border:1px solid transparent;border-radius:var(--radius);color:var(--text-muted);font-size:.9rem}.nav-link:hover,.nav-link.active{border-color:var(--border);background:color-mix(in srgb,var(--card) 76%,transparent);color:var(--text)}.theme-toggle{display:grid;width:38px;height:38px;place-items:center;border:1px solid var(--border);border-radius:var(--radius);background:var(--card);color:var(--secondary);cursor:pointer}.theme-toggle:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--secondary) 55%,var(--border))}.hero-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.88fr);gap:36px;align-items:center;min-height:620px;padding:48px 0 42px}.hero-copy h1,.listing-hero h1,.about-page h1,.article-header h1{margin:0;line-height:1.08;font-family:Segoe UI,system-ui,sans-serif}.hero-copy h1{max-width:720px;font-size:3.6rem}.hero-subtitle{max-width:680px;margin:20px 0 0;color:var(--text);font-size:1.08rem}.hero-cn{max-width:680px;margin:12px 0 0;color:var(--text-muted)}.eyebrow{margin:0 0 10px;color:var(--secondary);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.82rem;font-weight:700}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 16px;border:1px solid var(--border);border-radius:var(--radius);font-weight:700}.button:hover,.text-link:hover{transform:translateY(-2px)}.button.primary{background:color-mix(in srgb,var(--primary) 85%,var(--secondary));color:#fff}.button.ghost{background:var(--card);color:var(--text)}.hero-panel{position:relative;display:grid;gap:14px}.terminal-window,.mascot-card,.category-card,.post-card,.toc-panel,.about-page,.listing-hero{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow)}.terminal-window{position:relative;overflow:hidden}.terminal-window:after{content:"";position:absolute;inset:0;pointer-events:none;border-top:1px solid color-mix(in srgb,var(--secondary) 24%,transparent)}.terminal-topbar{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--code-bg) 88%,transparent)}.terminal-topbar span{width:10px;height:10px;border-radius:999px;background:var(--accent)}.terminal-topbar span:nth-child(2){background:var(--warning)}.terminal-topbar span:nth-child(3){background:var(--secondary)}.terminal-topbar strong{margin-left:6px;color:var(--text-muted);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.78rem}.terminal-window pre{margin:0;padding:22px;overflow:auto;background:var(--code-bg);color:var(--code-text);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.95rem;line-height:1.72}.prompt{color:var(--secondary)}.mascot-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:center;padding:16px}.mascot-avatar{position:relative;display:grid;width:74px;height:74px;place-items:center;border:1px solid color-mix(in srgb,var(--accent) 46%,var(--border));border-radius:var(--radius);background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 20%,transparent),transparent),var(--bg-soft);overflow:hidden}.mascot-avatar img{width:100%;height:100%;object-fit:cover}.pixel-star{position:absolute;top:7px;right:9px;color:var(--secondary);font-size:.82rem}.mascot-copy dl{display:grid;gap:6px;margin:0}.mascot-copy div{display:flex;gap:10px;align-items:center}.mascot-copy dt{min-width:48px;color:var(--text-muted);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.78rem}.mascot-copy dd{display:inline-flex;gap:7px;align-items:center;margin:0;color:var(--text)}.status-dot{width:8px;height:8px;border-radius:999px;background:var(--success);box-shadow:0 0 12px var(--success)}.hud-ring{position:absolute;right:-16px;bottom:-20px;z-index:-1;width:150px;height:150px;border:1px solid color-mix(in srgb,var(--secondary) 30%,transparent);border-radius:999px}.hud-ring:before,.hud-ring:after{content:"";position:absolute;border:1px solid color-mix(in srgb,var(--accent) 26%,transparent);border-radius:inherit}.hud-ring:before{inset:20px}.hud-ring:after{inset:43px}.section-block{padding:36px 0}.section-heading{margin-bottom:18px}.section-heading.split{display:flex;gap:16px;align-items:end;justify-content:space-between}.section-heading h2{margin:0;font-size:1.7rem}.text-link{color:var(--secondary);font-weight:700}.category-grid,.post-grid,.about-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.category-card,.post-card{display:block;padding:20px;transition:transform .16s ease,border-color .16s ease,background .16s ease}.category-card:hover,.post-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--tone, var(--primary)) 62%,var(--border));background:color-mix(in srgb,var(--card) 86%,var(--tone, var(--primary)) 8%)}.tone-primary{--tone: var(--primary)}.tone-secondary{--tone: var(--secondary)}.tone-accent{--tone: var(--accent)}.tone-danger{--tone: var(--danger)}.tone-warning{--tone: var(--warning)}.category-icon{display:grid;width:38px;height:38px;place-items:center;border:1px solid color-mix(in srgb,var(--tone, var(--primary)) 48%,var(--border));border-radius:var(--radius);color:var(--tone, var(--primary));font-size:1.1rem}.category-kicker,.badge{display:inline-flex;align-items:center;min-height:24px;padding:2px 8px;border:1px solid color-mix(in srgb,var(--tone, var(--primary)) 44%,var(--border));border-radius:var(--radius);color:var(--tone, var(--primary));background:color-mix(in srgb,var(--tone, var(--primary)) 10%,transparent);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.74rem;font-weight:800}.category-card h3,.post-card h3{margin:14px 0 8px;font-size:1.16rem;line-height:1.35}.category-card p,.post-card p{margin:0;color:var(--text-muted)}.post-card-topline,.post-meta-line,.article-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--text-muted);font-size:.84rem}.post-card h3 a:hover{color:var(--tone, var(--primary))}.post-meta-line{margin-top:14px}.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.tag-row a,.tag-cloud a{border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb,var(--card) 82%,transparent);color:var(--text-muted);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.78rem}.tag-row a{padding:4px 8px}.tag-row a:hover,.tag-cloud a:hover{border-color:color-mix(in srgb,var(--secondary) 55%,var(--border));color:var(--secondary)}.tag-cloud{display:flex;flex-wrap:wrap;gap:10px}.tag-cloud a{display:inline-flex;gap:8px;align-items:center;padding:7px 10px}.tag-cloud small{color:var(--accent)}.listing-hero,.about-page{margin:46px 0 20px;padding:34px}.listing-hero h1,.about-page h1{font-size:2.3rem}.listing-hero p:last-child,.about-page>p{max-width:760px;color:var(--text-muted)}.about-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:26px}.about-grid h2{margin:0 0 10px;font-size:1.1rem}.about-grid ul{margin:0;padding-left:20px;color:var(--text-muted)}.article-frame{display:grid;grid-template-columns:minmax(0,820px) 230px;gap:28px;align-items:start;justify-content:center;padding:42px 0}.article-main{min-width:0}.back-link{display:inline-flex;margin-bottom:14px;color:var(--secondary);font-size:.92rem;font-weight:700}.article-header{padding-bottom:24px;border-bottom:1px solid var(--border)}.article-header h1{margin-top:14px;font-size:2.7rem}.article-header>p{margin:16px 0 14px;color:var(--text-muted);font-size:1.06rem}.article-tags{margin-top:14px}.article-content{padding-top:22px;font-size:1rem}.article-content h2,.article-content h3{line-height:1.3;scroll-margin-top:96px}.article-content h2{margin:34px 0 12px;font-size:1.55rem}.article-content h3{margin:28px 0 10px;font-size:1.22rem}.article-content p,.article-content li{color:color-mix(in srgb,var(--text) 88%,var(--text-muted))}.article-content a{color:var(--secondary);text-decoration:underline;text-underline-offset:3px}.article-content img{display:block;max-width:100%;height:auto;border:1px solid var(--border);border-radius:var(--radius)}.article-content figure{margin:24px 0}.article-content figcaption{margin-top:8px;color:var(--text-muted);font-size:.9rem;text-align:center}.article-content pre{position:relative;overflow:auto;margin:22px 0;padding:20px;border:1px solid color-mix(in srgb,var(--secondary) 18%,var(--border));border-radius:var(--radius);background:var(--code-bg);color:var(--code-text);box-shadow:inset 0 1px color-mix(in srgb,white 8%,transparent)}.article-content code,.copy-code{font-family:JetBrains Mono,Fira Code,Consolas,monospace}.article-content :not(pre)>code{padding:2px 6px;border:1px solid var(--border);border-radius:6px;background:color-mix(in srgb,var(--code-bg) 86%,transparent);color:var(--code-text);font-size:.9em}.copy-code{position:absolute;top:10px;right:10px;padding:4px 8px;border:1px solid var(--border);border-radius:6px;background:color-mix(in srgb,var(--card) 86%,var(--code-bg));color:var(--secondary);cursor:pointer;font-size:.74rem}.copy-code:hover{border-color:var(--secondary)}.article-content blockquote{margin:22px 0;padding:16px 18px;border:1px solid var(--border);border-left:4px solid var(--secondary);border-radius:var(--radius);background:color-mix(in srgb,var(--card) 76%,var(--secondary) 5%)}.article-content blockquote p{margin:0}.callout-label{display:inline-flex;margin-bottom:8px;color:var(--secondary);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.78rem}.callout-warning{border-left-color:var(--warning)!important}.callout-warning .callout-label{color:var(--warning)}.callout-danger{border-left-color:var(--danger)!important}.callout-danger .callout-label{color:var(--danger)}.callout-success{border-left-color:var(--success)!important}.callout-success .callout-label{color:var(--success)}.toc-panel{position:sticky;top:88px;padding:16px}.toc-panel p{margin:0 0 10px;color:var(--text);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.78rem;font-weight:800}.toc-panel nav{display:grid;gap:8px}.toc-panel a{color:var(--text-muted);font-size:.86rem;line-height:1.35}.toc-panel a:hover{color:var(--secondary)}.toc-panel .depth-3{padding-left:12px}.article-footer-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:36px;padding-top:22px;border-top:1px solid var(--border)}.article-footer-nav a{display:grid;gap:4px;padding:14px;border:1px solid var(--border);border-radius:var(--radius);background:var(--card)}.article-footer-nav a:hover{border-color:color-mix(in srgb,var(--secondary) 55%,var(--border));transform:translateY(-2px)}.article-footer-nav span{color:var(--text-muted);font-size:.82rem}.article-footer-nav strong{line-height:1.35}.site-footer{display:flex;gap:16px;align-items:center;justify-content:space-between;margin-top:34px;padding:24px 0 36px;border-top:1px solid var(--border);color:var(--text-muted)}.site-footer div:first-child{display:grid}.site-footer strong{color:var(--text)}.footer-links{display:flex;gap:14px}.footer-links a:hover{color:var(--secondary)}@media(max-width:920px){.site-header{grid-template-columns:auto auto}.nav-scroll{grid-column:1 / -1;justify-content:start;order:3}.hero-section,.article-frame{grid-template-columns:1fr}.hero-section{min-height:auto;padding-top:34px}.hero-copy h1{font-size:2.6rem}.category-grid,.post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.toc-panel{display:none}}@media(max-width:640px){.site-shell{width:min(100% - 22px,1180px)}.brand-text{display:none}.hero-copy h1{font-size:2.2rem}.hero-subtitle,.hero-cn{font-size:.98rem}.category-grid,.post-grid,.about-grid,.article-footer-nav{grid-template-columns:1fr}.listing-hero,.about-page{padding:22px}.article-header h1{font-size:2rem}.site-footer{align-items:start;flex-direction:column}}