.app-preview{display:none}
/* Keep the complete example visible on short screens; the page can scroll. */

@media(max-width:640px){
  html[lang="hi"] .testing-phone .hero-phone{min-width:0;width:100%;max-width:100%;align-items:center}
  html[lang="hi"] .testing-phone .screen-dots{min-width:0;width:100%;max-width:100%;flex-wrap:wrap;justify-content:center}
}
.screen-slide.has-localized-preview>picture,.screen-slide.has-localized-preview>.screen-shot{display:none!important}
.screen-slide.has-localized-preview>.app-preview{display:flex}
.app-preview{height:100%;width:100%;box-sizing:border-box;flex-direction:column;background:#080b09;color:#f7faf8;font-family:Poppins,Inter,sans-serif;font-size:12px;line-height:1.5;text-align:left;overflow:hidden}
.app-preview *{box-sizing:border-box}
.app-preview svg{width:20px;height:20px;flex-shrink:0}
.app-preview h3,.app-preview p{margin:0}
.app-preview small{color:#a5b0a8;font-size:10px;display:block}
.ap-brand{display:flex;align-items:center;justify-content:space-between;padding:21px 18px 14px;border-bottom:1px solid #242d27;gap:8px}
.ap-brand>strong{font:800 15px Inter,sans-serif;letter-spacing:1px;display:flex;align-items:center;gap:6px}
.ap-brand>strong>span{width:6px;height:6px;border-radius:50%;background:#00c851}
.ap-locale{font-size:10px;color:#00d966;border:1px solid #214d33;padding:3px 8px;border-radius:12px}
.ap-body{flex:1;min-height:0;padding:16px 14px;overflow:hidden}
.ap-heading{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.ap-heading>svg{color:#00cf60}.ap-heading h3{font-size:18px;font-weight:700;line-height:1.5}
.ap-card .ap-heading{margin-bottom:5px}.ap-card .ap-heading h3{font-size:12px}
.ap-greeting{color:#b4c2b9;margin:-5px 0 14px!important}
.ap-card{background:#141b17;border:1px solid #29342d;border-radius:13px;padding:13px;margin-bottom:12px;min-width:0}
.ap-card p{color:#abb9af;font-size:11px;margin-top:8px;line-height:1.7}
.ap-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ap-metrics .ap-card{padding:10px 14px}.ap-metrics b{font-size:25px;color:#00d966;font-weight:700}
.ap-eyebrow{color:#91a399;font-size:10px;margin-bottom:12px;letter-spacing:.2px}
.ap-match{display:flex;align-items:center;justify-content:space-between;gap:5px}.ap-match b{font-size:10px;flex:1;text-align:center}.ap-match small{font-size:8px}
.ap-crest{display:grid;place-items:center;width:30px;height:34px;background:#006d2c;border:1px solid #00b650;border-radius:9px 9px 13px 13px;font:bold 15px Inter,sans-serif}.ap-crest-blue{background:#143264;border-color:#3764a5}
.ap-meta{display:flex;align-items:center;gap:6px;color:#c8d2cb;font-size:10px;margin-top:10px}.ap-meta svg{width:13px;height:13px}
.ap-tabs{display:flex;gap:5px;margin:4px 0 14px;flex-wrap:wrap}.ap-pill{display:inline-block;padding:5px 9px;border:1px solid #35413a;border-radius:16px;font-size:10px;color:#b3c0b8;white-space:nowrap}
.ap-selected{background:#063e20!important;border-color:#087a39!important;color:#41e383!important}
.ap-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 0;border-bottom:1px solid #29332d}.ap-row:last-child{border-bottom:0;padding-bottom:2px}.ap-row strong{font-size:11px}.ap-row small{margin-top:3px}.ap-row>div{min-width:0}
.ap-count{border-radius:50%;background:#00bd52;color:#001f0c;width:21px;height:21px;text-align:center;font-size:11px;font-weight:700;flex-shrink:0}
.ap-status{color:#40d782;display:flex;align-items:center;gap:3px;font-size:9px;flex-shrink:0}.ap-status svg{width:12px;height:12px}
.ap-total{display:flex;align-items:center;justify-content:space-between;gap:10px}.ap-total>b{font-size:27px;color:#41df80}.ap-progress{height:5px;background:#2e3b32;margin:11px 0 5px;border-radius:5px;overflow:hidden}.ap-progress>span{display:block;width:80%;height:100%;background:#00c851}
.ap-action{display:block;border-radius:10px;padding:10px 12px;background:#008d3a;color:#fff;font-size:12px;font-weight:600;text-align:center}
.ap-conversation>small{text-align:center;margin:0 0 12px}.ap-bubble{width:85%;padding:10px 12px;background:#1c2721;border-radius:12px 12px 12px 2px;margin:10px 0}.ap-bubble strong{font-size:10px;color:#4edb89}.ap-bubble p{font-size:11px;margin-top:4px;line-height:1.75}.ap-mine{margin-left:auto;background:#075b2e;border-radius:12px 12px 2px 12px}.ap-mine small{text-align:right;margin-top:5px;color:#add4bc}
.ap-table{width:100%;border-collapse:collapse;font-size:10px}.ap-table th{text-align:left;color:#8fa197;font-size:9px;padding:4px 5px 10px}.ap-table td{padding:12px 5px;border-top:1px solid #2b3830}.ap-table td:not(:first-child),.ap-table th:not(:first-child){text-align:center}.ap-highlight{color:#4bdc89}
.ap-week{display:flex;justify-content:space-between;margin:5px 0 18px;gap:5px}.ap-week>span{flex:1;text-align:center;padding:8px 3px;border-radius:10px;background:#17201b;font-size:10px;color:#adbbb2}.ap-week b{display:block;font-size:18px;color:#f5faf7;margin-top:4px}
.ap-profile{text-align:center;padding:5px 0 16px}.ap-avatar{height:74px;width:74px;margin:0 auto 9px;border:3px solid #21d673;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 22px #00c85133;background:#123b25;color:#adf3c7;font-size:36px;font-weight:600}.ap-profile h3{font-size:17px;margin-bottom:7px}.ap-profile small{margin-top:9px}
.ap-locker{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.ap-locker>div{display:flex;align-items:center;justify-content:center;flex-direction:column;height:91px;background:#151f18;border:1px solid #2d3e31;border-radius:10px}.ap-locker span{display:grid;place-items:center;width:45px;height:45px;border-radius:50%;border:2px solid #00d666;color:#d5eadc;font-size:20px}.ap-locker small{font-size:9px;margin-top:5px}.ap-blue span{border-color:#4489ed}.ap-gold span{border-color:#e9bb3c}.ap-purple span{border-color:#b166ed}
.ap-player{display:flex;align-items:center;gap:11px}.ap-player>svg{width:36px;height:36px;padding:8px;background:#24382b;border-radius:50%;color:#47df80}.ap-player strong{font-size:12px}.ap-player-footer{display:flex;justify-content:space-between;align-items:center;margin-top:12px;gap:10px}.ap-player-footer .ap-action{font-size:10px;padding:7px 12px}
.ap-demo{text-align:center;padding:3px 10px 7px;font-size:9px;color:#90a298}
.ap-nav{border-top:1px solid #27372d;display:flex;justify-content:space-around;gap:2px;padding:11px 6px 17px;background:#0f1712}.ap-nav>span{display:flex;flex-direction:column;align-items:center;gap:5px;color:#a6b9ad}.ap-nav small{font-size:8px;white-space:nowrap}.ap-nav>span:first-child{color:#00d966}
@media(max-width:640px) and (max-height:800px){.ap-brand{padding-top:15px;padding-bottom:10px}.ap-body{padding-top:12px}.ap-card{margin-bottom:9px;padding:10px}.ap-row{padding:8px 0}.ap-heading{margin-bottom:9px}.ap-nav{padding:8px 5px 12px}.ap-conversation .ap-bubble{margin:7px 0;padding:8px 11px}}