:root {
  color-scheme:light;
  --paper:#f6f7f5;
  --surface:#fff;
  --ink:#23332f;
  --muted:#63736c;
  --rule:#dce3df;
  --blue:#237562;
  --blue-deep:#185846;
  --warm:#f1f5f2;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}

* {
  box-sizing:border-box;
}

[hidden] {
  display:none!important;
}

body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  min-height:100vh;
}

button,textarea,select {
  font:inherit;
}

button {
  border:1px solid var(--rule);
  border-radius:10px;
  padding:.6rem .85rem;
  background:var(--surface);
  color:var(--ink);
  cursor:pointer;
  font-size:.82rem;
  font-weight:650;
  transition:background .15s,border-color .15s;
}

button:hover {
  background:var(--warm);
  border-color:#94b5a7;
}

button:disabled {
  cursor:default;
  opacity:.5;
}

button:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,a:focus-visible {
  outline:2px solid var(--blue);
  outline-offset:3px;
}

span[lang=en] {
  font-size:.85em;
  color:var(--muted);
  font-weight:400;
}

.topbar {
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:1.3rem;
  padding:.85rem max(1.25rem,calc((100vw - 64rem)/2));
  background:var(--surface);
  border-bottom:1px solid var(--rule);
}

.back {
  color:var(--blue-deep);
  text-decoration:none;
  font-weight:700;
}

.eyebrow {
  margin:0 0 .2rem;
  font-size:.63rem;
  letter-spacing:.15em;
  color:var(--muted);
  font-weight:700;
}

h1 {
  font-size:1.25rem;
  letter-spacing:-.025em;
  margin:0;
}

.session-actions {
  display:flex;
  gap:.5rem;
}

.session-actions button {
  white-space:nowrap;
}

main {
  width:min(100% - 2rem,56rem);
  min-height:calc(100vh - 6rem);
  margin:1.2rem auto;
  display:flex;
  flex-direction:column;
  gap:1rem;
}

.contract {
  border-bottom:1px solid var(--rule);
  padding:0 .2rem .8rem;
  font-size:.8rem;
  color:var(--muted);
}

.contract summary {
  cursor:pointer;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.5rem;
  list-style:none;
}

.contract summary::before {
  content:'›';
  font-size:1.15rem;
  color:var(--blue);
  transition:transform .15s;
}

.contract[open] summary::before {
  transform:rotate(90deg);
}

.contract p {
  margin:.5rem 0 0 1.25rem;
  font-size:.8rem;
  line-height:1.65;
}

.trust-badge {
  margin-left:auto;
  border:1px solid var(--rule);
  border-radius:20px;
  padding:.2rem .5rem;
  font-size:.68rem;
  background:#eef2ed;
}

.session-recovery {
  border:1px solid var(--rule);
  border-radius:14px;
  padding:1rem;
  background:var(--surface);
  display:grid;
  gap:.75rem;
}

.session-recovery small {
  display:block;
  margin-top:.25rem;
  color:var(--muted);
}

.recent-sessions {
  display:grid;
  gap:.5rem;
}

.recent-session {
  text-align:left;
  width:100%;
}

.recent-session span {
  display:block;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.recent-session small {
  font-weight:400;
}

.messages {
  flex:1;
  min-height:10rem;
  overflow:visible;
}

.empty {
  min-height:18rem;
  max-width:44rem;
  margin:0 auto;
  padding:2.5rem 1rem;
  display:grid;
  justify-items:center;
  align-content:center;
  text-align:center;
  color:var(--muted);
}

.empty-mark {
  display:grid;
  place-items:center;
  width:3.5rem;
  height:3.5rem;
  border-radius:18px;
  background:#e4eee7;
  color:var(--blue);
  font-size:2rem;
  margin-bottom:1.2rem;
}

.empty p {
  margin:0 0 .6rem;
  color:var(--ink);
  font-size:1.6rem;
  font-weight:650;
  letter-spacing:-.03em;
}

.empty small {
  line-height:1.8;
}

.example-prompts {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:.5rem;
  margin-top:1.4rem;
}

.example-prompts button {
  display:flex;
  flex-direction:column;
  gap:.2rem;
  text-align:left;
  padding:.65rem .9rem;
  border-radius:12px;
}

.message {
  margin:1rem 0 1.6rem;
  padding:1.1rem 1.3rem;
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:16px;
  overflow-wrap:anywhere;
  min-width:0;
}

.message.user {
  max-width:88%;
  margin-left:auto;
  background:#eaf1ed;
  border-color:#d3e1d8;
}

.message.assistant {
  border-color:transparent;
  background:transparent;
  padding:.8rem .2rem;
}

.message-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  margin-bottom:.7rem;
}

