:root{--bg: #fdfafb;--card: #ffffff;--border: #f3ecec;--text: #2d2727;--text2: #7d6b6b;--text3: #b7a6a6;--accent: #d4544c;--accent-hover: #e0645c;--accent-light: #fff5f5;--accent-border: #f8dbd9;--radius: 12px;--font-main: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;--shadow-sm: 0 2px 8px rgba(212, 84, 76, .04);--shadow-md: 0 4px 16px rgba(212, 84, 76, .08);--shadow-lg: 0 12px 32px rgba(212, 84, 76, .12)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-main);background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}a{color:var(--accent);text-decoration:none;transition:.2s}a:hover{color:var(--accent-hover)}.app{min-height:100vh;display:flex;flex-direction:column}.header{background:#ffffffd9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:16px 24px;position:sticky;top:0;z-index:100}.header-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between}.brand h1{font-family:Permanent Marker,cursive;font-size:26px;font-weight:400;color:#1a1a1a;display:inline-flex;align-items:center;gap:10px}.brand h1 svg{color:var(--accent)}.title-text{position:relative;display:inline-block}.title-text:after{content:"";position:absolute;bottom:-4px;left:0;right:0;height:6px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 4'%3E%3Cpath d='M0 3.5c5 0 5-3 10-3s5 3 10 3' fill='none' stroke='%23d4544c' stroke-width='2'/%3E%3C/svg%3E") repeat-x;background-size:12px 6px}.nav-links{display:flex;gap:8px}.nav-links a{padding:6px 16px;border-radius:20px;font-size:14px;font-weight:500;color:var(--text2);transition:.2s}.nav-links a:hover{background:var(--accent-light);color:var(--accent)}.hero{text-align:center;padding:80px 24px 60px;background:linear-gradient(180deg,#fff 0%,var(--bg) 100%)}.hero-avatar{width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#ff8a80);display:flex;align-items:center;justify-content:center;margin:0 auto 24px;font-size:42px;color:#fff;font-family:Permanent Marker,cursive;box-shadow:0 8px 24px #d4544c33}.hero h2{font-size:32px;font-weight:700;margin-bottom:12px;color:var(--text)}.hero p{font-size:16px;color:var(--text2);max-width:500px;margin:0 auto;line-height:1.8}.hero-links{display:flex;gap:12px;justify-content:center;margin-top:28px}.hero-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 24px;border-radius:24px;font-size:14px;font-weight:600;transition:all .3s;border:none;cursor:pointer}.hero-btn.primary{background:var(--accent);color:#fff;box-shadow:0 4px 12px #d4544c33}.hero-btn.primary:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 6px 20px #d4544c4d}.hero-btn.secondary{background:#fff;color:var(--text);border:1px solid var(--border)}.hero-btn.secondary:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}.section{max-width:1100px;margin:0 auto;padding:60px 24px}.section-title{font-size:22px;font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:10px}.section-title svg{color:var(--accent)}.section-desc{font-size:14px;color:var(--text2);margin-bottom:32px}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.project-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;transition:all .3s;cursor:pointer;text-decoration:none;color:inherit;display:block}.project-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--accent-border)}.project-card:hover{color:inherit}.project-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}.project-icon{width:40px;height:40px;border-radius:10px;background:var(--accent-light);color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0}.project-name{font-size:16px;font-weight:700}.project-badge{font-size:11px;background:var(--accent-light);color:var(--accent);padding:2px 8px;border-radius:6px;font-weight:600;margin-left:auto}.project-desc{font-size:14px;color:var(--text2);line-height:1.6;margin-bottom:16px}.project-tags{display:flex;flex-wrap:wrap;gap:6px}.project-tag{font-size:12px;padding:3px 10px;border-radius:6px;background:#f9f7f7;color:var(--text2);border:1px solid var(--border);font-family:var(--mono)}.blog-list{display:flex;flex-direction:column;gap:16px}.blog-item{display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px 24px;transition:all .3s;cursor:pointer}.blog-item:hover{transform:translate(8px);border-color:var(--accent-border);box-shadow:var(--shadow-sm)}.blog-title{font-size:15px;font-weight:600}.blog-meta{font-size:12px;color:var(--text3);margin-top:4px}.blog-arrow{color:var(--accent);opacity:0;transition:.3s}.blog-item:hover .blog-arrow{opacity:1}.links-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.link-card{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px 20px;transition:all .3s;text-decoration:none;color:inherit}.link-card:hover{transform:translateY(-2px);border-color:var(--accent-border);box-shadow:var(--shadow-md);color:inherit}.link-icon{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px}.link-name{font-size:14px;font-weight:600}.link-url{font-size:12px;color:var(--text3);margin-top:2px}.footer{text-align:center;padding:32px 24px;color:var(--text3);font-size:13px;border-top:1px solid var(--border);margin-top:auto}.footer a{color:var(--accent)}@media (max-width: 768px){.hero{padding:60px 20px 40px}.hero h2{font-size:24px}.hero-links{flex-direction:column;align-items:center}.projects-grid,.links-grid{grid-template-columns:1fr}.nav-links{display:none}.section{padding:40px 20px}}