*{box-sizing:border-box} body{margin:0;font-family:system-ui,Segoe UI,Roboto,Arial;background:#0b0f14;color:#e8eef7}
.app{max-width:720px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}
header{padding:16px 16px 10px;border-bottom:1px solid #1f2a36}
.title{font-weight:700;font-size:18px}
.sub{opacity:.8;font-size:12px;margin-top:6px}
.bar{margin-top:10px;height:10px;background:#16202b;border-radius:8px;overflow:hidden}
.barFill{height:100%;width:0%}
.chat{padding:14px 16px;flex:1;display:flex;flex-direction:column;gap:10px}
.msg{padding:10px 12px;border-radius:12px;line-height:1.35;white-space:pre-wrap}
.bot{background:#121b25;border:1px solid #1f2a36}
.you{background:#0f1a12;border:1px solid #1d3b26;align-self:flex-end}
.panel{padding:12px 16px;border-top:1px solid #1f2a36;background:#0d131b}
.qBox{padding:10px 12px;border:1px dashed #2a394a;border-radius:12px;margin-bottom:10px;min-height:46px;white-space:pre-wrap}
.inputRow{display:flex;gap:8px}
input{flex:1;padding:12px;border-radius:10px;border:1px solid #223244;background:#0b0f14;color:#e8eef7}
button{padding:12px 14px;border-radius:10px;border:1px solid #2a394a;background:#121b25;color:#e8eef7;cursor:pointer}
button:active{transform:translateY(1px)}
.hint{opacity:.8;font-size:12px;margin-top:8px}