/* Scoped to Unapp's visual walkthrough; other documentation keeps its layout. */
.visual-guide{max-width:1040px}.visual-guide h1{max-width:18ch;font-size:clamp(2.5rem,4.6vw,4rem)}.visual-guide .lede{max-width:65ch}.guide-intro{display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--muted);font-size:.88rem;margin:24px 0}.guide-intro span::before{content:'✓';color:var(--accent);margin-right:7px}.guide-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:28px 0 36px}.guide-steps a{display:flex;flex-direction:column;gap:12px;border:1px solid var(--rule);border-radius:10px;padding:16px 12px;text-decoration:none;font-size:.9rem;background:var(--paper)}.guide-steps a:hover{border-color:var(--accent);background:var(--accent-wash)}.guide-steps b{font:500 .8rem var(--mono);color:var(--muted)}.guide-watch{background:var(--panel);border:1px solid var(--rule);border-radius:16px;padding:24px;margin:0 0 48px}.guide-watch h2{border:0;padding:0;margin:.5em 0;font-size:1.7rem}.guide-watch p{max-width:68ch}.guide-watch video{display:block;width:100%;height:auto;border-radius:10px;border:1px solid var(--rule);background:#f0f0f1;aspect-ratio:1100/820}.visual-guide details{margin:18px 0}.visual-guide summary{cursor:pointer;font-weight:500;padding:10px 0;color:var(--accent-ink)}.visual-guide>h2{scroll-margin-top:80px;display:flex;align-items:center;gap:14px;font-size:clamp(1.4rem,2.4vw,1.9rem);margin-top:2.7em}.guide-number{flex:none;display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid var(--rule);border-radius:50%;font:500 .8rem var(--mono);color:var(--accent-ink);background:var(--accent-wash)}.guide-shot{margin:24px 0 36px;overflow:hidden;border:1px solid var(--rule);border-radius:12px;box-shadow:var(--shadow);background:var(--panel)}.guide-shot a{display:block;cursor:zoom-in}.guide-shot img{display:block;width:100%;height:auto;background:#f0f0f1}.guide-shot figcaption{padding:14px 18px;border-top:1px solid var(--rule);font-size:.87rem;color:var(--muted);line-height:1.6}.guide-shot figcaption span{white-space:nowrap;color:var(--accent-ink)}.guide-extra{border:1px solid var(--rule);border-radius:10px;padding:0 18px}.guide-extra .guide-shot{margin:10px 0 20px}.guide-next{margin-top:48px;padding:28px;border:1px solid var(--rule);border-radius:14px;background:var(--accent-wash)}.guide-next h2{border:0;padding:0;margin:0 0 14px}.guide-next .btnrow{margin:20px 0}.guide-lightbox{box-sizing:border-box;width:calc(100vw - 32px);max-width:1450px;max-height:94vh;padding:20px;border:1px solid var(--rule);border-radius:12px;background:var(--paper);color:var(--ink)}.guide-lightbox::backdrop{background:rgba(0,0,0,.75)}.guide-lightbox figure{margin:12px 0 0}.guide-lightbox img{display:block;max-width:100%;height:auto;margin:auto}.guide-lightbox figcaption{margin-top:12px;color:var(--muted)}.guide-lightbox-close{display:block;margin-left:auto;padding:10px 18px;border:1px solid var(--rule);border-radius:7px;color:var(--ink);background:var(--panel);cursor:pointer;font:inherit}.visual-guide a:focus-visible,.visual-guide button:focus-visible,.visual-guide summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
@media(max-width:1100px){.guide-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.guide-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.guide-steps a{flex-direction:row;gap:10px;align-items:center;padding:12px}.guide-watch{padding:16px}.guide-shot figcaption{padding:12px}.guide-next{padding:20px}.guide-lightbox{padding:12px}.visual-guide>h2{gap:10px}}

.guide-lightbox-tools{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px}.guide-lightbox-tools button{margin:0;padding:10px 18px;border:1px solid var(--rule);border-radius:7px;color:var(--ink);background:var(--panel);cursor:pointer;font:inherit}.guide-lightbox figure{overflow:auto;max-height:75vh}.guide-lightbox[data-actual-size="true"] img{width:1100px;max-width:none}

/* Shared screenshot presentation across the Unapp reference pages. */
.doc-topics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:22px 0 30px}.doc-topics a{display:block;border:1px solid var(--rule);border-radius:8px;padding:10px 14px;background:var(--panel);text-decoration:none;font-size:.92rem}.doc-details{border:1px solid var(--rule);border-radius:10px;padding:0 16px;margin:18px 0 28px}.doc-details summary{cursor:pointer;font-weight:500;padding:14px 0;color:var(--accent-ink)}.doc-details[open]{padding-bottom:14px}.doc-details p:last-child{margin-bottom:0}.guide-shot a:focus-visible,.guide-lightbox button:focus-visible,.doc-details summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}h2[id],h3[id]{scroll-margin-top:80px}@media(max-width:420px){.doc-topics{grid-template-columns:1fr}}

.main .wide>p,.main .wide>ul,.main .wide>ol{max-width:74ch}.guide-shot figcaption{overflow-wrap:anywhere}.pagenav{flex-wrap:wrap}.pagenav a{min-width:0;overflow-wrap:anywhere}
/* Keep catalogue cards inside even a narrow phone viewport. */
.starters{grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr))}