/* FDS extensions: document reading layout and capsule navigation. */
.ss-help-page .fds-btn { border-radius: var(--fds-radius-pill); text-decoration: none; }
.ss-help-shell { max-width: 1200px; margin: auto; padding: var(--fds-space-10) var(--fds-space-6) var(--fds-space-16); }
.ss-help-intro { display: grid; gap: var(--fds-space-3); padding-bottom: var(--fds-space-10); }
.ss-help-intro h1 { margin: 0; }
.ss-help-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--fds-space-2); max-width: 680px; margin-top: var(--fds-space-4); }
.ss-help-search-label { grid-column: 1 / -1; font-size: .8125rem; color: var(--fds-text-secondary); }
.ss-help-search .fds-input { height: 48px; border-radius: var(--fds-radius-pill); padding-inline: var(--fds-space-5); }
.ss-help-search .fds-btn { height: 48px; padding-inline: var(--fds-space-6); }
.ss-help-layout { display: grid; grid-template-columns: 224px minmax(0, 1fr); gap: var(--fds-space-10); align-items: start; }
.ss-help-sidebar { position: sticky; top: calc(var(--fds-topbar) + var(--fds-space-6)); display: grid; gap: var(--fds-space-8); }
.ss-help-categories, .ss-help-toc { display: grid; gap: var(--fds-space-2); }
.ss-help-categories h2, .ss-help-toc h2 { margin-bottom: var(--fds-space-2); padding-inline: var(--fds-space-3); }
.ss-help-categories a { display: flex; justify-content: space-between; gap: var(--fds-space-2); padding: var(--fds-space-3); border-radius: var(--fds-radius-pill); text-decoration: none; color: var(--fds-text-secondary); font-size: .875rem; }
.ss-help-categories a[aria-current] { background: var(--fds-black); color: var(--fds-white); }
.ss-help-categories a[aria-current] .fds-meta { color: inherit; }
.ss-help-categories a:hover:not([aria-current]) { background: var(--fds-bg-muted); }
.ss-help-toc a { padding: var(--fds-space-2) var(--fds-space-3); font-size: .8125rem; text-decoration: none; color: var(--fds-text-secondary); }
.ss-help-toc a:hover { color: var(--fds-text-primary); text-decoration: underline; }
.ss-help-toc-box summary { cursor: pointer; padding: var(--fds-space-3); font-size: .875rem; font-weight: 600; }
.ss-help-content { min-width: 0; }
.ss-help-results-head { display: flex; align-items: center; justify-content: space-between; gap: var(--fds-space-3); margin-bottom: var(--fds-space-4); }
.ss-help-results-head a { font-size: .8125rem; }
.ss-help-cards { display: grid; gap: var(--fds-space-4); }
.ss-help-card { display: grid; gap: var(--fds-space-3); padding: var(--fds-space-6); text-decoration: none; }
.ss-help-card:hover { border-color: var(--fds-border-strong); box-shadow: var(--fds-shadow-1); }
.ss-help-card h3 { margin: 0; font-size: 1.125rem; }
.ss-help-card p { margin: 0; color: var(--fds-text-secondary); font-size: .9375rem; }
.ss-help-meta { display: flex; justify-content: space-between; align-items: center; gap: var(--fds-space-3); flex-wrap: wrap; }
.ss-help-read { font-size: .8125rem; font-weight: 600; }
.ss-help-back { display: inline-block; margin-bottom: var(--fds-space-4); font-size: .875rem; text-underline-offset: 4px; }
.ss-help-article { padding: var(--fds-space-8); overflow-wrap: anywhere; }
.ss-help-article-title { font-size: 1.75rem; margin: var(--fds-space-4) 0 var(--fds-space-3); }
.ss-help-note { background: var(--fds-bg-muted); border-left: 3px solid var(--fds-border-strong); padding: var(--fds-space-4); border-radius: var(--fds-radius-sm); font-size: .875rem; color: var(--fds-text-secondary); }
.ss-help-section { scroll-margin-top: calc(var(--fds-topbar) + var(--fds-space-6)); padding-top: var(--fds-space-6); margin-top: var(--fds-space-6); border-top: 1px solid var(--fds-border); }
.ss-help-section h3 { font-size: 1.125rem; }
.ss-help-section h4 { margin-block: var(--fds-space-6) var(--fds-space-3); line-height: 1.6; }
/* FDS extension: illustrated production guides and copyable commands. */
.ss-help-code { white-space: pre-wrap; overflow-wrap: anywhere; padding: var(--fds-space-4); background: var(--fds-bg-muted); border-radius: var(--fds-radius-md); font-size: .875rem; line-height: 1.8; direction: ltr; text-align: left; }
.ss-help-figure { margin: var(--fds-space-6) 0; }
.ss-help-figure img { display: block; width: 100%; height: auto; border: 1px solid var(--fds-border); border-radius: var(--fds-radius-md); }
.ss-help-figure figcaption { margin-top: var(--fds-space-3); color: var(--fds-text-secondary); line-height: 1.8; font-size: .875rem; }
.ss-help-section p, .ss-help-section li { line-height: 1.85; color: var(--fds-text-secondary); }
.ss-help-section ul, .ss-help-section ol { padding-left: var(--fds-space-6); }
.ss-help-section li + li { margin-top: var(--fds-space-2); }
.ss-help-table-wrap { overflow-x: auto; margin-block: var(--fds-space-4); border: 1px solid var(--fds-border); border-radius: var(--fds-radius-md); }
.ss-help-table { border-collapse: collapse; width: 100%; min-width: 380px; font-size: .875rem; }
.ss-help-table th, .ss-help-table td { padding: var(--fds-space-3); text-align: left; vertical-align: top; border-bottom: 1px solid var(--fds-border); }
.ss-help-table th { background: var(--fds-bg-muted); font-weight: 600; }
.ss-help-table tr:last-child td { border-bottom: 0; }
.ss-help-related { display: flex; gap: var(--fds-space-4); flex-wrap: wrap; align-items: center; margin-top: var(--fds-space-6); font-size: .875rem; }
.ss-help-empty { padding: var(--fds-space-8); }
.ss-help-empty p { color: var(--fds-text-secondary); }
.ss-help-skip { position: fixed; top: -100px; left: var(--fds-space-4); z-index: 20; background: var(--fds-bg-panel); padding: var(--fds-space-3); }
.ss-help-skip:focus { top: var(--fds-space-3); }
@media (max-width: 1023px) {
  .ss-help-layout { grid-template-columns: minmax(0, 1fr); gap: var(--fds-space-6); }
  .ss-help-sidebar { position: static; gap: var(--fds-space-4); }
  .ss-help-categories { display: flex; flex-wrap: wrap; gap: var(--fds-space-2); }
  .ss-help-categories h2 { flex-basis: 100%; }
  .ss-help-categories a { gap: var(--fds-space-3); }
  .ss-help-toc-box { padding: var(--fds-space-2); background: var(--fds-bg-muted); border-radius: var(--fds-radius-lg); }
}
@media (max-width: 760px) {
  .ss-help-shell { padding: var(--fds-space-6) var(--fds-space-4) var(--fds-space-12); }
  .ss-help-intro { padding-bottom: var(--fds-space-6); }
  .ss-help-card, .ss-help-article { padding: var(--fds-space-5); }
  .ss-help-article-title { font-size: 1.375rem; }
  .ss-help-search .fds-btn { padding-inline: var(--fds-space-4); }
}

