/* NeuralShare Blog Post Stylesheet */

*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans JP',sans-serif;background:#fafafa;color:#1a1a2e;line-height:1.8}
.container{max-width:780px;margin:0 auto;padding:2rem 1.5rem}
header{background:#1a1a2e;color:#fff;padding:1rem 0}
header .container{display:flex;justify-content:space-between;align-items:center;padding:0 1.5rem}
header a{color:#fff;text-decoration:none;font-size:0.95rem;margin-left:1.2rem}
header a:hover{color:#00d4ff}
.site-title{font-size:1.1rem;font-weight:700;color:#00d4ff;text-decoration:none}
.breadcrumb{font-size:0.85rem;color:#64748b;margin-bottom:1rem}
.breadcrumb a{color:#2563eb;text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
article{background:#fff;border-radius:12px;padding:2.5rem;margin:1.5rem 0;box-shadow:0 1px 3px rgba(0,0,0,0.08)}
article h1{font-size:1.8rem;margin-bottom:0.5rem;line-height:1.4;color:#1a1a2e}
.meta{font-size:0.85rem;color:#94a3b8;margin-bottom:1.5rem}
.meta span{margin-right:1rem}
html{scroll-behavior:smooth}
.toc{background:#1a1a2e;border-radius:12px;padding:1rem 1.2rem;margin-bottom:2rem;border:1px solid rgba(37,99,235,.15)}
.toc h3{font-size:.95rem;margin-bottom:.5rem;color:#00d4ff;font-weight:700}
.toc ol{list-style:none;padding:0;margin:0;counter-reset:toc-counter}
.toc > ol > li{counter-increment:toc-counter;margin:.25rem 0}
.toc > ol > li > a::before{content:counter(toc-counter) ". ";color:#64748b;font-size:.8rem}
.toc > ol > li > ol{padding-left:1.2rem;margin:.15rem 0 .3rem;counter-reset:toc-sub}
.toc > ol > li > ol > li{counter-increment:toc-sub;margin:.15rem 0}
.toc > ol > li > ol > li > a::before{content:counter(toc-counter) "." counter(toc-sub) " ";color:#64748b;font-size:.75rem}
.toc a{color:#dbeafe;text-decoration:none;font-size:.85rem;display:inline-block;padding:1px 0;transition:color .2s}
.toc a:hover{color:#00d4ff;text-decoration:underline}
.article-body h2{font-size:1.4rem;margin:2rem 0 0.8rem;padding-bottom:0.3rem;border-bottom:2px solid #dbeafe;color:#1a1a2e}
.article-body h3{font-size:1.15rem;margin:1.5rem 0 0.6rem;color:#334155}
.article-body p{margin:0.8rem 0}
.article-body ul,.article-body ol{margin:0.8rem 0 0.8rem 1.5rem}
.article-body li{margin:0.3rem 0}
.article-body a{color:#2563eb;text-decoration:underline}
.article-body blockquote{border:1px solid rgba(37,99,235,.15);border-radius:12px;padding:0.8rem 1.2rem;margin:1rem 0;background:rgba(37,99,235,.04);color:#64748b}
.article-body strong{color:#1a1a2e}
.ns-verdict{background:linear-gradient(135deg,#eff6ff,#eff6ff);border:2px solid #2563eb;border-radius:12px;padding:1.2rem 1.5rem;margin:1.5rem 0;position:relative}
.ns-verdict::before{content:'NeuralShare判定';position:absolute;top:-12px;left:16px;background:#2563eb;color:#fff;font-size:.72rem;font-weight:700;padding:2px 10px;border-radius:20px;letter-spacing:.05em}
.ns-verdict p{margin:.4rem 0;font-size:.95rem;font-weight:600;color:#1e3a5f}
.ns-summary{background:#fefce8;border:2px solid #eab308;border-radius:12px;padding:1.2rem 1.5rem;margin:1.5rem 0;position:relative}
.ns-summary::before{content:'3秒要約';position:absolute;top:-12px;left:16px;background:#eab308;color:#fff;font-size:.72rem;font-weight:700;padding:2px 10px;border-radius:20px}
.ns-summary p{margin:.3rem 0;font-size:.95rem;font-weight:600;color:#713f12}
.ns-tldr{background:#eff6ff;border:2px solid #22c55e;border-radius:12px;padding:1.2rem 1.5rem;margin:1.5rem 0;position:relative}
.ns-tldr::before{content:'ここだけ見ればOK';position:absolute;top:-12px;left:16px;background:#22c55e;color:#fff;font-size:.72rem;font-weight:700;padding:2px 10px;border-radius:20px}
.ns-tldr p,.ns-tldr li{margin:.3rem 0;font-size:.92rem;color:#14532d}
.ns-updated{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:.8rem 1.2rem;margin:2rem 0;font-size:.82rem;color:#64748b;display:flex;align-items:center;gap:.5rem}
.ns-updated::before{content:'⚠️';font-size:1rem}
.article-body table{width:100%;border-collapse:collapse;margin:1rem 0}
.article-body th,.article-body td{border:1px solid #e2e8f0;padding:0.6rem 0.8rem;text-align:left;font-size:0.9rem}
.article-body th{background:#eff6ff;font-weight:600}
.article-body code{background:#eff6ff;padding:0.15rem 0.4rem;border-radius:4px;font-size:0.88rem}
.article-body pre{background:#1a1a2e;color:#e0e0e0;padding:1.2rem;border-radius:8px;overflow-x:auto;margin:1rem 0;position:relative}
.article-body pre code{background:none;padding:0;color:inherit}
.code-copy-btn{position:absolute;top:8px;right:8px;background:rgba(255,255,255,0.15);color:#94a3b8;border:1px solid rgba(255,255,255,0.2);border-radius:6px;padding:4px 10px;font-size:.75rem;cursor:pointer;transition:all .2s;z-index:1}
.code-copy-btn:hover{background:rgba(255,255,255,0.25);color:#fff}
.code-copy-btn.copied{background:#22c55e;color:#fff;border-color:#22c55e}
.category-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:.8rem}
.category-badge{display:inline-block;background:#dbeafe;color:#3730a3;padding:3px 10px;border-radius:20px;font-size:.75rem;font-weight:600;text-decoration:none;transition:background .2s}
.category-badge:hover{background:#c7d2fe}
.category-badge--primary{background:#2563eb;color:#fff}
.category-badge--primary:hover{background:#1d4ed8}
.tags{margin-top:1.5rem}
.tag{display:inline-block;background:#dbeafe;color:#3730a3;padding:0.2rem 0.7rem;border-radius:20px;font-size:0.8rem;margin:0.2rem 0.3rem 0.2rem 0}
.author-card{background:#eff6ff;border-radius:12px;padding:1.5rem;margin:2rem 0;display:flex;gap:1rem;align-items:center}
.author-card .avatar{width:60px;height:60px;border-radius:50%;background:#2563eb;color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;flex-shrink:0}
.author-card .info h4{margin:0 0 0.3rem;font-size:1rem}
.author-card .info p{font-size:0.85rem;color:#555;margin:0}
.author-card a{color:#2563eb;text-decoration:none;font-size:0.85rem}
.related-posts{margin:2.5rem 0}
.related-posts h2{font-size:1.2rem;margin-bottom:1rem;color:#1a1a2e;font-weight:700}
.related-posts ul{list-style:none;padding:0}
.related-posts li{margin:0.5rem 0}
.related-posts a{color:#2563eb;text-decoration:none}
.related-posts a:hover{text-decoration:underline}
.affiliate-cta{background:linear-gradient(135deg,#fff8f0 0%,#fff3e0 100%);border:2px solid #ff6d00;border-radius:16px;padding:2rem 2rem 1.5rem;margin:2rem 0;position:relative;text-align:center;box-shadow:0 4px 20px rgba(255,109,0,0.1)}
.affiliate-cta .cta-badge{position:absolute;top:10px;right:14px;font-size:0.65rem;color:#94a3b8;background:#fff;padding:1px 6px;border-radius:4px;font-weight:600;letter-spacing:1px}
.affiliate-cta h3{font-size:1.2rem;color:#1e3a5f;margin-bottom:0.4rem;font-weight:700}
.affiliate-cta p{font-size:0.9rem;color:#64748b;margin-bottom:1.2rem;line-height:1.6}
.affiliate-cta .cta-micro{display:block;font-size:0.8rem;color:#ff6d00;font-weight:700;margin-bottom:0.5rem;letter-spacing:0.05em}
.affiliate-cta .cta-button{display:inline-block;background:linear-gradient(135deg,#ff6d00 0%,#e65100 100%);color:#fff;padding:0.85rem 2.4rem;border-radius:12px;font-weight:700;font-size:1rem;text-decoration:none;transition:all 0.25s ease;box-shadow:0 4px 14px rgba(255,109,0,0.35);min-height:48px;line-height:1.4}
.affiliate-cta .cta-button:hover{background:linear-gradient(135deg,#ff8a33 0%,#ff6d00 100%);transform:translateY(-2px) scale(1.02);text-decoration:none;box-shadow:0 6px 20px rgba(255,109,0,0.45)}
.affiliate-cta .cta-button:active{transform:translateY(0) scale(1)}
.affiliate-cta .cta-note{display:block;margin-top:0.8rem;font-size:0.72rem;color:#94a3b8}
.cf-cta{background:linear-gradient(135deg,#eef6ff 0%,#f8fafc 100%);border:1px solid #dbeafe;border-radius:16px;padding:1.25rem 1.25rem 1.1rem;margin:1.75rem 0;box-shadow:0 6px 20px rgba(37,99,235,0.08)}
.cf-cta__badge{display:inline-block;background:#dbeafe;color:#1d4ed8;font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:999px;margin-bottom:.75rem}
.cf-cta__title{font-size:1.08rem;line-height:1.5;color:#0f172a;margin-bottom:.45rem}
.cf-cta__desc{font-size:.9rem;color:#64748b;margin-bottom:.9rem}
.cf-cta__meta{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-bottom:.95rem}
.cf-cta__price{font-size:.95rem;font-weight:800;color:#0f172a}
.cf-cta__tag{font-size:.75rem;color:#64748b;background:#e2e8f0;padding:3px 8px;border-radius:999px}
.cf-cta__btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.78rem 1.15rem;border-radius:12px;background:#2563eb;color:#fff;text-decoration:none;font-weight:700;box-shadow:0 6px 16px rgba(37,99,235,.25)}
.cf-cta__btn:hover{background:#1d4ed8;color:#fff;text-decoration:none}
.related-posts,.author-card,#comments-section,.affiliate-cta{content-visibility:auto;contain-intrinsic-size:auto 300px}
.blog-floating-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:997;background:#fff;border-top:2px solid #ff6d00;box-shadow:0 -4px 20px rgba(0,0,0,0.12);padding:10px 16px;transform:translateY(100%);transition:transform 0.4s ease;opacity:0}
.blog-floating-cta.is-visible{transform:translateY(0);opacity:1}
.blog-floating-cta__inner{display:flex;align-items:center;justify-content:center;gap:12px;max-width:600px;margin:0 auto}
.blog-floating-cta__btn{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#ff6d00,#e65100);color:#fff;padding:12px 24px;border-radius:12px;font-size:14px;font-weight:700;text-decoration:none;box-shadow:0 4px 14px rgba(255,109,0,0.35);white-space:nowrap;min-height:48px;transition:all 0.2s}
.blog-floating-cta__btn:hover{transform:scale(1.03);box-shadow:0 6px 20px rgba(255,109,0,0.45);color:#fff;text-decoration:none}
.blog-floating-cta__close{background:none;border:none;color:#94a3b8;font-size:22px;cursor:pointer;padding:4px 8px;line-height:1;flex-shrink:0}
@media(min-width:769px){.blog-floating-cta{display:none !important}}
footer{text-align:center;padding:2rem 0;font-size:0.8rem;color:#94a3b8}
footer a{color:#64748b;margin:0 0.5rem}
@media(max-width:600px){
  article{padding:1.2rem;border-radius:0}
  article h1{font-size:1.3rem}
  .article-body{font-size:18px;line-height:1.8}
  .article-body p{font-size:18px;line-height:1.8}
  .article-body li{font-size:17px;line-height:1.7}
  .article-body h2{font-size:1.25rem}
  .article-body h3{font-size:1.05rem}
  .author-card{flex-direction:column;text-align:center}
  header nav{gap:0!important;flex-wrap:wrap;justify-content:flex-end}
  header nav a{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;font-size:.82rem!important;padding:.4rem .6rem!important}
  header nav button{min-height:44px;min-width:44px}
  .subscribe-box form{flex-direction:column}
  .article-body table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .ad-slot{min-height:100px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}}

/* === Focus ring (accessibility) === */
*:focus-visible{outline:2px solid #2563eb;outline-offset:2px;border-radius:4px}
a:focus-visible,button:focus-visible{outline:2px solid #2563eb;outline-offset:2px}

/* === Scroll progress bar === */
.ns-scroll-progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,#2563eb,#00d4ff);z-index:101;width:0%;transition:width .1s;pointer-events:none}

/* === Typography improvements === */
.p-body,.blog-body{max-width:65ch}
.p-body p,.blog-body p{line-height:1.75}
.p-body h2,.blog-body h2{margin-top:2.5rem;margin-bottom:1rem}
.p-body h3,.blog-body h3{margin-top:2rem;margin-bottom:.8rem}

/* === Empty state === */
.ns-empty{text-align:center;padding:3rem 1.5rem}
.ns-empty h3{font-size:1.1rem;font-weight:600;color:#94a3b8;margin:0 0 .5rem}
.ns-empty p{font-size:.88rem;color:#64748b;margin:0 0 1rem}

/* === Skeleton loading === */
@keyframes skeleton{0%{background-position:200% 0}100%{background-position:-200% 0}}
.ns-skeleton{background:linear-gradient(90deg,rgba(255,255,255,.04) 25%,rgba(255,255,255,.08) 50%,rgba(255,255,255,.04) 75%);background-size:200% 100%;animation:skeleton 1.5s ease-in-out infinite;border-radius:8px}

/* === Additional utility classes for repeated inline styles === */
.rate-btn{background:#eff6ff;border:1px solid #dbeafe;border-radius:8px;padding:8px 16px;cursor:pointer;font-size:.9rem}
.rate-btn--mid{background:#fefce8;border-color:#f59e0b}
.rate-btn--low{background:#fef2f2;border-color:#fca5a5}

.footer-link{color:#64748b;margin:0 .5rem}

.nav-link-header{color:#cbd5e1;font-size:.88rem;padding:.45rem .85rem;border-radius:8px}

.card-link{display:block;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:1.2rem;text-decoration:none;transition:box-shadow .2s,transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.card-link:hover{box-shadow:0 4px 12px rgba(0,0,0,.1);transform:translateY(-2px)}

.card-title{display:block;font-size:.92rem;color:#1a1a2e;line-height:1.45;margin-bottom:.4rem}

.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}