#pi-composer[hidden],#pi-composer [hidden]{display:none!important}#pi-composer{margin:32px 0;padding:26px;border:1px solid #383838;border-radius:18px;background:#121212}#pi-composer h3{font-size:21px;font-weight:600;color:#eee;margin-bottom:12px}#pi-composer p{font-size:12px;line-height:1.9;color:#aaa;margin:12px 0}#pi-composer .pi-compose-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;margin:24px 0}#pi-composer .pi-compose-controls{display:grid;gap:16px;align-content:start}#pi-composer label{display:grid;gap:9px;color:#ccc;font-size:12px}#pi-composer :is(select,input){background:#1b1b1b;color:#eee;border:1px solid #444;border-radius:9px;width:100%;height:44px;padding:10px;font-family:inherit}#pi-composer .pi-compose-map{display:flex;justify-content:center;align-items:center;padding:16px;min-height:180px;max-height:380px;background:#202020;border-radius:12px;overflow:hidden}#pi-compose-preview{max-width:100%;height:auto;max-height:330px;object-fit:contain}#pi-composer .pi-compose-actions{display:flex;gap:10px;flex-wrap:wrap}#pi-compose-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px;margin-top:20px}#pi-composer .pi-compose-output{padding:16px;border:1px solid #333;border-radius:12px;min-width:0}#pi-composer .pi-compose-output img{width:100%;height:180px;object-fit:contain;background:repeating-conic-gradient(#222 0 25%,#171717 0 50%) 0/20px 20px}#pi-composer .secondary-btn:disabled{opacity:.4;cursor:not-allowed}#pi-composer :is(button,input,select,a):focus-visible{outline:2px solid white;outline-offset:4px}@media(max-width:639px){#pi-composer{padding:18px}#pi-composer .pi-compose-layout{grid-template-columns:1fr}#pi-compose-results{grid-template-columns:1fr 1fr}}
/* Crawlable supporting content and native keyboard-accessible FAQs. */
.pi-guide-content{max-width:1040px;margin:0 auto;padding:64px 24px;color:rgba(255,255,255,.62);line-height:1.8}.pi-guide-content h2{color:#fff;font-size:1.5rem;font-weight:650;margin:0 0 18px}.pi-guide-content p{margin:0 0 16px}.pi-guide-content a{color:#fff;text-decoration:underline;text-underline-offset:4px}.pi-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-bottom:48px}.pi-info-grid article{padding:24px;border:1px solid #ffffff18;border-radius:18px}.pi-sample{padding:24px;border:1px solid #ffffff18;border-radius:18px;margin:0 0 48px}.pi-native-faq details{border-bottom:1px solid #ffffff18}.pi-native-faq summary{padding:20px 0;cursor:pointer;color:#eee;font-weight:600}.pi-native-faq p{padding:0 0 20px}.pi-guide-content :focus-visible{outline:2px solid #fff;outline-offset:5px}@media(max-width:640px){.pi-info-grid{grid-template-columns:1fr;gap:16px}.pi-guide-content{padding:40px 18px}.pi-info-grid article{padding:20px}}
 .pi-native-faq details{overflow:hidden}.pi-native-faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px}.pi-native-faq summary::-webkit-details-marker{display:none}.pi-native-faq summary::after{content:'⌄';flex:none;transition:transform .26s ease}.pi-native-faq details[open]:not(.is-closing) summary::after{transform:rotate(180deg)}@media(prefers-reduced-motion:reduce){.pi-native-faq summary::after{transition:none}}