/* Vasilier v015.0 — coherent chat room, stable mobile viewport, readable typography */
:root{
  --chat-width:1180px;
  --ui-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  --surface:rgba(25,32,47,.88);
  --surface-strong:#1a2232;
  font-family:var(--ui-font)
}
html,body{height:100%;height:100dvh;overscroll-behavior:none}
body{font-family:var(--ui-font);background:radial-gradient(circle at 78% 18%,#273149 0,#171e2d 42%,#0f1521 100%)}
button,input,textarea,select{font-family:var(--ui-font)}
main{height:100vh;height:100dvh;min-height:0;overflow:hidden;background:linear-gradient(145deg,rgba(24,31,46,.9),rgba(14,20,31,.8))}
.top{flex:0 0 62px;height:62px;border-bottom:1px solid rgba(231,237,248,.06);background:rgba(16,22,34,.34);backdrop-filter:blur(14px)}
.messages{
  flex:1 1 auto;min-height:0;align-self:center;width:min(var(--chat-width),calc(100% - 44px));
  overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;overflow-anchor:none;-webkit-overflow-scrolling:touch;
  padding:24px 4px 178px;scrollbar-width:thin;scrollbar-color:rgba(210,221,241,.22) transparent
}
.message{grid-template-columns:30px minmax(0,1fr);gap:12px;margin:0 0 22px;font-family:var(--ui-font);font-size:calc(16px * var(--chat-scale));line-height:1.58}
.avatar{width:28px;height:28px;font-family:var(--ui-font);font-size:10px;font-weight:700;background:rgba(255,255,255,.035)}
.message-stamp{margin-bottom:7px;font-size:calc(10px * var(--chat-scale));letter-spacing:.105em;color:#8f9bad}
.message.user .message-body{padding:5px 12px 3px 2px}
.message.user .content{font-family:var(--ui-font);font-size:calc(16px * var(--chat-scale));line-height:1.55;color:#f0f2f6}
.message.assistant .message-body{padding:15px 17px 14px;border:1px solid rgba(211,222,241,.12);border-radius:16px;background:linear-gradient(145deg,rgba(43,54,76,.68),rgba(28,37,54,.58));box-shadow:0 12px 34px rgba(0,0,0,.12)}
.message.assistant .content{font-family:var(--ui-font);font-size:calc(16px * var(--chat-scale));line-height:1.62;color:#ebedf3;white-space:pre-wrap}
.message.assistant.is-thinking .message-body{min-height:66px;border-color:rgba(129,202,227,.35);background:linear-gradient(145deg,rgba(42,65,84,.76),rgba(28,39,57,.62));box-shadow:none}
.content .md-h{font-family:var(--ui-font);font-weight:700;letter-spacing:-.015em}.content p{margin:.08em 0 .72em}.content .md-gap{height:.18em}
.ai-meta{font-size:calc(9px * var(--chat-scale));letter-spacing:.12em;color:#8693a7}
.message-tools{top:4px}.branch-create{font-family:var(--ui-font);font-size:9px;padding:6px 10px}
.day-separator{margin:10px 0 24px;font-size:9px;color:#7f8b9d}
.message-files{gap:8px;margin-top:12px;align-items:flex-start}
.file-chip{font-family:var(--ui-font);font-size:11px;border-radius:11px;background:rgba(255,255,255,.055)}
.file-chip.attached.image-file{width:132px;padding:5px;display:flex;flex-direction:column;gap:5px;overflow:hidden}
.file-chip.attached.image-file img{display:block;width:100%;height:94px;object-fit:cover;border-radius:8px;background:#0d1320}
.file-chip.attached.image-file span{padding:0 3px 2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#composer{bottom:38px;width:min(1100px,calc(100% - 36px));padding:9px 11px;border-radius:20px;background:rgba(22,29,43,.965);box-shadow:0 20px 60px rgba(0,0,0,.36)}
.composer-row{align-items:center;gap:6px}.engine-wrap{flex:0 0 auto}.attach-btn,.mic-btn{flex:0 0 auto;width:38px;height:38px;border-radius:11px}
textarea{min-width:0;font-size:15px;line-height:1.42;padding:9px 6px}#send{flex:0 0 auto;width:42px;height:42px;border-radius:13px}
.pending-attachments{max-height:122px;overflow:auto;padding:2px 2px 8px}
.file-chip.pending.image-pending{display:grid;grid-template-columns:38px minmax(0,1fr) auto auto;align-items:center;gap:7px;min-width:min(330px,100%)}
.file-chip.pending.image-pending img{width:38px;height:38px;border-radius:7px;object-fit:cover;background:#0d1320}.file-chip.pending.image-pending span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.message.is-queued .message-body{opacity:.76}.queue-state{display:inline-flex;margin-top:9px;padding:4px 8px;border:1px solid rgba(143,198,222,.22);border-radius:999px;background:rgba(90,158,187,.09);color:#9dc7da;font-size:9px;font-weight:750;letter-spacing:.11em}.message.is-queued .queue-state:before{content:"";width:5px;height:5px;margin:4px 6px 0 0;border-radius:50%;background:#87c9e6;box-shadow:0 0 8px rgba(135,201,230,.65)}
.foot{bottom:12px}.watermark-orb{opacity:.19!important}
.branch-messages{overflow-anchor:none;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
.branch-messages .message.assistant .content{font-family:var(--ui-font);font-size:calc(15.5px * var(--chat-scale))}
.branch-composer{display:block;padding:8px 9px}.branch-composer-row{display:flex;align-items:center;gap:6px}.branch-pending{padding:0 2px 7px}

@media(max-width:700px){
  aside{height:calc(66px + env(safe-area-inset-bottom));padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:rgba(9,13,21,.985)}
  .mark{width:44px;height:44px}.new{width:44px;height:44px;border-radius:14px}.nav button{font-size:10px;padding:9px 7px}.logout{height:44px}
  .drawer{height:calc(100dvh - 66px - env(safe-area-inset-bottom))}
  .top{flex-basis:54px;height:54px;padding:0 10px 0 14px}.top>span{font-size:9px;max-width:50vw}.jump-btn{font-size:8px}
  .messages{width:100%;padding:16px 14px calc(170px + env(safe-area-inset-bottom));scroll-padding-bottom:calc(160px + env(safe-area-inset-bottom))}
  .message{display:block;margin-bottom:18px;font-size:calc(15.5px * var(--chat-scale));line-height:1.55}.avatar{display:none}
  .message.user .message-body{padding:5px 5px 4px}.message.user .content{font-size:calc(15.5px * var(--chat-scale))}
  .message.assistant .message-body{padding:13px 14px 12px;border-radius:14px}.message.assistant .content{font-size:calc(15.5px * var(--chat-scale));line-height:1.58}
  .message-stamp{font-size:calc(9px * var(--chat-scale));margin-bottom:6px}.message-tools{margin-top:7px}.branch-create{padding:5px 9px}
  .day-separator{margin:7px 0 18px}.file-chip.attached.image-file{width:112px}.file-chip.attached.image-file img{height:80px}
  #composer{bottom:calc(74px + env(safe-area-inset-bottom));width:calc(100% - 16px);padding:7px 8px;border-radius:17px}.composer-row{gap:4px}
  .engine-wrap{padding-right:5px}.engine-wrap select{width:52px;font-size:8px}.engine-dot{display:none}
  .attach-btn,.mic-btn{width:35px;height:35px;border-radius:10px}.cloud-files-btn{font-size:15px!important}
  textarea{font-size:15px;padding:8px 4px}#send{width:40px;height:40px;border-radius:12px}
  .watermark-orb{width:68vw;right:-23%;top:45%;opacity:.13!important}
  .branch-panel{height:calc(100dvh - 66px - env(safe-area-inset-bottom));bottom:calc(66px + env(safe-area-inset-bottom))}
  .branch-messages{padding:16px 14px 112px}.branch-composer{bottom:10px;left:8px;right:8px}
}

/* v020.0.2: visible branch action on all stored root-chat messages */
.messages .message:not(.temporary) .message-tools{opacity:1;position:static;margin-top:7px;}
.messages .message:not(.temporary) .branch-create{font-size:10px;padding:6px 11px;}
/* Keep the release filename exact, including case. */
#buildInfo{text-transform:none;overflow-wrap:anywhere}
.content details{margin-top:14px;max-width:100%;overflow-wrap:anywhere}
.content details summary{cursor:pointer;font-weight:600}
.content details section{padding:12px 0;border-top:1px solid #8884}
/* Full provider names and a usable text field on phones. */
@media(max-width:700px){
 #composer .composer-row{display:grid;grid-template-columns:minmax(94px,1fr) 32px 32px 32px 40px;align-items:center;gap:4px}
 #composer .engine-wrap{grid-column:1;grid-row:1;min-width:0}
 #composer .engine-wrap select{width:100%;font-size:10px}
 #attachBtn{grid-column:2;grid-row:1}#cloudFilesBtn{grid-column:3;grid-row:1}#micBtn{grid-column:4;grid-row:1}#send{grid-column:5;grid-row:1}
 #composer #input{grid-column:1/-1;grid-row:2;width:100%;min-width:0;box-sizing:border-box}
 .branch-composer-row{display:grid;grid-template-columns:minmax(100px,1fr) 32px 32px 40px;align-items:center}
 #branchEngine{grid-column:1;grid-row:1;width:100%;max-width:145px}
 #branchAttachBtn{grid-column:2;grid-row:1}#branchMicBtn{grid-column:3;grid-row:1}
 .branch-composer-row>button[type=submit]{grid-column:4;grid-row:1}
 #branchInput{grid-column:1/-1;grid-row:2;width:100%;min-width:0;box-sizing:border-box}
 .foot{display:block;bottom:calc(70px + env(safe-area-inset-bottom));width:calc(100% - 12px);font-size:7px;letter-spacing:0;text-align:center;overflow-wrap:anywhere}
 #composer{bottom:calc(88px + env(safe-area-inset-bottom))}
}
.v-build{text-transform:none;overflow-wrap:anywhere}

/* v020.0.16: unobtrusive, keyboard-accessible answer details. */
.content > .answer-details{margin-top:12px;font-size:.85em;color:var(--muted,#607b8d)}
.content > .answer-details > summary{font-weight:400;cursor:pointer;width:fit-content}
.content > .answer-details > summary:focus-visible{outline:2px solid #278bb0;outline-offset:4px}
.answer-details-body{padding-top:8px}.answer-warning{margin-top:10px;font-size:.85em;color:#946522}

.saved-request-status{margin:14px 0;padding:12px 16px;border:1px solid #8da5b855;border-radius:12px;font-size:.85em;overflow-wrap:anywhere}
.saved-request-status p{margin:0 0 8px}.saved-request-status button{margin:10px 8px 0 0;padding:6px 10px;border:1px solid #8da5b866;border-radius:8px;cursor:pointer;color:inherit;background:transparent}
.saved-request-status details div{padding-top:8px}
