/* Device viewports show the same approved cards in an illustrative Waykin chat. */
.conversation-frame .native-canvas{display:flex;flex-direction:column;overflow:hidden;font-family:Arial,sans-serif}
.conversation-frame .native-app-layout{display:flex;flex:1;min-height:0}
.conversation-frame .native-chat-main{min-width:0;flex:1;display:flex;flex-direction:column;background:#fff}
.conversation-frame .native-header{height:63px;flex:none;border-bottom:1px solid #f1f3f7;padding:12px 22px}
.native-chat-brand{display:flex;align-items:center;gap:7px;color:#203048;font-size:20px;letter-spacing:-.6px}
.native-chat-brand img{width:33px;height:33px;object-fit:contain}
.native-chat-brand b{font-weight:700}.native-chat-brand b span{color:#397bce;font-weight:500}
.native-thread{overflow:auto;flex:1;min-height:0;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#bacbdf transparent}
.native-thread:focus-visible{outline:2px solid #9ec7f5!important;outline-offset:-3px}
.native-conversation{max-width:898px;margin:auto;padding:22px 0 26px}
.native-example-label{display:block;text-align:center;font-size:11px;color:#8a98aa;margin-bottom:17px}
.native-user-message{margin:0 0 22px auto;padding:14px 18px;background:#f0f1f3;color:#253044;max-width:78%;width:fit-content;border-radius:20px 20px 5px 20px;font:16px/1.5 Arial,sans-serif}
.native-assistant-message{max-width:88%;font:16px/1.6 Arial,sans-serif;padding:15px 18px;background:#edf5ff;border-radius:6px 20px 20px 20px;color:#224362}
.native-assistant-message .native-speaker{display:block;font-size:12px;font-weight:700;color:#3475b5;margin-bottom:6px}
.native-assistant-message p{margin:0}
.native-answer-tools{display:flex;align-items:center;gap:13px;color:#8190a4;margin:12px 2px 20px}
.native-answer-tools svg{width:15px;height:15px;stroke-width:1.5}
.native-ad-placement{border-top:1px solid #eef1f5;padding-top:18px}
.native-composer-wrap{flex:none;padding:14px 24px 12px;background:#fff;border-top:1px solid #f2f5f8}
.conversation-frame .native-composer.screen-compose{max-width:898px;margin:0 auto;padding:11px 15px;min-height:50px;gap:12px;align-items:center;box-shadow:0 3px 15px #2035500b;font-size:15px;background:#fff;border-color:#e5eaf0}
.conversation-frame .native-composer>span{flex:1;text-align:left}
.conversation-frame .native-composer svg{width:21px;height:21px;color:#354860}
.conversation-frame .native-composer>b{display:grid;place-items:center;width:31px;height:31px;flex:none;border-radius:50%;background:#2477d2;color:#fff;font:22px Arial,sans-serif}
.native-preview-note{display:block;margin-top:9px;text-align:center;color:#97a0ad;font-size:10px;line-height:1.3}
.native-status{display:flex;align-items:center;justify-content:space-between;height:33px;flex:none;padding:9px 27px 0;color:#233044;font-size:13px}
.native-status>span{display:flex;gap:7px;align-items:center}
.native-status svg{width:17px;height:15px;stroke-width:1.6}
.native-signal{width:15px;height:13px;background:linear-gradient(to top,#233044 0 100%) 0 9px/3px 4px no-repeat,linear-gradient(to top,#233044 0 100%) 4px 6px/3px 7px no-repeat,linear-gradient(to top,#233044 0 100%) 8px 3px/3px 10px no-repeat,linear-gradient(to top,#233044 0 100%) 12px 0/3px 13px no-repeat}
.native-battery{position:relative;width:22px;height:10px;border:1px solid #748091;border-radius:3px;background:linear-gradient(90deg,#233044 85%,transparent 85%);box-shadow:inset 0 0 0 1px #fff}
.native-battery:after{content:'';position:absolute;right:-3px;top:2px;width:2px;height:4px;background:#748091;border-radius:1px}
.native-home-indicator{display:block;flex:none;height:5px;background:#c3ccd7;border-radius:5px;width:102px;margin:0 auto 7px}
.native-browser{height:34px;display:flex;align-items:center;position:relative;background:#f5f7fa;border-bottom:1px solid #e5ebf2;flex:none}
.native-browser>span:first-child{display:flex;gap:7px;margin-left:14px}.native-browser i{height:7px;width:7px;border-radius:50%;background:#cdd5df}.native-browser i:first-child{background:#e7b6b2}.native-browser i:nth-child(2){background:#e6d29c}.native-browser i:nth-child(3){background:#abd1b4}
.native-url{position:absolute;left:32%;width:36%;border:1px solid #e5eaf0;background:#fff;text-align:center;font-size:11px;border-radius:5px;color:#77879b;padding:2px}
.native-sidebar{width:174px;flex:none;padding:22px 15px;background:#f7f9fc;display:flex;flex-direction:column;gap:20px;border-right:1px solid #ebeff4;color:#66758a;font-size:12px}
.native-sidebar>span{display:flex;align-items:center;gap:8px}.native-sidebar svg{width:15px;height:15px}.native-side-brand{font-size:20px;color:#203048;font-weight:700;letter-spacing:-.7px;gap:1px!important}.native-side-brand>span{color:#397bce;font-weight:400}.native-side-brand img{width:29px;height:29px;margin-right:4px}.native-new-chat{margin-top:10px;color:#205890;font-weight:600}.native-sidebar small{font-size:9px;letter-spacing:1px;margin-top:12px;color:#91a0b2}.native-current-chat{background:#eaf1fa;padding:10px 8px;border-radius:8px;color:#386393;margin:0 -5px}.native-side-profile{margin-top:auto;padding-top:20px;border-top:1px solid #e5ebf2;color:#7590b4}.native-side-profile b{color:#61728a;font-weight:400}
.native-mobile .native-conversation{padding:15px 20px 22px}.native-mobile .native-header{height:54px;padding:9px 22px}.native-mobile .native-user-message{font-size:15px;margin-bottom:18px;padding:12px 15px;max-width:85%}.native-mobile .native-assistant-message{font-size:15px;line-height:1.55;max-width:96%;padding:13px 15px}.native-mobile .native-composer-wrap{padding:10px 17px 11px}.native-mobile .native-preview-note{font-size:9px}.native-mobile .native-ad-placement{padding-top:16px}.native-mobile .native-example-label{font-size:10px;margin-bottom:14px}
.native-ipad .native-conversation{padding:25px 28px 28px}.native-ipad .native-composer-wrap{padding:17px 28px 14px}.native-ipad .native-assistant-message{max-width:83%}
.native-desktop .native-thread{padding:0 24px}.native-desktop .native-conversation{padding-top:25px}.native-desktop .native-header .native-chat-brand{margin-right:auto;margin-left:15px}.native-desktop .native-composer-wrap{padding:15px 30px 16px}.native-desktop .native-assistant-message{max-width:78%}
.native-desktop .native-header{height:54px}
.native-desktop .native-conversation{padding-top:12px;padding-bottom:12px}
.native-desktop .native-example-label,.native-desktop .native-speaker{display:none}
.native-desktop .native-user-message{padding:10px 16px;margin-bottom:12px}
.native-desktop .native-assistant-message{padding:10px 16px;max-width:88%}
.native-desktop .native-answer-tools{margin:6px 0 8px}
.native-desktop .native-ad-placement{padding-top:12px}
.native-desktop .native-composer-wrap{padding:10px 30px 11px}
.peek-stage{background:radial-gradient(ellipse at 82% 85%,#f5eddb,transparent 55%),linear-gradient(145deg,#a8cecc,#e6f0e5);padding:23px}
.peek-stage .conversation-frame{border-color:#eef5f1;box-shadow:0 17px 42px #426b6c26}
.peek-stage .conversation-frame.mobile{width:300px;border-width:7px;border-radius:34px}
.peek-stage .conversation-frame.ipad{width:590px;border-width:9px;border-radius:24px}
.peek-stage .conversation-frame.desktop{width:1024px;border-width:7px;border-radius:17px}
.hero .conversation-frame.mobile{width:236px}
.hero .conversation-frame.ipad{width:360px}
.review-stage .device-stage{height:auto;min-height:0;padding:18px 0}
@media(max-width:600px){.peek-stage{padding:17px 12px}.peek-stage .conversation-frame.mobile{width:285px}}
