/* Velmor LMS wireframe shared header / footer */
.wf-site-header,
.wf-site-header *,
.wf-site-footer,
.wf-site-footer * { box-sizing: border-box; }

.wf-site-header {
  position: sticky;
  top: 0;
  z-index: 80;
  width: 100%;
  padding: 0 24px;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  background: rgba(11, 22, 40, .94);
  color: #fff;
  box-shadow: none;
  backdrop-filter: blur(12px);
}
.wf-site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 1440px;
  min-height: 80px;
  margin: 0 auto;
}
.wf-site-header__logo {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  text-decoration: none;
}
.wf-site-header__logo img {
  display: block;
  width: auto;
  height: 32px;
}
.wf-site-header__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 0;
}
.wf-site-header__nav a,
.wf-site-header__nav a:link,
.wf-site-header__nav a:visited {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 8px;
  border-radius: 6px;
  color: rgba(255, 255, 255, .75) !important;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background .18s ease, color .18s ease;
}
.wf-site-header__nav a:hover,
.wf-site-header__nav a:focus-visible {
  background: rgba(255, 255, 255, .07);
  color: #fff !important;
}
.wf-site-header__nav a.is-active {
  background: rgba(255, 255, 255, .07);
  color: #fff !important;
  box-shadow: inset 0 -2px 0 #4d97ff;
}
.wf-site-header__nav a.is-active::after {
  content: none;
}
.wf-site-header__dropdown {
  position: relative;
}
.wf-site-header__dropdown::before {
  position: absolute;
  z-index: 1;
  top: 100%;
  right: -12px;
  left: -12px;
  height: 14px;
  content: "";
}
.wf-site-header__nav a.wf-site-header__dropdown-trigger::after {
  display: block;
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  margin: -3px 0 0 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  content: "" !important;
  transform: rotate(45deg);
  transition: transform .18s ease;
}
.wf-site-header__dropdown:hover .wf-site-header__dropdown-trigger::after,
.wf-site-header__dropdown:focus-within .wf-site-header__dropdown-trigger::after {
  transform: translateY(3px) rotate(225deg);
}
.wf-site-header__dropdown-panel {
  position: absolute;
  z-index: 2;
  top: calc(100% + 10px);
  left: 50%;
  display: grid;
  width: 226px;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 13px;
  background: #101f35;
  box-shadow: 0 20px 44px rgba(4, 12, 27, .34);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 6px);
  visibility: hidden;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.wf-site-header__dropdown:hover .wf-site-header__dropdown-panel,
.wf-site-header__dropdown:focus-within .wf-site-header__dropdown-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0);
  visibility: visible;
}
.wf-site-header__nav .wf-site-header__dropdown-panel a,
.wf-site-header__nav .wf-site-header__dropdown-panel a:link,
.wf-site-header__nav .wf-site-header__dropdown-panel a:visited {
  display: flex;
  width: 100%;
  min-height: 0;
  padding: 10px 12px !important;
  color: #dce6f3 !important;
  font-size: 12px;
  font-weight: 600;  /* 2026-10-06 トップのパネル（600）に合わせた */
}
.wf-site-header__nav .wf-site-header__dropdown-panel a:hover,
.wf-site-header__nav .wf-site-header__dropdown-panel a:focus-visible,
.wf-site-header__nav .wf-site-header__dropdown-panel a.is-active {
  background: rgba(255,255,255,.08);
  color: #fff !important;
  box-shadow: inset 2px 0 0 #4d97ff;
}
.wf-site-header__nav a:focus-visible,
.wf-site-header__cta:focus-visible,
.wf-mobile-menu summary:focus-visible,
.wf-mobile-menu__panel a:focus-visible,
.wf-site-footer a:focus-visible {
  outline: 3px solid rgba(77, 151, 255, .45);
  outline-offset: 3px;
}
.wf-site-header__cta,
.wf-site-header__cta:link,
.wf-site-header__cta:visited {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 22px;
  border-radius: 999px;
  background: #1a6dff;
  color: #fff !important;
  font-size: 13px;
  font-weight: 700;
  line-height: 22px;
  text-decoration: none;
  box-shadow: none;
  transition: background .2s ease;
}
.wf-site-header__cta:hover { background: #3d8bff; }
.wf-mobile-menu { position: relative; display: none; margin-left: auto; }
.wf-mobile-menu > summary {
  display: grid;
  place-content: center;
  width: 44px;
  height: 44px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 10px;
  cursor: pointer;
  list-style: none;
}
.wf-mobile-menu > summary::-webkit-details-marker { display: none; }
.wf-mobile-menu > summary span {
  display: block;
  width: 20px;
  height: 2px;
  margin: 2px 0;
  border-radius: 999px;
  background: #fff;
  transition: transform .18s ease, opacity .18s ease;
}
.wf-mobile-menu[open] > summary span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.wf-mobile-menu[open] > summary span:nth-child(2) { opacity: 0; }
.wf-mobile-menu[open] > summary span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.wf-mobile-menu__panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  display: grid;
  width: min(82vw, 320px);
  padding: 10px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 15px;
  background: #101f35;
  box-shadow: 0 22px 50px rgba(4, 12, 27, .34);
}
.wf-mobile-menu__panel a,
.wf-mobile-menu__panel a:link,
.wf-mobile-menu__panel a:visited {
  padding: 12px 13px;
  border-radius: 9px;
  color: #e6edf7 !important;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.wf-mobile-menu__panel a:hover,
.wf-mobile-menu__panel a.is-active { background: rgba(255,255,255,.08); color: #fff !important; }
.wf-mobile-menu__group {
  border-top: 1px solid rgba(255,255,255,.09);
  border-bottom: 1px solid rgba(255,255,255,.09);
}
.wf-mobile-menu__group > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  padding: 12px 13px;
  border-radius: 9px;
  color: #e6edf7;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  list-style: none;
}
.wf-mobile-menu__group > summary::-webkit-details-marker { display: none; }
.wf-mobile-menu__group > summary::after {
  color: #8fb5ff;
  content: "+";
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
}
.wf-mobile-menu__group[open] > summary,
.wf-mobile-menu__group > summary:hover { background: rgba(255,255,255,.06); color: #fff; }
.wf-mobile-menu__group[open] > summary::after { content: "−"; }
.wf-mobile-menu__subnav {
  display: grid;
  padding: 0 0 8px 12px;
}
.wf-mobile-menu__panel .wf-mobile-menu__subnav a,
.wf-mobile-menu__panel .wf-mobile-menu__subnav a:link,
.wf-mobile-menu__panel .wf-mobile-menu__subnav a:visited {
  padding: 9px 12px;
  color: #c7d4e6 !important;
  font-size: 12px;
  font-weight: 600;
}
.wf-mobile-menu__panel .wf-mobile-menu__cta { margin-top: 7px; background: #1a6dff; text-align: center; }

.wf-site-footer {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #0b1628;
  color: #d5deeb;
}
.wf-site-footer::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, #1a6dff 0%, #00a58f 52%, #7357d6 100%);
  content: "";
}
.wf-site-footer__inner { width: min(100%, 1440px); margin: 0 auto; padding: 64px 24px 24px; }
.wf-site-footer__top {
  display: grid;
  grid-template-columns: minmax(250px, 1.45fr) repeat(3, minmax(140px, .72fr));
  gap: 44px;
  padding-bottom: 44px;
}
.wf-site-footer__brand img { display: block; width: 156px; height: auto; margin-bottom: 20px; }
.wf-site-footer__tagline { max-width: 370px; margin: 0; color: #aebbd0; font-size: 13px; line-height: 1.85; }
.wf-site-footer__title { margin: 2px 0 14px; color: #fff; font-size: 13px; font-weight: 800; }
.wf-site-footer__links { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.wf-site-footer__links a,
.wf-site-footer__links a:link,
.wf-site-footer__links a:visited { color: #b8c5d8 !important; font-size: 12px; line-height: 1.55; text-decoration: none; }
.wf-site-footer__links a:hover { color: #fff !important; text-decoration: underline; text-underline-offset: 4px; }
.wf-site-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.12);
  color: #8fa0b8;
  font-size: 11px;
}
.wf-site-footer__legal { display: flex; flex-wrap: wrap; gap: 18px; }
.wf-site-footer__legal a,
.wf-site-footer__legal a:link,
.wf-site-footer__legal a:visited { color: #aebbd0 !important; text-decoration: none; }
.wf-site-footer__legal a:hover { color: #fff !important; }

@media (max-width: 1280px) {
  .wf-site-header__nav { gap: 0; }
  .wf-site-header__nav a { padding-inline: 6px !important; }
  .wf-site-header__cta { padding-inline: 16px !important; }
}

@media (max-width: 1080px) {
  .wf-site-header__nav a { padding-inline: 4px !important; }
  .wf-site-header__cta { padding-inline: 14px !important; }
  .wf-site-footer__top { grid-template-columns: 1.2fr repeat(3, minmax(125px, .7fr)); gap: 26px; }
}
@media (max-width: 1024px) {
  .wf-site-header__inner { min-height: 64px; }
  .wf-site-header__logo img { width: auto; height: 30px; }
  .wf-site-header__nav,
  .wf-site-header__cta,
  .wf-site-header__cta:link,
  .wf-site-header__cta:visited { display: none; }
  .wf-mobile-menu { display: block; }
  .wf-site-footer__inner { padding: 50px 20px 22px; }
  .wf-site-footer__top { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
  .wf-site-footer__brand { grid-column: 1 / -1; }
  .wf-site-footer__bottom { align-items: flex-start; flex-direction: column-reverse; }
}
@media (max-width: 520px) {
  .wf-site-footer__top { grid-template-columns: 1fr; gap: 28px; }
  .wf-site-footer__brand { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .wf-site-header__nav a,
  .wf-site-header__cta,
  .wf-mobile-menu > summary span,
  .wf-site-header__dropdown-trigger::after,
  .wf-site-header__dropdown-panel { transition: none; }
}

/* LMSページ群：階層をまたいだトーン＆マナーの共通基準 */
:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) {
  --lms-family-brand: #1a6dff;
  --lms-family-brand-dark: #0b55d8;
  --lms-family-accent: #0b55d8;
  --lms-family-ink: #0b1628;
  --lms-family-muted: #31445b;
  --lms-family-line: #dce6f3;
  font-family: "Noto Sans JP", system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
}

:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) :is(h1, h2, h3, p, a, button, input, summary, span, li) {
  font-family: inherit;
}

/* Astraの英字大文字化を打ち消し、HTMLに記述した大文字・小文字をそのまま表示する。 */
:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) :is(h1, h2, h3, h4, h5, h6) {
  font-variant-caps: normal !important;
  text-transform: none !important;
}

/* パンくずは階層を示す補助情報として、下線を使わず静かな色で統一する。 */
:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) nav[aria-label="パンくず"] {
  color: #68778c !important;
  font-size: 13px !important;
  line-height: 1.6;
}

:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) nav[aria-label="パンくず"] a,
:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) nav[aria-label="パンくず"] a:visited {
  color: #52667f !important;
  text-decoration: none !important;
}

:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) nav[aria-label="パンくず"] a:hover,
:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) nav[aria-label="パンくず"] a:focus-visible {
  color: var(--lms-family-brand) !important;
  text-decoration: none !important;
}

/* Velmor青は導線と注目語、濃紺は見出し、深いティールは受講者を示す。 */
:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) .eyebrow,
#velmor-permission-wireframe .permission-hero-copy > div:first-child {
  border-color: rgba(26, 109, 255, .24) !important;
  background: rgba(26, 109, 255, .08) !important;
  color: var(--lms-family-brand-dark) !important;
}

