.pcode{margin:var(--space-5) 0 var(--space-6);border-radius:var(--radius-md);background:var(--pb-ink-950);color:#e8ebed;overflow:hidden}.pcode__bar{font:var(--fw-semibold) var(--text-xs)/1 var(--font-body);color:var(--pb-slate-300);letter-spacing:.02em;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding:8px 8px 8px 16px;display:flex}.pcode__bar button{color:#fff;font:var(--fw-semibold) var(--text-xs)/1 var(--font-body);cursor:pointer;transition:border-color var(--dur-fast);background:0 0;border:1px solid #ffffff29;border-radius:6px;padding:6px 10px}.pcode__bar button:hover{border-color:#ffffff80}.pcode__bar button:focus-visible{outline:2px solid var(--pb-blue-400);outline-offset:2px}.pcode__copy{display:grid}.pcode__copy b{font-weight:inherit;transition:opacity var(--dur-fast);grid-area:1/1}.pcode__copy b:last-child,.pcode__copy[data-copied=true] b:first-child{opacity:0}.pcode__copy[data-copied=true] b:last-child{opacity:1}.pcode pre{white-space:pre;margin:0;padding:16px 18px 18px;font:.875rem/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-x:auto}.pcode pre:focus-visible{outline:2px solid var(--pb-blue-400);outline-offset:-2px}.pcode figcaption{color:var(--pb-slate-300);border-top:1px solid #ffffff14;padding:10px 18px 12px}.pfb{margin:var(--space-7) 0;padding:var(--space-6);border:var(--edge);border-radius:var(--radius-lg);background:var(--pb-blue-100);box-shadow:var(--shadow-offset)}.pfb__title{font:var(--fw-bold) var(--text-xl)/1.2 var(--font-display);color:var(--pb-ink-950);margin:0}.pfb__text{margin:var(--space-2) 0 0;color:var(--pb-navy-800);font-size:var(--text-base);line-height:1.55}.pfb__form{gap:var(--space-3) var(--space-4);margin-top:var(--space-5);grid-template-columns:1fr;display:grid}.pfb__field{font:var(--fw-semibold) var(--text-sm)/1.3 var(--font-body);color:var(--pb-ink-950);gap:6px;display:grid}.pfb__field.is-long{grid-column:1/-1}.pfb__field small{font-weight:var(--fw-regular);color:var(--pb-slate-500)}.pfb__field input,.pfb__field textarea{border:1.5px solid var(--pb-ink-950);background:var(--pb-white);width:100%;font:var(--fw-regular) var(--text-base)/1.45 var(--font-body);color:var(--pb-ink-950);resize:vertical;border-radius:10px;padding:10px 12px}.pfb__field input:focus-visible,.pfb__field textarea:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.pfb__go{align-items:center;gap:var(--space-3) var(--space-4);margin-top:var(--space-2);flex-wrap:wrap;grid-column:1/-1;display:flex}.pfb__note{font-size:var(--text-sm);color:var(--pb-slate-500);flex:14rem;margin:0;line-height:1.45}.pfb__note a{color:var(--pb-blue-600);text-underline-offset:2px;text-decoration:underline}@media (width<=760px){.pfb{padding:var(--space-5) var(--space-4)}.pfb__form{grid-template-columns:1fr}}.pof--post{margin:var(--space-6) 0 var(--space-7)}.pof__board{aspect-ratio:300/230;background:#fafafc var(--dots-on-light) 0 0 / var(--dots) var(--dots);border-radius:14px;width:100%;position:relative;box-shadow:0 0 0 1px #ffffff1a,0 24px 50px -20px #0009;container-type:inline-size}.pof__board>*{position:absolute}.pof__sw{border-radius:2.67cqw;width:18.67%;height:14.78%;top:6.96%;box-shadow:inset 0 0 0 1px #14191f1f}.pof__sw:first-child{left:6%}.pof__sw:nth-child(2){left:28%}.pof__sw:nth-child(3){left:50%}.pof__sw:nth-child(4){width:22%;left:72%}.pof__btnmock{background:var(--pb-blue-500);color:#fff;width:40.67%;height:15.65%;font:600 4.33cqw/1 var(--font-body);border-radius:2.67cqw;place-items:center;display:grid;top:28.7%;left:6%}.pof__toggle{background:var(--pb-slate-200);border-radius:99px;width:15.33%;height:10.43%;top:31.3%;left:53.33%}.pof__toggle i{background:#fff;border-radius:50%;width:39.13%;height:75%;position:absolute;top:12.5%;left:6.52%;box-shadow:0 1px 2px #0003}.pof__input{border:1.5px solid var(--pb-slate-200);width:88%;height:15.65%;color:var(--pb-slate-400);font:4.33cqw/1 var(--font-body);background:#fff;border-radius:2.67cqw;align-items:center;padding:0 4cqw;display:flex;top:50.43%;left:6%}.pof__input i{background:var(--pb-ink-950);opacity:0;width:1.5px;height:5.33cqw;margin-left:2px}.pof__card{border:1.5px solid var(--pb-slate-200);background:#fff;border-radius:3.33cqw;width:88%;height:20.87%;top:72.17%;left:6%}.pof__card i{aspect-ratio:1;background:var(--pb-coral-500);border-radius:50%;width:9.85%;position:absolute;top:20.83%;left:3.79%}.pof__card b{background:var(--pb-ink-950);border-radius:4px;width:45.45%;height:16.67%;position:absolute;top:27.08%;left:17.42%}.pof__card b+b{background:var(--pb-slate-200);width:64.39%;top:56.25%}.pof__mq{border:2px solid var(--pb-blue-500);opacity:0;border-radius:3px;width:44.67%;height:20.87%;top:26.09%;left:4%}.pof__mq i{border:2px solid var(--pb-blue-500);background:#fff;width:8px;height:8px;position:absolute}.pof__mq i:first-child{top:-5px;left:-5px}.pof__mq i:nth-child(2){top:-5px;right:-5px}.pof__mq i:nth-child(3){bottom:-5px;left:-5px}.pof__mq i:nth-child(4){bottom:-5px;right:-5px}.pof__ptr{filter:drop-shadow(0 2px 3px #14191f4d);opacity:0;width:max(22px,8cqw);height:auto;top:40%;left:42%}.pof__sw,.pof__c{opacity:0;transform:translateY(8px)scale(.96)}.pof.is-in .pof__sw,.pof.is-in .pof__c{opacity:1;transition:opacity .4s var(--ease-out), transform .5s var(--ease-spring);transform:none}.pof.is-in .pof__sw:first-child{transition-delay:.1s}.pof.is-in .pof__sw:nth-child(2){transition-delay:.18s}.pof.is-in .pof__sw:nth-child(3){transition-delay:.26s}.pof.is-in .pof__sw:nth-child(4){transition-delay:.34s}.pof.is-in .pof__btnmock{transition-delay:.55s}.pof.is-in .pof__toggle{transition-delay:.65s}.pof.is-in .pof__input{transition-delay:.75s}.pof.is-in .pof__card{transition-delay:.85s}.pof.is-in .pof__mq{opacity:1;animation:pof-mq 8s var(--ease-in-out) 1.2s infinite}.pof.is-in .pof__ptr{opacity:1;animation:pof-ptr 8s var(--ease-in-out) 1.2s infinite}.pof.is-in .pof__toggle{animation:8s 1.2s infinite pof-tg}.pof.is-in .pof__toggle i{animation:pof-knob 8s var(--ease-out) 1.2s infinite}.pof.is-in .pof__input{animation:8s 1.2s infinite pof-in}.pof.is-in .pof__input i{animation:8s step-end 1.2s infinite pof-caret}.pof.is-in .pof__btnmock{animation:8s 1.2s infinite pof-press}.pof.is-in .pof__card i{animation:8s 1.2s infinite pof-avatar}@keyframes pof-mq{0%,20%{width:44.67%;height:20.87%;top:26.09%;left:4%}25%,45%{width:19.33%;height:15.65%;top:28.7%;left:51.33%}50%,70%{width:92%;height:20.87%;top:47.83%;left:4%}75%,95%{width:92%;height:26.09%;top:69.57%;left:4%}to{width:44.67%;height:20.87%;top:26.09%;left:4%}}@keyframes pof-ptr{0%,20%{top:40%;left:42%}25%,45%{top:40%;left:65.33%}50%,70%{top:61.74%;left:83.33%}75%,95%{top:87.83%;left:83.33%}to{top:40%;left:42%}}@keyframes pof-press{0%,6%,14%,to{transform:none}10%{transform:scale(.95)}}@keyframes pof-tg{0%,29%{background:var(--pb-slate-200)}32%,92%{background:var(--pb-blue-500)}96%,to{background:var(--pb-slate-200)}}@keyframes pof-knob{0%,29%{transform:none}32%,92%{transform:translate(122%)}96%,to{transform:none}}@keyframes pof-in{0%,52%{border-color:var(--pb-slate-200)}54%,70%{border-color:var(--pb-blue-500)}73%,to{border-color:var(--pb-slate-200)}}@keyframes pof-caret{0%,54%{opacity:0}56%{opacity:1}61%{opacity:0}66%{opacity:1}71%,to{opacity:0}}@keyframes pof-avatar{0%,78%{background:var(--pb-coral-500)}80%,94%{background:var(--pb-lime-400)}97%,to{background:var(--pb-coral-500)}}.pof.is-still .pof__mq,.pof.is-still .pof__ptr{opacity:1}