.rk-article {
  --rk-ink: #10182c;
  --rk-text: #283044;
  --rk-muted: #687086;
  --rk-canvas: #f4f7fb;
  --rk-surface: #fff;
  --rk-line: #dfe6f0;
  --rk-cyan: #36c7ee;
  --rk-violet: #786dff;
  --rk-purple: #ac63ed;
  --rk-green: #2cb99a;
  --rk-gradient: linear-gradient(120deg, var(--rk-cyan), var(--rk-violet) 56%, var(--rk-purple));
  --rk-radius: 18px;
  --rk-shadow: 0 18px 60px rgba(16, 24, 44, .07);
  color: var(--rk-text);
  background: var(--rk-canvas);
  font-family: "Noto Sans JP", "Hiragino Sans", sans-serif;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: .018em;
}
.rk-article * { box-sizing: border-box; }
.rk-article a { color: inherit; }
.rk-reading-line { position: fixed; top: 0; left: 0; right: 0; z-index: 9999; height: 3px; transform: scaleX(0); transform-origin: left; background: var(--rk-gradient); }
.rk-layout { width: min(1240px, calc(100% - 40px)); margin: 0 auto; padding: 54px 0 96px; display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 56px; align-items: start; }
.rk-main { min-width: 0; }
.rk-breadcrumb { display: flex; align-items: center; gap: 10px; margin-bottom: 42px; color: var(--rk-muted); font: 600 12px/1.4 Manrope, sans-serif; }
.rk-breadcrumb a { text-decoration: none; }
.rk-breadcrumb a:hover { color: var(--rk-violet); }
.rk-kicker, .rk-section-label { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 15px; color: var(--rk-violet); font: 800 11px/1.2 Manrope, sans-serif; letter-spacing: .18em; }
.rk-kicker::before, .rk-section-label::before { content: ""; width: 22px; height: 2px; background: var(--rk-gradient); }
.rk-article-head h1 { max-width: 900px; margin: 0; color: var(--rk-ink); font-size: clamp(2rem, 4.2vw, 3.45rem); line-height: 1.28; letter-spacing: -.035em; font-weight: 700; }
.rk-deck { max-width: 780px; margin: 24px 0 0; color: #555e73; font-size: 17px; line-height: 1.9; }
.rk-byline { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 24px 0 34px; color: var(--rk-muted); font: 600 12px/1.5 Manrope, "Noto Sans JP", sans-serif; }
.rk-byline span { position: relative; }
.rk-byline span + span::before { content: ""; position: absolute; left: -12px; top: 50%; width: 3px; height: 3px; border-radius: 50%; background: #aab1c0; }
.rk-hero { position: relative; overflow: hidden; margin: 0 0 38px; aspect-ratio: 16/9; border-radius: 24px; background: var(--rk-ink); box-shadow: var(--rk-shadow); }
.rk-hero::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(255,255,255,.15); border-radius: inherit; pointer-events: none; }
.rk-hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rk-toc { display: grid; grid-template-columns: 180px 1fr; gap: 28px; padding: 28px 30px; margin: 0 0 48px; background: rgba(255,255,255,.86); border: 1px solid var(--rk-line); border-radius: var(--rk-radius); box-shadow: 0 8px 30px rgba(16,24,44,.035); backdrop-filter: blur(14px); }
.rk-toc > div { border-right: 1px solid var(--rk-line); }
.rk-toc > div span { display: block; color: var(--rk-violet); font: 800 10px/1 Manrope, sans-serif; letter-spacing: .16em; }
.rk-toc > div strong { display: block; margin-top: 8px; color: var(--rk-ink); font-size: 15px; }
.rk-toc ol { margin: 0; padding: 0; list-style: none; counter-reset: rk-toc; display: grid; gap: 8px; }
.rk-toc li { counter-increment: rk-toc; position: relative; padding-left: 32px; }
.rk-toc li::before { content: counter(rk-toc, decimal-leading-zero); position: absolute; left: 0; color: #a2aaba; font: 700 11px/1.9 Manrope, sans-serif; }
.rk-toc a { text-decoration: none; font-size: 14px; font-weight: 600; }
.rk-toc a:hover { color: var(--rk-violet); }
.rk-prose { padding: 3px 0; font-size: 16px; }
.rk-prose > p:first-child { font-size: 18px; line-height: 2; color: #394157; }
.rk-prose h2 { scroll-margin-top: 96px; position: relative; margin: 3.5em 0 1.15em; padding: 0 0 .65em 22px; color: var(--rk-ink); font-size: clamp(1.45rem, 2.4vw, 1.85rem); line-height: 1.5; letter-spacing: -.018em; border-bottom: 1px solid var(--rk-line); }
.rk-prose h2::before { content: ""; position: absolute; left: 0; top: .2em; width: 5px; height: 1.2em; border-radius: 9px; background: var(--rk-gradient); }
.rk-prose h3 { margin: 2.5em 0 .9em; color: var(--rk-ink); font-size: 1.2rem; line-height: 1.55; }
.rk-prose p { margin: 0 0 1.55em; }
.rk-prose a { color: #4e5cd4; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.rk-prose strong { color: var(--rk-ink); }
.rk-prose ul, .rk-prose ol { margin: 0 0 1.7em; padding-left: 1.4em; }
.rk-prose li { margin-bottom: .55em; padding-left: .2em; }
.rk-prose blockquote { margin: 2em 0; padding: 22px 24px; border: 1px solid #d9e5f4; border-left: 4px solid var(--rk-cyan); border-radius: 5px 15px 15px 5px; background: #f5fbff; }
.rk-prose blockquote p:last-child { margin-bottom: 0; }
.rk-prose table { width: 100%; margin: 2em 0; border-collapse: separate; border-spacing: 0; overflow: hidden; border: 1px solid var(--rk-line); border-radius: 14px; background: var(--rk-surface); font-size: 14px; }
.rk-prose th, .rk-prose td { padding: 14px 16px; text-align: left; vertical-align: top; border-right: 1px solid var(--rk-line); border-bottom: 1px solid var(--rk-line); }
.rk-prose th { color: var(--rk-ink); background: #f0f4fa; font-weight: 700; }
.rk-prose tr:last-child td { border-bottom: 0; }
.rk-prose th:last-child, .rk-prose td:last-child { border-right: 0; }
.rk-prose figure, .rk-prose img { max-width: 100%; height: auto; }
.rk-prose figure { margin: 2.2em 0; }
.rk-prose img { border-radius: 15px; }
.rk-aside { position: sticky; top: 90px; display: grid; gap: 22px; max-height: calc(100vh - 112px); overflow-y: auto; scrollbar-width: thin; padding: 3px 7px 14px; margin: -3px -7px 0; }
.rk-widget { border: 1px solid var(--rk-line); border-radius: var(--rk-radius); background: var(--rk-surface); box-shadow: 0 12px 44px rgba(16,24,44,.05); }
.rk-popular { padding: 22px; }
.rk-widget-title span { display: block; color: var(--rk-violet); font: 800 10px/1 Manrope, sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.rk-widget-title h2 { margin: 7px 0 18px; color: var(--rk-ink); font-size: 18px; letter-spacing: -.02em; }
.rk-popular-tabs { display: grid; grid-template-columns: repeat(3,1fr); margin-bottom: 10px; padding: 4px; border-radius: 10px; background: #f1f4f9; }
.rk-popular-tab { border: 0; border-radius: 7px; padding: 8px 4px; background: transparent; color: #7c8495; font: 700 11px/1 Manrope, "Noto Sans JP", sans-serif; cursor: pointer; }
.rk-popular-tab.is-active { background: #fff; color: var(--rk-ink); box-shadow: 0 3px 12px rgba(16,24,44,.08); }
.rk-popular-list { display: none; list-style: none; margin: 0; padding: 0; }
.rk-popular-list.is-active { display: block; }
.rk-popular-list li { position: relative; padding: 13px 0; border-bottom: 1px solid #edf0f5; }
.rk-popular-list li:last-child { border: 0; padding-bottom: 0; }
.rk-popular-list a { display: grid; grid-template-columns: 78px 1fr; gap: 12px; text-decoration: none; align-items: center; }
.rk-rank { position: absolute; z-index: 2; left: -7px; top: 7px; display: grid; place-items: center; width: 25px; height: 25px; border-radius: 8px; background: var(--rk-ink); color: #fff; font: 800 11px/1 Manrope, sans-serif; box-shadow: 0 4px 10px rgba(16,24,44,.18); }
.rk-popular-list li:first-child .rk-rank { background: var(--rk-gradient); }
.rk-popular-thumb { display: block; width: 78px; aspect-ratio: 3/2; overflow: hidden; border-radius: 9px; background: linear-gradient(135deg,#e9eef7,#f6f8fb); }
.rk-popular-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rk-popular-copy strong { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #343c50; font-size: 12.5px; line-height: 1.55; }
.rk-popular-copy small { display: block; margin-top: 5px; color: #969dac; font: 700 10px/1 Manrope, sans-serif; }
.rk-popular-list a:hover strong { color: var(--rk-violet); }
.rk-side-cta { position: relative; overflow: hidden; padding: 26px; border: 0; color: #fff; background: linear-gradient(145deg,#10182c 0%,#1b2850 62%,#2d2564 100%); }
.rk-side-cta::after { content: ""; position: absolute; right: -90px; bottom: -110px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle,rgba(54,199,238,.28),transparent 65%); }
.rk-side-cta > * { position: relative; z-index: 1; }
.rk-side-cta-mark { color: #7ee7ff; font: 800 10px/1 Manrope,sans-serif; letter-spacing: .18em; }
.rk-side-cta h2 { margin: 13px 0 10px; font-size: 19px; line-height: 1.55; letter-spacing: -.02em; }
.rk-side-cta p { margin: 0 0 20px; color: rgba(255,255,255,.7); font-size: 12.5px; line-height: 1.75; }
.rk-side-cta a { display: flex; justify-content: space-between; align-items: center; padding: 13px 15px; border-radius: 10px; background: #fff; color: var(--rk-ink); text-decoration: none; font-size: 13px; font-weight: 700; }
.rk-side-cta a:hover { transform: translateY(-2px); }
.rk-side-cta small { display: block; margin-top: 12px; color: rgba(255,255,255,.48); font-size: 9px; text-align: center; }
.rk-related { margin-top: 78px; padding-top: 36px; border-top: 1px solid var(--rk-line); }
.rk-related h2 { margin: 0 0 22px; color: var(--rk-ink); font-size: 24px; }
.rk-related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; }
.rk-related-grid a { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--rk-line); border-radius: 15px; background: var(--rk-surface); text-decoration: none; box-shadow: 0 8px 28px rgba(16,24,44,.04); }
.rk-related-thumb { display: block; aspect-ratio: 16/9; background: #edf1f7; overflow: hidden; }
.rk-related-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rk-related-grid strong { padding: 14px; color: #343c50; font-size: 13px; line-height: 1.65; }
.rk-related-grid a:hover { transform: translateY(-3px); border-color: #cbd5ea; }
.rk-main-cta { position: relative; overflow: hidden; margin-top: 48px; padding: 45px; border-radius: 24px; color: #fff; background: linear-gradient(145deg,#0f172b 0%,#18264c 56%,#32266b 100%); box-shadow: 0 24px 70px rgba(16,24,44,.18); }
.rk-main-cta::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 88% 12%,rgba(54,199,238,.23),transparent 34%),radial-gradient(circle at 20% 110%,rgba(172,99,237,.2),transparent 38%); }
.rk-main-cta > * { position: relative; z-index: 1; }
.rk-main-cta-copy span { color: #7ee7ff; font: 800 10px/1 Manrope,sans-serif; letter-spacing: .19em; }
.rk-main-cta h2 { margin: 14px 0 13px; color: #fff; font-size: clamp(1.65rem,3vw,2.35rem); line-height: 1.45; letter-spacing: -.035em; }
.rk-main-cta p { max-width: 680px; margin: 0; color: rgba(255,255,255,.7); font-size: 14px; }
.rk-service-pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 25px 0; }
.rk-service-pills span { padding: 7px 12px; border: 1px solid rgba(255,255,255,.13); border-radius: 999px; background: rgba(255,255,255,.055); color: rgba(255,255,255,.78); font-size: 11px; font-weight: 600; }
.rk-main-cta-actions { display: flex; align-items: center; gap: 20px; }
.rk-primary-button { display: inline-flex; align-items: center; gap: 16px; padding: 15px 21px; border-radius: 11px; background: #fff; color: var(--rk-ink)!important; text-decoration: none; font-size: 14px; font-weight: 700; box-shadow: 0 10px 25px rgba(0,0,0,.15); }
.rk-primary-button:hover { transform: translateY(-2px); }
.rk-main-cta-actions small { color: rgba(255,255,255,.48); font-size: 10px; }
.rk-archive { min-height: 70vh; }
.rk-archive-head { color: #fff; background: linear-gradient(145deg,#10182c,#1c2b54 58%,#33266e); }
.rk-archive-head > div { width: min(1240px,calc(100% - 40px)); margin: 0 auto; padding: 84px 0 76px; }
.rk-archive-head span { color: #7ee7ff; font: 800 11px/1 Manrope,sans-serif; letter-spacing: .2em; }
.rk-archive-head h1 { margin: 18px 0 12px; color: #fff; font-size: clamp(2.2rem,5vw,4.2rem); letter-spacing: -.05em; }
.rk-archive-head p { max-width: 690px; margin: 0; color: rgba(255,255,255,.66); font-size: 16px; }
.rk-archive-layout { width: min(1240px,calc(100% - 40px)); margin: 0 auto; padding: 64px 0 100px; display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 50px; align-items: start; }
.rk-card-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.rk-card { border: 1px solid var(--rk-line); border-radius: 18px; overflow: hidden; background: #fff; box-shadow: 0 12px 40px rgba(16,24,44,.05); }
.rk-card > a { display: block; text-decoration: none; }
.rk-card-thumb { display: block; aspect-ratio: 16/9; overflow: hidden; background: #e9eef6; }
.rk-card-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rk-card-body { display: flex; min-height: 240px; flex-direction: column; padding: 22px; }
.rk-card-body small { color: var(--rk-violet); font: 700 10px/1 Manrope,sans-serif; }
.rk-card-body strong { margin: 12px 0 10px; color: var(--rk-ink); font-size: 18px; line-height: 1.6; }
.rk-card-body em { color: var(--rk-muted); font-size: 12px; line-height: 1.8; font-style: normal; }
.rk-card-body b { margin-top: auto; padding-top: 18px; color: var(--rk-violet); font-size: 12px; }
.rk-card:hover { transform: translateY(-4px); box-shadow: var(--rk-shadow); }
.rk-pagination { margin-top: 38px; }
.rk-pagination .nav-links { display: flex; gap: 8px; }
.rk-pagination a,.rk-pagination span { display: grid; place-items: center; min-width: 38px; height: 38px; border: 1px solid var(--rk-line); border-radius: 9px; text-decoration: none; background:#fff; }
.rk-pagination .current { background: var(--rk-ink); color:#fff; border-color:var(--rk-ink); }
@media (max-width: 1050px) {
  .rk-layout,.rk-archive-layout { grid-template-columns: minmax(0,1fr) 300px; gap: 30px; }
}
@media (max-width: 860px) {
  .rk-layout,.rk-archive-layout { width: min(100% - 28px,760px); grid-template-columns: 1fr; padding-top: 34px; }
  .rk-aside { position: static; max-height: none; overflow: visible; grid-template-columns: 1fr 1fr; }
  .rk-breadcrumb { margin-bottom: 28px; }
  .rk-toc { grid-template-columns: 1fr; }
  .rk-toc > div { border-right: 0; border-bottom: 1px solid var(--rk-line); padding-bottom: 14px; }
}
@media (max-width: 620px) {
  .rk-article { font-size: 15px; }
  .rk-layout,.rk-archive-layout,.rk-archive-head > div { width: min(100% - 24px,760px); }
  .rk-article-head h1 { font-size: 1.85rem; }
  .rk-deck,.rk-prose > p:first-child { font-size: 16px; }
  .rk-hero { border-radius: 16px; }
  .rk-prose table { display: block; overflow-x: auto; white-space: nowrap; }
  .rk-related-grid,.rk-card-grid,.rk-aside { grid-template-columns: 1fr; }
  .rk-main-cta { padding: 30px 22px; border-radius: 18px; }
  .rk-main-cta-actions { align-items: stretch; flex-direction: column; }
  .rk-primary-button { justify-content: space-between; }
  .rk-archive-head > div { padding: 60px 0 54px; }
  .rk-archive-layout { padding-top: 36px; }
}
@media (prefers-reduced-motion: no-preference) {
  .rk-card,.rk-related-grid a,.rk-side-cta a,.rk-primary-button { transition: transform .22s ease,box-shadow .22s ease,border-color .22s ease; }
}