/* Compact, shared page presentation. */
html{scroll-padding-top:86px}body .shell{max-width:1100px}body .guide-shell{padding-top:14px;padding-bottom:32px}body .crumb,body .guide-breadcrumb{padding-top:12px;padding-bottom:0;margin-bottom:12px;font-size:13px}body .hero{margin-top:8px;margin-bottom:18px;padding-top:18px;padding-bottom:18px}body .guide-hero{padding:22px 26px}body .hero h1,body .guide-hero h1{margin-top:8px;margin-bottom:12px;font-size:clamp(27px,3vw,38px);line-height:1.24}body .hero .meta{margin-bottom:14px}body .hero p,body .guide-hero p{margin-bottom:10px;font-size:16px;line-height:1.7}body .layout,body .guide-layout{display:block;grid-template-columns:1fr;margin-top:18px;padding-bottom:30px}body .article{padding:22px 26px}body .article h2{margin-top:28px;margin-bottom:12px}body .article h3{margin-top:20px;margin-bottom:10px}body .article p{margin-bottom:12px}body .step{margin:18px 0;padding:18px}body .guide-article section{margin-top:24px;margin-bottom:24px}body .article-section{margin-top:22px;margin-bottom:22px}body .notice,body .guide-note,body .guide-tip,body .small-note,body .ux-info{margin-top:14px;margin-bottom:14px;padding:14px 16px;border-radius:12px}body .shot,body .guide-figure{margin-top:16px;margin-bottom:18px}body .guide-hero .hero-actions{margin-top:16px}body .site-footer{padding-top:26px}body .tablewrap{margin-top:14px;margin-bottom:18px}
.ux-toc{border:1px solid #cbddeb;border-radius:14px;background:#f5f9fd;margin:0 0 20px;overflow:hidden;color:#173b60}.ux-toc>summary{display:flex;align-items:center;gap:10px;list-style:none;cursor:pointer;min-height:52px;padding:13px 17px;font-size:15px;font-weight:700}.ux-toc>summary::-webkit-details-marker{display:none}.ux-toc-toggle{margin-left:auto;font-size:22px;line-height:1}.ux-toc[open] .ux-toc-toggle{font-size:0}.ux-toc[open] .ux-toc-toggle:after{content:'−';font-size:22px}.ux-toc nav{padding:0 15px 14px}.ux-toc ol{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 14px;margin:0;padding:0}.ux-toc li{padding:0;margin:0;min-width:0}.ux-toc a{display:block;padding:10px 12px;min-height:44px;border-radius:9px;color:#185a95;text-decoration:none;line-height:1.45;font-size:14px;background:#fff;border:1px solid #e1eaf2}.ux-toc a:hover{background:#eaf3fc;border-color:#9abfe2}.ux-toc a:focus-visible,.ux-toc summary:focus-visible{outline:3px solid #4b91d3;outline-offset:2px}
.ux-info{position:relative;background:#eef6fd;border:1px solid #c5ddf1;border-left:4px solid #226dae;padding-left:42px!important;font-size:15px}.ux-info:before{content:'ⓘ';position:absolute;left:15px;top:13px;color:#2166a2;font-size:18px}.ux-warning{background:#fff9eb;border-color:#efdab0;border-left-color:#b37816}.notice,.guide-note,.guide-tip{border-left-width:4px}.notice>strong:before,.guide-note>strong:before,.guide-tip>strong:before{content:'ⓘ ';color:#1763aa}
.ux-slider-controls{display:flex;justify-content:flex-end;gap:8px;margin:8px 0 12px}.ux-slider-controls button{min-width:44px;min-height:44px;border:1px solid #bfd4e7;background:#fff;color:#174f83;border-radius:10px;cursor:pointer;font-size:20px}.ux-slider-controls button:hover{background:#edf5fd}.ux-rail{display:flex!important;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:4px;padding:4px 4px 14px!important;overscroll-behavior-x:contain}.ux-rail>*{flex:0 0 min(370px,85%);scroll-snap-align:start}.ux-rail:focus-visible{outline:3px solid #4b91d3}
@media(max-width:760px){body .guide-shell{padding:12px 14px 28px}body .guide-hero{padding:18px}body .hero h1,body .guide-hero h1{font-size:28px}body .article{padding:18px 16px}body .article h2{font-size:23px;margin-top:24px}body .guide-layout{margin-top:18px}body .crumb,body .guide-breadcrumb{margin-bottom:10px;padding-top:10px}.ux-toc ol{grid-template-columns:1fr}.ux-toc summary{padding:12px 14px}.ux-toc nav{padding:0 11px 12px}body .step{padding:15px}body .site-footer{padding-bottom:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ux-rail{scroll-behavior:auto}}

/* Contextual site links stand out within the reading text. */
body a.internal-link,body .context-link a{color:#075eaa;font-weight:650;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;border-radius:2px}body a.internal-link:hover,body .context-link a:hover{color:#034478;background:#edf5ff;text-decoration-thickness:2px}body a.internal-link:focus-visible{outline:2px solid #2378bf;outline-offset:3px}.context-link{font-size:15px!important;line-height:1.7!important;margin:10px 0 14px!important}
body .guide-note a[href^="/"],body .guide-tip a[href^="/"]{color:#075eaa;font-weight:650;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}