:root{--bg: #0b1020;--bg-soft: #121a33;--card: #161f3d;--card-hover: #1c2750;--border: #25315c;--text: #e7ecff;--text-soft: #a6b1d6;--muted: #7b87b3;--brand: #6c8cff;--brand-2: #38e0c8;--accent: #ffd166;--radius: 14px;--maxw: 1080px;--font: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font);background:radial-gradient(1200px 600px at 50% -200px,#1a2550 0%,var(--bg) 60%);color:var(--text);line-height:1.65;-webkit-font-smoothing:antialiased}a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}img{max-width:100%;height:auto}.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 20px}.site-header{position:sticky;top:0;z-index:50;background:#0b1020cc;backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}.site-header .container{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}.logo{font-weight:800;font-size:1.15rem;letter-spacing:-.02em;color:var(--text);display:flex;align-items:center;gap:8px}.logo:hover{text-decoration:none}.logo .dot{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-2));display:inline-block}.nav{display:flex;gap:18px;flex-wrap:wrap}.nav a{color:var(--text-soft);font-size:.95rem;font-weight:500}.nav a:hover{color:var(--text);text-decoration:none}.hero{text-align:center;padding:64px 0 40px}.hero h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.1;margin:0 0 16px;letter-spacing:-.03em;background:linear-gradient(135deg,var(--text),var(--brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{font-size:1.15rem;color:var(--text-soft);max-width:640px;margin:0 auto 28px}section{padding:28px 0}h2{font-size:1.6rem;letter-spacing:-.02em;margin:0 0 8px}h3{font-size:1.2rem;margin:0 0 8px}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}.section-head p{color:var(--muted);margin:4px 0 0}.lead{color:var(--text-soft);font-size:1.05rem}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px;transition:transform .15s ease,border-color .15s ease,background .15s ease;display:flex;flex-direction:column;gap:10px}.card:hover{transform:translateY(-3px);border-color:var(--brand);background:var(--card-hover)}.card a{text-decoration:none}.card .card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.card h3 a{color:var(--text)}.card .desc{color:var(--text-soft);font-size:.95rem;margin:0}.badge{display:inline-block;font-size:.72rem;font-weight:600;padding:3px 9px;border-radius:999px;background:#6c8cff26;color:var(--brand);border:1px solid rgba(108,140,255,.3);white-space:nowrap}.badge.free{background:#38e0c81f;color:var(--brand-2);border-color:#38e0c84d}.rating{color:var(--accent);font-weight:700;font-size:.95rem;white-space:nowrap}.tags{display:flex;flex-wrap:wrap;gap:6px}.pills{display:flex;flex-wrap:wrap;gap:10px}.pill{background:var(--bg-soft);border:1px solid var(--border);color:var(--text-soft);padding:8px 16px;border-radius:999px;font-size:.9rem;font-weight:500}.pill:hover{border-color:var(--brand);color:var(--text);text-decoration:none}.pill[aria-current=true]{background:var(--brand);color:#0b1020;border-color:var(--brand)}.tool-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:28px 0 12px;border-bottom:1px solid var(--border);margin-bottom:24px}.tool-hero h1{font-size:2.4rem;margin:0 0 6px;letter-spacing:-.02em}.tool-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;color:var(--muted)}.btn{display:inline-block;background:linear-gradient(135deg,var(--brand),#8aa2ff);color:#0b1020;font-weight:700;padding:12px 22px;border-radius:10px;white-space:nowrap}.btn:hover{text-decoration:none;filter:brightness(1.08)}.btn.secondary{background:transparent;border:1px solid var(--border);color:var(--text)}.cols2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px}.panel h3{margin-top:0}.panel.pros{border-color:#38e0c84d}.panel.cons{border-color:#ff6b6b4d}ul.clean{list-style:none;padding:0;margin:0}ul.clean li{padding:6px 0 6px 26px;position:relative;color:var(--text-soft)}ul.clean li:before{content:"→";position:absolute;left:0;color:var(--brand)}.panel.pros ul.clean li:before{content:"✓";color:var(--brand-2)}.panel.cons ul.clean li:before{content:"✕";color:#ff8a8a}table.spec{width:100%;border-collapse:collapse}table.spec td{padding:10px 0;border-bottom:1px solid var(--border);color:var(--text-soft)}table.spec td:first-child{color:var(--muted);width:40%}.vs-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.vs-grid .panel{text-align:center}table.compare{width:100%;border-collapse:collapse;margin-top:8px}table.compare th,table.compare td{padding:12px;border-bottom:1px solid var(--border);text-align:left}table.compare th{color:var(--muted);font-weight:600}table.compare td{color:var(--text-soft)}.ad-slot{margin:28px 0;display:flex;justify-content:center}.ad-slot .ad-inner{width:100%;max-width:728px;min-height:90px;border:1px dashed var(--border);border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.8rem;background:#ffffff05}.ad-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);text-align:center;margin-bottom:4px}.prose{max-width:760px;margin:0 auto}.prose h1{font-size:2.2rem;letter-spacing:-.02em}.prose h2{font-size:1.4rem;margin-top:32px}.prose p,.prose li{color:var(--text-soft)}.site-footer{border-top:1px solid var(--border);margin-top:56px;padding:36px 0;color:var(--muted)}.site-footer .cols{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}.site-footer a{color:var(--text-soft)}.site-footer .links{display:flex;gap:18px;flex-wrap:wrap}.site-footer .small{font-size:.85rem;margin-top:18px}.crumb{color:var(--muted);font-size:.85rem;margin:18px 0 0}.crumb a{color:var(--text-soft)}@media(max-width:640px){.cols2,.vs-grid{grid-template-columns:1fr}.hero{padding:40px 0 24px}.nav{display:none}}