.examples-section{padding:10px 0 70px}.examples-section .section-heading{align-items:center}.examples-heading-note{color:#748099;font-size:14px;line-height:1.6;margin:14px 0 0}.gallery-controls{display:flex;align-items:center;gap:10px}.gallery-controls>span{font:12px var(--font);letter-spacing:1px;color:#7a8ba7;margin-right:10px;white-space:nowrap}.gallery-controls button,.example-open{width:43px;height:43px;border:1px solid #d5e2f5;background:white;border-radius:50%;display:grid;place-items:center;color:var(--blue);flex-shrink:0;transition:background .2s}.gallery-controls button:hover,.example-open:hover{background:#eaf2ff}.gallery-controls button:disabled{opacity:.35;cursor:default}.gallery-controls button:first-of-type svg{transform:rotate(180deg)}.example-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding:8px 2px 23px;scrollbar-width:thin;scrollbar-color:#a9c6ef #edf3ff}.example-card{flex:0 0 258px;min-width:0;scroll-snap-align:start}.portrait-preview{position:relative;display:flex;flex-direction:column;width:100%;height:420px;border:1px solid #cfddf1;border-radius:17px;background:#f1f6ff;padding:17px 20px 15px;text-align:center;color:var(--blue);overflow:hidden;transition:transform .2s,border-color .2s}.portrait-preview:hover{transform:translateY(-4px);border-color:var(--blue)}.portrait-top{display:flex;justify-content:space-between;align-items:center;width:100%;padding-bottom:14px;border-bottom:1px solid #dce7f7}.portrait-top>span{font:700 20px var(--font);letter-spacing:-1px}.portrait-top svg{width:14px;height:14px}.portrait-content{display:flex;flex-direction:column;align-items:center;flex:1;width:100%;justify-content:center;padding:16px 0;gap:12px}.portrait-kicker{font:600 8px var(--font);letter-spacing:1.2px;line-height:1.5}.portrait-icon{display:grid;place-items:center;width:37px;height:37px}.portrait-icon svg{width:30px;height:30px}.portrait-headline{font:600 32px/.98 var(--font);letter-spacing:-1.8px;display:block}.portrait-note{font-size:10px;line-height:1.6;color:#70809b;max-width:190px;white-space:pre-line}.portrait-cta{display:flex;align-items:center;justify-content:center;gap:12px;border-radius:5px;background:var(--blue);color:white;min-height:33px;padding:8px 12px;font-size:9px;font-weight:600;margin-top:3px}.portrait-cta svg{width:13px;height:13px}.portrait-signoff{font:7px var(--font);letter-spacing:1px;color:#8197b6;display:block}.example-caption{display:flex;justify-content:space-between;align-items:center;padding:17px 2px 0;gap:10px}.example-caption h3{font:600 17px var(--font);letter-spacing:-.4px;margin:0 0 5px}.example-caption p{font-size:12px;color:#7c8aa4;margin:0}.example-open{width:32px;height:32px}.example-open svg{width:16px;height:16px}.example-note,.example-list{background:#fff}.example-chapters,.example-wish{background:#deebff}.example-box{background:var(--blue);color:white;border-color:var(--blue)}.example-box .portrait-top{border-color:#ffffff40}.example-box .portrait-note,.example-box .portrait-signoff{color:#d9e8ff}.example-box .portrait-cta{background:white;color:var(--blue)}.example-box .portrait-icon{height:58px}.example-box .portrait-icon svg{height:48px;width:48px}.example-birthday .portrait-headline{font-size:30px}.example-birthday .portrait-icon,.example-archive .portrait-icon,.example-game .portrait-icon{display:none}.example-chapters .portrait-icon{display:none}.example-chapters .portrait-content{gap:15px}.example-chapters .example-chapters{display:grid;gap:7px;text-align:left;font-size:8px;width:100%;padding:11px;background:white;border-radius:6px}.example-countdown{display:flex;gap:6px}.example-countdown>span{display:block;background:#dceaff;border-radius:6px;padding:8px 12px;font:600 19px var(--font)}.example-countdown small{display:block;font:6px var(--font);letter-spacing:1px;margin-top:3px}.example-archive .example-archive{display:grid;gap:7px;width:100%;font-size:9px;text-align:left}.example-archive .example-archive span{padding:10px;background:white;border-radius:5px}.example-archive b{font-weight:400;margin-left:7px;color:#70809b}.example-scratch .example-scratch{display:grid;place-items:center;width:100%;height:63px;border:1px dashed #95b9ef;background:#dceaff;border-radius:8px;font-size:9px;letter-spacing:1px}.example-levels{display:flex;gap:8px}.example-levels span{display:grid;place-items:center;width:46px;height:46px;border:1px solid #b4cff4;background:#fff;border-radius:7px;font:600 20px var(--font)}.example-levels span:last-child{background:var(--blue);color:white}.example-list .portrait-note{text-align:left;line-height:2.2}.faq-section{border-top:1px solid var(--line);padding-top:65px;padding-bottom:72px;display:grid;grid-template-columns:1fr 1.5fr;gap:70px}.faq-intro h2{font:600 37px/1.15 var(--font);letter-spacing:-1.6px;margin:17px 0}.faq-intro>p{font-size:15px;color:#76809a;line-height:1.7;max-width:270px}.faq-list details{border-bottom:1px solid var(--line)}.faq-list details:first-child{border-top:1px solid var(--line)}.faq-list summary{list-style:none;cursor:pointer;padding:23px 0;display:flex;justify-content:space-between;align-items:center;gap:22px;font:500 17px var(--font);letter-spacing:-.3px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary svg{width:19px;height:19px;color:var(--blue);transition:transform .2s}.faq-list details[open] summary svg{transform:rotate(45deg)}.faq-list details[open] summary{color:var(--blue)}.faq-list details p{font-size:15px;color:#72809a;line-height:1.8;margin:0 35px 23px 0}.faq-list details a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}@media(max-width:760px){.examples-section{padding-bottom:45px}.examples-section .section-heading{display:flex;flex-wrap:wrap;gap:20px}.examples-section .section-heading h2{font-size:30px}.gallery-controls{width:100%;justify-content:flex-end}.gallery-controls>span{margin-right:auto}.example-track{gap:18px}.example-card{flex-basis:245px}.portrait-preview{height:403px}.faq-section{grid-template-columns:1fr;gap:22px;padding-top:42px;padding-bottom:45px}.faq-intro h2{font-size:31px}.faq-intro>p{max-width:none}.faq-list summary{font-size:16px;padding:21px 0}.faq-list details p{font-size:14px}}@media(prefers-reduced-motion:reduce){.portrait-preview,.gallery-controls button,.example-open,.faq-list summary svg{transition:none}}