#velmor-lms-wireframe .hero-grid .accent,
#velmor-features-wireframe .hero-layout h1 span,
#velmor-course-management-wireframe .hero-title-accent,
#velmor-progress-wireframe .hero-grid h1 span,
#velmor-permission-wireframe .permission-hero-title-accent,
#velmor-delivery-wireframe .hero-grid h1 span,
#velmor-knowledge-search-wireframe .hero-grid h1 span {
  color: var(--lms-family-accent) !important;
}

#velmor-lms-wireframe .hero-grid > div:first-child,
#velmor-features-wireframe .hero-layout > div:first-child,
#velmor-course-management-wireframe .hero-grid > div:first-child,
#velmor-progress-wireframe .hero-grid > div:first-child,
#velmor-permission-wireframe .permission-hero-copy,
#velmor-delivery-wireframe .hero-grid > div:first-child,
#velmor-knowledge-search-wireframe .hero-grid > div:first-child {
  border-left-color: var(--lms-family-accent) !important;
}

:is(
  #velmor-lms-wireframe,
  #velmor-features-wireframe,
  #velmor-course-management-wireframe,
  #velmor-progress-wireframe,
  #velmor-permission-wireframe,
  #velmor-delivery-wireframe,
  #velmor-knowledge-search-wireframe
) :is(a, button, summary):focus-visible {
  outline: 3px solid rgba(26, 109, 255, .34);
  outline-offset: 3px;
}

/* LMS群の可読性・操作性。既存ページ内CSSより優先し、Astraのボタン指定も打ち消す。 */
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) p:not(.lead):not(.eyebrow):not(.viewport-title):not(.wf-site-footer__title) {
  font-size: 16px !important;
  line-height: 1.8 !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.eyebrow, .role-label, .feat-detail__role, .feature-inline-detail__role) {
  font-size: 12px !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(section[id], .domain[id]) {
  scroll-margin-top: 100px;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .wf-site-header__nav a {
  min-height: 44px;
  /* 2026-10-06 トップのヘッダー（.header-nav a＝12px）に合わせた。
     min-height はタップ領域の確保なので残す。 */
  font-size: 12px;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .wf-mobile-menu__panel {
  max-height: calc(100dvh - 88px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .wf-site-footer :is(p, a) {
  font-size: 14px !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .wf-site-footer__links a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
}

/* カテゴリ色をDOMの並び順から切り離し、列の再配置でも同じ意味を保つ。 */
#velmor-features-wireframe .domain[data-domain-kind="course-management"] { --domain-color: #1a6dff !important; --domain-soft: #e8f1ff !important; --domain-text: #155cc9; }
#velmor-features-wireframe .domain[data-domain-kind="progress"] { --domain-color: #00a995 !important; --domain-soft: #e6f8f5 !important; --domain-text: #007a6c; }
#velmor-features-wireframe .domain[data-domain-kind="permission"] { --domain-color: #7655df !important; --domain-soft: #f0edff !important; --domain-text: #6a4fcf; }
#velmor-features-wireframe .domain[data-domain-kind="delivery"] { --domain-color: #df8f13 !important; --domain-soft: #fff3dd !important; --domain-text: #9a5c00; }
#velmor-features-wireframe .domain[data-domain-kind="knowledge-search"] { --domain-color: #de557f !important; --domain-soft: #fff0f4 !important; --domain-text: #c13b66; }
#velmor-features-wireframe .domain-count,
#velmor-features-wireframe .domain-toggle,
#velmor-features-wireframe .domain-actions .destination,
#velmor-features-wireframe .chip-button[aria-pressed="true"] {
  color: var(--domain-text) !important;
}
#velmor-features-wireframe .domain-toggle {
  min-height: 44px !important;
  height: auto !important;
  padding: 8px 14px !important;
  font-size: 14px !important;
  gap: 10px;
}
#velmor-features-wireframe .domain-actions .destination {
  min-height: 44px !important;
  font-size: 14px !important;
}
#velmor-features-wireframe .chips,
#velmor-features-wireframe .domain.is-open .chips {
  grid-auto-rows: 48px !important;
}
#velmor-features-wireframe .chip-button {
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  padding: 8px 12px !important;
  font-size: 15px !important;
}
#velmor-features-wireframe .feature-inline-detail {
  min-height: 176px !important;
  padding: 20px !important;
}
#velmor-features-wireframe .feature-inline-detail__title { font-size: 18px !important; }
#velmor-features-wireframe .chip-button[data-feature-role="受講者向け"] .role,
#velmor-features-wireframe .features-guide .role:nth-of-type(2),
#velmor-features-wireframe .feature-inline-detail__role[data-role-type="受講者向け"] {
  background: #007d72 !important;
  color: #fff !important;
}
#velmor-features-wireframe .hero-capabilities a {
  display: flex;
  align-items: center;
  min-height: 44px !important;
  padding: 10px 14px !important;
  font-size: 15px !important;
}

