.screenshot-guide{margin:0 0 28px;padding:24px;background:#fff;border:1px solid #dce5d8;border-radius:20px}.sg-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px}.sg-heading>span{background:#edf3e9;color:#4b6b55;font-size:11px;padding:5px 10px;border-radius:20px}.sg-heading h2{font-size:22px;margin:0}.sg-intro{display:grid;grid-template-columns:1.15fr 1fr;gap:26px;align-items:center}.sg-example{margin:0;border:1px solid #e2e6dd;border-radius:14px;overflow:hidden;background:#fff}.sg-post-head{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;padding:10px 12px}.sg-post-head>span:last-child{margin-left:auto;letter-spacing:2px}.sg-avatar{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#e5eee0}.sg-photo{position:relative;aspect-ratio:3/2;overflow:hidden}.sg-photo img{display:block;width:100%;height:100%;object-fit:contain}.sg-focus{position:absolute;left:3%;top:25%;width:37%;height:37%;border:3px solid #fff;border-radius:14px;box-shadow:0 0 0 2px #3a604549}.sg-photo-label{position:absolute;left:5%;bottom:12%;font-size:11px;font-weight:600;background:#fffffff2;color:#244c36;padding:6px 10px;border-radius:6px}.sg-example figcaption{font-size:9px;color:#7a8579;padding:7px 10px;line-height:1.5}.sg-start>p{font-size:13px;line-height:1.9;color:#627263;margin:12px 0}.sg-start .sg-lead{font-size:21px;font-weight:700;line-height:1.6;color:#284834}.sg-start>small{display:block;font-size:10px;color:#7c877b;margin-top:7px}.sg-steps{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0;margin:24px 0 18px}.sg-steps li{display:flex;gap:12px;background:#f5f7f1;border-radius:12px;padding:16px}.sg-number{color:#a78c54;font-size:18px;font-weight:700;flex:none}.sg-steps h3{font-size:14px;margin:0 0 5px}.sg-steps p{font-size:12px;line-height:1.8;margin:0;color:#637161}.sg-example-note{display:block;margin-top:8px;color:#758171;font-size:10px;line-height:1.7}.sg-faq{border-top:1px solid #e1e7db;padding-top:6px}.sg-faq summary{font-size:13px;font-weight:600;padding:12px 0;cursor:pointer}.sg-faq h3{font-size:13px;margin:15px 0 5px}.sg-faq p{font-size:12px;line-height:1.9;color:#667562}.sg-faq>div{padding:0 4px 10px}.page-heading h1{font-size:clamp(26px,4vw,42px);line-height:1.4}.page-heading{margin-bottom:24px}
@media(max-width:700px){.screenshot-guide{padding:16px;border-radius:14px}.sg-heading{gap:8px;margin-bottom:14px}.sg-heading h2{font-size:18px}.sg-intro{grid-template-columns:1fr;gap:12px}.sg-start .sg-lead{font-size:18px;margin:0 0 8px}.sg-start .sg-lead br{display:none}.sg-start>p{font-size:12px;margin:8px 0}.sg-steps{grid-template-columns:1fr;gap:8px;margin:18px 0 12px}.sg-steps li{padding:13px;gap:11px}.sg-steps h3{font-size:13px}.sg-photo-label{font-size:10px}.page-heading h1{font-size:28px}}
.sg-demo-tag{font-size:9px;color:#66806e;letter-spacing:0!important;white-space:nowrap}.sg-stage{position:relative;aspect-ratio:3/2;background:#f0f4ed;overflow:hidden;isolation:isolate}.sg-scene{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px;animation:sgReveal .2s ease both}.sg-scene[hidden]{display:none}.sg-scene[data-scene="0"]{padding:0}.sg-scene .sg-photo{width:100%;height:100%}.sg-demo .sg-focus{animation:sgGlow 2s ease-in-out infinite}.sg-phone-shot{width:66%;background:#fff;border:5px solid #fff;border-radius:12px;box-shadow:0 10px 26px #26473422;transform:rotate(-3deg);overflow:hidden;animation:sgCapture .35s ease both}.sg-phone-shot img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}.sg-phone-shot span{display:block;text-align:center;font-size:12px;font-weight:700;padding:6px;color:#345b47}.sg-scene-copy{font-size:12px;font-weight:600;text-align:center;margin:14px 0 0;color:#345b47}.sg-upload-demo{background:#fff;border:1px dashed #8aa48f;border-radius:12px;padding:14px;width:92%;display:flex;gap:12px;align-items:center;box-shadow:0 8px 20px #315a4010}.sg-upload-demo img{width:32%;aspect-ratio:1;object-fit:cover;border-radius:6px}.sg-upload-demo b,.sg-upload-demo span,.sg-upload-demo small{display:block}.sg-upload-demo b{font-size:15px}.sg-upload-demo span{font-size:11px;margin:8px 0}.sg-upload-demo small{font-size:9px;color:#748374}.sg-upload-track{height:5px;background:#e4ece1;border-radius:9px;overflow:hidden;margin:10px 0}.sg-upload-track i{display:block;height:100%;background:#486a59;animation:sgUpload .65s ease both}.sg-result-demo{display:grid;grid-template-columns:38% 1fr;align-items:center;gap:12px;width:100%;background:#fff;padding:13px;border-radius:12px;box-sizing:border-box;box-shadow:0 8px 24px #315a4010}.sg-result-demo img{width:100%;height:120px;object-fit:contain}.sg-result-demo small,.sg-result-demo b,.sg-result-demo span{display:block}.sg-result-demo b{font-size:14px;line-height:1.5;margin:4px 0}.sg-result-demo small{font-size:10px;color:#6a7a6a}.sg-result-demo span{font-size:10px}.sg-result-demo strong{font-size:clamp(21px,3vw,30px);line-height:1.5;letter-spacing:-.5px;color:#214c36}.sg-demo-badge{color:#82704b;background:#f5efdf;border-radius:4px;padding:3px 5px;width:fit-content;margin-bottom:7px;font-size:9px!important}.sg-result-note{font-size:9px;line-height:1.6;margin:9px 0 0;color:#697a6a}.sg-consult-demo{text-align:center;display:flex;align-items:center;flex-direction:column}.sg-consult-check{display:grid;place-items:center;width:40px;height:40px;background:#486a59;color:white;border-radius:50%;font-size:23px;margin-bottom:10px}.sg-consult-demo b{font-size:17px}.sg-consult-demo p{font-size:12px;line-height:1.8;margin:8px 0}.sg-consult-demo>span:not(.sg-consult-check){background:white;padding:7px 12px;border-radius:20px;font-size:11px}.sg-consult-demo small{font-size:9px;margin-top:8px;color:#748374}.sg-demo-footer{padding:10px}.sg-demo-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}.sg-demo-tabs button{border:0;background:#f0f4ed;color:#58705d;border-radius:6px;font:inherit;font-size:10px;min-height:44px;padding:4px 2px;cursor:pointer}.sg-demo-tabs button[aria-pressed="true"]{background:#486a59;color:#fff}.sg-demo-controls{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:10px;color:#6e7c6c}.sg-demo-controls>span{margin-right:auto}.sg-demo-controls button{border:0;background:transparent;color:#365b46;font:inherit;min-height:36px;cursor:pointer;padding:4px 8px}.sg-demo button:focus-visible{outline:3px solid #b09557;outline-offset:2px}.sg-demo.is-paused .sg-focus{animation-play-state:paused!important}.sg-demo.is-paused .sg-scene,.sg-demo.is-paused .sg-phone-shot,.sg-demo.is-paused .sg-upload-track i{animation:none!important;opacity:1;transform:none}.sg-demo.is-paused .sg-upload-track i{width:100%}@keyframes sgReveal{from{opacity:1;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes sgCapture{from{transform:scale(.88) rotate(0);filter:brightness(1.4)}to{transform:scale(1) rotate(-3deg);filter:brightness(1)}}@keyframes sgGlow{50%{box-shadow:0 0 0 7px #ffffff35}}@keyframes sgUpload{from{width:0}to{width:100%}}@media(max-width:400px){.sg-stage{aspect-ratio:1.2}.sg-scene{padding:10px}.sg-result-demo{gap:8px;padding:10px}.sg-result-demo b{font-size:12px}.sg-consult-demo b{font-size:15px}}@media(prefers-reduced-motion:reduce){.sg-demo *{animation:none!important;transition:none!important}.sg-upload-track i{width:100%}}