/* Sauti public site: layout refinements for tablet and desktop, and header clearance. */
/* keep the chat header's status text clear of the fixed "Quick exit" button */
.sauti-hdr-right{margin-right:5.5rem}

/* tablets and desktops: a comfortable reading column instead of a phone-width strip */
@media (min-width:768px){
  #root,.max-w-lg{max-width:40rem}
}
@media (min-width:1280px){
  #root,.max-w-lg{max-width:44rem}
}

/* ======================= welcome screen: quick actions + suggested prompts ======================= */
.sx-welcome{padding-bottom:1.25rem}
.sx-bot-row{display:flex;align-items:flex-start;gap:.75rem}
.sx-bot{flex:none;height:3rem;width:3rem;border-radius:50%;background:#E1F5E9;color:#00823F;display:flex;align-items:center;justify-content:center}
.sx-bubble{background:#E9F4EE;border:1px solid #D5EADD;border-radius:16px;padding:.95rem 1.1rem}
.sx-bubble-title{margin:0;font-size:1.0625rem;line-height:1.5rem;font-weight:700;color:#31357E}
.sx-bubble-body{margin:.35rem 0 0;font-size:.9375rem;line-height:1.4rem;color:rgba(49,53,126,.72)}
.sx-qa-label{margin:1.5rem 0 .6rem .15rem;font-size:.8125rem;font-weight:600;letter-spacing:.02em;color:#6D71A3}
.sx-qa-list{display:flex;flex-direction:column;gap:.7rem}
.sx-qa-card{display:flex;align-items:center;gap:.9rem;width:100%;min-height:4.5rem;padding:.9rem 1rem;text-align:left;background:#fff;border:1px solid #E7E9F2;border-radius:14px;box-shadow:0 1px 2px rgba(49,53,126,.05);color:#31357E;transition:border-color .15s,box-shadow .15s;touch-action:manipulation}
.sx-qa-card:hover{border-color:#9FD8B6;box-shadow:0 2px 8px rgba(0,130,63,.1)}
.sx-qa-ic{flex:none;height:3rem;width:3rem;border-radius:50%;display:flex;align-items:center;justify-content:center}
.sx-qa-ic.is-pink{background:#FCE6F2;color:#ED008C}
.sx-qa-ic.is-green{background:#E1F5E9;color:#00823F}
.sx-qa-ic.is-lav{background:#E8E9F7;color:#31357E}
.sx-qa-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}
.sx-qa-title{font-size:1.0625rem;font-weight:700;line-height:1.4rem}
.sx-qa-body{font-size:.875rem;line-height:1.25rem;color:rgba(49,53,126,.62)}
.sx-qa-chev{flex:none;color:#31357E}
.sx-prompts-lead{margin:1.4rem 0 .6rem .15rem;font-size:.8125rem;line-height:1.2rem;color:#6D71A3}
.sx-prompts{display:flex;flex-wrap:wrap;gap:.5rem}
.sx-prompt{border:1px solid rgba(0,166,82,.4);color:#00823F;background:transparent;border-radius:999px;padding:.55rem .95rem;font-size:.875rem;line-height:1.1rem;text-align:left;touch-action:manipulation}
.sx-prompt:hover{background:rgba(0,166,82,.08)}

/* ======================= grounding exercises ======================= */
.sx-g-scrim{position:fixed;inset:0;z-index:40;background:rgba(49,53,126,.5);display:flex;align-items:flex-end;justify-content:center}
.sx-g-dialog{background:#fff;width:100%;max-width:28rem;max-height:90vh;max-height:90dvh;overflow-y:auto;border-radius:22px 22px 0 0;padding-bottom:calc(1rem + env(safe-area-inset-bottom))}
@media (min-width:640px){.sx-g-scrim{align-items:center;padding:1rem}.sx-g-dialog{border-radius:22px;max-height:calc(100dvh - 2rem)}}
.sx-g-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.9rem .9rem .4rem}
.sx-g-title{margin:0;flex:1;text-align:center;font-family:Lora,serif;font-size:1.1875rem;font-weight:600;color:#31357E}
.sx-g-icon{flex:none;height:2.5rem;width:2.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#31357E;touch-action:manipulation}
.sx-g-icon:hover{background:#F1F2F8}
.sx-g-body{padding:.25rem 1.25rem .5rem}
.sx-g-p{margin:.4rem 0 0;font-size:.9375rem;line-height:1.5rem;color:rgba(49,53,126,.75)}
.sx-g-menu{display:flex;flex-direction:column;gap:.7rem;margin-top:1rem}
.sx-g-card{display:flex;flex-direction:column;gap:.15rem;text-align:left;width:100%;padding:.95rem 1rem;border:1px solid #E7E9F2;border-radius:14px;background:#fff;color:#31357E;touch-action:manipulation;min-height:4.25rem}
.sx-g-card:hover{border-color:#9FD8B6;background:#F7FBF8}
.sx-g-card-name{font-size:1.0625rem;font-weight:700}
.sx-g-card-desc{font-size:.875rem;color:rgba(49,53,126,.7)}
.sx-g-card-mins{font-size:.75rem;color:#00823F;font-weight:600}
.sx-g-step{padding-top:.25rem}
.sx-g-eyebrow{margin:0;font-size:.75rem;font-weight:600;color:#6D71A3;text-align:center}
.sx-g-h{margin:.5rem 0 0;font-size:1.25rem;line-height:1.6rem;font-weight:700;color:#31357E}
.sx-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin:1.2rem 0 .8rem}
.sx-dot{height:1.75rem;width:1.75rem;border-radius:50%;border:2px solid #9FD8B6;background:#fff;transition:background-color .2s,transform .2s}
.sx-dot.is-on{background:#00A652;border-color:#00A652;transform:scale(1.08)}
.sx-g-items{list-style:none;margin:.2rem 0 .6rem;padding:0;display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.sx-g-items li{background:#E1F5E9;color:#00823F;border-radius:999px;padding:.25rem .7rem;font-size:.8125rem}
.sx-g-entry{display:flex;flex-direction:column;gap:.6rem;margin-top:.4rem}
.sx-g-input{width:100%;border:1px solid #D9DCEB;border-radius:12px;padding:.75rem .9rem;font-size:1rem;color:#31357E;background:#fff;min-height:2.75rem}
.sx-g-input:focus{outline:2px solid #00A652;outline-offset:1px;border-color:transparent}
.sx-g-btn{display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;padding:.6rem 1.2rem;border-radius:999px;border:1px solid #D9DCEB;background:#fff;color:#31357E;font-size:.9375rem;font-weight:600;touch-action:manipulation}
.sx-g-btn:hover{background:#F1F2F8}
.sx-g-btn.is-primary{background:#00823F;border-color:#00823F;color:#fff}
.sx-g-btn.is-primary:hover{background:#006E35}
.sx-g-btn.is-block{width:100%;margin-top:.5rem}
.sx-g-count{margin:.7rem 0 0;text-align:center;font-size:.8125rem;color:#6D71A3}
.sx-g-nice{margin:.5rem 0 0;text-align:center;font-size:.9375rem;color:#00823F;font-weight:600}
.sx-g-link{display:block;margin:.4rem auto 0;padding:.6rem;font-size:.8125rem;color:#6D71A3;text-decoration:underline;touch-action:manipulation}
.sx-g-row{display:flex;gap:.6rem;margin-top:1.2rem;flex-wrap:wrap}
.sx-g-topics{display:flex;flex-direction:column;gap:.55rem;margin-top:1rem}
.sx-g-topic{width:100%;text-align:left;padding:.85rem 1rem;border:1px solid #E7E9F2;border-radius:14px;background:#fff;color:#31357E;font-size:1rem;font-weight:600;min-height:3rem;touch-action:manipulation}
.sx-g-topic:hover{border-color:#9FD8B6;background:#F7FBF8}
.sx-g-note{margin:.6rem 0 0;font-size:.8125rem;color:#6D71A3}
.sx-g-safe{margin:.6rem 1.25rem 0;padding-top:.7rem;border-top:1px solid #EEF0F5;font-size:.75rem;line-height:1.1rem;color:#6D71A3;text-align:center}
.sx-ring{margin:1rem auto .4rem;height:6.5rem;width:6.5rem;border-radius:50%;background:radial-gradient(circle,#00A652 0 30%,rgba(0,166,82,.22) 31% 100%)}
@media (prefers-reduced-motion:no-preference){
  .sx-ring{animation:sx-ring 5s ease-in-out infinite}
  @keyframes sx-ring{0%,100%{transform:scale(.88)}50%{transform:scale(1.06)}}
}

/* ======================= failure messages, mic status, offline, privacy ======================= */
.sx-err{max-width:88%;background:#FFF8F0;border:1px solid #F0D9B8;border-radius:16px;border-bottom-left-radius:6px;padding:.85rem 1rem;color:#31357E}
.sx-err-title{margin:0;font-size:.9375rem;font-weight:700}
.sx-err-body{margin:.3rem 0 0;font-size:.875rem;line-height:1.3rem;color:rgba(49,53,126,.78)}
.sx-err-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}
.sx-err-actions .sx-g-btn{min-height:2.5rem;padding:.45rem 1rem;font-size:.875rem}
.sx-err-urgent{margin:.75rem 0 0;font-size:.8125rem;color:#6D71A3}
.sx-err-urgent a{color:#00823F;text-decoration:underline}
.sx-mic-status{max-width:32rem;margin:.5rem auto 0;padding:.55rem 1rem;font-size:.8125rem;color:#31357E;background:#EEF0FA;border-radius:10px;width:calc(100% - 2rem)}
.sx-offline{max-width:32rem;margin:.5rem auto 0;padding:.55rem 1rem;font-size:.8125rem;color:#8A5A00;background:#FFF4D6;border:1px solid #F0D78A;border-radius:10px;width:calc(100% - 2rem)}
.sx-bubble-ai{margin:.55rem 0 0;font-size:.8125rem;line-height:1.2rem;color:rgba(49,53,126,.6)}
.sx-privacy-link{display:inline-block;margin-top:1.1rem;font-size:.8125rem;color:#6D71A3;text-decoration:underline}
.sx-notice-list{list-style:none;margin:.4rem 0 1rem;padding:0;display:flex;flex-direction:column;gap:.7rem}
.sx-notice-li{position:relative;padding-left:1.4rem;font-size:.9375rem;line-height:1.45rem;color:rgba(49,53,126,.82)}
.sx-notice-li::before{content:"";position:absolute;left:.1rem;top:.55rem;height:.5rem;width:.5rem;border-radius:50%;background:#00A652}
.sx-pv-meta{margin:0 0 .5rem;font-size:.8125rem;color:#6D71A3}
.sx-pv-h{margin:1.4rem 0 .35rem;font-size:1rem;font-weight:700;color:#31357E}
.sx-pv-p{margin:0;font-size:.9375rem;line-height:1.5rem;color:rgba(49,53,126,.78)}
.sx-pv-form{display:flex;flex-direction:column;gap:.6rem;margin-top:.8rem}
.sx-pv-res{margin:.2rem 0 0;font-size:.875rem;line-height:1.3rem;border-radius:10px;padding:.65rem .8rem}
.sx-pv-res.is-ok{background:#E1F5E9;color:#00823F}
.sx-pv-res.is-bad{background:#FBE9E5;color:#B03A25}