/* 機能説明はカード内で完結。操作部は同じ幅・高さと明瞭な選択状態にする。 */
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feature-list[data-feature-group] {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 8px !important;
  padding: 0;
  margin-top: 18px;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feature-list li:has(> .feat-btn) {
  min-width: 0;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feat-btn, .feat-chip) {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  width: 100% !important;
  min-height: 48px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  border: 1px solid #cfdded !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: #30445e !important;
  font-size: 15px !important;
  font-weight: 600;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease;
}
#velmor-permission-wireframe .feat-chip { width: auto !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feat-btn, .feat-chip):hover {
  border-color: #1a6dff !important;
  background: #f4f8ff !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feat-btn, .feat-chip)[aria-pressed="true"] {
  border-color: #1a6dff !important;
  background: #e8f1ff !important;
  color: #0b55d8 !important;
  box-shadow: inset 3px 0 0 #1a6dff;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feat-detail {
  min-height: 168px !important;
  margin: 16px 0 0 !important;
  padding: 20px !important;
  border: 1px solid #cfdef2 !important;
  border-left: 3px solid #1a6dff !important;
  border-radius: 12px;
  background: linear-gradient(130deg, #eef5ff, #fff) !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feat-detail__role { background: #0b1628 !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feat-detail__role[data-role-type="受講者向け"] { background: #007d72 !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feat-detail__title { font-size: 18px !important; color: #0b1628 !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feat-detail__desc { color: #42566f !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [role="tabpanel"]:focus-visible {
  outline: 3px solid rgba(26, 109, 255, .5);
  outline-offset: 4px;
  border-radius: 12px;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [role="tab"] {
  font-size: 14px !important;
  min-height: 48px !important;
}
:is(#velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .flow-step:not(:last-child)::after {
  content: "→";
  position: absolute;
  z-index: 1;
  top: 50%;
  right: -27px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 3px solid #f4f8ff;
  border-radius: 50%;
  background: #1a6dff;
  color: #fff;
  font-size: 18px;
  line-height: 1;
  transform: translateY(-50%);
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .related-card:focus-within {
  outline: 3px solid rgba(26, 109, 255, .34);
  outline-offset: 3px;
}
#velmor-permission-wireframe .permission-faq [data-faq-trigger] { min-height: 56px; font-size: 16px !important; }
#velmor-permission-wireframe .permission-faq [data-faq-answer] { font-size: 16px !important; line-height: 1.8 !important; color: #31445b !important; }
#velmor-permission-wireframe .permission-related-card { color: #30445e !important; text-decoration: none !important; }
#velmor-permission-wireframe .permission-related-card:hover,
#velmor-permission-wireframe .permission-related-card:focus-visible { border-color: #1a6dff !important; background: #f4f8ff !important; }

/* ヒーローと読了後の導線。footerの有無に左右されないCTA専用指定。 */
#velmor-lms-wireframe .lms-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
#velmor-lms-wireframe a.lms-hero-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 20px;
  border: 1px solid #1a6dff;
  border-radius: 999px;
  color: #0b55d8 !important;
  background: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
#velmor-lms-wireframe a.lms-hero-action--primary { background: #1a6dff; color: #fff !important; }
#velmor-lms-wireframe a.lms-hero-action:hover { background: #edf4ff; }
#velmor-lms-wireframe a.lms-hero-action--primary:hover { background: #0b55d8; }
:is(#velmor-lms-wireframe, #velmor-features-wireframe) .lms-final-cta {
  background: radial-gradient(circle at 85% 18%, rgba(26, 109, 255, .3), transparent 35%), linear-gradient(135deg, #0b1628, #102746) !important;
  color: #fff !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe) .lms-final-cta :is(h2, .lead) { color: #fff !important; }
#velmor-lms-wireframe .feature-link { padding: 0 !important; }
#velmor-lms-wireframe .feature-link > a { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; padding: 16px 22px; }

@media (max-width: 1200px) {
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.wf-site-header__nav, .wf-site-header__cta) { display: none !important; }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .wf-mobile-menu { display: block; }
  #velmor-lms-wireframe .viewport.desktop .areas { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 1024px) {
  :is(#velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .flow-step::after { display: none !important; }
}
@media (max-width: 900px) {
  #velmor-lms-wireframe .viewport.desktop .areas { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 768px) {
  #velmor-features-wireframe .mobile .domain-actions { grid-template-columns: minmax(0, 1fr) !important; gap: 8px; }
  #velmor-features-wireframe .mobile .domain-toggle { justify-self: start; width: auto !important; }
  #velmor-features-wireframe .mobile .domain-toggle [data-toggle-label] { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; clip-path: none !important; white-space: normal !important; }
  #velmor-features-wireframe .mobile .feature-inline-detail { min-height: 204px !important; }
  #velmor-features-wireframe .mobile .chip-button { font-size: 14px !important; padding-inline: 10px !important; }
  #velmor-permission-wireframe .permission-tabs { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .wf-site-footer__links a { min-height: 44px; }
  #velmor-lms-wireframe .lms-hero-actions { flex-direction: column; align-items: stretch; }
  #velmor-lms-wireframe .mobile .hero-grid .tags { display: flex !important; }
  #velmor-lms-wireframe .mobile .hero-grid .tag { font-size: 12px !important; white-space: nowrap; }
}
@media (max-width: 520px) {
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feature-list[data-feature-group] { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feat-btn, .feat-chip) { transition: none; }
}

/* LMSのカード設計：情報は罫線、操作は青、学習基盤は濃紺で役割を分ける。 */
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) {
  --lms-card-line: #c9d4e2;
  --lms-card-soft: #f5f7fa;
  --lms-card-text: #31445b;
  --lms-type-family: "Noto Sans JP", system-ui, -apple-system, "Hiragino Kaku Gothic ProN", sans-serif;
  --lms-type-title: clamp(44px, 3.7vw, 52px);
  --lms-type-section: 36px;
  --lms-type-card: 20px;
  --lms-type-support: 22px;
  --lms-type-lead: 18px;
  --lms-type-body: 16px;
  --lms-type-action: 15px;
  --provision-standard: #0b55d8;
  --provision-standard-soft: #edf4ff;
  --provision-standard-line: #b6cef5;
  --provision-option: #86500b;
  --provision-option-soft: #fff6e1;
  --provision-option-line: #dfbc7a;
  --provision-custom: #6542ac;
  --provision-custom-soft: #f5f1fb;
  --provision-custom-line: #cdbcea;
}
/* 文字と面積の序列を明確にし、装飾よりも情報の読み取りを優先する。 */
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) h1 {
  font-size: var(--lms-type-title) !important;
  line-height: 1.3 !important;
  letter-spacing: -.025em !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) h2,
#velmor-permission-wireframe .viewport .dc-card > div > .permission-section-heading {
  font-size: var(--lms-type-section) !important;
  line-height: 1.45 !important;
  margin-bottom: 16px !important;
  letter-spacing: -.02em !important;
}
#velmor-permission-wireframe .viewport .dc-card .permission-hero-title { font-size: var(--lms-type-title) !important; line-height: 1.3 !important; letter-spacing: -.025em !important; color: #0b1628 !important; }
#velmor-permission-wireframe .viewport .dc-card .permission-hero-eyebrow { padding: 0 !important; border: 0 !important; background: none !important; font-size: 12px !important; font-weight: 700; color: #0b55d8 !important; }
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .lead,
#velmor-permission-wireframe .viewport .dc-card .permission-hero-lead,
#velmor-permission-wireframe .viewport .dc-card .permission-section-lead { font-size: var(--lms-type-lead) !important; line-height: 1.85 !important; }
:is(#velmor-lms-wireframe, #velmor-features-wireframe) :is(.area-card p, .detail-card p, .domain-description, .feature-inline-detail__description) { color: var(--lms-card-text) !important; }
:is(#velmor-lms-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .page > section:not(.breadcrumb-section):not(:has(nav[aria-label="パンくず"])):not(:has(> .hero-grid)):not(.cta-section):not(.lms-final-cta),
#velmor-features-wireframe :is(.features, section[aria-labelledby^="custom-area-title"], .requirements),
#velmor-permission-wireframe .viewport .dc-card > div:has(> .permission-section-heading) { padding-top: 80px !important; padding-bottom: 80px !important; }
#velmor-lms-wireframe .viewport .areas { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 20px !important; }
#velmor-lms-wireframe .viewport .detail-links { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; }
#velmor-lms-wireframe .area-card h3 { font-size: var(--lms-type-card) !important; line-height: 1.55 !important; }
#velmor-lms-wireframe .area-card__destination { font-size: 14px !important; padding-top: 16px !important; }
#velmor-lms-wireframe .detail-card h3 { font-size: var(--lms-type-support) !important; }
#velmor-lms-wireframe .feature-note { max-width: 880px; margin-inline: auto; text-align: left; }
#velmor-lms-wireframe .layer-band--current .layer-copy h3 { font-size: 28px !important; }
#velmor-features-wireframe .domain h3 { font-size: var(--lms-type-card) !important; line-height: 1.55 !important; }
#velmor-features-wireframe :is(.card-item, .requirement-card) h3 { font-size: var(--lms-type-support) !important; }
#velmor-features-wireframe .requirement-table :is(th, td),
#velmor-features-wireframe .requirement-notes li { font-size: 16px !important; line-height: 1.8; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.role-panel, .related-card) h3 { font-size: var(--lms-type-support) !important; line-height: 1.5 !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .content-card, .record-card, .delivery-card, .knowledge-card, .flow-step, .role-panel, .related-card) p { color: var(--lms-card-text) !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .role-grid .role-panel--learner::before { background: #007d72 !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .role-panel--learner .role-label { background: #007d72 !important; color: #fff !important; }
:is(#velmor-lms-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .page > section.section--gray:not(.lms-final-cta):not(.cta-section):not(:last-child),
#velmor-features-wireframe :is(.features, .requirements) {
  background: var(--lms-card-soft) !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) section:has(> :is(.hero-grid, .hero-layout)),
#velmor-permission-wireframe .viewport .dc-card > div:has(> :is(.permission-hero, .permission-hero-title)) {
  background: #fff !important;
  box-shadow: none !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .eyebrow,
#velmor-permission-wireframe .permission-hero-copy > div:first-child {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: none !important;
  color: #0b55d8 !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.tag, .hero-capabilities a, .role-label, .feat-detail__role, .feature-inline-detail__role, .step-number, .flow-number, .status) {
  border-radius: 3px !important;
  box-shadow: none !important;
}

/* 土台の上に載る情報は薄い枠に留め、基盤だけ面の強さで際立たせる。 */
#velmor-lms-wireframe .layers--foundation-modules .layer-band {
  border: 1px solid var(--lms-card-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
}
#velmor-lms-wireframe .layers--foundation-modules .layer-band--outcome {
  min-height: 88px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--lms-card-line) !important;
  border-radius: 0 !important;
  padding: 12px 18px !important;
  background: none !important;
}
#velmor-lms-wireframe .layers--foundation-modules .layer-band--module {
  min-height: 168px !important;
  padding: 16px 20px !important;
}
#velmor-lms-wireframe .layers--foundation-modules :is(.layer-label, .module-note) {
  border: 0 !important;
  border-radius: 3px !important;
  background: #f0f3f7 !important;
  color: #42566f !important;
  box-shadow: none !important;
  letter-spacing: .025em !important;
}
#velmor-lms-wireframe .layers--foundation-modules .layer-label { background: none !important; }
#velmor-lms-wireframe .layers--foundation-modules :is(.layer-icon, .card-icon) { box-shadow: none !important; }
#velmor-lms-wireframe .layer-link :is(a, a:visited) { color: #0b55d8 !important; }
#velmor-lms-wireframe .layers--foundation-modules .layer-band--current {
  min-height: 224px !important;
  border: 1px solid #132e50 !important;
  border-bottom: 6px solid #1a6dff !important;
  background: #132e50 !important;
}
#velmor-lms-wireframe .layer-band--current .layer-copy :is(h3, p) { color: #fff !important; }
#velmor-lms-wireframe .layer-band--current .foundation-kicker { color: #a9cdff !important; }
#velmor-lms-wireframe .layer-band--current .layer-label { color: #a9cdff !important; }
#velmor-lms-wireframe .layer-band--current .current-label {
  border-radius: 3px !important;
  background: #0b55d8 !important;
  color: #fff !important;
  font-size: 12px !important;
  vertical-align: middle;
}
#velmor-lms-wireframe .foundation-capabilities span {
  padding: 4px 10px !important;
  border: 1px solid #5a7698 !important;
  border-radius: 3px !important;
  background: none !important;
  color: #fff !important;
}

