/* Landing-page visual refinement */
body {
    background: linear-gradient(145deg, #fcfcfa 0%, #fbfbf8 62%, #f6f5ff 100%)
}

header {
    background: #fbfbf8d9;
    backdrop-filter: blur(12px)
}

.query-hero {
    max-width: 900px;
    position: relative;
    padding: 12px 0 0
}

.query-hero:before {
    content: "";
    position: absolute;
    width: 300px;
    height: 300px;
    right: -110px;
    top: -90px;
    background: #e8e5ff;
    border-radius: 50%;
    filter: blur(4px);
    opacity: .52;
    z-index: -1
}

.query-hero h1 {
    font-size: 64px;
    line-height: .98;
    letter-spacing: 0px;
    font-weight: 600;
    color: #252821;
    margin-top: 4px
}

.query-hero h1 em {
    font-family: 'DM Sans', sans-serif;
    font-size: 60px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0px;
    color: #6b5ed8;
    position: relative;
    display: inline-block
}

.query-hero h1 em:after {
    content: "";
    position: absolute;
    left: 2px;
    right: 4px;
    bottom: -8px;
    height: 3px;
    border-radius: 3px;
    background: #b7aff4;
    transform: rotate(-1.5deg)
}

.lede {
    font-size: 16px;
    max-width: 600px;
    line-height: 1.6;
    margin-top: 28px;
    color: #70746c
}

.search-card {
    margin-top: 32px;
    border-color: #d8d7e2;
    box-shadow: 0 15px 38px #5c50b30c, 0 2px 6px #1b1d1708;
    border-radius: 13px
}

.search-card textarea {
    font-size: 15px;
    height: 66px;
    padding: 20px 20px 9px
}

.search-card>div {
    height: 48px;
    padding-left: 14px
}

.scope {
    background: #f4f2ff;
    color: #5d55a6;
    border: 1px solid #e8e5ff
}

.search-button {
    height: 32px;
    border-radius: 8px;
    padding: 0 14px;
    background: #6355cf;
    box-shadow: 0 4px 10px #6355cf2b
}

.search-examples {
    margin-top: 17px
}

.search-examples span {
    font-family: 'DM Mono';
    letter-spacing: .3px
}

.search-examples button {
    background: #fff;
    border-color: #e2e1e8;
    padding: 8px 12px;
    transition: all .15s ease
}

.search-examples button:hover {
    background: #f3f1ff;
    border-color: #afa6ed;
    color: #5c4dc1;
    transform: translateY(-1px)
}

.answer-panel {
    margin-top: 70px
}

.query-label {
    color: #878a82
}

.answer,
.evidence {
    box-shadow: 0 10px 26px #30302808
}

.answer-head {
    height: 72px
}

.answer-copy {
    padding: 23px 24px 15px
}

.answer-copy p {
    font-size: 14px
}

.evidence {
    padding: 18px
}

.source-card {
    box-shadow: 0 7px 18px #31312807;
    transition: transform .15s ease, box-shadow .15s ease
}

.source-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 26px #31312812
}

.source-card h3 {
    letter-spacing: -.2px
}

.page-heading h2 {
    font-size: 34px;
    letter-spacing: -1.7px
}

@media(max-width:900px) {
    .query-hero h1 {
        font-size: 53px
    }

    .query-hero h1 em {
        font-size: 50px
    }
}

@media(max-width:640px) {
    .query-hero h1 {
        font-size: 42px;
        letter-spacing: -2.3px
    }

    .query-hero h1 em {
        font-size: 39px;
        letter-spacing: -2.2px
    }

    .query-hero:before {
        right: -140px
    }

    .lede {
        font-size: 14px
    }

    .search-card {
        margin-top: 25px
    }
}

.answer,
.evidence {
    height: 540px;
    min-height: 540px;
    overflow: hidden
}

.answer {
    display: flex;
    flex-direction: column
}

.answer-copy {
    flex: 1;
    overflow-y: auto;
    min-height: 0
}

.answer-actions {
    flex: 0 0 auto
}

.evidence {
    overflow-y: auto
}

.evidence-item {
    transition: background .15s ease;
    border-radius: 6px
}

.evidence-item:hover {
    background: #faf9ff
}

.evidence-item.selected {
    background: #f1efff;
    box-shadow: inset 3px 0 #7567dc
}

.answer-copy .source-detail {
    border-top: 1px solid #efeee9;
    margin-top: 20px;
    padding-top: 17px
}

.answer-copy .source-detail h4 {
    font-size: 11px;
    color: #696c64;
    margin: 0 0 8px
}

.answer-copy .source-detail p {
    font-size: 12px;
    color: #777a72;
    white-space: pre-wrap
}

.answer-head small .mode-badge {
    color: #6b5ed8;
    margin-left: 5px
}

@media(max-width:900px) {

    .answer,
    .evidence {
        height: 500px;
        min-height: 500px
    }
}

@media(max-width:640px) {

    .answer,
    .evidence {
        height: 460px;
        min-height: 460px
    }
}

.answer-copy h3 {
    font-size: 19px;
    line-height: 1.25;
    letter-spacing: -.5px;
    margin: 5px 0 7px
}

.source-detail-meta {
    font-size: 11px !important;
    color: #8b8e86 !important;
    border-bottom: 1px solid #efeee9;
    padding-bottom: 13px;
    margin-bottom: 2px
}

.answer-copy .eyebrow {
    font-size: 9px;
    margin-bottom: 8px
}
.heading-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.embedding-notice{margin:14px 0;color:#9a5b00;font-size:13px;min-height:18px}
.modal-card{max-height:calc(100vh - 40px);overflow-y:auto}
.modal-title-row{display:flex;align-items:center;gap:10px;margin-bottom:2px}
.modal-title-row h2{flex:1}
.help-button{width:27px;height:27px;border:1px solid #d9d5ef;border-radius:50%;background:#f7f5ff;color:#5d51a6;font:700 14px/1 'DM Sans';cursor:pointer;flex:0 0 auto}
.help-button:hover{background:#ece9ff;border-color:#9b90dc}
.credential-help{margin:12px 0 16px;padding:14px 15px;border:1px solid #ded8f7;border-radius:9px;background:#faf9ff;color:#55515f;font-size:11px;line-height:1.5}
.credential-help h3{margin:0 0 5px;color:#40386d;font-size:13px}
.credential-help p{margin:5px 0 8px}
.credential-help ol{margin:7px 0 9px;padding-left:19px}
.credential-help li{margin:5px 0}
.credential-help a{color:#5c50b0;text-decoration:underline}
.credential-help code{font-size:10px;background:#efedf9;padding:1px 4px;border-radius:3px}
.back-answer{border:0;background:transparent;color:#5c50b0;font:600 11px 'DM Sans';padding:0 0 12px;cursor:pointer}
.back-answer:hover{text-decoration:underline}
.answer-warning{margin-top:16px;padding:10px 12px;border-radius:7px;background:#fff8e8;color:#8a5a18;font-size:11px;line-height:1.45}
