@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Noto+Sans+JP:wght@400;500;700;900&display=swap");:root{--ink:#17201d;--muted:#6d7772;--line:#dfe5df;--paper:#f7f9f5;--accent:#e65f36;--green:#dceee3}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans JP",sans-serif;line-height:1.8}.site-header{max-width:1100px;margin:auto;padding:24px 28px;display:flex;justify-content:space-between;align-items:center}.brand{font:700 20px "DM Sans";color:var(--ink);text-decoration:none}.brand span{color:var(--accent)}nav{display:flex;gap:25px;font-size:13px}nav a,.back{color:var(--muted);text-decoration:none}main{overflow:hidden}.hero{max-width:1100px;margin:50px auto 100px;padding:55px 28px}.eyebrow{font:700 12px "DM Sans";letter-spacing:.16em;color:var(--accent)}h1{font-size:clamp(36px,6vw,72px);line-height:1.2;letter-spacing:-.05em;margin:12px 0 22px;font-weight:900}h1 em,h2 em{font-style:normal;color:var(--accent)}.hero p:not(.eyebrow){max-width:550px;color:var(--muted);font-size:17px}.cta{display:inline-block;margin-top:25px;background:var(--ink);color:white;padding:12px 22px;border-radius:99px;text-decoration:none;font-size:14px}.section{max-width:1100px;margin:0 auto 110px;padding:0 28px}.section-head{margin-bottom:30px}h2{font-size:30px;line-height:1.35;letter-spacing:-.03em}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.category{background:white;border:1px solid var(--line);padding:25px;text-decoration:none;color:var(--ink);min-height:220px;transition:.2s}.category:hover{transform:translateY(-5px);border-color:var(--accent)}.icon{font-size:32px}.category h3{font-size:17px;margin:15px 0 4px}.category p,.method-grid p{font-size:13px;color:var(--muted);margin:0}.read{display:block;margin-top:22px;font-size:12px;color:var(--accent)}.how{background:var(--green);max-width:none;padding:75px max(28px,calc((100% - 1100px)/2));display:grid;grid-template-columns:1fr 2fr;gap:50px}.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.method-grid article{border-top:1px solid #9fc4aa;padding-top:12px}.method-grid b{font:700 13px "DM Sans";color:var(--accent)}.method-grid h3{font-size:17px;margin:8px 0}.article{max-width:820px;margin:45px auto 110px;padding:0 28px}.article h1{font-size:48px}.lead{font-size:18px;color:var(--muted)}.notice{background:#fff0e8;border-left:4px solid var(--accent);padding:16px 20px;margin:30px 0}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;background:white;font-size:14px}th,td{padding:15px;border:1px solid var(--line);text-align:left}th{background:var(--green)}.check{padding-left:25px}.check li{margin:14px 0}footer{max-width:1100px;margin:auto;padding:35px 28px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}footer p{color:var(--ink);font-weight:700}@media(max-width:700px){nav{display:none}.hero{margin:20px auto 65px;padding-top:30px}.category-grid,.method-grid,.how{grid-template-columns:1fr}.how{gap:25px;padding-top:55px;padding-bottom:55px}.article h1{font-size:36px}.category{min-height:auto}}

.verdict{background:var(--ink);color:#fff;padding:22px 24px;border-radius:3px;margin:28px 0}.verdict strong{color:#f6b29b;font-size:13px;letter-spacing:.08em}.verdict p{margin:6px 0 0}.type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.type-card{background:#fff;border:1px solid var(--line);padding:20px}.type-card h3{margin:8px 0 15px}.type-label{font-size:12px;color:var(--accent);font-weight:700}.type-card dl{font-size:13px;margin:0}.type-card dt{color:var(--muted);margin-top:10px}.type-card dd{margin:0}.compare-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.compare-notes>div{border-top:2px solid var(--accent);padding:14px;background:#fff}.compare-notes p{font-size:13px;color:var(--muted);margin:7px 0 0}.check li p{margin:4px 0 0;color:var(--muted)}details{background:#fff;border:1px solid var(--line);padding:14px 18px;margin:8px 0;font-size:14px}summary{cursor:pointer;font-weight:700}details p{color:var(--muted);margin:8px 0 0}.next-box{background:var(--green);padding:20px;margin-top:30px}.next-box p{margin:5px 0 0}.editor-note{font-size:12px;color:var(--muted);margin-top:30px}@media(max-width:700px){.type-grid,.compare-notes{grid-template-columns:1fr}.verdict{padding:18px}.table-wrap table{min-width:650px}}
.diagram{display:grid;grid-template-columns:1fr auto 1fr auto 1.35fr;gap:12px;align-items:center;background:linear-gradient(135deg,#e8f4ec,#fdf2ea);border:1px solid var(--line);padding:22px;margin:30px 0}.device{border:2px solid var(--ink);background:#fff;padding:18px 10px;text-align:center;font-weight:700;border-radius:8px}.device small{display:block;color:var(--muted);font-size:10px;font-weight:400;margin-top:4px}.dock{background:var(--ink);color:#fff;border-color:var(--ink)}.dock small{color:#c4d5c8}.connector{font-size:24px;color:var(--accent);font-weight:700}.outputs{display:grid;grid-template-columns:1fr 1fr;gap:7px}.outputs span{background:#fff;padding:8px 6px;border-radius:5px;font-size:12px;text-align:center;border:1px solid var(--line)}
@media(max-width:700px){.diagram{grid-template-columns:1fr auto 1fr;gap:8px;padding:14px}.diagram .branch{display:none}.outputs{grid-column:1/-1;grid-template-columns:1fr 1fr}.connector{font-size:18px}.device{padding:14px 5px;font-size:13px}}
.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:25px 0 42px}.about-grid section{background:#fff;border:1px solid var(--line);padding:20px}.about-grid b{color:var(--accent);font-size:13px}.about-grid p{font-size:14px;color:var(--muted);margin-bottom:0}@media(max-width:700px){.about-grid{grid-template-columns:1fr}}
.product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.product-card{background:#fff;border:1px solid var(--line);padding:20px}.product-card h3{font-size:18px;margin:10px 0}.product-card p{font-size:13px;margin:7px 0;color:var(--muted)}.product-card strong{color:var(--ink)}.product-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.maker{font-size:12px;font-weight:700;color:var(--accent);letter-spacing:.08em}.price{font-size:12px;color:var(--muted)}.product-specs{color:var(--ink)!important;font-weight:700}.product-link{display:inline-block;margin-top:12px;color:var(--accent);font-size:13px;font-weight:700}.affiliate-note{font-size:12px!important;color:var(--muted)!important}@media(max-width:700px){.product-grid{grid-template-columns:1fr}}