/* 機能領域はカードの面・罫線、提供区分は文字ラベルで示す。紫・アンバーは区分用に残す。 */
:is(#velmor-lms-wireframe, #velmor-features-wireframe) [data-domain-kind="course-management"] {
  --category-ink: #0b55d8;
  --category-soft: #edf4ff;
  --category-line: #b6cef5;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe) [data-domain-kind="progress"] {
  --category-ink: #08718c;
  --category-soft: #edf8fb;
  --category-line: #abd4df;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe) [data-domain-kind="permission"] {
  --category-ink: #4955a4;
  --category-soft: #f0f2fc;
  --category-line: #c2c8ea;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe) [data-domain-kind="delivery"] {
  --category-ink: #596b29;
  --category-soft: #f4f7ea;
  --category-line: #c9d7a7;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe) [data-domain-kind="knowledge-search"] {
  --category-ink: #a03e57;
  --category-soft: #fff1f4;
  --category-line: #e8bec9;
}

/* リンクカードは全面クリック、資料カードは内部リンクのみ。反応を分ける。 */
#velmor-lms-wireframe a.area-card {
  border: 1px solid var(--lms-card-line) !important;
  border-top: 4px solid var(--category-ink, #1a6dff) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  padding: 20px !important;
}
#velmor-lms-wireframe a.area-card:hover,
#velmor-lms-wireframe a.area-card:focus-visible {
  border-color: var(--category-ink, #1a6dff) !important;
  background: var(--category-soft, #f3f7ff) !important;
}
#velmor-lms-wireframe .area-card :is(.area-card__destination, .area-card__destination:visited) { color: var(--category-ink, #0b55d8) !important; }
#velmor-lms-wireframe .area-card__count,
#velmor-features-wireframe .domain-count {
  border: 0 !important;
  border-radius: 3px !important;
  background: var(--category-soft, #f0f3f7) !important;
  color: var(--category-ink, #42566f) !important;
  font-size: 12px !important;
  padding: 3px 6px !important;
}
#velmor-lms-wireframe .area-card .card-icon { padding: 0 !important; background-color: var(--category-soft, transparent) !important; box-shadow: none !important; }
#velmor-lms-wireframe .detail-card.is-static {
  border: 0 !important;
  border-top: 2px solid #9bacc2 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  padding: 20px 0 !important;
}
#velmor-lms-wireframe .detail-card.is-static:hover { transform: none !important; box-shadow: none !important; }
#velmor-lms-wireframe .detail-card.is-static a { display: inline-flex; align-items: center; min-height: 44px; color: #0b55d8 !important; }
#velmor-lms-wireframe .feature-link {
  border: 1px solid #132e50 !important;
  border-radius: 6px !important;
  background: #132e50 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* 機能一覧：開閉する容器を動かさず、操作部だけ状態を示す。 */
#velmor-features-wireframe .domain,
#velmor-features-wireframe .domain.is-open,
#velmor-features-wireframe .domain:not(.is-open):hover {
  border: 1px solid var(--lms-card-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}
#velmor-features-wireframe .domain.is-open { border-color: var(--category-line, #97b6e7) !important; }
#velmor-features-wireframe .domain .domain-head { background: var(--category-soft, #f8faff) !important; }
#velmor-features-wireframe .domain-actions .destination { color: var(--category-ink, #0b55d8) !important; }
#velmor-features-wireframe .domain-toggle {
  border: 1px solid var(--category-ink, #1a6dff) !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: var(--category-ink, #0b55d8) !important;
}
#velmor-features-wireframe .domain-toggle:hover { background: var(--category-soft, #edf4ff) !important; }
#velmor-features-wireframe .features-guide {
  border: 0 !important;
  border-bottom: 1px solid var(--lms-card-line) !important;
  border-radius: 0 !important;
  background: none !important;
  padding: 12px 0 !important;
}
#velmor-features-wireframe .chip-button,
#velmor-features-wireframe .chip-button:hover {
  border: 1px solid var(--lms-card-line) !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #233851 !important;
  box-shadow: none !important;
  transform: none !important;
}
#velmor-features-wireframe .chip-button:hover { border-color: var(--category-ink, #1a6dff) !important; background: var(--category-soft, #f3f7ff) !important; }
#velmor-features-wireframe .chip-button[aria-pressed="true"] {
  border-color: var(--category-ink, #0b55d8) !important;
  background: var(--category-ink, #0b55d8) !important;
  color: #fff !important;
}
#velmor-features-wireframe .chip-button[aria-pressed="true"] .role { border: 1px solid #bed5ff; }
#velmor-features-wireframe :is(.role, .feature-inline-detail__role) { border-radius: 3px !important; }
#velmor-features-wireframe .feature-inline-detail {
  border: 0 !important;
  border-left: 3px solid var(--category-ink, #1a6dff) !important;
  border-radius: 0 !important;
  background: var(--category-soft, #f5f7fa) !important;
}
#velmor-features-wireframe .cards--custom .card-item,
#velmor-features-wireframe .requirement-card {
  border: 1px solid var(--lms-card-line) !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: none !important;
}
#velmor-features-wireframe .cards--custom .card-item { min-height: 0 !important; }
#velmor-features-wireframe .requirement-table th { background: #eef2f7 !important; }

/* 詳細ページ：比較・手順・教材は静かな資料カードへ。 */
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .role-panel, .content-card, .record-card, .delivery-card, .knowledge-card, .flow-step, .related-card) {
  border: 1px solid var(--lms-card-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .flow-step) { padding: 24px !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .role-panel::before { height: 2px !important; background: #1a6dff !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .content-card, .record-card, .delivery-card, .knowledge-card, .flow-step) h3 { color: #0b1628 !important; font-size: 20px !important; line-height: 1.5 !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feat-btn, .feat-chip) { border-radius: 4px !important; box-shadow: none !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feat-btn, .feat-chip)[aria-pressed="true"] {
  border-color: #0b55d8 !important;
  background: #0b55d8 !important;
  color: #fff !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feat-detail {
  border: 0 !important;
  border-left: 3px solid #1a6dff !important;
  border-radius: 0 !important;
  background: #f5f7fa !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) a.related-card:hover,
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) a.related-card:focus-visible {
  border-color: #1a6dff !important;
  background: #f3f7ff !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.related-arrow, .content-icon, .record-icon, .delivery-icon, .knowledge-icon) {
  border-radius: 4px !important;
  background: #edf3fc !important;
  color: #0b55d8 !important;
  box-shadow: none !important;
  transform: none !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.flow-bar, .flow-summary, .permission-flow-summary) { border-radius: 4px !important; box-shadow: none !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .flow-step, .permission-flow-step)::after { box-shadow: none !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .flow-step, .permission-flow-step):not(:last-child)::after {
  width: 28px !important;
  height: 28px !important;
  margin-top: 0 !important;
  right: -23px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: #1a6dff !important;
  color: #fff !important;
  line-height: 28px !important;
  transform: translateY(-50%) !important;
}
#velmor-lms-wireframe section:has(> .layers) { background: #fff !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) section:has(> .role-grid) { background: #f5f7fa !important; }

/* 権限管理の旧インライン構造も、既存の意味のある要素を起点に限定する。 */
#velmor-permission-wireframe { --permission-soft: #f5f7fa; }
#velmor-permission-wireframe :is(.permission-flow-step, .permission-related-card, .permission-faq > div, .dc-card div:has(> [data-feature-group])) {
  border: 1px solid var(--lms-card-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}
#velmor-permission-wireframe .permission-related-card:hover,
#velmor-permission-wireframe .permission-related-card:focus-visible { border-color: #1a6dff !important; background: #f3f7ff !important; }
#velmor-permission-wireframe .dc-card > div:nth-of-type(4) > div:nth-child(4) > div,
#velmor-permission-wireframe .dc-card > div:nth-of-type(6) > div:nth-child(4) {
  border-radius: 8px !important;
  box-shadow: none !important;
}
#velmor-permission-wireframe .dc-card .feat-detail__role {
  border: 0 !important;
  border-radius: 3px !important;
  padding: 3px 8px !important;
  color: #fff !important;
}
#velmor-permission-wireframe .permission-flow-number { border-radius: 3px !important; }
#velmor-permission-wireframe .permission-flow-step > div:nth-child(2) { font-size: var(--lms-type-card) !important; line-height: 1.55 !important; }
#velmor-permission-wireframe .permission-flow-step > div:last-child,
#velmor-permission-wireframe .viewport .dc-card :is(.permission-point__body, .permission-problem__body, .permission-standard-intro),
#velmor-permission-wireframe .permission-related-card > div:nth-child(2),
#velmor-permission-wireframe .permission-comparison + div > div:last-child { font-size: 16px !important; line-height: 1.8 !important; color: #31445b !important; }
#velmor-permission-wireframe .permission-flow-section > div:last-child { font-size: 14px !important; line-height: 1.7 !important; color: #42566f !important; }
#velmor-permission-wireframe .permission-related-card > div:last-child { font-size: 14px !important; color: #0b55d8 !important; }
#velmor-permission-wireframe .viewport .dc-card :is(.permission-point, .permission-problem) > div:is(.permission-point__title, .permission-problem__title),
#velmor-permission-wireframe .permission-related-card > div:first-child > div { font-size: var(--lms-type-card) !important; line-height: 1.55 !important; }
#velmor-permission-wireframe .viewport .dc-card .permission-point { border: 1px solid var(--lms-card-line) !important; border-radius: 8px !important; background: #fff !important; box-shadow: none !important; padding: 24px !important; }
#velmor-permission-wireframe .viewport .dc-card .permission-point::before { width: 32px !important; height: 3px !important; border-radius: 0 !important; background: #0b55d8 !important; }

