:root{--color-primary:#3b82f6;--color-primary-dark:#2563eb;--color-bg:#fff;--color-bg-subtle:#f8fafc;--color-bg-muted:#f1f5f9;--color-text:#0f172a;--color-text-muted:#64748b;--color-border:#e2e8f0;--radius:8px;--radius-lg:12px;--max-width:1200px;--nav-height:56px}[data-theme=dark]{--color-primary:#60a5fa;--color-primary-dark:#3b82f6;--color-bg:#0f172a;--color-bg-subtle:#1e293b;--color-bg-muted:#334155;--color-text:#f1f5f9;--color-text-muted:#94a3b8;--color-border:#334155}*,:before,:after{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}body{color:var(--color-text);background-color:var(--color-bg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:15px;font-weight:400;line-height:1.6;transition:background-color .15s,color .15s}h1{font-size:48px;font-weight:800;line-height:1.1}h2{font-size:28px;font-weight:700;line-height:1.2}h3{font-size:18px;font-weight:700;line-height:1.3}a{color:var(--color-primary);text-decoration:none;transition:color .15s}a:hover{text-decoration:underline}.nav{height:var(--nav-height);background-color:var(--color-bg-subtle);border-bottom:1px solid var(--color-border);z-index:100;transition:background-color .15s,border-color .15s;position:fixed;top:0;left:0;right:0}.nav-inner{max-width:var(--max-width);flex-direction:row;align-items:center;height:100%;margin:0 auto;padding:0 24px;display:flex}.nav-brand{color:var(--color-primary);font-size:16px;font-weight:700;text-decoration:none}.nav-brand:hover{text-decoration:none}.nav-links{flex-direction:row;align-items:center;gap:24px;margin-left:auto;padding:0;list-style:none;display:flex}.nav-links a{color:var(--color-text-muted);font-size:14px;font-weight:500;text-decoration:none;transition:color .15s}.nav-links a:hover{color:var(--color-text);text-decoration:underline}.theme-toggle{cursor:pointer;color:var(--color-text-muted);background:0 0;border:none;justify-content:center;align-items:center;margin-left:16px;padding:4px;transition:color .15s;display:inline-flex}.theme-toggle:hover{color:var(--color-text)}.main{padding-top:calc(var(--nav-height) + 24px);max-width:var(--max-width);margin:0 auto;padding-bottom:48px;padding-left:24px;padding-right:24px}.hero{text-align:center;padding:64px 0 48px}.hero h1{background:linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-subtitle{color:var(--color-text-muted);max-width:600px;margin:16px auto 0;font-size:17px}.hero-cta{margin-top:20px}.cta-link{background:var(--color-primary);color:#fff;border-radius:var(--radius);padding:10px 24px;font-size:15px;font-weight:600;text-decoration:none;transition:background .15s;display:inline-block}.cta-link:hover{background:var(--color-primary-dark);text-decoration:none}.hero-stats{flex-direction:row;justify-content:center;align-items:center;gap:32px;margin-top:32px;display:flex}.hero-stat{text-align:center}.hero-stat-value{color:var(--color-primary);font-size:32px;font-weight:800}.hero-stat-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:13px}.search-input{border:1px solid var(--color-border);border-radius:var(--radius);background-color:var(--color-bg-subtle);width:100%;color:var(--color-text);padding:12px 16px;font-family:inherit;font-size:15px;transition:border-color .15s,background-color .15s}.search-input:focus{border-color:var(--color-primary);outline:none}.search-input::placeholder{color:var(--color-text-muted)}.cards-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;display:grid}.card{background-color:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--radius);padding:24px;transition:border-color .2s,transform .2s,box-shadow .2s,background-color .15s}.card:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 12px #00000014}[data-theme=dark] .card:hover{box-shadow:0 4px 12px #0000004d}.card-title{color:var(--color-text);margin-bottom:8px}.card-title a{color:inherit;text-decoration:none}.card-title a:hover{color:var(--color-primary);text-decoration:none}.card-description{color:var(--color-text-muted);margin-bottom:16px;font-size:14px}.card-tags{flex-wrap:wrap;gap:6px;display:flex}.badge{background-color:var(--color-bg-muted);color:var(--color-text-muted);border-radius:12px;padding:2px 10px;font-size:12px;font-weight:500;transition:background-color .15s,color .15s;display:inline-block}.card[data-class=core]{border-left:3px solid #3b82f6}.card[data-class=coding]{border-left:3px solid #8b5cf6}.card[data-class=devops]{border-left:3px solid #10b981}.card[data-class=research]{border-left:3px solid #f59e0b}.card[data-class=writing]{border-left:3px solid #ec4899}.card[data-class=data]{border-left:3px solid #06b6d4}.card[data-class=testing]{border-left:3px solid #ef4444}.card[data-class=security]{border-left:3px solid #f97316}.card[data-class=design]{border-left:3px solid #a855f7}.card[data-class=productivity]{border-left:3px solid #14b8a6}.breadcrumbs{color:var(--color-text-muted);flex-direction:row;align-items:center;gap:8px;margin-bottom:24px;font-size:14px;display:flex}.breadcrumbs a{color:var(--color-primary)}.breadcrumbs .separator:before{content:"/"}.skill-detail{max-width:800px;margin:0 auto}.skill-detail h1{margin-bottom:16px}.skill-tags{flex-wrap:wrap;gap:8px;margin-bottom:32px;display:flex}.skill-section{margin-bottom:32px}.skill-section h2{border-bottom:1px solid var(--color-border);margin-bottom:16px;padding-bottom:8px}.skill-content h2{border-bottom:1px solid var(--color-border);margin-top:32px;margin-bottom:16px;padding-bottom:8px;font-size:28px;font-weight:700;line-height:1.2}.skill-content h3{margin-top:24px;margin-bottom:12px;font-size:18px;font-weight:700;line-height:1.3}.skill-content p{margin-bottom:16px}.skill-content ul,.skill-content ol{margin-bottom:16px;padding-left:24px}.skill-content li{margin-bottom:6px}.skill-content strong{font-weight:700}.skill-content em{font-style:italic}.skill-content code{background-color:var(--color-bg-muted);border-radius:4px;padding:2px 6px;font-family:SF Mono,Monaco,Consolas,Liberation Mono,monospace;font-size:13px;font-weight:400;transition:background-color .15s}.skill-content pre{background-color:var(--color-bg-muted);border:1px solid var(--color-border);border-radius:var(--radius);margin-bottom:16px;padding:16px;transition:background-color .15s,border-color .15s;overflow-x:auto}.skill-content pre code{background:0 0;border-radius:0;padding:0;font-size:13px;line-height:1.5}.skill-content table{border-collapse:collapse;width:100%;margin-bottom:16px}.skill-content th{background-color:var(--color-bg-muted);text-align:left;border-bottom:2px solid var(--color-border);padding:12px;font-weight:600;transition:background-color .15s,border-color .15s}.skill-content td{border-bottom:1px solid var(--color-border);padding:12px;transition:border-color .15s}code{font-family:SF Mono,Monaco,Consolas,Liberation Mono,monospace;font-size:13px;font-weight:400;line-height:1.5}:not(pre)>code{background-color:var(--color-bg-muted);border-radius:4px;padding:2px 6px;transition:background-color .15s}pre{background-color:var(--color-bg-muted);border:1px solid var(--color-border);border-radius:var(--radius);margin-bottom:16px;padding:16px;transition:background-color .15s,border-color .15s;overflow-x:auto}pre code{background:0 0;border-radius:0;padding:0}table{border-collapse:collapse;width:100%}th{background-color:var(--color-bg-muted);text-align:left;border-bottom:2px solid var(--color-border);padding:12px;font-weight:600;transition:background-color .15s,border-color .15s}td{border-bottom:1px solid var(--color-border);padding:12px;transition:border-color .15s}.footer{border-top:1px solid var(--color-border);text-align:center;color:var(--color-text-muted);margin-top:48px;padding:24px;font-size:13px;transition:border-color .15s,color .15s}.footer a{color:var(--color-primary)}.nav,.nav-inner,.card,.search-input,.badge,.footer,.breadcrumbs,th,td,pre,code{transition:background-color .15s,color .15s,border-color .15s}@media (max-width:768px){h1{font-size:36px}.cards-grid{grid-template-columns:1fr}.nav-links{flex-wrap:wrap;gap:16px}.hero{padding:48px 0 32px}.hero-stats{gap:24px}.main{padding-bottom:32px;padding-left:16px;padding-right:16px}.skill-detail{max-width:100%}}@media (max-width:480px){h1{font-size:28px}h2{font-size:22px}h3{font-size:16px}body{font-size:14px}.hero-subtitle{font-size:15px}.hero-stat-value{font-size:24px}.nav-inner{padding:0 16px}.card{padding:16px}.skill-content pre{padding:12px}th,td{padding:8px}}