body.chatpage{background:var(--bg)}
body.chatpage main.start{max-width:40rem;margin:2rem auto;padding:0 1.1rem}
.top{display:flex;align-items:center;gap:1rem;padding:.7rem 1.1rem;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:2}
.top .brand{font-weight:700}.top .test{font-size:.85rem;color:#7a3b00;background:#fff3e0;border:1px solid #f0c27a;border-radius:999px;padding:.2rem .7rem}
.top .newchat{margin-left:auto}.top .newchat button{padding:.45rem .9rem;min-height:2.4rem;font-size:.9rem}
.layout{display:grid;grid-template-columns:1fr;gap:1rem;max-width:72rem;margin:0 auto;padding:1rem 1.1rem 3rem}
@media(min-width:900px){.layout{grid-template-columns:minmax(0,1fr) 24rem;align-items:start}.side{position:sticky;top:4.2rem}}
.chat{background:#fff;border:1px solid var(--line);border-radius:1rem;padding:1rem;display:flex;flex-direction:column;min-height:60vh}
.messages{flex:1;display:flex;flex-direction:column;gap:.6rem;overflow:auto;max-height:65vh;padding:.2rem}
.msg{display:flex}.msg.client{justify-content:flex-end}.bubble{max-width:85%;padding:.7rem .9rem;border-radius:1rem;line-height:1.45;font-size:1rem}
.msg.assistant .bubble{background:#f1f3ef;border-bottom-left-radius:.3rem}.msg.client .bubble{background:var(--accent);color:#fff;border-bottom-right-radius:.3rem}
.msg.error .bubble{background:#fff2f2;border:1px solid #e7b4b4;color:var(--bad)}
.quick{display:flex;flex-wrap:wrap;gap:.45rem;margin:.2rem 0 .4rem}.quick button{font-size:.92rem;padding:.45rem .8rem;min-height:2.4rem;background:#fff;color:var(--accent);border:1.5px solid var(--accent);border-radius:999px}
.cards{margin:.3rem 0 .6rem}.cards .dcard{text-align:left;cursor:pointer;min-height:auto;font-weight:500;color:var(--text);border-color:var(--line)}
.composer{display:grid;grid-template-columns:1fr auto;gap:.6rem;margin-top:.8rem}.composer textarea{min-height:3.2rem;resize:vertical}
.composer button{align-self:end}.typing{color:var(--muted);font-size:.9rem;padding:.3rem .2rem}
.flash{padding:.6rem .8rem;border-radius:.6rem;background:#eef6f2;border:1px solid #cfe3d8;margin:0 0 .6rem}.flash.warn{background:#fff6ec;border-color:#f0c27a}
.panel{background:#fff;border:1px solid var(--line);border-radius:1rem;padding:.2rem .9rem .9rem}
.panel summary{cursor:pointer;font-weight:700;padding:.7rem 0;list-style:none;display:flex;justify-content:space-between}
.panel summary::after{content:"▾";color:var(--muted)}.panel[open] summary::after{content:"▴"}
.future h3{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:1rem 0 .25rem}
.future p,.future li{margin:.15rem 0;font-size:.95rem}.future ul{margin:.2rem 0;padding-left:1.1rem}
.future table.price{width:100%;border-collapse:collapse;font-size:.95rem}.future table.price td{padding:.3rem 0;border-bottom:1px solid var(--line);vertical-align:top}
.future td.num{text-align:right;white-space:nowrap;padding-left:.6rem}.future tr.total td{font-weight:700;border-bottom:0}
.future .warn{color:#7a3b00}.future .ok{color:var(--accent);font-weight:600}.future .mini{height:5.5rem}
.future form{margin:.6rem 0 0}.future button{width:100%}
@media(max-width:899px){.panel summary{position:sticky;top:3.4rem;background:#fff;z-index:1}}
@media(max-width:899px){
  .top{flex-wrap:wrap;gap:.4rem .7rem;padding:.55rem .8rem}.top .brand{font-size:.95rem}.top .test{font-size:.72rem;padding:.15rem .55rem}
  .top .newchat{margin-left:auto}.top .newchat button{padding:.3rem .6rem;min-height:2rem;font-size:.8rem;border-width:1.5px}
  .layout{padding:.6rem .6rem 2rem;gap:.6rem}.side{order:-1}.panel{padding:.1rem .7rem .7rem}.panel summary{top:0;padding:.55rem 0}
  .chat{min-height:0;padding:.7rem}.messages{max-height:55vh}.bubble{max-width:92%;font-size:.97rem}
  .composer{grid-template-columns:1fr}.composer textarea{min-height:2.8rem}.composer button{width:100%}
}