/* タブは選択状態だけを濃くし、画像枠と操作部を重ねて飾らない。 */
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [role="tab"] { border-radius: 4px !important; box-shadow: none !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [role="tab"][aria-selected="true"] { background: #0b55d8 !important; color: #fff !important; }
#velmor-permission-wireframe .permission-switcher { border-radius: 8px !important; box-shadow: none !important; }
#velmor-permission-wireframe :is(.permission-tabs, .permission-stage, .permission-switcher .permission-visual, .permission-scope-visual) { border-radius: 4px !important; box-shadow: none !important; }

/* 主なCTAは押せる矩形に。グローバルヘッダーの仕様は変更しない。 */
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.button-wire, .lms-hero-action),
#velmor-features-wireframe .action,
#velmor-permission-wireframe .permission-cta-actions a {
  border-radius: 6px !important;
  box-shadow: none !important;
  transform: none !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.button-wire--primary, .lms-hero-action--primary),
#velmor-features-wireframe .action.primary { background: #0b55d8 !important; color: #fff !important; }
#velmor-lms-wireframe .viewport .page > section.lms-final-cta,
#velmor-features-wireframe .lms-final-cta,
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .page .cta-section,
#velmor-permission-wireframe .viewport .dc-card > div:has(.permission-cta-actions) { background: #132e50 !important; }
#velmor-course-management-wireframe .cta-section :is(h2, .lead) { color: #fff !important; }
#velmor-permission-wireframe .permission-comparison {
  border: 1px solid var(--lms-card-line) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  overflow: hidden;
}
#velmor-permission-wireframe .permission-comparison span { border-radius: 3px !important; }
#velmor-permission-wireframe .viewport .dc-card .permission-comparison > div { min-width: 0 !important; font-size: 16px !important; line-height: 1.8 !important; }
#velmor-permission-wireframe .viewport .dc-card .permission-comparison > div:first-child { font-size: 14px !important; font-weight: 700; background: #edf2f8 !important; color: #31445b !important; }
#velmor-permission-wireframe .permission-comparison > div > div { min-width: 0; }
#velmor-permission-wireframe .viewport .dc-card .permission-comparison span { display: inline-block; max-width: 100%; font-size: 13px !important; line-height: 1.6 !important; white-space: normal !important; }
#velmor-permission-wireframe .viewport .dc-card > div > div > a.permission-more-card {
  border: 1px solid var(--lms-card-line) !important;
  border-radius: 8px !important;
  padding: 20px !important;
  background: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}
