.feature-deck { --deck-line: #dce2eb; --deck-blue: #234ec2; color: #142033; background: #f5f7fb; border: 1px solid var(--deck-line); border-radius: 8px; margin: 32px clamp(16px, 2vw, 40px); overflow-wrap: anywhere; }
.feature-deck *, .feature-deck-dialog { box-sizing: border-box; }
.feature-deck button { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 44px; min-height: 44px; padding: 6px 10px; border: 1px solid var(--deck-line); border-radius: 6px; background: white; color: var(--deck-blue); font: inherit; font-size: 16px; cursor: pointer; }
.feature-deck button:disabled { opacity: .45; cursor: default; }
.feature-deck [hidden] { display: none !important; }
.feature-deck :is(button, a, summary, [tabindex]):focus-visible { outline: 3px solid var(--deck-blue); outline-offset: -3px; }
.feature-deck__toolbar { position: sticky; top: 80px; z-index: 1; background: #f5f7fb; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--deck-line); }
.feature-deck__controls { display: flex; align-items: center; gap: 6px; }
.feature-deck__stage { display: grid; grid-template-columns: minmax(0, 1fr) 64px; position: relative; }
.feature-deck__rail { padding: 16px 8px; border-left: 1px solid var(--deck-line); }
.feature-deck__rail-nav { position: sticky; top: max(150px, 35dvh); display: flex; flex-direction: column; align-items: center; gap: 12px; }
.feature-deck__rail output { text-align: center; font-size: 14px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.feature-deck__toc { padding: 0 16px; background: #fff; border-bottom: 1px solid var(--deck-line); }
.feature-deck__toolbar > .feature-deck__toc { flex: 0 0 100%; min-width: 0; }
.feature-deck__toc summary { cursor: pointer; padding-block: 12px; font-size: 16px; }
.feature-deck__toc summary span { color: #52627a; margin-left: 10px; }
.feature-deck__toc nav { max-height: 28dvh; overflow-y: auto; }
.feature-deck__toc ol { list-style: decimal; margin: 0; padding: 0 0 12px 28px; }
.feature-deck__toc a { display: block; padding: 10px 4px; color: var(--deck-blue); text-underline-offset: 3px; }
.feature-deck__toc a[aria-current="true"] { font-weight: 700; background: #edf2ff; }
.feature-deck__viewport { position: relative; }
.feature-deck.is-ready[data-deck-mode="scroll"] .feature-deck__viewport { height: min(74dvh, 800px); overflow-y: auto; scroll-snap-type: y proximity; }
.feature-deck__slide { container-type: inline-size; scroll-snap-align: start; scroll-margin-top: 150px; border-bottom: 1px solid var(--deck-line); background: white; }
.feature-deck.is-ready[data-deck-mode="scroll"] .feature-deck__slide { scroll-margin-top: 0; min-height: 100%; }
.feature-deck__paper { padding: clamp(20px, 3cqi, 56px) clamp(24px, 5cqi, 80px); min-height: 400px; }
.feature-deck__brand { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.feature-deck__brand img { width: 120px; height: 28px; object-fit: contain; }
.feature-deck__brand span { font-size: clamp(14px, 1.3cqi, 20px); color: #52627a; }
.feature-deck .feature-deck__paper h2 { font-size: clamp(24px, 3.2cqi, 52px); line-height: 1.4; margin: 0 0 20px; padding: 0; border: 0; text-wrap: balance; }
.feature-deck .feature-deck__message { font-size: clamp(18px, 2cqi, 32px); line-height: 1.65; margin: 0 0 24px; }
.feature-deck__body { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.feature-deck .feature-deck__body ul { list-style: disc; padding-left: 1.3em; margin: 0; font-size: clamp(17px, 1.8cqi, 28px); line-height: 1.7; }
.feature-deck__body li + li { margin-top: 16px; }
.feature-deck__body figure { margin: 0; }
.feature-deck__contents { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; list-style: none; padding: 0; margin: 0; }
.feature-deck__contents a { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 16px; border: 1px solid var(--deck-line); border-radius: 6px; color: var(--deck-blue); font-size: clamp(17px, 1.8cqi, 28px); line-height: 1.6; text-decoration: none; background: #f5f7fb; }
.feature-deck__contents a > .mi { margin-left: auto; flex: 0 0 24px; }
.feature-deck__planned { font-size: 14px; white-space: nowrap; border: 1px solid var(--deck-line); padding: 2px 6px; color: #52627a; }
.feature-deck__capabilities { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0 0 24px; }
.feature-deck__capabilities li { background: #edf2ff; color: var(--deck-blue); border-radius: 4px; padding: 6px 12px; font-size: clamp(16px, 1.5cqi, 24px); }
.feature-deck__comparison { display: grid; grid-template-columns: 1fr 24px 1fr; align-items: stretch; gap: 16px; }
.feature-deck__comparison section { border: 1px solid var(--deck-line); padding: 20px; border-radius: 6px; }
.feature-deck__comparison section:last-child { background: #f5f7fb; border-color: #aebfe9; }
.feature-deck__comparison h3 { margin: 0 0 12px; color: var(--deck-blue); font-size: clamp(18px, 2cqi, 30px); line-height: 1.5; }
.feature-deck__comparison h3 span { display: block; font-size: clamp(17px, 1.6cqi, 24px); color: #142033; }
.feature-deck__comparison p { margin: 0; font-size: clamp(17px, 1.8cqi, 28px); line-height: 1.65; }
.feature-deck__change { align-self: center; color: var(--deck-blue); }
.feature-deck__benefit-heading { font-size: clamp(18px, 1.8cqi, 28px); margin: 24px 0 12px; }
.feature-deck__benefits { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.feature-deck__benefits li { display: flex; gap: 8px; font-size: clamp(17px, 1.6cqi, 24px); line-height: 1.65; }
.feature-deck__benefits .mi { flex: 0 0 24px; color: var(--deck-blue); }
.feature-deck__body figure > img { width: 100%; height: auto; object-fit: contain; }
.feature-deck__map { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--deck-line); border-radius: 6px; background: #f5f7fb; }
.feature-deck__map span { padding: 8px 12px; border-left: 3px solid var(--deck-blue); background: white; font-size: clamp(17px, 1.8cqi, 28px); }
.feature-deck__body figcaption { font-size: clamp(14px, 1.3cqi, 20px); color: #52627a; line-height: 1.6; margin-top: 12px; }
.feature-deck .feature-deck__note { margin: 24px 0 0; border-top: 1px solid var(--deck-line); padding-top: 16px; font-size: clamp(16px, 1.5cqi, 24px); line-height: 1.6; color: #52627a; }
.feature-deck__help { margin: 0; padding: 12px 16px; font-size: 14px; line-height: 1.7; color: #52627a; }
.feature-deck-dialog { max-width: none; max-height: none; width: 100%; height: 100dvh; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); border: 0; margin: 0; background: #f5f7fb; }
.feature-deck-dialog::backdrop { background: #142033; }
.feature-deck-dialog .feature-deck { margin: 0; border: 0; height: 100%; display: flex; flex-direction: column; }
.feature-deck-dialog .feature-deck__toolbar { top: 0; }
.feature-deck-dialog .feature-deck__stage { flex: 1; min-height: 0; grid-template-rows: minmax(0, 1fr); }
.feature-deck-dialog .feature-deck__viewport { height: 100% !important; min-height: 0; overflow-y: auto; scroll-snap-type: y proximity; }
.feature-deck-dialog .feature-deck__rail-nav { top: 35dvh; }
.feature-deck-dialog .feature-deck__slide { min-height: 100%; scroll-margin-top: 0; }
.feature-deck-dialog .feature-deck__paper { max-width: 1600px; margin-inline: auto; }
.feature-deck-dialog .feature-deck__slide { container-type: inline-size; }
@container (max-width: 620px) {
  .feature-deck__contents, .feature-deck__comparison, .feature-deck__benefits { grid-template-columns: 1fr; }
  .feature-deck__change { justify-self: center; transform: rotate(90deg); }
  .feature-deck__body { grid-template-columns: 1fr; gap: 20px; }
  .feature-deck__brand { flex-wrap: wrap; }
}
@media (max-width: 540px) {
  .feature-deck__toolbar { top: 69px; }
  .feature-deck { margin-inline: 0; }
  .feature-deck__stage { grid-template-columns: minmax(0, 1fr) 52px; }
  .feature-deck__rail { padding-inline: 4px; }
  .feature-deck__paper { padding-inline: 20px; }
}
/* Shared slide hierarchy: primary = navigation, secondary = benefit/result. */
.feature-deck { --deck-line: var(--line); --deck-blue: var(--p-dark); color: var(--fg); background: var(--bg-2); border-radius: var(--r); }
/* Reuse the article's responsive inner width; fullscreen moves outside it. */
.fund-page-skeleton.fund-page-decks { padding-block: 0; }
.fund-page-decks > .feature-deck { margin-inline: 0; }
.feature-deck button, .feature-deck__contents a, .feature-deck__comparison section, .feature-deck__map { border-radius: var(--r); }
.feature-deck__toolbar { background: var(--p-soft); border-top: 3px solid var(--p); }
.feature-deck button { border-color: var(--p); box-shadow: var(--shadow-sm); font-weight: 700; }
.feature-deck button[data-deck-open] { background: var(--p-dark); color: var(--bg); }
.feature-deck button:not(:disabled):hover, .feature-deck__contents a:hover { background: var(--p-soft); color: var(--p-dark); border-color: var(--p-dark); }
.feature-deck button:not(:disabled):active { box-shadow: none; }
.feature-deck__slide[data-slide-layout="contents"] { background: var(--p-soft); }
.feature-deck__slide[data-slide-layout="summary"] { background: var(--bg-3); }
.feature-deck .feature-deck__paper h2 { display: flex; align-items: baseline; gap: var(--space-3); color: var(--p-dark); }
.feature-deck .feature-deck__heading-icon { align-self: flex-start; flex-shrink: 0; padding: var(--space-2); font-size: clamp(24px, 3cqi, 48px); color: var(--p-dark); background: var(--p-soft); border-radius: var(--r); }
.feature-deck__slide[data-slide-layout="summary"] .feature-deck__heading-icon { color: var(--p-dark); background: var(--bg); }
.feature-deck .feature-deck__message { border-left: 3px solid var(--p); padding-left: var(--space-4); text-wrap: pretty; }
.feature-deck__contents a { background: var(--bg); border-color: var(--p); box-shadow: var(--shadow-sm); }
.feature-deck__contents a > .mi { background: var(--p-dark); color: var(--bg); padding: var(--space-1); border-radius: var(--r); flex-basis: auto; }
.feature-deck__comparison section:first-child { background: var(--bg-2); border-top: 3px solid var(--muted); }
.feature-deck__comparison section:last-child { background: var(--bg); border: 1px solid var(--p); border-top-width: 3px; }
.feature-deck__comparison section:last-child h3, .feature-deck__benefits .mi { color: var(--p-dark); }
.feature-deck__benefits li { background: var(--bg); padding: var(--space-4); border-bottom: 3px solid var(--p); border-radius: var(--r); }
.feature-deck__body > ul { background: var(--bg-2); border-top: 3px solid var(--p); }
.feature-deck .feature-deck__body > ul { padding: var(--space-5) var(--space-5) var(--space-5) var(--space-10); }
.feature-deck__body li::marker { color: var(--p); }
.feature-deck__capabilities li { display: inline-flex; align-items: center; gap: var(--space-2); }
.feature-deck__comparison h3 > .mi { font-size: 1em; vertical-align: middle; }
.feature-deck__benefit-heading { display: flex; align-items: center; gap: var(--space-2); color: var(--p-dark); }
.feature-deck .feature-deck__notice { display: flex; align-items: flex-start; gap: var(--space-3); background: var(--warm-bg); border: 0; border-left: 3px solid var(--warm); border-radius: var(--r); padding: var(--space-4); color: var(--warm-fg); }
.feature-deck__notice > .mi { flex-shrink: 0; font-size: 1.3em; }
.feature-deck__planned { background: var(--warm-bg); color: var(--warm-fg); border-color: var(--warm); }
.feature-deck__slide[data-slide-status="planned"] .feature-deck__heading-icon { background: var(--warm-bg); color: var(--warm-fg); }
.feature-deck__slide[data-slide-status="planned"] .feature-deck__brand > span { color: var(--warm-fg); background: var(--warm-bg); padding: var(--space-1) var(--space-2); }
.feature-deck__map { background: var(--p-soft); }
.feature-deck__screenshot { display: block; border: 2px solid var(--p); border-radius: var(--r); padding: var(--space-2); background: var(--bg); box-shadow: var(--shadow-md); cursor: zoom-in; text-decoration: none; }
.feature-deck__screenshot:hover { outline: 2px solid var(--p-dark); outline-offset: 2px; }
.feature-deck__screenshot img { display: block; width: 100%; height: auto; }
.feature-deck__image-hint { display: flex; justify-content: center; align-items: center; gap: var(--space-2); padding: var(--space-3); margin-top: var(--space-2); background: var(--p-dark); color: var(--bg); font-size: var(--fs-md); font-weight: 700; }
/* 画面画像に添える「入力／出力」。この画面で何を入れ、何が出るかを画像の直後に置く。 */
.feature-deck__io { display: grid; grid-template-columns: auto 1fr; gap: var(--space-2) var(--space-3); margin: var(--space-3) 0 0; padding: var(--space-3) var(--space-4); background: var(--p-soft); border-radius: var(--r); font-size: clamp(15px, 1.4cqi, 22px); line-height: 1.65; }
.feature-deck__io dt { font-weight: 700; color: var(--p-dark); white-space: nowrap; }
.feature-deck__io dd { margin: 0; color: #3d4a5c; }
@media (max-width: 560px) { .feature-deck__io { grid-template-columns: 1fr; gap: var(--space-1) 0; } .feature-deck__io dd { margin-bottom: var(--space-2); } }

.feature-deck__body figure > p > a { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 44px; padding: var(--space-2) var(--space-3); border: 1px solid var(--p); border-radius: var(--r); background: var(--bg); text-underline-offset: 3px; }
.feature-deck__body figure > p > a:hover { background: var(--p-soft); }
.feature-deck-image-dialog { box-sizing: border-box; max-width: none; max-height: none; width: 100%; height: 100dvh; margin: 0; border: 0; padding: max(var(--space-4), env(safe-area-inset-top)) max(var(--space-4), env(safe-area-inset-right)) max(var(--space-4), env(safe-area-inset-bottom)) max(var(--space-4), env(safe-area-inset-left)); background: var(--bg-2); color: var(--fg); }
.feature-deck-image-dialog { width: calc(100% - var(--space-8)); height: calc(100dvh - var(--space-8)); margin: auto; border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-lg); }
.feature-deck-image-dialog[open] { display: flex; flex-direction: column; gap: var(--space-4); }
.feature-deck-image-dialog::backdrop { background: color-mix(in srgb, var(--fg) 72%, transparent); }
.feature-deck-image-dialog__toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); flex-shrink: 0; }
.feature-deck-image-dialog__toolbar strong { margin-right: auto; }
.feature-deck-image-dialog__toolbar a { padding: var(--space-3); color: var(--p-dark); text-decoration: underline; }
.feature-deck .feature-deck-image-dialog__toolbar button { background: var(--p-dark); color: var(--bg); }
.feature-deck-image-dialog > img { flex: 1; min-height: 0; width: 100%; object-fit: contain; border: 1px solid var(--line); background: var(--bg); }
@media (max-width: 980px) {
  /* Reserve the fixed section-menu row without changing global navigation. */
  .section-menu-layout .feature-deck__toolbar { top: calc(var(--space-16) + var(--space-3) + var(--space-12) + var(--space-2) + env(safe-area-inset-top)); }
}
@media print {
  .feature-deck-image-dialog { display: none; }
  .feature-deck__toolbar, .feature-deck__toc, .feature-deck__help, .feature-deck__rail { display: none; }
  .feature-deck__stage { display: block; }
  .feature-deck .feature-deck__viewport { height: auto !important; max-height: none !important; overflow: visible !important; }
  .feature-deck__slide { break-inside: avoid; break-after: page; }
}