:root{
      --dash-border: var(--v2-border, rgba(11,18,32,.12));
      --chat-bg:#fff; --msg-user-bg:#0f172a; --msg-user-fg:#f8fafc;
    }
    .chat-card {
        border: 1px solid var(--dash-border) !important;
        margin-bottom: 84px;
        height: 100%;
    }
  /* Main grid layout - responsive */
    .chat-grid{display:grid;grid-template-columns:320px 1fr;gap:14px; margin: 0 50px;align-items:start;min-height:0;}
    @media (max-width:1000px){ .chat-grid{grid-template-columns:1fr; margin: 0 0;} }
    @media (max-width:768px){ .mobile-menu-open .chat-grid{grid-template-columns:320px 1fr;}
      .chat-card {
        border: 1px solid var(--dash-border) !important;
        margin-bottom: 0;
        height: 100%;
    }
  }

    /* Top bar */
    .chat-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px;border-bottom:1px solid var(--dash-border); margin: 0 70px;}
    @media (max-width:768px){ .chat-top{margin:0;padding:8px;position:fixed;top:0;left:0;right:0;z-index:100;background:#fff;border-bottom:1px solid var(--dash-border);} }
    .chat-top .cta-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:#fff;color:#0b1220;font-size:20px;cursor:pointer;transition:background 0.2s,color 0.2s}
    @media (max-width:768px){ .chat-top .cta-icon{width:44px;height:44px;} }
    .chat-top .cta-icon:hover{background:#0b1220;color:#fff}
    @media (max-width:768px){ .chat-top .title{font-size:18px;} }

    /* User dropdown */
    .user-dropdown{position:relative;display:inline-flex}
    .user-dropdown img{border-radius:50%;width:32px;height:32px;object-fit:cover;border:1px solid rgba(15,23,42,.12);cursor:pointer}
    .user-dropdown-menu{position:absolute;top:100%;right:0;z-index:1000;background:#fff;border:1px solid var(--dash-border);border-radius:12px;padding:8px 0;box-shadow:0 8px 24px rgba(0,0,0,.1);display:none;min-width:180px}
    @media (max-width:768px){ .user-dropdown-menu{right:0px;min-width:160px;} }
    .user-dropdown.open .user-dropdown-menu{display:block}
    .user-dropdown-item{display:block;padding:12px 16px;text-decoration:none;color:#0b1220;font-weight:500}
    @media (max-width:768px){ .user-dropdown-item{padding:14px 16px;font-size:16px;} }
    .user-dropdown-item:hover{background:rgba(0,0,0,.05);color:#0b1220}
    .title{margin:0;font-size:20px;font-weight:900;color:#0b1220}
    .muted{color:#445163}
    .badge {
        background: #f1f5f9;
        color: #0b1220;
        border-color: #e2e8f0;
        margin-left: auto;
        font-size: 11px;
        padding: 3px 8px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.025em;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .scout-badges {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        align-items: stretch;
    }
    .icon-wp,.icon-boost{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;vertical-align:middle;margin-right:6px}
    .icon-wp svg,.icon-boost svg{width:16px;height:16px;display:block}
.scout-premium{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;border:1px solid rgba(15,23,42,.12);background:#fff;font-size:12px;font-weight:600;cursor:pointer}
.scout-premium.is-active{background:#0b1220;color:#fff;border-color:#0b1220}
.scout-addon-btn{display:inline-flex;align-items:center;gap:8px;padding:6px 8px;border:none;background:transparent;border-radius:10px;font-size:13px;font-weight:700;cursor:pointer;color:#0b1220;}
  .scout-addon-btn svg{width:20px;height:20px;display:block;}
  .scout-addon-btn:hover{background:rgba(15,23,42,.06);}
  .scout-addon-btn.is-active{background:rgba(21,44,112,.12);color:#0b1220;}
  .scout-addon-sep{opacity:0.4;font-weight:800;padding:0 2px;}
  @media (max-width:768px){
    .scout-addon-btn{padding:6px;min-width:36px;justify-content:center;}
    .scout-addon-btn span.label{display:none;}
    .scout-addon-sep{display:none;}
  }
.scout-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:none;background:transparent;border-radius:10px;cursor:pointer;padding:0;transition:background .15s ease;}
.scout-icon-btn:hover{background:rgba(21,44,112,.08);}
.scout-icon-btn.is-active{background:rgba(21,44,112,.14);}
.cta{display:inline-block;text-decoration:none;border-radius:12px;padding:10px 12px;font-weight:800;color:#0b1220;border:1px solid #0b1220;background:#fff}

    /* Main column */
    .chat-main {
        display: flex;
        flex-direction: column;
        background: #ffffff47;
        height: calc(100vh - 175px);
        border-radius: 20px;
        margin-right: 12px;
        backdrop-filter: blur(4px);
    }
    @media (max-width:1000px){ .chat-main{height:calc(100vh - 20px)} }
    .scout-messages{flex:1 1 auto;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:12px; border-radius:20px 20px 0 0}
    .scout-global-loader{display:none;align-items:center;gap:10px;padding:10px 14px;margin:6px 18px;border:1px solid var(--dash-border);border-radius:12px;background:#f8fafc;font-weight:700;color:#0b1220;}
    .scout-global-loader.is-visible{display:flex;}
    .scout-global-spinner{width:18px;height:18px;border-radius:50%;border:3px solid rgba(15,23,42,.2);border-top-color:#0b1220;animation:scoutSpin .8s linear infinite;}
    .msg-row{display:flex;gap:8px;align-items:flex-start; margin:0 10px;}
    .avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;flex:0 0 28px}
    .avatar.assistant{background:#e2e8f0;color:#0b1220}
    .avatar.user{background:#0f172a;color:#fff}
    .avatar.user.has-photo{background:#fff;padding:0;border:1px solid rgba(15,23,42,.12)}
    .avatar img{width:100%;height:100%;border-radius:inherit;object-fit:cover;display:block}
    .scout-msg{position:relative;display:block;width:90%;border-radius:16px;padding:12px 14px;border:none;color:#0b1220}
    .scout-msg.assistant{margin-right:auto;background:#f8fafc;
        border-top-left-radius: 0;
        max-width: 95%;
      }
    .scout-msg.user {
        background: #ffffff;
        color: var(--msg-user-fg);
        margin-left: auto;
        border: 1px solid #0000000d;
        border-top-right-radius: 0;
        max-width: 95%;
    }
    .scout-msg-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#475569}
    .scout-msg-actions{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
    .scout-msg-footer{position:absolute;right:12px;bottom:12px;display:flex;justify-content:flex-end}
    .scout-copy-btn{background:none;border:none;color:#64748b;font-size:16px;cursor:pointer;padding:6px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;line-height:0;margin-left:auto}
.scout-copy-btn:hover{color:#0f172a;background:rgba(15,23,42,.08)}
.scout-copy-btn:disabled{cursor:default;opacity:0.5;background:transparent;color:#94a3b8}
/* .scout-msg.assistant .scout-chips{margin-bottom:28px} */
.scout-msg.user .scout-chips{margin-bottom:28px}
.copy-check{font-size:16px;display:inline-block;color:#0f172a}

.scout-image-wrap {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}

/* Image generation loader */
.scout-img-loader{display:flex;align-items:center;gap:10px;margin-top:8px;}
.scout-img-loader-core{width:64px;height:64px;position:relative;background:#fff;border-radius:4px;overflow:hidden;}
.scout-img-loader-core:before{content:"";position:absolute;left:0;bottom:0;width:40px;height:40px;transform:rotate(45deg) translate(30%, 40%);background:#ff9371;box-shadow:32px -34px 0 5px #ff3d00;animation:scout-img-slide 2s infinite ease-in-out alternate;}
.scout-img-loader-core:after{content:"";position:absolute;left:10px;top:10px;width:16px;height:16px;border-radius:50%;background:#ff3d00;transform:rotate(0deg);transform-origin:35px 145px;animation:scout-img-rotate 2s infinite ease-in-out;}
.scout-img-loader-text{font-size:14px;color:#111827;}
@keyframes scout-img-slide{0%,100%{bottom:-35px;}25%,75%{bottom:-2px;}20%,80%{bottom:2px;}}
@keyframes scout-img-rotate{0%{transform:rotate(-15deg);}25%,75%{transform:rotate(0deg);}100%{transform:rotate(25deg);}}
    .scout-msg.user .scout-msg-header{color:#cbd5e1}
    .scout-msg-body{
        font-size:15px;
        line-height:1.6;
        word-wrap: break-word;
        overflow-wrap: break-word;
        word-break: normal;
        hyphens: auto;
        max-width: 100%;
    }
    .scout-msg-body p{margin:0; color: black;}
    .scout-msg-body ul, .scout-msg-body ol{margin:8px 0 10px 18px}
    .scout-msg-body h3 {
    color: #00a091;
    font-size: 30px;
    }
    .scout-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:rgba(15,23,42,.08);color:#0b1220;font-size:12px;font-weight:600}
    .scout-optimizing{margin-top:10px;font-size:13px;color:#475569;display:flex;align-items:center;gap:8px}
    .scout-optimizing::before{content:'';width:12px;height:12px;border-radius:50%;border:2px solid rgba(71,85,105,.5);border-top-color:transparent;animation:scoutSpin .85s linear infinite}
    @keyframes scoutSpin{to{transform:rotate(360deg);}}
    .scout-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
    .scout-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
    .scout-button{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s ease}
    .scout-button:hover{background:#0b1220;color:#fff;border-color:#0b1220}
    .scout-feedback{margin-top:8px;display:flex;gap:8px}
    .scout-feedback button{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:600;cursor:pointer}

    /* Composer */
      .chat-composer-wrap {
          position: sticky;
          bottom: 0;
          background: #ffffff00;
          padding: 10px 12px;
          border-top: 1px solid rgb(255 255 255 / 0%);
          border-radius: 0 0 20px 20px;
          backdrop-filter: blur(1px);
      }
    .scout-composer{display:flex;flex-direction:column;gap:10px; background:transparent;}
    .scout-composer textarea{width:100%;min-height:110px;border-radius:14px;border:1px solid rgba(15,23,42,.12);padding:12px 14px;font-size:15px;resize:vertical;background:#fff;position:relative;padding-right:60px;}
    .scout-composer .textarea-send {
        position: absolute;
        right: 8px;
        bottom: 7px;
        z-index: 10;
    }
    .scout-image-preview{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
    .scout-image-preview .scout-image-thumb{width:56px;height:56px;border-radius:10px;object-fit:cover;border:1px solid rgba(15,23,42,.12)}
    .scout-image-strip {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 6px;
        justify-content: flex-start;
    }
    .scout-image-strip .scout-image-thumb{max-width:140px;max-height:140px;border-radius:12px;object-fit:cover;border:1px solid rgba(15,23,42,.1)}
    .scout-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
    .scout-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
    .scout-actions select.scout-select{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:999px;padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer;appearance:auto}
    .scout-autoscroll input{accent-color:#0b1220;cursor:pointer}
    .scout-send button{background:#0b1220;color:#fff;border:none;border-radius:999px;padding:10px 18px;font-size:14px;font-weight:800;cursor:pointer}
.scout-addons{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px;}
.scout-banner{display:none;margin-top:6px;padding:8px 10px;border-radius:10px;border:1px solid rgba(234,179,8,.4);background:rgba(234,179,8,.1);color:#92400e;font-size:12px;font-weight:600}
.scout-banner.is-visible{display:flex;align-items:center;gap:8px}
.scout-admin-panel{display:flex;flex-direction:column;gap:4px;margin-bottom:8px;border:1px dashed rgba(15,23,42,.25);background:#f8fafc;border-radius:12px;padding:10px}
.scout-admin-panel label{font-size:12px;font-weight:700;color:#0b1220}
.scout-admin-panel input{border:1px solid rgba(15,23,42,.2);border-radius:10px;padding:6px 10px;font-size:13px;background:#fff}
.scout-admin-panel small{font-size:11px;color:#475569}
.is-disabled{opacity:0.5;cursor:not-allowed;pointer-events:auto;}
select.is-disabled{background:#f8fafc;color:#94a3b8;}

/* Custom model picker */
.scout-model-picker{position:relative;min-width:170px}
.scout-model-current{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:8px 10px;border-radius:10px;border:1px solid rgba(15,23,42,.12);background:#fff;font-weight:700;cursor:pointer;font-size:13px}
.scout-model-current .model-chip{display:flex;align-items:center;gap:6px}
.scout-model-menu{position:absolute;bottom:calc(100% + 6px);left:0;width:100%;background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:12px;box-shadow:0 12px 30px rgba(15,23,42,.15);z-index:20;display:none;flex-direction:column;overflow:hidden}
.scout-model-menu.is-open{display:flex}
.scout-model-menu button{display:flex;align-items:center;gap:8px;padding:8px 10px;border:none;background:#fff;text-align:left;cursor:pointer;font-weight:600;font-size:13px}
.scout-model-menu button:hover{background:#f8fafc}
.scout-model-menu button.is-active {
    background: #ffffff;
    color: #000000;
    border: 2px solid #00a1ff;
    border-radius: 10px;
}
.scout-model-menu button.is-disabled{opacity:0.45;cursor:not-allowed}
.model-icon{width:16px;height:16px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;}







.model-caret{width:10px;height:10px;border-right:2px solid #0b1220;border-bottom:2px solid #0b1220;transform:rotate(-135deg);margin-left:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}

@media (max-width: 768px) {
  /* Mobile image handling: ensure thumbs fill the strip without overflow */
  .scout-image-strip .scout-image-thumb{
    max-width: 100%;
    max-height: 100%;
    border-radius: 12px;
    object-fit: cover;
    border: 1px solid rgba(15,23,42,.1);
  }

  /* Hide inline user avatar on mobile to save horizontal space */
  .avatar.user{
    background:#0f172a;
    color:#fff;
    display:none;
  }
}

    section h2 {
    margin: 0 0 8px;
    font-size: 21px;
    letter-spacing: .2px;
    color: #0092c3;
    }

    /* Parts */
    .scout-part{border:none;padding:10px;border-radius:10px;margin:8px 0}
    .scout-part.thought{background:#ffffff}
    .scout-part.answer{background:#f8fafc}
    .scout-part .part-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#475569;margin-bottom:6px}
    .scout-part.thought .part-label{display:none}

    /* Collapsible thought */
    .thought-collapsible{margin:0}
    .thought-collapsible summary{cursor:pointer;color:#9aa0a6;font-size:12px;list-style:none}
    /* Legacy modal styles (dashboard) retained for inline chat history modal */
    .scout-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(15,23,42,.45);z-index:1200;}
    .scout-modal.is-open{display:flex;}
    .scout-modal-panel{background:#fff;border-radius:18px;max-width:520px;width:90%;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 24px 48px rgba(15,23,42,.22);}
    .scout-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--dash-border);}
    .scout-modal-header h4{margin:0;font-size:18px;font-weight:800;color:#0b1220;}
    .scout-modal-close{background:none;border:none;font-size:22px;cursor:pointer;color:#64748b;line-height:1;}
    .scout-modal-close:hover{color:#0b1220;}
    .scout-modal-body{padding:12px 18px;flex:1 1 auto;overflow:auto;}
    .scout-modal-footer{padding:12px 16px;border-top:1px solid var(--dash-border);display:flex;justify-content:flex-end;gap:12px;}
    .scout-history-item{padding:12px 4px;border-bottom:1px solid rgba(15,23,42,.08);cursor:pointer;display:flex;justify-content:space-between;gap:16px;}
    .scout-history-item:last-child{border-bottom:none;}
    .scout-history-item strong{display:block;font-weight:700;color:#0b1220;margin-bottom:4px;}
    .scout-history-meta{font-size:12px;color:#64748b;}
    .thought-collapsible summary::-webkit-details-marker{display:none}
    .thought-body{color:#9aa0a6;font-size:13px;line-height:1.55;margin-top:6px}

    /* Sidebar */
  .chat-side {
        padding: 12px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        background: white;
        border-radius: 20px;
        margin-left: 12px;
        height: calc(100vh - 175px);
        overflow: hidden;
        min-height: 0;
    }
    #exitScoutChatBtn svg,
    #newChatBtn  svg {
    width: 20px;
    height: 100%;
    }
    button#exitScoutChatBtn, button#newChatBtn {
        background: none;
        gap: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        align-content: center;
    }
    button#newChatBtn {
    display: flex;
    align-items: center;
    gap: 10px;
    /* border-right: 1px solid #000000; */
    /* padding-right: 15%; */
    }
  .side-card{border:1px solid rgb(0 0 0 / 15%);border-radius:14px;padding:12px;background:#fff}
  .side-card.side-card-recent{flex:1;display:flex;flex-direction:column;min-height:0;}
  @media (max-width:768px){ .side-card{padding:16px;} }
  .side-card h3{margin:0 0 6px 0;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#0b1220}
  @media (max-width:768px){ .side-card h3{font-size:14px;} }
  .list{list-style:none;margin:0;padding:0}
  .scout-inline-note{background:rgba(15,23,42,.05);padding:8px 10px;border-radius:10px;font-size:12px;color:#475569}
  @media (max-width:768px){ .scout-inline-note{padding:12px;font-size:14px;} }

  .scout-delete-chat{background:none;border:none;color:#64748b;font-size:16px;cursor:pointer;padding:4px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;line-height:0;margin-left:auto}
  @media (max-width:768px){ .scout-delete-chat{padding:8px;font-size:20px;min-width:44px;min-height:44px;}
.scout-msg-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #475569;
}
}
  .scout-delete-chat:hover{color:#dc2626;background:rgba(220,38,38,.08)}
  .scout-chat-item{display:flex;justify-content:space-between;align-items:flex-start;padding:8px 0;border-radius:8px;margin:2px 0;padding:1px 8px;cursor:pointer;transition:all 0.15s ease}
  @media (max-width:768px){ .scout-chat-item{padding:12px;min-height:44px;margin:4px 0;} }
  .scout-chat-item:hover{background:#f8fafc;border-left:2px solid #0b1220}
  .scout-chat-item.active{background:#f3f4f6;border-left:2px solid #0b1220;font-weight:600}
  .scout-chat-item.is-loading{opacity:0.7;position:relative}
  .scout-chat-item.is-loading::after{content:'';position:absolute;right:10px;top:12px;width:14px;height:14px;border-radius:50%;border:2px solid rgba(15,23,42,.3);border-top-color:#0b1220;animation:scoutSpin .7s linear infinite}
  .scout-chat-item-title{font-size:12px;font-weight:600;color:#0b1220;line-height:1.3}
  .scout-rename-input{width:100%;border:1px solid var(--dash-border);border-radius:8px;padding:6px 8px;font-size:12px;font-weight:600;color:#0b1220;box-sizing:border-box}
  @media (max-width:768px){ .scout-chat-item-title{font-size:14px;margin-bottom:4px;} }
  @media (max-width:768px){ .scout-rename-input{font-size:14px;padding:10px;} }
  .scout-chat-item-meta{font-size:12px;color:#64748b;font-weight:500}
  @media (max-width:768px){ .scout-chat-item-meta{font-size:13px;} }
  .scout-chat-item .chat-loading-pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:4px 8px;border-radius:999px;border:1px solid rgba(15,23,42,.12);background:#f1f5f9;color:#0b1220;margin-top:6px}
  .scout-chat-item.is-loading .chat-loading-pill{background:#0b1220;color:#fff;border-color:#0b1220}
  #scoutSessions{flex:1;overflow-y:auto;padding-right:4px;scrollbar-gutter:stable;min-height:0;max-height:100%;}
  /* .badge{background:#f1f5f9;color:#0b1220;border-color:#e2e8f0;font-size:11px;padding:3px 8px;font-weight:600;text-transform:uppercase;letter-spacing:0.025em} */
  @media (max-width:768px){ .badge{font-size:12px;padding:4px 10px;} }
  /* Chat status + loading */
.chat-load-indicator {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    /* margin: 0 12px 8px; */
    border: 1px solid rgb(255 255 255 / 15%);
    border-radius: 12px 12px 0 0;
    background: #f8fff1;
    font-weight: 700;
    color: #0b1220;
}
  .chat-load-indicator .chat-status-copy{display:flex;flex-direction:column;gap:2px}
  .chat-load-indicator .chat-status-dot{width:10px;height:10px;border-radius:50%;background:#10b981;box-shadow:0 0 0 6px rgba(16,185,129,.18)}
  .chat-load-indicator .chat-status-dot.is-loading{background:#0b1220;box-shadow:0 0 0 6px rgba(11,18,32,.18);animation:scoutSpin 1s linear infinite}
  .chat-load-indicator .chat-status-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#475569}
  .chat-load-indicator .chat-status-title{font-size:14px;font-weight:800}
  .chat-load-indicator .chat-status-meta{font-size:12px;font-weight:600;color:#64748b}
  .chat-loading{display:flex;align-items:center;justify-content:center;gap:12px;padding:24px 12px;color:#0b1220}
  .chat-loading .spinner{width:22px;height:22px;border-radius:50%;border:3px solid rgba(15,23,42,.12);border-top-color:#0b1220;animation:scoutSpin .9s linear infinite}
  .chat-loading strong{font-size:14px;display:block}
  .chat-loading small{color:#64748b;font-weight:600}

  #addonImages svg { width: auto; height: 20px; }

    /* Messages */
  /* @media (max-width:768px){ .msg-row{margin:0 16px;} }
  @media (max-width:768px){ .scout-msg-body{font-size:16px;} }

  /* Copy button */
  @media (max-width:768px){ .scout-copy-btn{padding:8px;font-size:18px;min-width:44px;min-height:44px;} }

  /* Mobile Layout - Native Chat App Feel */
  /* Show hamburger only on mobile */
  @media (min-width:769px){ .hamburger-btn{display:none!important;} }
  @media (max-width:768px){ .hamburger-btn{display:flex;} }

  @media (max-width:768px){
    .scout-badges{display:none!important;}
    .badge{display:none!important;}
    /* Side panel with slide animation and backdrop */
    .chat-side {
        position: fixed;
        left: -332px;
        top: 0;
        width: 320px;
        height: 100vh;
        z-index: 200;
        background: #fff;
        transition: transform 0.3s ease;
        /* box-shadow: 2px 0 20px rgba(0, 0, 0, 0.1); */
        overflow-y: auto;
        padding: 12px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        /* border-top-left-radius: 0; */
        /* border-bottom-left-radius: 0; */
        border-radius: 0 19px 19px 0;
    }
    
    .mobile-menu-open .chat-side{
      transform:translateX(320px);
    }
    
    /* Main chat area animation */
    .chat-main{
      transition:transform 0.3s ease;
      margin-right:0;
      border-radius:0;
      height: calc(100vh - 0px);
    }

    /* Soften scout actions on mobile */
    .scout-actions{
      gap:6px;
      opacity:0.9;
    }
    .scout-actions select.scout-select{
      padding:6px 10px;
      font-size:12px;
      border-radius:12px;
      border:1px solid rgba(15,23,42,.08);
      background:rgba(255,255,255,.9);
    }

    /* Anchor mode selector closer to top of input */
    .scout-toolbar{
      align-items:flex-start;
    }

    
    .mobile-menu-open .chat-main{
      transform:translateX(320px);
      filter:blur(3px);
      opacity:0.6;
      pointer-events:none;
    }
    
    /* Backdrop overlay */
    .mobile-overlay{
      display:none;
      position:fixed;
      top:0;
      left:0;
      right:0;
      bottom:0;
      background:rgba(0,0,0,0.5);
      z-index:199;
      backdrop-filter:blur(5px);
    }
    
    .mobile-menu-open .mobile-overlay{
      display:block;
    }
    
    /* Side panel close button */
    .side-panel-close{
      position:absolute;
      top:12px;
      right:12px;
      background:none;
      border:none;
      font-size:24px;
      color:#64748b;
      cursor:pointer;
      z-index:201;
      width:40px;
      height:40px;
      display:flex;
      align-items:center;
      justify-content:center;
      border-radius:50%;
    }
    
    .side-panel-close:hover{
      background:rgba(0,0,0,0.05);
      color:#0b1220;
    }
    
    /* Enhanced mobile chat experience */
    .scout-messages{
      overflow-y:auto;
      margin:60px 0 70px;
      padding:8px;
      /* height:calc(100vh - 130px); */
      padding-bottom:60px; /* ensure last message clears fixed composer */
      max-width: 387px;
    }
    
    .chat-composer-wrap{
      position:fixed;
      bottom:0;
      left:0;
      right:0;
      width:100%;
      background:#fff;
      border-top:1px solid var(--dash-border);
      border-radius:0;
      z-index:150;
      padding:8px 12px;
    }
    
    .scout-composer textarea{
      font-size:16px;
      min-height:53px;
      border-radius:9999px;
      background:#ffffff;
      backdrop-filter:blur(5px);
      padding:16px 60px 16px 16px;
    }
    
    /* Improve message display on mobile */
    .msg-row{
      margin:0 8px;
    }

    .scout-msg{
      width: 100%;
      max-width: 100%;
    }

    .avatar.assistant,
    .avatar.user.has-photo{
      display: none;
    }

    .scout-msg-body{
      font-size:16px;
      line-height:1.6;
      word-break: normal;
    }
    
    .scout-msg.user .scout-chips{
      margin-bottom:0;
    }
    
    /* Top bar adjustments */
    .chat-top{
      position:fixed;
      top:0;
      left:0;
      right:0;
      z-index:100;
      background:#fff;
      border-bottom:1px solid var(--dash-border);
      margin:0;
      padding:8px 12px;
    }
    
    .scout-badges{
      display:none;
    }
  }

  .answer-body h3 {
      color: #0092c3;
      font-size: 24px;
  }

  /* Autoscroll - hide on mobile */
  @media (max-width:768px){ .scout-autoscroll{display:none!important;} }

  /* Textarea */
  @media (max-width:768px){ 
    .scout-composer textarea {
        font-size: 16px;
        /* padding: 16px; */
        line-height: 1.4;
        height: 53px;
        min-height: 100%;
        border-radius: 9999px;
        background: #ffffff96;
        backdrop-filter: blur(5px);
    }
  }

  /* Send button - SVG placeholder on mobile */
  @media (max-width:768px){
    .scout-send button {
        min-height: 38px;
        min-width: 40px;
    }
    .scout-send button span{display:none;} }

  /* Settings button - hide completely */
  @media (min-width:769px){ .settingsBtn{display:none!important;} }
  @media (max-width:768px){ .settingsBtn{display:none!important;} }

  /* Quota badges - hide from main screen on mobile */
  @media (max-width:768px){ .chat-top .badge{display:none;} }

  /* a11y */
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

  /* Waypoint error message styling */
  .wp-error-message {
    padding: 16px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 12px;
    color: #7f1d1d;
  }
  .wp-error-message p {
    margin: 0 0 12px 0;
    font-size: 15px;
    line-height: 1.5;
  }
  .wp-suggestions {
    margin: 12px 0;
  }
  .wp-suggestions strong {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
  }
  .wp-suggestions ul {
    margin: 0;
    padding-left: 20px;
  }
  .wp-suggestions li {
    margin: 4px 0;
    font-size: 14px;
  }
  .wp-refresh-info {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #fecaca;
    font-size: 13px;
    color: #92400e;
  }
  #addonImages svg { width: 20px; height: 20px; }
  .wp-tooltip {
    border-bottom: 1px dotted #7f1d1d;
    cursor: help;
    position: relative;
  }
  .wp-tooltip:hover::after {
    content: attr(title);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #1f2937;
    color: white;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  }
  .wp-tooltip:hover::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: #1f2937;
    z-index: 1000;
  }
    /* WP toast (bottom-right) */
    .wp-toast-container{position:fixed;right:16px;bottom:26px;z-index:9999;display:flex;flex-direction:column;gap:8px}
    .wp-toast{background: #ffffffff; color:#000000;border-radius:12px;padding:10px 12px;box-shadow:0 8px 24px rgba(15,23,42,.2);font-weight:700;font-size:13px;opacity:0;transform:translateY(6px);transition:opacity .2s ease, transform .2s ease;white-space:pre-line}
    .wp-toast.is-visible{opacity:1;transform:translateY(0)}

/* Image wrapper download button */
.scout-image-wrap{position:relative;display:inline-block;}
.scout-image-download{position:absolute;right:7px;top:6px;background:rgba(17,24,39,0.82);color:#fff;padding:4px 8px;border-radius:6px;font-size:12px;text-decoration:none;}
.scout-image-download:hover{background:rgba(17,24,39,0.95);}


/* Image modal */
body.scout-image-modal-open{overflow:hidden;}
.scout-image-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:3000;opacity:0;transition:opacity .18s ease;}
.scout-image-modal.is-open {
    display: flex;
    opacity: 1;
    backdrop-filter: blur(3px);
}
.scout-image-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,0.65);}
.scout-image-modal-body {
    position: relative;
    z-index: 1;
    /* background: #0b1220; */
    padding: 16px;
    border-radius: 12px;
    max-width: 90vw;
    max-height: 90vh;
    /* box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35); */
    /* backdrop-filter: blur(0px); */
}
.scout-image-modal-body img{max-width:80vw;max-height:80vh;display:block;border-radius:10px;}
.scout-image-modal-close{position:absolute;top:6px;right:6px;border:none;background:rgba(0,0,0,0.5);color:#fff;font-size:22px;border-radius:50%;width:32px;height:32px;cursor:pointer;}

/* Image wrapper download button */
.scout-image-wrap{position:relative;display:inline-block;}
.scout-image-actions{margin-top:6px;display:flex;gap:8px;align-items:center;}
.scout-image-download{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid rgba(15,23,42,0.16);border-radius:9px;background:#fff;color:#0b1220;text-decoration:none;}
.scout-image-download:hover{background:#0b1220;color:#fff;border-color:#0b1220;}


@media (max-width:768px){
  html, body{height:100%; overflow:hidden;}
  body.homev2{overflow:hidden;}
  .chat-card{min-height:100vh; height:100vh; margin-bottom:0;}
  .chat-grid{grid-template-columns:1fr; margin:0; height:calc(100vh - 60px); min-height:0;}
  .chat-main{display:flex; flex-direction:column; min-height:0;}
  .scout-messages{flex:1 1 auto; overflow:auto;}
}