.message .role {
  margin:0;
  font-size:.7rem;
  letter-spacing:.09em;
  font-weight:800;
  color:var(--blue-deep);
}

.copy-message {
  font-size:.68rem;
  padding:.28rem .55rem;
  background:transparent;
  border-color:transparent;
}

.copy-message:hover {
  border-color:var(--rule);
}

.message-content {
  font-size:.98rem;
  line-height:1.85;
  white-space:pre-wrap;
}

.message-content p {
  margin:.5rem 0 1rem;
}

.message-content h2,.message-content h3,.message-content h4 {
  line-height:1.5;
  margin:1.6rem 0 .7rem;
  font-size:1.22rem;
  letter-spacing:-.02em;
}

.message-content h3 {
  font-size:1.08rem;
}

.message-content h4 {
  font-size:1rem;
}

.message-content ul,.message-content ol {
  padding-left:1.35rem;
  margin:.7rem 0 1.15rem;
  white-space:normal;
}

.message-content li {
  padding-left:.2rem;
  margin:.4rem 0;
}

.message-content a {
  color:var(--blue);
  text-underline-offset:3px;
}

.message-content code {
  background:#eaf0ec;
  border-radius:4px;
  padding:.1rem .3rem;
  font:.85em ui-monospace,SFMono-Regular,monospace;
}

.message-content pre {
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  padding:1rem;
  border-radius:10px;
  background:#eaf0ec;
  font:.85rem/1.65 ui-monospace,SFMono-Regular,monospace;
}

.message-content blockquote {
  border-left:3px solid #a5bdb0;
  margin:.8rem 0;
  padding:.2rem 1rem;
  color:var(--muted);
}

.answer-table {
  max-width:100%;
  overflow-x:auto;
  margin:1rem 0;
  white-space:normal;
}

.answer-table table {
  width:100%;
  border-collapse:collapse;
  font-size:.86rem;
  min-width:26rem;
}

.answer-table th,.answer-table td {
  text-align:left;
  vertical-align:top;
  padding:.65rem .75rem;
  border-bottom:1px solid var(--rule);
  line-height:1.7;
}

.answer-table th {
  background:#eaf0ec;
  font-weight:650;
}

.receipt-details {
  margin-top:.8rem;
  font-size:.73rem;
  color:var(--muted);
}

.receipt-details summary {
  cursor:pointer;
}

.receipt {
  margin:.4rem 0;
  font-size:.73rem;
  overflow-wrap:anywhere;
}

.thinking {
  border:1px solid #c9ddd0;
  border-radius:14px;
  padding:1rem 1.15rem;
  background:#f0f6f2;
}

.thinking-heading {
  display:flex;
  gap:.6rem;
  align-items:center;
  font-size:.88rem;
}

.activity-dot {
  width:.55rem;
  height:.55rem;
  border-radius:50%;
  background:var(--blue);
  animation:pulse 1.8s ease-in-out infinite;
}

.thinking-heading strong {
  font-weight:650;
}

#thinking-time {
  margin-left:auto;
  color:var(--muted);
  font-size:.75rem;
  font-variant-numeric:tabular-nums;
}

.thinking p {
  margin:.55rem 0 0;
  color:var(--muted);
  font-size:.77rem;
  line-height:1.6;
}

