body { font-family: system-ui, sans-serif; background: #f4f5f7; margin: 0; }
main { max-width: 720px; margin: 2rem auto; padding: 0 1rem; }
#dropzone { border: 2px dashed #999; border-radius: 8px; padding: 2rem; text-align: center; background: #fff; }
#dropzone.over { border-color: #2563eb; background: #eff6ff; }
button { padding: .6rem 1.2rem; border: 0; border-radius: 6px; background: #2563eb; color: #fff; cursor: pointer; margin-top: 1rem; }
button:disabled { background: #9ca3af; cursor: not-allowed; }
pre { background: #111827; color: #e5e7eb; padding: 1rem; border-radius: 6px; overflow: auto; max-height: 400px; }
progress { width: 100%; }
#error { color: #b91c1c; }
#askSection { margin-top: 2rem; }
#chat { background: #fff; border-radius: 8px; padding: .5rem; max-height: 360px; overflow-y: auto; }
.msg { padding: .6rem .8rem; border-radius: 8px; margin: .4rem 0; white-space: pre-wrap; max-width: 85%; }
.msg.user { background: #dbeafe; margin-left: auto; }
.msg.bot { background: #f3f4f6; }
.msg.error { color: #b91c1c; }
.ask-row { display: flex; gap: .5rem; margin-top: .5rem; }
.ask-row input { flex: 1; padding: .6rem; border: 1px solid #ccc; border-radius: 6px; }
.ask-row button { margin-top: 0; }

#docBar { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.fileBtn { background: #2563eb; color: #fff; padding: .5rem 1rem; border-radius: 6px; cursor: pointer; }
#docName { color: #555; font-size: .9rem; }
#chat { min-height: 300px; max-height: 60vh; }
#quick { display: flex; gap: .5rem; margin-top: .5rem; }
#quick button { margin-top: 0; background: #e5e7eb; color: #111; }