@charset "UTF-8";
html {
    font-size: 62.5%;
    height: 100%;
    overflow: hidden;
}
body{
    font-size: 1.4rem;
    list-style:none;
    font-family:"Microsoft YaHei";
    height:100%;
    margin:0;
    padding:8px;
    box-sizing:border-box;
    overflow:hidden;
}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,dt+dd{
    margin:0;
    padding:0;
    list-style:none;
    font-weight:400;
    color:#3a3a3a
}
img{
    vertical-align:middle;
    border:none;
}
.left{float:left;}
.right{float:right;}
.clear:after{
    content:'';
    clear:both;
    display:block;
}
.clear{clear:both;}
.clearfloat:after{
    display:block;
    content:'';
    height:0;
    clear:both;
    visibility:hidden;
}
.clearfloat{zoom:1;}
a{
    color:#333;
    text-decoration:none;
}
i,em{
    font-style:normal;
}
input,button{
    border:0;
    outline:none;
    margin:0;
    padding:0;
}
/*****AI智能问答 start*****/
body{background:#f3f5f8;}

:root {
    --ink: #333;
    --muted: #666;
    --navy: #0e1d34;
    --panel: #142743;
    --panel-light: #1b3455;
    --line: rgba(178, 201, 233, .16);
    --accent: #336af4;
    --accent-strong: #1551e8;
    --shadow:0 0 5px 1px rgba(0, 0, 0, 0.08);
}
button, textarea { font: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid rgba(255, 180, 91, .72); outline-offset: 3px; }

.app-shell {
    position: relative; 
    z-index: 1;
    display:flex;
    flex-direction:column;
    width: min(100%, 760px);
    height:100%;
    margin: 0 auto;
    min-height:0;
    overflow:hidden;
}

.app-bar {
    position:relative;
    flex:0 0 48px;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:48px;
    background:#336af4;
    color:#fff;
}
.app-bar-title { color:#fff; font-size:15px; font-weight:500; }
.back-btn {
    position:absolute;
    inset:0 auto 0 0;
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    padding:0;
    border:0;
    background:transparent;
    color:#fff;
}
.back-icon {
    width:24px;
    height:24px;
    background:url(../images/icon_return.png) no-repeat center / contain;
}

.chat-top {
    flex:0 0 auto;
    padding:15px;
    box-sizing: border-box;
}
.chat-title{
    width: 100%;
    font-size:1.65rem;
    font-weight: bold;
    color:#336af4;
    text-align: center;
}
.question-input { margin-top:15px; }
.ai-seek { padding:12px; border:1px solid #336af4; border-radius:15px; background:#fff; }
.ai-seek:focus-within { border-color:#336af4; }
.ai-textarea { display:block; width:100%; min-height:96px; padding:2px 2px 0; border:0; resize:vertical; background:transparent; color:var(--ink); font-size:1.4rem; line-height:1.65; }
.ai-textarea::placeholder { color:#8192a9; }
.ai-textarea:focus { outline:0; }
.ai-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; }
.ai-label { display:inline-flex; align-items:center; gap:7px; line-height:33px; padding:0 15px; border:1px solid #d2d2d2; border-radius:50px; background:transparent; color: #111; font-size:13px; transition:.2s ease; box-sizing: border-box;}
/* .ai-label::before { content:"✦"; color:var(--accent); font-size:14px; } */
.ai-label.is-active { border-color:#336af4; background:#edf2ff; color:#336af4; }
.send-btn { display:inline-grid; place-items:center; width:34px; height:34px; border:0; border-radius:5px; background:var(--accent); color:#fff; transition:transform .2s ease, background .2s ease; }
.send-btn:hover {background:#234bb1; }
.send-btn.is-running { background:var(--accent-strong); }
.send-icon { width: 0; height: 0; border-left: 6px solid transparent; border-bottom: 8px solid currentColor; border-right: 6px solid transparent; transform: translateY(-1px); }
.send-btn.is-running .send-icon { width:11px; height:11px; border:2px solid currentColor; border-radius:3px; transform:none; }

.section {
    position:relative;
    display:flex;
    flex:1 1 auto;
    flex-direction:column;
    min-height:0;
    width:100%;
    box-sizing: border-box;
    overflow:hidden;
}
.section-title{flex:0 0 auto; text-align: center;}
.section-title img {
    max-width: 560px;
    width: 100%;
    max-height: 50px;
    margin:0 0 10px;
}
.category-tabs { display: flex; flex:0 0 auto; gap: 12px; width:100%; margin-bottom:10px; padding: 2px 15px 10px; overflow-x: auto; scrollbar-width: none; box-sizing: border-box;}
.category-tabs::-webkit-scrollbar { display: none; }
.category-tab { flex: 0 0 auto; padding: 8px 13px; border-radius:50px; background:#fff; color: var(--muted); font-size:1.2rem; white-space: nowrap; transition: .2s ease; box-shadow: var(--shadow);}
.category-tab:hover { border-color: rgba(255, 180, 91, .55); color: var(--ink); }
.category-tab.is-active { border-color: var(--accent); background: var(--accent); color: #fff; font-weight: 600; }

.question-scroll { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding-bottom:max(12px, env(safe-area-inset-bottom)); box-sizing:border-box; }
.question-list { display: grid; gap:10px;width:calc(100% - 30px); margin:0 auto; padding: 0; list-style: none; }
.question-item { display: flex; align-items: flex-start; gap: 11px; width: 100%; padding: 13px 14px; border: 1px solid var(--line); border-radius: 10px; background:#fff; color: var(--ink); text-align: left; line-height: 1.5; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.fire { flex: 0 0 auto; margin-top: 1px; color: var(--accent); font-size: 15px; }
.question-text { min-width: 0; font-size: 14px; }
.empty-state { display: none; padding: 32px 16px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); text-align: center; font-size: 13px; }
.empty-state.is-visible { display: block; }
.toast { position: fixed; left: 50%; bottom: max(20px, env(safe-area-inset-bottom)); z-index:4; max-width:calc(100% - 30px); padding:10px 15px; border-radius:8px; background:rgba(0,0,0,0.5); color:#fff; font-size: 13px; box-shadow: var(--shadow); opacity: 0; transform: translate(-50%, 14px); pointer-events: none; transition: .25s ease; }
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.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; }
/*****AI智能问答 end*****/
