:root{
  --bg:#EDEEE9;--surface:#FBFBF8;--ink:#2F312D;--mute:#696C64;--line:#D6D9D0;--line-soft:#E4E6DF;
  --sage:#66745F;--sage-deep:#505C4A;--sage-soft:#DFE4DA;--rose:#9C7C74;--rose-soft:#EFE4E0;
  --sand:#8F7B5E;--slate:#5F6B78;--slate-soft:#E1E5EA;--danger:#A4483C;
  --black:#1F201D;
  --r:12px;--r-sm:8px;
  --shadow:0 1px 2px rgba(40,42,36,.05),0 4px 16px rgba(40,42,36,.05);
  --pop-shadow:0 2px 4px rgba(40,42,36,.05),0 16px 40px -8px rgba(40,42,36,.18);
  --halo:0 0 0 1px rgba(95,107,120,.20),0 0 0 2px rgba(95,107,120,.08),0 0 12px 2px rgba(95,107,120,.20);
  --halo-err:0 0 0 1px rgba(164,72,60,.18),0 0 0 2px rgba(164,72,60,.07),0 0 12px 2px rgba(164,72,60,.18);
  --ease:cubic-bezier(.2,.7,.2,1);
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-move:cubic-bezier(.65,0,.35,1);
  --font:"Noto Sans TC",system-ui,sans-serif;
  --content:760px;
  --header-h:56px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%;margin:0}