#velmor-permission-wireframe .viewport .dc-card > div > div > a.permission-more-card:hover { border-color: #1a6dff !important; background: #f3f7ff !important; }
#velmor-permission-wireframe .permission-more-card > div:first-child { font-size: 18px !important; color: #0b1628 !important; text-decoration: none !important; }
#velmor-permission-wireframe .permission-more-card > div:nth-child(2) { font-size: 16px !important; color: #31445b !important; }
#velmor-permission-wireframe .permission-more-card > div:last-child { font-size: 14px !important; font-weight: 700; color: #0b55d8 !important; }
/* 提供区分は対象者の色とは別軸。文字ラベルと細い罫線を必ず併用する。 */
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [data-provision="standard"] {
  --provision-ink: var(--provision-standard);
  --provision-soft: var(--provision-standard-soft);
  --provision-line: var(--provision-standard-line);
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [data-provision="option"] {
  --provision-ink: var(--provision-option);
  --provision-soft: var(--provision-option-soft);
  --provision-line: var(--provision-option-line);
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [data-provision="custom"] {
  --provision-ink: var(--provision-custom);
  --provision-soft: var(--provision-custom-soft);
  --provision-line: var(--provision-custom-line);
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .provision-label[data-provision],
#velmor-permission-wireframe .viewport .dc-card .provision-label[data-provision] {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 3px 9px !important;
  margin: 0 0 12px;
  border: 1px solid var(--provision-line) !important;
  border-radius: 3px !important;
  background: var(--provision-soft) !important;
  color: var(--provision-ink) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.6 !important;
  letter-spacing: .02em !important;
  white-space: normal !important;
  vertical-align: middle;
}
#velmor-features-wireframe .provision-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 16px 0 0;
  color: #31445b;
  font-size: 14px;
}
#velmor-features-wireframe .provision-legend .provision-label { margin: 0; }
#velmor-features-wireframe .provision-legend__title { margin-right: 4px; }
#velmor-features-wireframe .features[data-provision="standard"],
#velmor-lms-wireframe .page > section.section--gray[data-provision="standard"] { background: #f3f7fd !important; }
#velmor-features-wireframe .domain[data-provision="standard"] { border-top: 4px solid var(--category-ink, var(--provision-standard)) !important; }
#velmor-features-wireframe .domain[data-provision="standard"] .domain-head .provision-label { margin-bottom: 8px; }
#velmor-features-wireframe section[aria-labelledby^="custom-area-title"][data-provision="custom"] { background: #faf8fd !important; }
#velmor-features-wireframe .cards--custom .card-item[data-provision="custom"],
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .related-card[data-provision="custom"],
#velmor-permission-wireframe .viewport .dc-card > div > div > a.permission-more-card[data-provision="custom"] {
  border-color: var(--provision-line) !important;
  border-left: 3px solid var(--provision-ink) !important;
  background: var(--provision-soft) !important;
}
#velmor-features-wireframe .cards--custom .status.provision-label { margin: 0 0 0 8px; }
#velmor-lms-wireframe .layers--foundation-modules .layer-band--module[data-provision="custom"] {
  border-color: var(--provision-custom-line) !important;
  border-top: 2px solid var(--provision-custom) !important;
  background: #faf8fd !important;
}
#velmor-lms-wireframe .layers--foundation-modules .layer-band--module .module-note.provision-label {
  margin: 0;
  border: 1px solid var(--provision-custom-line) !important;
  background: var(--provision-custom-soft) !important;
  color: var(--provision-custom) !important;
  font-size: 12px !important;
}
#velmor-lms-wireframe .layer-band--module .layer-label,
#velmor-lms-wireframe .layer-band--module .layer-link :is(a, a:visited) { color: var(--provision-custom) !important; }
#velmor-lms-wireframe .provision-summary { margin: 16px auto 0; max-width: 960px; color: #31445b !important; }
/* 境界注記の面は淡く、ラベルのみ濃くする。本文は通常の読める濃さを維持。 */
:is(#velmor-lms-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feature-note, .boundary-note, .option-note, .extension-note, .provision-note)[data-provision],
#velmor-features-wireframe .note-box[data-provision],
#velmor-permission-wireframe .viewport .dc-card .permission-comparison + div[data-provision] {
  padding: 20px !important;
  border: 1px solid var(--provision-line) !important;
  border-left: 3px solid var(--provision-ink) !important;
  border-radius: 4px !important;
  background: var(--provision-soft) !important;
  color: #31445b !important;
  text-align: left !important;
}
:is(#velmor-lms-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feature-note, .boundary-note, .option-note, .extension-note, .provision-note) .provision-label { display: table; margin-bottom: 8px; }
#velmor-lms-wireframe .feature-note > br { display: none; }
#velmor-features-wireframe .note-box p { color: #31445b !important; }
#velmor-course-management-wireframe .page .option-note:has(.provision-note) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 0 !important; border: 0 !important; background: none !important; }
#velmor-course-management-wireframe .provision-note { margin: 0; }
#velmor-permission-wireframe .viewport .dc-card .permission-comparison > div[data-provision] { background: var(--provision-soft) !important; }
#velmor-permission-wireframe .viewport .dc-card .permission-comparison > div[data-provision] > div:first-child { border-left: 3px solid var(--provision-ink); }
#velmor-permission-wireframe .viewport .dc-card .permission-comparison .provision-label[data-provision] { margin: 0; border-color: var(--provision-line) !important; background: var(--provision-soft) !important; color: var(--provision-ink) !important; font-size: 13px !important; }
#velmor-permission-wireframe .permission-comparison + div .provision-label { margin: 0 8px 0 0; }
#velmor-permission-wireframe .permission-more-card[data-provision="custom"] > div:last-child,
#velmor-knowledge-search-wireframe .related-card[data-provision="custom"] a { color: var(--provision-custom) !important; }
/* 「管理者・受講者」の紫は個別開発と混同するため、対象者はスレートへ。 */
#velmor-features-wireframe .chip-button[data-feature-role="管理者・受講者向け"] .role,
#velmor-features-wireframe .feature-inline-detail__role[data-role-type="管理者・受講者向け"] { background: #42566f !important; color: #fff !important; }
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(a, button):focus-visible {
  outline: 3px solid #1a6dff !important;
  outline-offset: 4px !important;
}
@media (max-width: 768px) {
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) h1,
  #velmor-permission-wireframe .viewport.mobile .dc-card .permission-hero-title { font-size: var(--lms-type-title) !important; line-height: 1.3 !important; letter-spacing: -.025em !important; }
  #velmor-permission-wireframe .viewport.mobile .dc-card .permission-hero-eyebrow { font-size: 12px !important; }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) h2,
  #velmor-permission-wireframe .viewport .dc-card > div > .permission-section-heading { font-size: var(--lms-type-section) !important; }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .lead,
  #velmor-permission-wireframe .viewport.mobile .dc-card .permission-hero-lead,
  #velmor-permission-wireframe .viewport .dc-card .permission-section-lead { font-size: var(--lms-type-lead) !important; }
  :is(#velmor-lms-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .page > section:not(.breadcrumb-section):not(:has(nav[aria-label="パンくず"])):not(:has(> .hero-grid)):not(.cta-section):not(.lms-final-cta),
  #velmor-features-wireframe :is(.features, section[aria-labelledby^="custom-area-title"], .requirements),
  #velmor-permission-wireframe .viewport .dc-card > div:has(> .permission-section-heading) { padding-top: 52px !important; padding-bottom: 52px !important; }
  #velmor-lms-wireframe .viewport .areas,
  #velmor-lms-wireframe .viewport .detail-links { grid-template-columns: minmax(0, 1fr) !important; grid-auto-flow: row !important; grid-auto-columns: auto !important; gap: 16px !important; overflow: visible !important; margin-right: 0 !important; padding-right: 0 !important; scroll-snap-type: none !important; }
  #velmor-lms-wireframe .scroll-hint { display: none !important; }
  #velmor-lms-wireframe .viewport .area-card { min-width: 0 !important; min-height: 0 !important; width: auto !important; }
  #velmor-lms-wireframe .area-card h3,
  #velmor-features-wireframe .domain h3 { font-size: var(--lms-type-card) !important; }
  #velmor-lms-wireframe .layer-band--current .layer-copy h3 { font-size: 24px !important; }
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .content-card, .record-card, .delivery-card, .knowledge-card, .flow-step) h3,
  #velmor-permission-wireframe .viewport .dc-card :is(.permission-point, .permission-problem) > div:is(.permission-point__title, .permission-problem__title) { font-size: var(--lms-type-card) !important; }
  #velmor-course-management-wireframe .role-grid.mobile-swipe { grid-template-columns: minmax(0, 1fr) !important; grid-auto-flow: row !important; grid-auto-columns: auto !important; gap: 20px !important; overflow: visible !important; scroll-snap-type: none !important; margin-right: 0 !important; padding: 0 !important; }
  #velmor-course-management-wireframe .role-grid.mobile-swipe .role-panel { scroll-snap-align: none !important; }
  #velmor-features-wireframe .mobile .chips { grid-template-columns: minmax(0, 1fr) !important; }
  #velmor-permission-wireframe .permission-comparison > div > div:last-child { width: 110px !important; flex-shrink: 0; padding-inline: 10px !important; }
  #velmor-permission-wireframe .viewport .dc-card .permission-flow-grid { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; margin-inline: 0 !important; padding: 0 !important; overflow: visible !important; scroll-snap-type: none !important; }
  #velmor-permission-wireframe .viewport .dc-card .permission-flow-step { min-height: 0 !important; }
  #velmor-lms-wireframe .layers--foundation-modules .layer-band--module { min-height: 0 !important; }
  #velmor-course-management-wireframe .page .option-note:has(.provision-note) { grid-template-columns: minmax(0, 1fr); }
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .flow-step) { padding: 20px !important; }
}