/* FDS extension: catalog-backed schematic cards in help articles. */
.ss-help-showcase-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--fds-space-3,12px); }
.ss-help-showcase-card { min-width:0; padding:var(--fds-space-3,12px); border:1px solid var(--fds-border); border-radius:var(--fds-radius-md,8px); background:var(--fds-bg-panel,#fff); color:var(--fds-text-primary); text-align:start; cursor:pointer; }
.ss-help-showcase-card .ss-template-thumbnail { width:100%; max-height:160px; display:block; margin-bottom:var(--fds-space-2,8px); }
.ss-help-showcase-card strong { display:block; font-size:14px; line-height:1.5; }
.ss-help-showcase-card:hover { border-color:var(--fds-gray-400); }
.ss-help-showcase-card.is-selected { border-color:var(--fds-blue-600); background:var(--fds-blue-50); box-shadow:inset 0 0 0 1px var(--fds-blue-600); }
.ss-help-showcase-card:focus-visible { outline:2px solid var(--fds-blue-600); outline-offset:3px; }
.ss-gallery-selected { color:var(--fds-text-secondary); font-size:13px; }

/* FDS extension: task-based help landing and accessible reading navigation. */
.ss-help-start { margin-bottom: var(--fds-space-8); }
.ss-help-featured { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--fds-space-3); }
.ss-help-task { display: grid; gap: var(--fds-space-3); padding: var(--fds-space-5); text-decoration: none; min-width: 0; overflow-wrap: anywhere; }
.ss-help-task span { color: var(--fds-text-secondary); font-size: .875rem; line-height: 1.7; }
.ss-help-task:hover { border-color: var(--fds-border-strong); }
.ss-help-card h4 { margin: 0; font-size: 1.125rem; }
.ss-help-group { grid-column: 1 / -1; padding-block: var(--fds-space-4) var(--fds-space-1); }
.ss-help-group h3 { margin: 0 0 var(--fds-space-2); }
.ss-help-group p { margin: 0; color: var(--fds-text-secondary); line-height: 1.7; }
.ss-help-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ss-help-categories a, .ss-help-toc a { min-height: 44px; align-items: center; }
.ss-help-toc a { display: flex; }
.ss-help-faq, .ss-help-recent { margin-top: var(--fds-space-8); }
.ss-help-faq details { padding: var(--fds-space-4); border-bottom: 1px solid var(--fds-border); }
.ss-help-faq summary { cursor: pointer; min-height: 44px; line-height: 1.7; font-weight: 600; }
.ss-help-faq p { line-height: 1.85; color: var(--fds-text-secondary); }
.ss-help-recent a { display: flex; justify-content: space-between; gap: var(--fds-space-3); padding-block: var(--fds-space-3); min-height: 44px; }
.ss-help-section ul, .ss-help-section ol { padding-inline-start: var(--fds-space-6); padding-inline-end: 0; }
.ss-help-note { border-left: 0; border-inline-start: 3px solid var(--fds-border-strong); }
.ss-help-table th, .ss-help-table td { text-align: start; }
.ss-help-page a:focus-visible, .ss-help-page summary:focus-visible { outline: 2px solid var(--fds-text-primary); outline-offset: 3px; }
@media (max-width: 1023px) { .ss-help-featured { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .ss-help-featured, .ss-help-cards { grid-template-columns: minmax(0, 1fr); }
  .ss-help-card p, .ss-help-section p, .ss-help-section li, .ss-help-task span, .ss-help-search .fds-input { font-size: 1rem; }
  .ss-help-recent a { flex-wrap: wrap; }
}

/* FDS extension: keep every anchor reachable in long desktop documents. */
@media (min-width: 1024px) {
  .ss-help-sidebar { max-height: calc(100dvh - var(--fds-topbar) - var(--fds-space-12)); overflow-y: auto; overscroll-behavior: contain; }
}
