.guide-page{width: 100%;max-width: calc(72ch + 2 * var(--sp-6));margin: var(--sp-6) auto calc(var(--sp-6) + var(--sp-4));padding: var(--sp-6);color: var(--c-ink);background: var(--c-surface);border: 1px solid var(--c-line);border-radius: var(--r-lg);box-shadow: var(--sh-1);font-size: var(--fs-md);line-height: 1.7;overflow-wrap: break-word}.guide-page > :first-child{margin-top: 0}.guide-page .size-breadcrumb{margin-bottom: var(--sp-4)}.guide > :last-child{margin-bottom: 0} .guide-page h1{margin: 0 0 var(--sp-2);font-size: clamp(var(--fs-xl),4vw,var(--fs-2xl));line-height: 1.2;text-wrap: balance}.guide-page h2{margin: var(--sp-6) 0 var(--sp-3);padding-top: var(--sp-5);border-top: 1px solid var(--c-line);color: var(--c-ink);font-size: var(--fs-xl);line-height: 1.3}.guide-page h3{margin: var(--sp-5) 0 var(--sp-2);font-size: var(--fs-lg);line-height: 1.4}.guide-page :is(h2,h3)[id]{scroll-margin-top: var(--sp-4)}.guide-page p{margin: 0 0 var(--sp-4)}.guide-updated{margin: 0 0 var(--sp-5);color: var(--c-ink-2);font-size: var(--fs-sm);line-height: 1.6}.guide-lede{margin: 0 0 var(--sp-5);color: var(--c-ink);font-size: var(--fs-lg);line-height: 1.6} .guide :is(ul,ol){margin: 0 0 var(--sp-4);padding-inline-start: 1.4em}.guide li + li{margin-top: var(--sp-2)}.guide-steps{padding: var(--sp-4) var(--sp-5) var(--sp-4) calc(var(--sp-5) + 1.4em);border-radius: var(--r-md);background: var(--c-surface-2)}.guide-steps > li{padding-inline-start: var(--sp-1)}.guide-steps > li + li{margin-top: var(--sp-3)}.guide-steps > li::marker{color: var(--c-primary);font-weight: 600} .guide-figure{margin: var(--sp-5) 0}.guide-figure img{display: block;width: 100%;height: auto;border: 1px solid var(--c-line);border-radius: var(--r-md);background: var(--c-surface-2)}.guide-figure figcaption{margin-top: var(--sp-2);color: var(--c-ink-2);font-size: var(--fs-sm);line-height: 1.5} .guide-table-wrap{overflow-x: auto;margin: var(--sp-5) 0;border: 1px solid var(--c-line);border-radius: var(--r-md)}.guide-table{width: 100%;border-collapse: collapse;font-size: var(--fs-sm);font-variant-numeric: tabular-nums;line-height: 1.5}.guide-table caption{padding: var(--sp-3) var(--sp-3) var(--sp-2);color: var(--c-ink);font-weight: 600;text-align: left}.guide-table :is(th,td){padding: var(--sp-2) var(--sp-3);border-bottom: 1px solid var(--c-line);text-align: left;vertical-align: top}.guide-table thead{background: var(--c-surface-2)}.guide-table th{color: var(--c-ink);font-weight: 600}.guide-table tbody tr:last-child > *{border-bottom: 0} .guide-note{margin: var(--sp-5) 0;padding: var(--sp-3) var(--sp-4);border-left: 3px solid var(--c-primary);border-radius: 0 var(--r-md) var(--r-md) 0;background: var(--c-primary-soft);color: var(--c-ink)}.guide-note > :last-child{margin-bottom: 0} .guide-cta{margin: var(--sp-5) 0}.guide-button{display: inline-flex;align-items: center;justify-content: center;min-height: 44px;padding: var(--sp-2) var(--sp-4);border: 1px solid var(--c-primary);border-radius: var(--r-md);background: var(--c-primary);box-shadow: var(--sh-1);color: var(--c-on-primary);font-weight: 600;line-height: 1.3;text-align: center;text-decoration: none}.guide-button:hover,.guide-button:active{border-color: var(--c-primary-hover);background: var(--c-primary-hover);color: var(--c-on-primary)} .guide-contents{margin: var(--sp-5) 0;padding: var(--sp-3) var(--sp-4);border-radius: var(--r-md);background: var(--c-surface-2)}.guide-contents-title{margin: 0;color: var(--c-ink-2);font-size: var(--fs-sm);font-weight: 600}.guide-contents ol{margin: var(--sp-1) 0 0;padding-inline-start: 1.6em}.guide-contents li + li{margin-top: 0}.guide-contents li::marker{color: var(--c-ink-2)}.guide-contents a{display: inline-flex;align-items: center;min-height: 44px;line-height: 1.35}.guide-related ul{display: grid;gap: var(--sp-2);margin: 0;padding: 0;list-style: none}.guide-related li + li{margin-top: 0}.guide-related a{display: flex;align-items: center;min-height: 44px;padding: var(--sp-2) var(--sp-3);border: 1px solid var(--c-line);border-radius: var(--r-md);background: var(--c-surface);line-height: 1.35;text-decoration: none}.guide-related a:hover{border-color: var(--c-primary);background: var(--c-primary-soft)} .guide-index .guide-lede{color: var(--c-ink-2);font-size: var(--fs-md);line-height: 1.7}.guide-cards{display: grid;grid-template-columns: repeat(auto-fill,minmax(min(100%,16rem),1fr));gap: var(--sp-4);margin: var(--sp-4) 0 0;padding: 0;list-style: none}.guide-card{display: flex;flex-direction: column;gap: var(--sp-2);margin: 0;padding: var(--sp-4);border: 1px solid var(--c-line);border-radius: var(--r-md);background: var(--c-surface);box-shadow: var(--sh-1)}.guide-card + .guide-card{margin-top: 0}.guide-card h3{margin: 0;font-size: var(--fs-lg);line-height: 1.35}.guide-card h3 a{display: inline-flex;align-items: center;min-height: 44px}.guide-card p{margin: 0}.guide-card-meta{display: flex;flex-wrap: wrap;gap: var(--sp-1) var(--sp-3);margin-top: auto;color: var(--c-ink-2);font-size: var(--fs-sm)}@media (prefers-reduced-motion: no-preference){.guide-button,.guide-related a{transition: background-color 140ms ease,border-color 140ms ease}}@media (max-width: 600px){.guide-page{margin-block: var(--sp-4) var(--sp-5);padding: var(--sp-5) var(--sp-4)}.guide-lede{font-size: var(--fs-md)}.guide-steps{padding: var(--sp-3) var(--sp-3) var(--sp-3) calc(var(--sp-3) + 1.4em)}.guide-button{width: 100%}}@media print{.guide-page{margin: 0;padding: 0;border: 0;box-shadow: none}.guide-figure,.guide-note,.guide-table-wrap,.guide-steps > li{break-inside: avoid}.guide-table-wrap{overflow: visible}}