.thinking-model {
  font-size:.73rem;
  color:var(--blue-deep);
  margin-top:.55rem;
}

.jump-latest {
  align-self:center;
  position:sticky;
  bottom:15rem;
  z-index:2;
  box-shadow:0 3px 15px #23332f10;
  background:var(--surface);
}

.composer {
  position:sticky;
  bottom:.75rem;
  border:1px solid #cdd9d1;
  border-radius:18px;
  padding:1rem 1.15rem;
  background:var(--surface);
  box-shadow:0 8px 28px #23332f0d;
  z-index:3;
}

.composer label {
  display:block;
  font-size:.69rem;
  font-weight:650;
  color:var(--muted);
  margin-bottom:.35rem;
}

.model-controls {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;
  align-items:end;
  gap:.65rem;
}

.model-controls select {
  width:100%;
  min-height:2.5rem;
  border:1px solid var(--rule);
  border-radius:9px;
  background:var(--surface);
  padding:.4rem .55rem;
  color:var(--ink);
  font-size:.84rem;
}

.model-controls button {
  height:2.5rem;
  padding:.4rem .7rem;
  font-size:.72rem;
}

.model-hint {
  font-size:.69rem;
  color:var(--muted);
  margin:.5rem 0 .25rem;
  line-height:1.5;
}

.model-feedback {
  display:flex;
  align-items:center;
  gap:.5rem;
  margin:.2rem 0 .65rem;
}

#model-status {
  margin:0;
  font-size:.7rem;
  color:var(--muted);
}

#reload-models {
  padding:.22rem .45rem;
  font-size:.7rem;
}

.composer textarea {
  display:block;
  width:100%;
  min-height:3.5rem;
  max-height:12rem;
  resize:vertical;
  border:0;
  outline:none;
  padding:.2rem 0;
  color:var(--ink);
  line-height:1.6;
  font-size:.95rem;
}

.composer textarea:focus-visible {
  outline:none;
  box-shadow:0 2px 0 var(--blue);
}

.composer-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.8rem;
  border-top:1px solid var(--rule);
  padding-top:.65rem;
}

#status {
  margin:0;
  color:var(--muted);
  font-size:.74rem;
  line-height:1.5;
}

#send {
  background:var(--blue);
  color:#fff;
  border-color:var(--blue);
  flex-shrink:0;
  min-width:6rem;
}

#send span[lang=en] {
  color:#d8ece4;
}

#send:hover {
  background:var(--blue-deep);
}

.keyboard-hint {
  margin:.5rem 0 0;
  color:var(--muted);
  font-size:.65rem;
  text-align:right;
}

@keyframes pulse {
  50% {
    opacity:.3;
    transform:scale(.8);
  }

}

@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation:none!important;
    scroll-behavior:auto!important;
    transition:none!important;
  }

}

@media(max-width:42rem) {
  .topbar {
    gap:.75rem;
    padding:.8rem 1rem;
    grid-template-columns:auto 1fr auto;
  }

  .eyebrow {
    font-size:.58rem;
  }

  h1 {
    font-size:1.1rem;
  }

  .session-actions {
    gap:.35rem;
  }

  .session-actions button {
    padding:.5rem .55rem;
    font-size:.7rem;
  }

  .session-actions span[lang=en] {
    display:none;
  }

  main {
    width:calc(100% - 1.25rem);
    margin:.85rem auto;
  }

  .contract {
    font-size:.72rem;
  }

  .trust-badge {
    font-size:.6rem;
  }

  .contract summary>span[lang=en] {
    display:none;
  }

  .empty {
    padding:1.4rem .5rem;
    min-height:15rem;
  }

  .empty p {
    font-size:1.3rem;
  }

  .example-prompts {
    gap:.4rem;
    margin-top:1rem;
  }

  .example-prompts button {
    padding:.55rem .65rem;
    font-size:.74rem;
  }

  .example-prompts button:last-child {
    display:none;
  }

  .message {
    padding:.9rem 1rem;
  }

  .message.assistant {
    padding:.55rem .2rem;
  }

  .message-content {
    font-size:.94rem;
    line-height:1.85;
  }

  .composer {
    bottom:max(.4rem,env(safe-area-inset-bottom));
    padding:.8rem .85rem;
    border-radius:15px;
  }

  .model-controls {
    gap:.45rem;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;
  }

  .model-controls select {
    font-size:.78rem;
    padding:.4rem;
    min-height:2.3rem;
  }

  .model-controls button {
    height:2.3rem;
    padding:.35rem .45rem;
    font-size:.65rem;
  }

  .model-hint span[lang=en],.keyboard-hint {
    display:none;
  }

  .model-hint {
    font-size:.66rem;
  }

  .model-feedback {
    margin-bottom:.5rem;
  }

  #status {
    font-size:.68rem;
  }

  #send {
    min-width:5.6rem;
    padding:.55rem .65rem;
  }

  .thinking {
    padding:.85rem;
  }

  .thinking-heading {
    font-size:.8rem;
  }

  .thinking p {
    font-size:.71rem;
  }

  .jump-latest {
    bottom:17rem;
  }

}

