:root{--bg:#faf8f5;--surface:#fff;--card:#fff;--border:#e8e4dd;--text:#2c2416;--text-dim:#8c8478;--accent:#e8553a;--accent-hover:#d1442a;--accent-soft:#fef3f0;--gold:#f0a030;--green:#2d9e64;--green-soft:#edf8f1;--blue:#4a90d9;--blue-soft:#eef5fc;--radius-sm:8px;--radius:14px;--radius-lg:20px;--shadow-sm:0 1px 3px #0000000a;--shadow:0 2px 12px #0000000f;--shadow-lg:0 8px 30px #00000014}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Yu Gothic,sans-serif;line-height:1.8}.header{background:var(--surface);border-bottom:1px solid var(--border);z-index:100;padding:0 20px;position:sticky;top:0}.header-inner{justify-content:space-between;align-items:center;max-width:960px;height:60px;margin:0 auto;display:flex}.logo{color:var(--text);letter-spacing:-.02em;align-items:center;gap:6px;font-size:1.15rem;font-weight:900;text-decoration:none;display:flex}.logo span{color:var(--accent)}.nav{align-items:center;gap:20px;display:flex}.nav a{color:var(--text-dim);font-size:.85rem;font-weight:500;text-decoration:none;transition:color .2s}.nav a:hover,.nav a.active{color:var(--accent)}.main{max-width:960px;margin:0 auto;padding:32px 20px 60px}.hero{text-align:center;background:linear-gradient(135deg,var(--accent-soft) 0%,var(--surface) 100%);border-radius:var(--radius-lg);border:1px solid #f0e8e0;margin-bottom:40px;padding:48px 20px 40px}.hero h1{margin-bottom:8px;font-size:2rem;font-weight:900;line-height:1.4}.hero h1 .accent{color:var(--accent)}.hero .lead{color:var(--text-dim);max-width:560px;margin:0 auto;font-size:.95rem}.section-title{align-items:center;gap:8px;margin-bottom:6px;font-size:1.3rem;font-weight:700;display:flex}.section-sub{color:var(--text-dim);margin-bottom:24px;font-size:.88rem}.tool-card{background:var(--card);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow-sm);align-items:flex-start;gap:24px;margin-bottom:16px;padding:28px 24px;transition:all .25s;display:flex}.tool-card:hover{box-shadow:var(--shadow-lg);border-color:#d8d0c4;transform:translateY(-2px)}.card-rank{color:var(--accent);text-align:center;min-width:40px;padding-top:2px;font-size:1.6rem;font-weight:900}.card-body{flex:1;min-width:0}.card-header{flex-wrap:wrap;align-items:baseline;gap:12px;margin-bottom:6px;display:flex}.card-name{font-size:1.15rem;font-weight:700}.card-rating{color:var(--gold);align-items:center;gap:4px;font-size:.85rem;font-weight:700;display:inline-flex}.card-rating .count{color:var(--text-dim);font-size:.8rem;font-weight:400}.card-desc{color:var(--text-dim);margin-bottom:14px;font-size:.88rem;line-height:1.65}.card-meta{flex-wrap:wrap;gap:10px;margin-bottom:16px;display:flex}.tag{border-radius:20px;padding:4px 12px;font-size:.78rem;font-weight:500}.tag.price{background:var(--green-soft);color:var(--green)}.tag.speed{background:var(--blue-soft);color:var(--blue)}.tag.privacy{color:#7c5cfc;background:#f3eefc}.card-actions{flex-wrap:wrap;gap:10px;display:flex}.btn{border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:6px;padding:9px 22px;font-family:inherit;font-size:.88rem;font-weight:700;text-decoration:none;transition:all .2s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);transform:scale(1.02)}.btn-outline{color:var(--accent);border:2px solid var(--accent);background:0 0}.btn-outline:hover{background:var(--accent-soft)}.detail-header{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow);margin-bottom:32px;padding:40px 32px}.detail-header h1{margin-bottom:8px;font-size:1.8rem;font-weight:900;line-height:1.4}.detail-meta{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:16px;display:flex}.detail-rating{color:var(--gold);font-size:1.1rem;font-weight:700}.detail-content{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow-sm);padding:32px}.detail-content h2{border-bottom:2px solid var(--accent-soft);margin:32px 0 12px;padding-bottom:8px;font-size:1.35rem;font-weight:700}.detail-content h2:first-child{margin-top:0}.detail-content p{color:#4a3f32;margin-bottom:14px}.detail-content ul,.detail-content ol{color:#4a3f32;margin:10px 0 20px 20px}.detail-content li{margin-bottom:6px}.pros-cons{grid-template-columns:1fr 1fr;gap:16px;margin:24px 0;display:grid}.pros,.cons{border-radius:var(--radius);padding:20px;font-size:.9rem;line-height:1.7}.pros{background:var(--green-soft);border:1px solid #c8e8d4}.cons{background:#fef3f0;border:1px solid #f8d0c4}.pros h3,.cons h3{margin-bottom:8px;font-size:.95rem}.faq-item{background:var(--bg);border-radius:var(--radius-sm);border:1px solid var(--border);margin-bottom:10px;padding:18px 20px}.faq-q{color:var(--accent);margin-bottom:6px;font-size:.92rem;font-weight:700}.faq-a{color:var(--text-dim);font-size:.88rem}.footer{color:#b8a898;background:#2c2416;margin-top:60px;padding:40px 20px 24px}.footer-inner{grid-template-columns:repeat(3,1fr);gap:32px;max-width:960px;margin:0 auto;font-size:.85rem;line-height:2;display:grid}.footer h4{color:#f0e6d8;margin-bottom:8px;font-size:.9rem}.footer a{color:#b8a898;text-decoration:none;transition:color .2s}.footer a:hover{color:#f0e6d8}.footer-bottom{text-align:center;color:#8c7c6c;border-top:1px solid #3d3428;max-width:960px;margin:24px auto 0;padding-top:16px;font-size:.8rem}@media (width<=640px){.hero{padding:32px 16px 28px}.hero h1{font-size:1.4rem}.tool-card{flex-direction:column;gap:12px;padding:20px}.card-rank{font-size:1.2rem}.pros-cons{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr;gap:20px}.detail-header,.detail-content{padding:24px 20px}.nav{gap:12px}.nav a{font-size:.78rem}}