:root{--color-bg:#fbfbfd;--color-surface:#fff;--color-surface-hover:#f5f5f7;--color-text:#1d1d1f;--color-text-muted:#68686d;--color-accent:#0071e3;--color-accent-hover:#005bb8;--color-border:#e6e6eb;--max-width:1120px;--radius:24px}
html{scroll-padding-top:90px}body{background:#fbfbfd;-webkit-font-smoothing:antialiased}a{color:var(--color-accent)}:focus-visible{outline:3px solid #0071e3;outline-offset:5px}img{max-width:100%;height:auto}.site-header{background:rgba(251,251,253,.90);backdrop-filter:blur(20px);padding:16px 0}.site-logo{color:#1d1d1f;font-size:1rem;letter-spacing:-.03em}.site-nav a{font-size:.8rem}.eyebrow{font-size:11px;font-weight:750;letter-spacing:.15em;color:#0071e3;text-decoration:none}.home-hero{padding:80px 0 52px}.home-hero h1{font-size:clamp(44px,7vw,80px);line-height:1.12;letter-spacing:-.06em;margin:22px 0;background:none;color:#1d1d1f;-webkit-text-fill-color:initial}.home-hero h1 span{color:#7b7b80}.hero-description{font-size:17px;line-height:1.9;margin-bottom:26px}.text-link{display:inline-block;font-weight:600;text-decoration:none;font-size:14px}.home-feature{display:grid;grid-template-columns:1fr 1fr;align-items:center;background:#fff;border:1px solid var(--color-border);border-radius:32px;overflow:hidden;margin:12px 0 70px;min-height:360px}.feature-copy{padding:42px}.feature-copy h2{font-size:clamp(28px,4vw,46px);line-height:1.2;letter-spacing:-.05em;margin:18px 0}.feature-copy h2 a{color:inherit;text-decoration:none}.feature-copy p{font-size:14px;color:var(--color-text-muted);margin-bottom:24px}.pill-link{display:inline-flex;background:#0071e3;color:#fff;padding:11px 20px;border-radius:30px;font-size:13px;text-decoration:none}.feature-image img{display:block;width:100%;object-fit:contain}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:24px}.section-heading h2{font-size:26px;letter-spacing:-.04em}.section-heading span{font-size:12px;color:#68686d}.article-grid{gap:24px}.article-card{box-shadow:0 5px 25px #00000003}.article-card img{height:240px;object-fit:contain;background:#fff}.card-body{padding:26px}.card-body h3{font-size:18px;letter-spacing:-.02em}.card-summary{line-height:1.8;margin:12px 0 20px}.mini-badge{display:inline-block;border-radius:20px;padding:2px 9px;background:#eef5ff;color:#0071e3;margin-left:8px}.article-heading{max-width:840px;margin:58px auto 32px}.article-heading h1{font-size:clamp(26px,4vw,42px);line-height:1.4;letter-spacing:-.04em;margin:16px 0}.article-heading>p{color:#68686d;margin-bottom:16px}.article-meta{font-size:12px;color:#68686d}.article-paper{background:white;border:1px solid var(--color-border);border-radius:28px;padding:48px;max-width:920px;margin:40px auto 80px;position:relative}.author-intro{display:flex;gap:14px;align-items:center;background:#f5f5f7;padding:18px;border-radius:16px;margin-bottom:32px}.author-mark{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;border-radius:50%;background:#0071e3;color:white;font-weight:800}.author-intro p{font-size:12px;color:#68686d}.article-content{overflow-wrap:anywhere}.article-content table{display:block;max-width:100%;overflow-x:auto;white-space:normal}.article-content h2{font-size:26px;line-height:1.5;margin-top:54px}.article-content p{line-height:1.95}.article-content img{border-radius:18px}.article-content .vs-summary-box,.article-content .diagram-box,.article-content .scene-matrix-box,.article-content .pc-card,.article-content .decision-card{background:#f7f8fa;color:#1d1d1f;border-color:#e6e6eb}.site-footer{margin-top:64px}.stage-skip{position:absolute;right:20px;bottom:16px;font-size:11px;text-decoration:none}
/* Stage-contained canvas and dock cannot overlay the following article. */
.showcase{position:relative}.stage-sticky{position:relative;height:640px;max-height:850px;background:#fbfbfd;overflow:hidden;border-radius:28px}.stage-copy{text-align:center;padding:22px 16px 0;position:relative;z-index:2}.stage-copy h2{font-size:clamp(28px,4.2vw,50px);letter-spacing:-.045em;line-height:1.25;margin:10px 0}.stage-copy p{font-size:13px;color:#68686d}.versus{margin:0 10px;color:#0071e3}.stage-viewport{position:absolute;top:150px;bottom:128px;left:0;right:0}.stage-canvas{display:none;width:100%;height:100%;position:relative;z-index:1;touch-action:pan-y}.stage-poster{width:100%;height:100%;object-fit:contain}.stage-shadow{position:absolute;width:180px;height:16px;background:#11111118;filter:blur(14px);border-radius:50%;bottom:8px;left:calc(50% - 90px)}.stage-caption{position:absolute;bottom:58px;left:16px;right:16px;text-align:center;z-index:2;pointer-events:none}.stage-caption p{font-size:14px;margin:5px 0}.stage-caption small{display:block;font-size:10px;color:#68686d;max-width:600px;margin:auto}.wave-legend{display:flex;gap:14px;justify-content:center;font-size:10px;margin-top:5px}.wave-legend span:nth-child(1){color:#e11d48}.wave-legend span:nth-child(2){color:#0071e3}.wave-legend span:nth-child(3){color:#00876b}.stage-dock{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);height:30px;padding:2px 4px;display:flex;gap:3px;background:#fffefc;border:1px solid #ddd;border-radius:30px;box-shadow:0 4px 14px #0000000a;z-index:4;transition:opacity .18s,visibility .18s}.stage-dock[hidden]{display:none}.stage-dock[inert]{opacity:0;visibility:hidden;pointer-events:none}.stage-dock button{height:24px;padding:0 13px;border:0;background:none;border-radius:20px;font-size:11px;cursor:pointer;color:#1d1d1f}.stage-dock button[aria-pressed=true]{background:#1d1d1f;color:#fff}.showcase.is-ready{height:260svh}.is-ready .stage-sticky{position:sticky;top:68px;height:calc(100svh - 68px);max-height:none}.is-ready .stage-canvas{display:block}.is-ready .stage-poster{display:none}.showcase.is-reduced{height:auto}.is-reduced .stage-sticky{position:relative;top:0;height:640px}.article-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
@media(max-width:700px){.container{padding:0 18px}.site-header{padding:12px 0}.site-header .container{gap:10px}.site-logo{font-size:12px}.site-nav a{font-size:11px;margin-left:8px}.site-nav a:nth-child(2){display:none}.home-hero{padding:55px 0 35px}.home-feature{grid-template-columns:1fr;margin-bottom:44px;border-radius:24px}.feature-copy{padding:28px}.feature-image{grid-row:1}.feature-image img{height:220px}.feature-copy h2{font-size:32px}.section-heading{display:block}.section-heading h2{font-size:22px;margin-bottom:6px}.article-grid{grid-template-columns:1fr}.article-card img{height:210px}.article-heading{margin-top:32px}.article-paper{padding:24px 18px;border-radius:20px;margin-top:24px}.article-content h2{font-size:22px}.showcase{margin-left:-18px;margin-right:-18px}.stage-sticky{border-radius:0}.is-ready .stage-sticky{top:49px;height:calc(100svh - 49px)}.stage-copy{padding-top:20px}.stage-copy h2{font-size:30px}.stage-copy p{font-size:11px}.stage-viewport{top:130px;bottom:160px}.stage-caption{bottom:65px}.stage-caption p{font-size:12px}.stage-caption small{font-size:9px;max-width:320px}.stage-skip{bottom:46px;right:12px;font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.showcase.is-ready{height:auto}.is-ready .stage-sticky{position:relative;top:0;height:640px}}
.motion-toggle{position:absolute;top:0;right:8px;z-index:5;background:#fff;border:1px solid #ddd;border-radius:15px;font-size:10px;padding:4px 10px;cursor:pointer}.motion-toggle[hidden]{display:none}@media(prefers-reduced-motion:reduce){.showcase.is-ready.motion-allowed{height:260svh}.motion-allowed .stage-sticky{position:sticky;top:68px;height:calc(100svh - 68px)}}@media(prefers-reduced-motion:reduce) and (max-width:700px){.motion-allowed .stage-sticky{top:49px;height:calc(100svh - 49px)}}
.site-header{height:68px;padding:0;display:flex;align-items:center}.site-header>.container{width:100%}.site-nav a:hover{color:#0071e3}.scene-matrix-table th{color:#1d1d1f}.btn{border-radius:30px;box-shadow:none}@media(max-width:700px){.site-header{height:49px}.site-header .container{flex-direction:row;gap:8px}.site-logo{font-size:11px;white-space:nowrap}.site-nav{width:auto;flex-wrap:nowrap;gap:0}.site-nav a{padding:3px;margin-left:3px;font-size:10px;white-space:nowrap}}

/* ---- 白基調テーマ向けコントラスト補正（白文字化の解消） ---- */
.article-content .diagram-title { color: #1d1d1f !important; }
.article-content .score-row { border-bottom: 1px solid #e6e6eb !important; }
.article-content .score-bar-bg { background: #e6e6eb !important; }
.article-content .vs-summary-box { background: #f7f8fa !important; border: 1px solid #e6e6eb !important; box-shadow: none !important; }
.article-content .vs-header { color: #1d1d1f !important; }
.article-content .vs-side-card { background: #ffffff !important; border: 1px solid #e6e6eb !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important; }
.article-content .vs-side-label { color: #68686d !important; font-weight: 600 !important; }
.article-content .vs-side-title { color: #1d1d1f !important; }
.article-content .vs-points { border-top: 1px solid #e6e6eb !important; }
.article-content .vs-point-tag { background: #ffffff !important; border: 1px solid #e6e6eb !important; color: #1d1d1f !important; }
.article-content .scene-matrix-box { background: #f7f8fa !important; border: 1px solid #e6e6eb !important; }
.article-content .scene-matrix-title { color: #1d1d1f !important; }
.article-content .scene-matrix-table th { background: #f0f2f5 !important; color: #1d1d1f !important; border-color: #e6e6eb !important; }
.article-content .scene-matrix-table td { background: #ffffff !important; border-color: #e6e6eb !important; color: #1d1d1f !important; }
.article-content .decision-card { background: #f7f8fa !important; border: 1px solid #e6e6eb !important; }
.article-content .decision-title { color: #1d1d1f !important; }
.article-content .decision-desc { color: #68686d !important; }
.article-content .purchase-block { background: #f7f8fa !important; border: 1px solid #e6e6eb !important; }
.article-content .purchase-title { color: #1d1d1f !important; border-bottom: 1px solid #e6e6eb !important; }


/* ---- Top Page: Load More Pagination ---- */
.article-card.is-hidden {
  display: none !important;
}
.article-card.is-revealed {
  animation: fadeInCard 0.35s ease forwards;
}
@keyframes fadeInCard {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.load-more-wrap {
  display: flex;
  justify-content: center;
  margin: 48px 0 24px;
}
.btn-load-more {
  cursor: pointer;
  border: none;
  font-size: 14px;
  font-weight: 600;
  padding: 12px 28px;
  box-shadow: 0 4px 14px rgba(0, 113, 227, 0.18);
  transition: transform 0.15s, background-color 0.15s, box-shadow 0.15s;
}
.btn-load-more:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 113, 227, 0.28);
}

/* ---- About Page: Apple-like Clean Design (脱・幼稚化) ---- */
.about-container {
  max-width: 920px;
  margin: 0 auto;
  padding: 20px 0 80px;
}
.about-header {
  text-align: center;
  padding: 30px 0 50px;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 48px;
}
.about-header h1 {
  font-size: clamp(32px, 5vw, 54px);
  line-height: 1.18;
  letter-spacing: -0.05em;
  margin: 18px 0 20px;
  color: #1d1d1f;
}
.about-header h1 span {
  color: #86868b;
}
.about-lead {
  font-size: 16px;
  line-height: 1.85;
  color: #515154;
  max-width: 660px;
  margin: 0 auto;
}
.about-section {
  margin-bottom: 56px;
}
.section-title-wrap {
  margin-bottom: 22px;
}
.section-title-wrap h2 {
  font-size: 24px;
  letter-spacing: -0.04em;
  margin-top: 6px;
  color: #1d1d1f;
}
.about-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 768px) {
  .about-card-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.about-card {
  background: #ffffff;
  border: 1px solid var(--color-border);
  border-radius: 20px;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
  transition: transform 0.2s, box-shadow 0.2s;
}
.about-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.04);
}
.card-num {
  font-size: 13px;
  font-weight: 800;
  color: var(--color-accent);
  letter-spacing: 0.1em;
  margin-bottom: 12px;
}
.about-card h3 {
  font-size: 16.5px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #1d1d1f;
  margin-bottom: 10px;
  line-height: 1.4;
}
.about-card p {
  font-size: 13.5px;
  line-height: 1.75;
  color: #68686d;
  margin: 0;
}
.about-profile-card {
  background: #ffffff;
  border: 1px solid var(--color-border);
  border-radius: 24px;
  padding: 34px 30px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
}
.profile-meta {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid #f0f0f4;
}
.profile-avatar-badge {
  width: 50px;
  height: 50px;
  border-radius: 14px;
  background: #1d1d1f;
  color: #ffffff;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: 0.05em;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.profile-titles h3 {
  font-size: 19px;
  font-weight: 700;
  color: #1d1d1f;
  margin: 0 0 4px;
}
.profile-role {
  font-size: 12.5px;
  color: #68686d;
  margin: 0;
}
.profile-text p {
  font-size: 13.5px;
  line-height: 1.85;
  color: #424245;
  margin-bottom: 12px;
}
.profile-text p:last-child {
  margin-bottom: 0;
}
.about-policy-card {
  background: #fbfbfd;
  border: 1px solid var(--color-border);
  border-radius: 24px;
  padding: 34px 30px;
}
.policy-block {
  margin-bottom: 24px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--color-border);
}
.policy-block h3, .disclaimer-block h3 {
  font-size: 16px;
  font-weight: 700;
  color: #1d1d1f;
  margin-bottom: 10px;
}
.policy-block p, .disclaimer-block p {
  font-size: 13.5px;
  line-height: 1.8;
  color: #515154;
}
.policy-list {
  list-style: none;
  padding: 0;
  margin: 12px 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.policy-list li {
  font-size: 13.5px;
  color: #1d1d1f;
  padding-left: 18px;
  position: relative;
}
.policy-list li::before {
  content: "•";
  position: absolute;
  left: 4px;
  color: var(--color-accent);
  font-weight: bold;
}
.policy-subtext {
  font-size: 12px;
  color: #86868b;
  margin-top: 10px;
}