/* Private labels share the existing research asset group registry. */
.conversation-context { display:grid; gap:4px; margin-top:12px; min-width:0; }
.conversation-context strong { overflow-wrap:anywhere; }
.conversation-context small { color:var(--muted); }
.conversation-tools { display:flex; align-items:center; gap:12px; margin:12px 0; flex-wrap:wrap; }
.conversation-tools span { color:var(--muted); font-size:12px; }
.research-library { border:1px solid var(--rule); border-radius:18px; padding:18px; margin:16px 0; background:var(--paper); }
.library-controls { display:flex; align-items:end; gap:12px; flex-wrap:wrap; }
.library-controls label { display:grid; gap:5px; flex:1; min-width:120px; font-size:12px; }
.library-items { display:grid; gap:8px; }
.library-item { display:flex; align-items:center; gap:8px; min-width:0; }
.library-open { display:grid; gap:6px; text-align:left; flex:1; min-width:0; padding:12px; }
.library-open strong { overflow-wrap:anywhere; }
.library-open small { color:var(--muted); font-weight:400; }
.library-classify { flex:none; }
#library-status,#label-feedback,#saved-answer-feedback { font-size:13px; color:var(--muted); overflow-wrap:anywhere; }
.save-message { padding:5px 9px; font-size:12px; }
.research-dialog { width:min(600px,calc(100vw - 32px)); max-height:85dvh; overflow:auto; border:1px solid var(--rule); border-radius:20px; padding:24px; background:#fff; color:var(--ink); box-sizing:border-box; }
.research-dialog::backdrop { background:rgb(20 40 34 / 35%); backdrop-filter:blur(3px); }
.research-dialog header,.research-dialog footer { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.research-dialog h2 { margin:0; font-size:20px; }
.research-dialog label { display:grid; gap:8px; margin:18px 0; font-size:13px; }
.research-dialog input { border:1px solid var(--rule); border-radius:10px; padding:12px; width:100%; box-sizing:border-box; font:inherit; color:inherit; }
.create-label { display:flex; align-items:end; gap:10px; }
.create-label label { flex:1; min-width:0; margin:8px 0; }
.create-label button { margin-bottom:8px; }
.saved-answer-dialog { width:min(850px,calc(100vw - 32px)); }
#saved-answer-question { color:var(--muted); white-space:pre-wrap; }
@media(max-width:600px) {
  .topbar { grid-template-columns:auto 1fr; }
  .session-actions { grid-column:1 / -1; width:100%; justify-content:flex-start; }
  .session-actions button { flex:1; padding:7px; font-size:11px; }
  .message-header { flex-wrap:wrap; }
  .research-library { padding:12px; }
  .research-dialog { padding:18px; }
  .research-dialog footer button { flex:1; }
}

@media (max-width: 42rem) {
  .session-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .session-actions button { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
}