:root{--bg: #0e1116;--panel: #161b22;--panel-2: #1c2230;--border: #2a3142;--text: #e8eaf0;--muted: #8a93a6;--accent: #7c5cff;--accent-2: #00d4a8;--accent-3: #ff6f9c;--link: #82aaff;--warn: #ffb547;--max-w: 760px;--max-w-wide: 1080px}@media(prefers-color-scheme:light){:root{--bg: #fafbfc;--panel: #ffffff;--panel-2: #f6f8fa;--border: #e1e4e8;--text: #24292f;--muted: #6a737d;--link: #0969da}}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Hiragino Sans,Yu Gothic UI,sans-serif;line-height:1.75;font-size:16px;-webkit-font-smoothing:antialiased}a{color:var(--link);text-decoration:none}a:hover{text-decoration:underline}.wrap{max-width:var(--max-w);margin:0 auto;padding:24px 20px 80px}.wrap-wide{max-width:var(--max-w-wide);margin:0 auto;padding:24px 20px}header.site{border-bottom:1px solid var(--border);padding:14px 0;background:#0e1116cc;backdrop-filter:blur(12px);position:sticky;top:0;z-index:100}@media(prefers-color-scheme:light){header.site{background:#ffffffd9}}header.site .inner{max-width:var(--max-w-wide);margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between}header.site .logo{font-weight:800;font-size:18px;letter-spacing:.5px;color:var(--text);display:inline-flex;align-items:center;gap:8px}header.site .logo-mark{width:28px;height:28px;background:linear-gradient(135deg,var(--accent),var(--accent-2));border-radius:7px;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:14px}header.site nav a{margin-left:16px;color:var(--muted);font-size:14px}header.site nav a:hover{color:var(--text);text-decoration:none}.hero{position:relative;margin:0 -20px 40px;padding:64px 24px 56px;border-radius:0;overflow:hidden;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(124,92,255,.18),transparent),radial-gradient(ellipse 60% 50% at 80% 100%,rgba(0,212,168,.12),transparent),linear-gradient(180deg,#131722,#0e1116)}@media(min-width:720px){.hero{border-radius:24px;margin:0 0 48px}}.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(ellipse 60% 60% at 50% 50%,black,transparent);pointer-events:none}.hero-content{position:relative;display:grid;grid-template-columns:1fr;gap:24px;align-items:center}@media(min-width:720px){.hero-content{grid-template-columns:1.4fr 1fr}}.hero h1{font-size:32px;margin:0 0 12px;font-weight:800;line-height:1.25;background:linear-gradient(135deg,#fff,#b9c0d4);-webkit-background-clip:text;background-clip:text;color:transparent}@media(min-width:720px){.hero h1{font-size:40px}}.hero p.lead{font-size:16px;color:var(--muted);margin:0 0 20px}@media(min-width:720px){.hero p.lead{font-size:17px}}.hero .badges{display:flex;flex-wrap:wrap;gap:8px}.hero .badge-pill{font-size:12px;padding:5px 12px;border-radius:999px;background:#7c5cff1f;color:#c9bcff;border:1px solid rgba(124,92,255,.3)}.hero-illust{position:relative;display:flex;justify-content:center}.hero-illust svg{width:100%;max-width:320px;height:auto}h1,h2,h3{line-height:1.4}h1{font-size:28px;margin:0 0 16px;font-weight:800}h2{font-size:24px;margin:48px 0 16px;font-weight:800;display:flex;align-items:center;gap:10px;padding-bottom:8px;border-bottom:2px solid var(--border)}h2:before{content:"";display:inline-block;width:4px;height:24px;background:linear-gradient(180deg,var(--accent),var(--accent-2));border-radius:2px}h3{font-size:19px;margin:32px 0 12px;font-weight:700;color:var(--text)}p{margin:0 0 16px}ul,ol{padding-left:24px;margin:0 0 16px}li{margin-bottom:4px}img{max-width:100%;height:auto;border-radius:8px}blockquote{border-left:3px solid var(--accent);margin:16px 0;padding:8px 16px;color:var(--muted);background:#7c5cff0d;border-radius:0 8px 8px 0}table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px;background:var(--panel);border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #0000000f}th,td{border-bottom:1px solid var(--border);padding:10px 14px;text-align:left}tr:last-child td{border-bottom:none}th{background:linear-gradient(180deg,var(--panel-2),var(--panel));font-weight:700;font-size:13px;color:var(--text);letter-spacing:.3px}tbody tr:hover{background:#7c5cff0a}code{background:var(--panel);padding:2px 6px;border-radius:4px;font-family:ui-monospace,monospace;font-size:13px}pre{background:var(--panel);border:1px solid var(--border);padding:12px;border-radius:8px;overflow-x:auto;margin:16px 0}pre code{background:none;padding:0}.post-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:24px}@media(min-width:600px){.post-grid{grid-template-columns:repeat(2,1fr)}}.post-card{display:block;background:var(--panel);border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:transform .12s ease,border-color .2s ease,box-shadow .2s ease;text-decoration:none;color:inherit}.post-card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 12px 28px #7c5cff1f;text-decoration:none}.post-card .card-thumb{aspect-ratio:16 / 9;background:radial-gradient(ellipse 80% 80% at 30% 20%,rgba(124,92,255,.35),transparent),radial-gradient(ellipse 80% 80% at 70% 80%,rgba(0,212,168,.25),transparent),linear-gradient(135deg,#1a1f2e,#131722);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.post-card .card-thumb:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,black,transparent)}.post-card .card-thumb svg{width:56px;height:56px;position:relative;z-index:1;opacity:.9}.post-card .card-body{padding:16px}.post-card h3{margin:0 0 8px;font-size:16px;font-weight:700;color:var(--text);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.post-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.post-card .card-meta{display:flex;align-items:center;justify-content:space-between;margin-top:12px;font-size:12px;color:var(--muted)}.post-card .card-meta .cat{display:inline-block;background:#7c5cff1a;color:#c9bcff;padding:3px 10px;border-radius:999px;font-weight:600}.post-hero{margin:0 -20px 32px;position:relative;background:radial-gradient(ellipse 80% 50% at 30% 0%,rgba(124,92,255,.15),transparent),radial-gradient(ellipse 60% 50% at 90% 100%,rgba(0,212,168,.1),transparent),linear-gradient(180deg,#131722,#0e1116);padding:48px 24px;overflow:hidden}@media(min-width:720px){.post-hero{border-radius:20px;margin:0 0 32px;padding:56px 40px}}.post-hero:before{content:"";position:absolute;inset:0;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:32px 32px;mask-image:radial-gradient(ellipse 60% 60% at 50% 50%,black,transparent)}.post-hero .inner{position:relative;max-width:var(--max-w);margin:0 auto}.post-hero .category-badge{display:inline-block;font-size:12px;font-weight:700;padding:5px 14px;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;letter-spacing:.5px;margin-bottom:16px}.post-hero h1{font-size:26px;font-weight:800;line-height:1.4;margin:0 0 16px;background:linear-gradient(135deg,#fff,#c9d1de);-webkit-background-clip:text;background-clip:text;color:transparent}@media(min-width:720px){.post-hero h1{font-size:32px}}.post-hero .meta{display:flex;flex-wrap:wrap;gap:16px;font-size:13px;color:var(--muted)}.post-hero .meta-item{display:inline-flex;align-items:center;gap:6px}.post-hero .meta svg{width:14px;height:14px;opacity:.7}.affiliate-disclosure{background:#ffb54714;border:1px solid rgba(255,181,71,.25);border-radius:10px;padding:12px 16px;font-size:13px;color:var(--muted);margin:0 0 32px;display:flex;align-items:flex-start;gap:10px}.affiliate-disclosure svg{flex-shrink:0;width:18px;height:18px;margin-top:2px;opacity:.7}.callout{background:linear-gradient(135deg,#7c5cff0f,#00d4a80a);border:1px solid rgba(124,92,255,.2);border-radius:14px;padding:18px 22px;margin:24px 0;font-size:14px}.callout-title{font-weight:700;color:var(--text);margin-bottom:6px;display:flex;align-items:center;gap:8px}.callout-title svg{width:18px;height:18px}.comparison-card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:20px;margin:16px 0;display:grid;grid-template-columns:60px 1fr;gap:16px;align-items:start}.comparison-card .icon{width:60px;height:60px;background:linear-gradient(135deg,#7c5cff26,#00d4a81a);border-radius:12px;display:flex;align-items:center;justify-content:center}.comparison-card .icon svg{width:32px;height:32px}.comparison-card .item-num{font-size:12px;color:var(--muted);font-weight:600;margin-bottom:2px}.comparison-card h3{margin:0 0 6px;font-size:16px}.comparison-card .price-tag{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:#00d4a81a;color:var(--accent-2);margin-bottom:8px}.comparison-card p{margin:0;font-size:14px;color:var(--muted)}.image-placeholder{width:100%;aspect-ratio:16 / 9;background:repeating-linear-gradient(135deg,var(--panel) 0 12px,var(--panel-2) 12px 24px);border:2px dashed var(--border);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:16px 0;color:var(--muted);font-size:13px;text-align:center;padding:16px}.image-placeholder svg{width:36px;height:36px;opacity:.4;margin-bottom:8px}.toc{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:16px 20px;margin:0 0 32px;font-size:14px}.toc-title{font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:8px}.toc-title svg{width:16px;height:16px}.toc ol{padding-left:24px;margin:0}.toc a{color:var(--muted)}.toc a:hover{color:var(--link)}footer.site{border-top:1px solid var(--border);padding:32px 20px;margin-top:80px;text-align:center;color:var(--muted);font-size:13px;background:linear-gradient(180deg,transparent,rgba(124,92,255,.03))}footer.site .footer-grad{width:80px;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent-2));margin:0 auto 16px;border-radius:2px}footer.site a{color:var(--muted);margin:0 8px}footer.site a:hover{color:var(--text)}