.docs-article {
    --topic-space: 3rem;
    line-height: 1.7;
}
.docs-article h1 { font-size: clamp(2.5rem, 4vw, 3rem); line-height: 1.15; margin-bottom: 1.25rem; }
.docs-article h2 { font-size: clamp(1.75rem, 3vw, 2rem); line-height: 1.3; margin: 0 0 1rem; }
.docs-article h3 { font-size: 1.25rem; line-height: 1.4; margin: 2rem 0 0.75rem; }
.docs-article p, .docs-article li { font-size: 1rem; }
.docs-article p { margin: 0.75rem 0; }
.docs-article li { margin: 0.75rem 0; }
.docs-article > section,
.docs-article > section#check-device {
    margin-top: var(--topic-space);
    padding-top: var(--topic-space);
    border-top: 1px solid var(--line, #dce3eb);
    scroll-margin-top: 7rem;
}
.docs-article > .troubleshooting-item {
    margin-top: 1.25rem;
    border: 1px solid var(--line, #dce3eb);
    border-radius: 4px;
    scroll-margin-top: 7rem;
}
.docs-article > .troubleshooting-item + .troubleshooting-item { margin-top: 0.75rem; }
.troubleshooting-item > summary {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    padding: 1.15rem 1.25rem;
    cursor: pointer;
    list-style: none;
}
.troubleshooting-item > summary::-webkit-details-marker { display: none; }
.troubleshooting-item > summary::after {
    content: "+";
    margin-left: auto;
    color: var(--muted, #5b6b7f);
    font-size: 1.35rem;
    line-height: 1;
}
.troubleshooting-item[open] > summary::after { content: "\2212"; }
.troubleshooting-item > summary:hover { background: #f6f8fb; }
.troubleshooting-item > summary:focus-visible { outline: 2px solid #245fd1; outline-offset: -2px; }
.troubleshooting-item > summary h2 { margin: 0; font-size: 1.25rem; line-height: 1.4; }
.troubleshooting-item[open] > summary { border-bottom: 1px solid var(--line, #dce3eb); }
.troubleshooting-item > :not(summary) { margin-left: 1.25rem; margin-right: 1.25rem; }
.troubleshooting-item > :nth-child(2) { margin-top: 1.25rem; }
.troubleshooting-item > :last-child { margin-bottom: 1.5rem; }
.docs-article .docs-callout h2 { font-size: 1.25rem; }
.docs-article .faq-item h2 { font-size: 1.5rem; }
.docs-article .faq-item + .faq-item { margin-top: 2rem; padding-top: 2rem; }
.docs-article .guide-figure { margin: 1.5rem 0 2rem; }
.docs-article .guide-figure img { width: auto; max-width: 100%; max-height: 28rem; margin: 0; object-fit: contain; }
.docs-article .guide-figure--wide img { width: 100%; max-width: 36rem; max-height: none; }
.docs-article .guide-figure figcaption { margin-top: 0.75rem; max-width: 60ch; font-size: 0.875rem; line-height: 1.5; text-align: left; }
.docs-article .guide-figure--icon img { width: auto; height: auto; max-height: 3.5rem; }
.docs-article .guide-figure img[src$="event-hall-led-wall.svg"] { max-width: min(100%, 28rem); }
.troubleshooting-item .guide-figure { padding-left: 1.25rem; padding-right: 1.25rem; }
.troubleshooting-item > .guide-figure { margin-left: 0; margin-right: 0; }
.docs-article .platform-walkthrough { margin: 1rem 0 2rem; border-top: 1px solid var(--line, #dce3eb); border-bottom: 1px solid var(--line, #dce3eb); }
.platform-walkthrough summary { padding: 1rem 0; color: var(--navy); font-size: 1rem; font-weight: 600; cursor: pointer; }
.platform-walkthrough summary:hover { text-decoration: underline; }
.platform-walkthrough summary:focus-visible { outline: 2px solid #245fd1; outline-offset: 4px; }
.platform-walkthrough[open] summary { margin-bottom: 0.5rem; }
.docs-sidebar { border-color: var(--line, #dce3eb); border-radius: 0; }
.docs-sidebar a { font-size: 0.875rem; line-height: 1.5; }
.docs-subnav-title { font-size: 1rem; line-height: 1.4; }
.docs-subnav-description { font-size: 0.875rem; line-height: 1.5; }
/* Keep the bar the same height in both languages so switching language does not shift the page. */
.docs-subnav-card { min-height: 5.35rem; }
/* The language toggle sets [data-lang-ja] to display:block, which would collapse the subnav grid. */
html[lang="ja"] .docs-subnav[data-lang-ja] { display: grid !important; }
@media (max-width: 46rem) {
    .docs-article { --topic-space: 2rem; }
    .docs-article h1 { font-size: 2.25rem; }
    .docs-article h2 { font-size: 1.75rem; }
    .docs-subnav { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }
    /* The nav wraps to two rows on small screens, so the subnav needs more clearance than the desktop 3.25rem. */
    .docs-subnav { margin-top: 6rem; }
    .docs-subnav-card { min-height: 6.7rem; }
}
.docs-article > section.faq-item { margin-top: 2.5rem; padding-top: 2.5rem; }
.docs-article > section.faq-item h2 { font-size: clamp(1.75rem, 3vw, 2rem); }
.docs-article .setup-example { margin: 1rem 0 1.5rem; }
.docs-article .setup-example .guide-figure { margin: 0.5rem 0 1.5rem; }
.docs-article .docs-callout--requirements { background: #f3f7f7; }
.docs-article .docs-callout--recommended { background: transparent; border-bottom: 1px solid var(--line, #dce3eb); padding-bottom: 1.5rem; }
.docs-article .docs-callout--recommended h2 { border-bottom: 0; }
@media print {
    .platform-walkthrough::details-content { display: block; content-visibility: visible; }
}