/* LMSトップの文字階層を一覧・詳細へ継承。提供区分・役割の色と小ラベルは変えない。 */
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) {
  font-family: var(--lms-type-family) !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .viewport :is(h1, h2, h3, h4, p, a, button, input, summary, span, li, div, small, strong, em, label, th, td, dt, dd, figcaption) {
  font-family: inherit !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(h1, h2, h3) {
  font-weight: 700 !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) h3 {
  letter-spacing: -.025em !important;
}
#velmor-features-wireframe .domain-count { font-weight: 700 !important; }
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.step, .content-card, .record-card, .delivery-card, .knowledge-card, .flow-step) h3,
#velmor-permission-wireframe .viewport .dc-card div:is(.permission-point__title, .permission-problem__title, .permission-subheading),
#velmor-permission-wireframe .viewport .dc-card .permission-flow-step > div:nth-child(2) {
  font-size: var(--lms-type-card) !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
  letter-spacing: -.025em !important;
}
#velmor-permission-wireframe .viewport .dc-card .permission-related-card > div:first-child > div,
#velmor-permission-wireframe .viewport .dc-card .permission-more-card > div:first-child {
  font-size: var(--lms-type-support) !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: -.025em !important;
}
#velmor-permission-wireframe .viewport .dc-card :is(.permission-section-heading, .permission-cta-copy) {
  font-size: var(--lms-type-section) !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: -.02em !important;
}
:is(#velmor-lms-wireframe, #velmor-features-wireframe) .lms-final-cta :is(.lead, .cta-copy p),
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .cta-section .lead,
#velmor-permission-wireframe .viewport .dc-card :is(.permission-cta-lead, .permission-support-copy) {
  font-size: var(--lms-type-body) !important;
  line-height: 1.8 !important;
}
:is(#velmor-lms-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .viewport .button-wire,
#velmor-features-wireframe .viewport .action,
#velmor-permission-wireframe .viewport .dc-card .permission-cta-actions a {
  font-size: var(--lms-type-action) !important;
  font-weight: 700 !important;
  line-height: 1.8 !important;
  letter-spacing: normal !important;
}
#velmor-features-wireframe .viewport .chip-button,
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feat-btn, .feat-chip) {
  font-size: var(--lms-type-action) !important;
  font-weight: 700 !important;
  line-height: 1.8 !important;
}
:is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [role="tab"] {
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.8 !important;
}
/* 権限説明の対象者は、他ページと同じ管理者向けの配色で示す。 */
#velmor-permission-wireframe .viewport .dc-card .feat-detail .feat-detail__role[data-role-type="管理者向け"] {
  background: #0b1628 !important;
  color: #fff !important;
}
@media (max-width: 768px) {
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) {
    --lms-type-title: 36px;
    --lms-type-section: 28px;
    --lms-type-lead: 17px;
  }
  #velmor-course-management-wireframe .viewport .steps {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #velmor-course-management-wireframe .viewport .steps .step {
    min-height: 0 !important;
  }
}
/* 小画面でも画像タブを隠さず、選べる項目を一目で把握できるようにする。 */
@media (max-width: 520px) {
  #velmor-delivery-wireframe .delivery-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    overflow: visible !important;
    scroll-snap-type: none;
  }
  #velmor-delivery-wireframe .delivery-tab {
    min-width: 0 !important;
    min-height: 48px;
    width: auto;
    white-space: normal;
  }
  #velmor-delivery-wireframe .delivery-tab:last-child {
    grid-column: 1 / -1;
  }
}