body{
  background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow:hidden;
}
:focus-visible{outline:2px solid var(--sage);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.app{display:flex;flex-direction:column;height:100dvh;max-width:var(--content);margin:0 auto}
.main{flex:1;min-height:0;display:flex;flex-direction:column}

/* ===== A 頂部列 ===== */
.top{
  flex:none;height:var(--header-h);display:flex;align-items:center;gap:10px;
  padding:0 16px;border-bottom:1px solid var(--line);background:rgba(237,238,233,.92);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:5;
  min-width:0;
}
/* 標題可縮／省略；右側額度＋清除不可被擠壓 */
.top h1{
  margin:0;font-size:18px;font-weight:700;letter-spacing:.01em;
  flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.top-end{
  display:flex;align-items:center;gap:10px;
  flex:0 0 auto;flex-shrink:0;min-width:max-content;white-space:nowrap;
}
.quota{flex:0 0 auto;flex-shrink:0}
.l5inline{
  display:inline-flex;align-items:center;gap:4px;flex-wrap:nowrap;
  font-size:16px;color:var(--mute);white-space:nowrap;flex-shrink:0;
}
.quota-full,.quota-short{
  display:inline-flex;align-items:center;gap:4px;flex-wrap:nowrap;
  white-space:nowrap;flex-shrink:0;min-width:max-content;
}
.l5inline b{
  flex:none;flex-shrink:0;
  min-width:22px;height:22px;padding:0 7px;border-radius:7px;background:var(--sage-soft);color:#45523F;
  font-size:16px;display:inline-grid;place-items:center;font-variant-numeric:tabular-nums;line-height:1;
  white-space:nowrap;
}
.l5inline.is-loading b{background:#E8E9E3;color:#A9ACA3}
.quota-reset{color:var(--mute);font-size:16px;font-weight:400;white-space:nowrap;flex-shrink:0}
.quota-full{display:none}
.quota-short{display:inline-flex}

/* B5 清除畫面 */
.btn{font:inherit;font-size:16px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;cursor:pointer;border:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent;position:relative;white-space:nowrap;transition:background-color .18s var(--ease),color .18s,box-shadow .2s var(--ease),transform .12s var(--ease),border-color .18s}
.btn:disabled{cursor:not-allowed}
.b5{background:none;color:var(--ink);padding:0 4px;border-radius:4px;font-weight:500;min-height:44px;flex-shrink:0;white-space:nowrap}
.b5::after{content:"";position:absolute;left:4px;right:4px;bottom:9px;height:1px;background:currentColor;transform:scaleX(.35);transform-origin:left;transition:transform .2s var(--ease)}
.b5:hover{color:var(--rose)}
.b5:hover::after{transform:scaleX(1)}
.b5:active{opacity:.7}
.b5:disabled{color:#AEB0A9}
.b5:disabled::after{transform:scaleX(0)}

/* B2 */
.b2{background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:8px;min-height:44px;padding:0 16px}
.b2:hover{background:#fff;border-color:#BFC3B8}
.b2:active{background:var(--sage-soft)}
.b2:focus-visible{outline:2px solid var(--slate);outline-offset:3px}
.b2:disabled{color:#A9ACA3;border-color:var(--line-soft);background:transparent}

/* B4 chips */
.b4{background:var(--slate-soft);color:#3E4955;border-radius:12px;font-weight:600;width:100%;min-height:48px;padding:0 16px;text-align:center;white-space:normal}
.b4:hover{background:#D3D9E0}
.b4:active{background:#C6CED7;transform:scale(.98)}
.b4:focus-visible{outline:2px solid var(--slate);outline-offset:3px}
.b4:disabled{background:#ECEEF0;color:#A7AEB6}

/* B1 圓形送出／停止 */
.b1-icon{
  width:44px;height:44px;min-height:44px;padding:0;border-radius:999px;
  background:var(--black);color:#fff;flex:none;
}
.b1-icon:hover{background:#3A3C37}
.b1-icon:active{transform:scale(.97)}
.b1-icon:focus-visible{outline:2px solid var(--black);outline-offset:3px}
.b1-icon:disabled{background:#C9CBC4;color:#F3F3EF}
.b1-icon .ico{width:18px;height:18px;display:block}
.b1-icon[data-mode="stop"] .ico-send{display:none}
.b1-icon[data-mode="send"] .ico-stop{display:none}

/* ===== B 對話區 ===== */
.log{
  flex:1;min-height:0;overflow:auto;padding:20px 16px 12px;
  -webkit-overflow-scrolling:touch;scroll-behavior:smooth;
}

/* E1 空狀態 */
.emp{width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:24px 8px 8px}
.emp svg.art{width:96px;height:96px;margin-bottom:10px}
.emp .lead{margin:0;font-size:16px;font-weight:500;color:var(--ink);max-width:22em}
.emp .disc{margin:4px 0 0;font-size:16px;color:var(--mute)}
.chips{display:grid;gap:10px;width:100%;max-width:420px;margin:18px auto 0;padding:0}

/* 問答 */
.turn{display:flex;flex-direction:column;gap:10px;margin-bottom:22px}
.q-bubble{
  align-self:flex-end;max-width:min(92%,520px);background:#E4E4E4;color:var(--ink);
  padding:12px 16px;border-radius:12px;font-size:16px;line-height:1.55;white-space:pre-wrap;word-break:break-word;
}
.a-block{align-self:stretch;width:100%}
.a-md{font-size:16px;line-height:1.7;word-break:break-word}
.a-md > :first-child{margin-top:0}
.a-md > :last-child{margin-bottom:0}
.a-md h1,.a-md h2,.a-md h3{font-size:1.1em;margin:1em 0 .4em;font-weight:700}
.a-md p{margin:.55em 0}
.a-md ul,.a-md ol{margin:.55em 0;padding-left:1.35em}
.a-md li{margin:.2em 0}
.a-md a{color:var(--sage-deep)}
.a-md code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:1em;background:#E8E9E3;padding:.1em .35em;border-radius:4px}
.a-md pre{overflow-x:auto;background:#F4F4F0;border:1px solid var(--line-soft);border-radius:10px;padding:12px 14px;margin:.7em 0}
.a-md pre code{background:none;padding:0}
.a-md table{border-collapse:collapse}
.a-md th,.a-md td{border:1px solid var(--line);padding:6px 10px}
.a-md blockquote{border-left:3px solid var(--line);padding-left:12px;color:var(--mute);margin:.7em 0}
.a-md strong{font-weight:700}
.cursor{
  display:inline-block;width:8px;height:1.05em;margin-left:2px;vertical-align:-2px;background:var(--black);
  animation:blink 1s step-end infinite;
}
@keyframes blink{50%{opacity:0}}
.stopped{color:var(--mute);font-size:16px;margin-top:6px}
.truncated{color:var(--mute);font-size:16px;margin-top:6px}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}

/* E3 骨架：三條灰線 */
.think{display:grid;gap:10px;padding:6px 0 4px;max-width:100%}
.sk{position:relative;overflow:hidden;background:#E3E5DE;border-radius:6px;height:14px}
.sk.w1{width:88%}.sk.w2{width:72%}.sk.w3{width:64%}
.sk::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0));transform:translateX(-100%);animation:shimmer 1.9s var(--ease-move) infinite}
@keyframes shimmer{to{transform:translateX(100%)}}
.think-hint{margin:8px 0 0;font-size:16px;color:var(--mute)}

/* 錯誤卡（N1 白卡細框） */
.err-card{
  margin-top:10px;background:#fff;border:1px solid var(--line-soft);border-radius:14px;
  box-shadow:var(--pop-shadow);
  padding:16px 18px;display:flex;flex-direction:column;align-items:flex-start;gap:12px;
}
.err-card p{margin:0;font-size:16px;font-weight:600;line-height:1.45}

/* ===== C 提問列 ===== */
.composer{
  flex:none;padding:10px 16px 0;background:var(--bg);
  padding-bottom:calc(8px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line-soft);
}
.input-wrap{
  position:relative;display:flex;align-items:flex-end;gap:8px;
  border:1px solid var(--line);border-radius:16px;background:#fff;padding:10px 10px 10px 14px;
  transition:border-color .2s,box-shadow .2s;
}
.input-wrap:hover{border-color:#BFC3B8}
.input-wrap:focus-within{border-color:var(--slate);box-shadow:var(--halo)}
.input-wrap.is-error{border-color:var(--danger);box-shadow:var(--halo-err)}
.input-wrap.is-error:focus-within{border-color:var(--danger);box-shadow:var(--halo-err)}
.input-wrap.is-disabled{opacity:.6;background:#F6F6F2}
#q{
  flex:1;min-width:0;border:0;outline:0;resize:none;background:transparent;
  font:inherit;font-size:16px;line-height:1.5;color:var(--ink);
  field-sizing:content;
  max-height:140px;overflow-y:auto;min-height:24px;padding:6px 0;
}
#q::placeholder{color:#74776F}
#q:disabled{cursor:not-allowed}
.meta-row{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:6px 4px 0;font-size:16px;color:var(--mute);min-height:22px;
}
.shortcut{display:none}
.counter{font-variant-numeric:tabular-nums}
.counter.is-warn{color:var(--danger);font-weight:600}
.counter-limit{margin-left:8px;color:var(--danger)}

/* D 免責（唯一允許 <16px） */
.foot-disc{margin:4px 0 0;padding:0 4px;font-size:13px;color:var(--mute);line-height:1.5}

/* N1 已複製 */
.toast-region{
  position:fixed;z-index:60;left:50%;top:max(16px,env(safe-area-inset-top));
  transform:translateX(-50%);width:min(320px,calc(100% - 32px));pointer-events:none;
}
.toast{
  background:#fff;border:1px solid var(--line-soft);border-radius:14px;
  box-shadow:var(--pop-shadow);
  padding:14px 16px;font-size:16px;font-weight:500;opacity:0;transform:translateY(-6px);
  transition:opacity .25s var(--ease-out),transform .25s var(--ease-out);
}
.toast.show{opacity:1;transform:none}

#turnstile-host{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

@media (min-width:768px){
  :root{--header-h:64px}
  .app{height:100vh}
  .top{padding:0 20px}
  .top h1{font-size:20px}
  .quota-full{display:inline-flex;flex-wrap:nowrap;white-space:nowrap;flex-shrink:0}
  .quota-short{display:none}
  .log{padding:28px 20px 16px}
  .chips{grid-template-columns:1fr 1fr;max-width:none}
  .composer{padding:12px 20px 0;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
  #q{max-height:220px}
  .shortcut{display:inline}
  .toast-region{left:auto;right:max(24px, calc(50% - var(--content)/2 + 24px));transform:none;top:max(24px, env(safe-area-inset-top))}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .sk::after{animation:none}
  .cursor{animation:none;opacity:1}
  .toast{transition:none}
  .b1-icon:active,.b4:active{transform:none}
}