/* スマホは本文の読みやすさを残し、境界とカード内の重複余白を整理する。 */
@media (max-width: 768px) {
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) {
    --lms-type-support: 20px;
  }
  :is(#velmor-lms-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .page > section:not(.breadcrumb-section):not(:has(nav[aria-label="パンくず"])):not(:has(> .hero-grid)):not(.cta-section):not(.lms-final-cta),
  #velmor-features-wireframe :is(.features, section[aria-labelledby^="custom-area-title"], .requirements),
  #velmor-permission-wireframe .viewport.mobile .dc-card > div:has(> .permission-section-heading) {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) section:has(> :is(.hero-grid, .hero-layout)),
  #velmor-permission-wireframe .viewport.mobile .dc-card > div:has(> :is(.permission-hero, .permission-hero-title)) {
    padding-top: 36px !important;
    padding-bottom: 40px !important;
  }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.hero-grid, .hero-layout),
  #velmor-permission-wireframe .viewport.mobile .permission-hero { gap: 28px !important; }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe) .lms-final-cta,
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .page .cta-section,
  #velmor-permission-wireframe .viewport.mobile .dc-card > div:has(.permission-cta-actions) {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(section[id], .domain[id]) { scroll-margin-top: 80px; }
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .wf-mobile-menu__panel :is(a, summary) {
    display: flex;
    align-items: center;
    min-height: 48px;
    font-size: 15px !important;
    line-height: 1.6;
  }
  #velmor-lms-wireframe .mobile .area-card { padding: 16px !important; }
  #velmor-lms-wireframe .mobile .area-card .card-icon { width: 40px !important; height: 40px !important; margin-bottom: 8px !important; }
  #velmor-lms-wireframe .mobile .area-card p { min-height: 0 !important; }
  #velmor-lms-wireframe .mobile .area-card__destination { padding-top: 12px !important; }
  #velmor-lms-wireframe .mobile .detail-card.is-static { padding: 16px 0 !important; }
  #velmor-lms-wireframe .mobile .detail-card.is-static .compact-details__body { padding: 0 !important; }
  #velmor-lms-wireframe .mobile .detail-card.is-static .compact-details__body a { padding-top: 12px !important; }
  #velmor-lms-wireframe .mobile .lms-final-cta .cta-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  #velmor-lms-wireframe .mobile .lms-final-cta .button-wire { width: 100%; min-height: 52px; }
  #velmor-features-wireframe .mobile .domain-head { padding: 16px !important; gap: 10px !important; }
  #velmor-features-wireframe .mobile .domain-actions { grid-template-columns: minmax(0, 1fr) 96px !important; gap: 8px; align-items: center; }
  #velmor-features-wireframe .mobile .domain-actions .destination { display: block !important; align-content: center; min-height: 48px !important; font-size: 14px !important; line-height: 1.6 !important; white-space: normal; text-wrap: balance; }
  #velmor-features-wireframe .mobile .domain-toggle { justify-self: stretch; width: 100% !important; min-height: 48px !important; justify-content: space-between; padding-inline: 12px !important; }
  #velmor-features-wireframe .mobile .feature-inline-detail { padding: 16px !important; }
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.role-panel, .content-card, .record-card, .delivery-card, .knowledge-card, .related-card) { padding: 20px !important; }
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) .feat-detail { padding: 16px !important; }
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) :is(.feat-btn, .feat-chip) { padding-block: 9px !important; }
  :is(#velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) [role="tab"] { font-size: 15px !important; }
  #velmor-permission-wireframe .viewport.mobile .dc-card .permission-point { padding: 20px !important; }
  #velmor-permission-wireframe .viewport.mobile .dc-card .permission-flow-step { padding: 20px !important; }
  #velmor-permission-wireframe .viewport.mobile .dc-card .permission-comparison > div > div:first-child { font-size: 15px !important; line-height: 1.7 !important; }
}
@media (max-width: 520px) {
  :is(#velmor-lms-wireframe, #velmor-features-wireframe, #velmor-course-management-wireframe, #velmor-progress-wireframe, #velmor-permission-wireframe, #velmor-delivery-wireframe, #velmor-knowledge-search-wireframe) {
    --lms-type-title: 32px;
    --lms-type-section: 26px;
  }
  #velmor-knowledge-search-wireframe .knowledge-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    overflow: visible !important;
    scroll-snap-type: none;
  }
  #velmor-knowledge-search-wireframe .knowledge-tab {
    min-width: 0 !important;
    width: auto !important;
    padding-inline: 8px !important;
    white-space: normal !important;
  }
}

/* 機能一覧のスマホカード：2列で見渡せる密度と、選択時に動かない説明欄を両立する。 */
@media (max-width: 768px) {
  #velmor-features-wireframe .mobile :is(.domain-list, .domain-column) { gap: 12px !important; }
  #velmor-features-wireframe .mobile .domain-head { padding: 12px !important; gap: 8px !important; }
  #velmor-features-wireframe .mobile .domain-head .provision-label { margin-bottom: 4px !important; padding: 2px 7px !important; }
  #velmor-features-wireframe .mobile .domain h3 { margin: 0 !important; }
  #velmor-features-wireframe .mobile .domain-description { margin: 4px 0 0 !important; }
  #velmor-features-wireframe .mobile .domain-actions { grid-template-columns: minmax(0, 1fr) 96px !important; }
  #velmor-features-wireframe .mobile .domain-content { padding: 0 12px 12px !important; }
  #velmor-features-wireframe .mobile :is(.chips, .domain.is-open .chips) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: 56px !important;
    gap: 6px !important;
    padding-top: 10px !important;
  }
  #velmor-features-wireframe .mobile .chip-button {
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding: 6px 8px !important;
    gap: 5px !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    white-space: normal !important;
  }
  #velmor-features-wireframe .mobile .chip-button .role { flex-shrink: 0; }
  #velmor-features-wireframe .mobile .feature-inline-detail {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto 1fr;
    align-items: start;
    gap: 8px 6px;
    min-height: 168px !important;
    margin-top: 10px !important;
    padding: 12px !important;
  }
  #velmor-features-wireframe .mobile .feature-inline-detail__title { grid-area: 1 / 1; margin: 0 !important; line-height: 1.4 !important; }
  #velmor-features-wireframe .mobile .feature-inline-detail__role { grid-area: 1 / 2; align-self: center; margin: 0 !important; padding: 3px 6px; line-height: 1.4 !important; white-space: nowrap; }
  #velmor-features-wireframe .mobile .feature-inline-detail__description { grid-area: 2 / 1 / 3 / -1; }
  #velmor-features-wireframe .mobile .domain-note { margin-top: 10px !important; padding-top: 8px !important; }
  #velmor-features-wireframe .mobile .cards--custom { margin-top: 20px !important; gap: 10px !important; }
  #velmor-features-wireframe .mobile :is(.cards--custom .card-item, .requirement-card, .note-box) { padding: 16px !important; }
  #velmor-features-wireframe .mobile .requirements-grid { margin-top: 16px !important; gap: 10px !important; }
}
@media (max-width: 359px) {
  #velmor-features-wireframe .mobile .feature-inline-detail { min-height: 180px !important; }
  #velmor-features-wireframe .mobile .feature-inline-detail__title { font-size: 16px !important; }
  /* 6文字の機能名で末尾1文字だけが折り返されないよう、文字サイズではなく内側の幅を確保する。 */
  #velmor-features-wireframe .mobile .chip-button[data-feature-title="メディア管理"] { padding-inline: 4px !important; gap: 4px !important; }
}