/* === Reset === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden;-webkit-tap-highlight-color:transparent;background:var(--bg)}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue",system-ui,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;max-width:430px;margin:0 auto;height:100dvh;overflow:hidden}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* === Design Tokens ===
 * 公共 --brand-*/--ink-*/--primary/--surface/--bg/--text/--radius/--safe-* 由 /common/tokens.css 提供
 * 本文件仅保留 chat 特有变量 */
:root {
  --primary-mid: var(--brand-500);
  --line: var(--ink-100);
  --radius: 10px;          /* chat 气泡专用，比全局 radius-md 小一档 */
  --radius-sm: 6px;
  --title-font: 17px;
  --bubble-font: 15px;
  --desc-font: 12px;
  --green-700: #2F6F47;
  --green-100: #E2F0E7;
  --amber-700: #A26B14;
  --amber-100: #FAEDD0;
  --red-700:   #B23A3A;
  --red-100:   #FADCDC;
  --shadow-xs: 0 1px 0 rgba(17,20,24,0.04);
  --shadow-sm: 0 1px 2px rgba(17,20,24,0.06), 0 0 0 1px rgba(17,20,24,0.04);
  --shadow-md: 0 4px 16px rgba(17,20,24,0.06), 0 1px 3px rgba(17,20,24,0.04);
  --shadow-pop: 0 10px 30px -10px rgba(17,20,24,0.18);
  --glow-purple: rgba(122,108,153,0.16);
  --green-50:  #EEF6F1;
  --green-300: #B1D3BB;
  --green-400: #6DAF82;
  --green-500: #4E8B6E;
  --green-600: #3B6D52;
}

/* === Dark（保留 chat 原深紫暗色，微调对齐 token）=== */
@media(prefers-color-scheme:dark){
:root{--primary-mid:var(--brand-500);--line:var(--ink-100);--shadow-xs:0 1px 2px rgba(0,0,0,.25);--shadow-sm:0 1px 2px rgba(0,0,0,.3),0 0 0 1px rgba(0,0,0,.2);--shadow-md:0 4px 16px rgba(0,0,0,.35),0 1px 3px rgba(0,0,0,.25);--shadow-pop:0 10px 30px -10px rgba(0,0,0,.45);--glow-purple:rgba(168,156,196,.16);--green-50:#1A2E0A;--green-100:#1A2E0A;--green-300:#366A2A;--green-400:#5BA844;--green-500:#85D06A;--green-600:#A1DE87}
}

/* === Skip Link === */
.skip-link{position:absolute;top:-100px;left:0;background:var(--primary);color:#fff;padding:12px 20px;border-radius:0 0 var(--radius) 0;font-weight:600;text-decoration:none;z-index:9999;transition:top 120ms}
.skip-link:focus{top:0;outline:3px solid var(--primary);outline-offset:2px}

/* === Visually Hidden === */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* === Error Banner === */
.err{flex-shrink:0;font-size:var(--text-base);padding:10px 32px 10px 16px;text-align:center;display:none;align-items:center;justify-content:center;gap:6px;animation:erIn .25s;position:relative}
.err.show{display:flex}
.err.e{background:#FCEBEB;color:#A32D2D}
.err svg{width:16px;height:16px;flex-shrink:0}
.err-close{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:none;border-radius:50%;background:transparent;color:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:var(--text-base);opacity:.5;transition:opacity 120ms}
.err-close:active{opacity:1}
@keyframes erIn{from{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}

/* === 公告栏（后台可配置，常驻不可关闭）=== */
.announcement-bar{flex-shrink:0;width:100%;max-width:400px;margin:0;padding:9px 12px;background:var(--brand-50);border:0.5px solid var(--brand-200);border-radius:10px;font-size:var(--text-base);line-height:1.45;box-shadow:0 1px 2px rgba(0,0,0,.03);animation:annIn .35s cubic-bezier(.16,1,.3,1)}
.ann-body{min-width:0}
.ann-item{display:flex;align-items:flex-start;gap:6px;padding:1px 0}
.ann-item + .ann-item{margin-top:3px;border-top:0.5px solid var(--brand-200);padding-top:4px}
a.ann-item{color:inherit;text-decoration:none}
a.ann-item:active{background:var(--brand-100);border-radius:var(--radius-sm)}
.ann-clickable{cursor:pointer}
.ann-dot{flex-shrink:0;width:5px;height:5px;border-radius:50%;background:var(--text4);margin-top:5px}
.ann-text{min-width:0;flex:1}
.ann-title{font-weight:600;color:var(--text2)}
.ann-desc{color:var(--text3);font-size:var(--text-sm);margin-top:1px;word-break:break-word}
@keyframes annIn{from{transform:translateY(-8px);opacity:0}to{transform:translateY(0);opacity:1}}
@media(prefers-color-scheme:dark){
.announcement-bar{background:rgba(45,37,71,.7);border-color:rgba(124,111,175,.25);box-shadow:none}
.ann-title{color:var(--text2)}
.ann-desc{color:var(--text3)}
a.ann-item:active{background:rgba(124,111,175,.18);border-radius:var(--radius-sm)}
.ann-dot{background:var(--text4)}
.ann-item + .ann-item{border-color:rgba(124,111,175,.2)}
}

/* === Chat Area === */
.chat{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;padding:0 16px}
.chat::-webkit-scrollbar{width:2px}
.chat::-webkit-scrollbar-thumb{background:var(--text3);border-radius:1px}

/* === Welcome Page === */
.welcome{display:flex;flex-direction:column;align-items:center;justify-content:safe center;padding:max(20px,3vh) 24px max(14px,2vh);gap:max(14px,2.5vh);min-height:100%;animation:welcomeIn .5s cubic-bezier(.16,1,.3,1)}
@media(max-height:680px){.welcome{gap:10px;padding:12px 20px 8px}}
@keyframes welcomeIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

.hero{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0}
.hero-bg{position:absolute;top:-10px;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,var(--glow-purple) 0%,transparent 70%);pointer-events:none;z-index:-1}
.hero-bg::after{content:'';position:absolute;top:30px;left:50%;transform:translateX(-50%);width:260px;height:260px;border-radius:50%;background:radial-gradient(ellipse 120% 80% at 50% 0%,rgba(107,94,138,.04) 0%,transparent 60%);pointer-events:none}
.hero-img{position:relative;width:auto;max-width:120px;max-height:min(140px,18vh);object-fit:contain;margin-bottom:max(14px,1.5vh);animation:heroPop .6s cubic-bezier(.16,1,.3,1) .1s both}
@keyframes heroPop{from{opacity:0;transform:scale(.88) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}
.hero-title{position:relative;font-size:var(--text-xl);font-weight:600;color:var(--text);letter-spacing:0;margin-bottom:0;animation:fadeUp .5s cubic-bezier(.16,1,.3,1) .25s both}
.hero-subtitle{position:relative;font-size:var(--text-base);color:var(--text3);margin-bottom:6px;animation:fadeUp .5s cubic-bezier(.16,1,.3,1) 120ms both}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* === Quick Chips === */

/* === Cards === */
.guide-card,.pollen-card{display:flex;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;width:100%;max-width:400px}
.guide-card{gap:14px;margin-top:12px;animation:fadeUp .5s cubic-bezier(.16,1,.3,1) .25s both}
.pollen-card{gap:14px;text-decoration:none;padding:16px;background:linear-gradient(135deg,#F2F7F0 0%,#F8FBF7 100%);border:0.5px solid rgba(47,111,71,.12);border-radius:var(--radius);color:inherit;transition:border-color 150ms,background 150ms;cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative;overflow:hidden;animation:fadeUp .5s cubic-bezier(.16,1,.3,1) .38s both}
.pollen-card::before{content:'';position:absolute;top:-18px;right:-18px;width:72px;height:72px;background:var(--green-50);border-radius:50%;opacity:.8}
.pollen-card:active{border-color:var(--green-300);background:#EDF4EA}
.guide-icon{flex-shrink:0;width:40px;height:40px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center}
.guide-icon{background:#EEF6F1;color:#4E8B6E}
.pollen-icon{flex:none;width:42px;height:42px;border-radius:var(--radius-md);background:var(--green-100);color:var(--green-600);display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.pollen-icon svg{display:block;width:21px;height:21px}
.guide-icon svg{width:22px;height:22px}
.guice-content{flex:1;min-width:0}
.guide-title{font-size:var(--text-base);font-weight:600;color:var(--text);margin-bottom:3px}
.guide-desc{font-size:var(--text-sm);color:var(--text3);line-height:1.6}
/* 花粉数据卡片 */
.pollen-body{flex:1;min-width:0;position:relative;z-index:1}
.pollen-label{font-size:var(--text-xs);color:var(--green-600);font-weight:600;letter-spacing:.4px;margin-bottom:4px}
.pollen-city{display:flex;align-items:center;gap:5px;font-size:var(--text-base);font-weight:700;color:var(--text);margin-bottom:3px}
.pollen-city svg{flex:none;color:var(--green-500)}
.pollen-hint{font-size:var(--text-xs);color:var(--text4);letter-spacing:.3px}
.pollen-level{flex:none;font-size:var(--text-base);font-weight:700;padding:6px 14px;border-radius:var(--radius-full);position:relative;z-index:1}
.pollen-level.low{color:#2F6F47;background:#E2F0E7}
.pollen-level.mid{color:#B87806;background:#FFF3D6}
.pollen-level.high{color:#C53030;background:#FDE8E8}
.pollen-arrow{flex:none;color:var(--text4);display:flex;align-items:center;position:relative;z-index:1}
.pollen-card:active .pollen-arrow{color:var(--green-500)}

/* === History Button === */
.history-btn{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px auto 0;padding:10px 20px;background:rgba(139,126,200,.08);border:1px solid rgba(139,126,200,.16);border-radius:var(--radius-full);color:var(--primary);font-size:var(--text-base);font-weight:600;cursor:pointer;transition:all 120ms;animation:fadeUp .5s cubic-bezier(.16,1,.3,1) .52s both;-webkit-tap-highlight-color:transparent}
.history-btn:active{background:var(--primary-light);border-color:var(--primary-mid);transform:scale(.98)}
.history-icon{display:flex;align-items:center;color:var(--primary);transition:transform 120ms}
.history-btn:active .history-icon{transform:rotate(-20deg)}

/* === Note === */

/* === Message Bubbles === */
.msg{display:flex;margin-bottom:16px;align-items:flex-start}
.msg.u{justify-content:flex-end}
.msg.a{justify-content:flex-start}
.msg.s{justify-content:center}
.msg.u+.msg.u,.msg.a+.msg.a{margin-top:-4px}
.msg.u.msg-anim{animation:upUser .25s cubic-bezier(.16,1,.3,1)}
.msg.a.msg-anim{animation:upAi .4s cubic-bezier(.16,1,.3,1)}
@keyframes upUser{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes upAi{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes bubbleBounce{0%{transform:scale(1)}30%{transform:scale(1.06)}60%{transform:scale(.97)}100%{transform:scale(1)}}
.bubble-bounce{animation:bubbleBounce .28s ease}
.msg-date-sep{text-align:center;font-size:var(--text-xs);color:var(--text4);padding:14px 0;margin:0;letter-spacing:.5px}
.msg-consec .avatar.a,.msg-consec .avatar.u{opacity:0;width:0;margin:0;overflow:hidden}
.msg-consec .bubble{border-radius:var(--radius)}
.msg.u.msg-consec .bubble{border-top-right-radius:6px}
.msg.a.msg-consec .bubble{border-top-left-radius:6px}
.avatar{width:34px;height:34px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:600;margin-top:2px}
.avatar.a{background:var(--primary-gradient);color:#fff;margin-right:10px;box-shadow:0 2px 6px rgba(92,82,120,.18)}
.input-empty .input-box{position:relative;overflow:hidden}
.input-empty .input-box::after{content:'';position:absolute;top:0;left:-100%;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(139,126,200,.04),transparent)}
.avatar.u{background:var(--line);color:var(--text3);margin-left:10px;order:1}
.avatar svg{width:16px;height:16px}
.avatar img{width:100%;height:100%;object-fit:contain;border-radius:50%}
.msg-body{display:flex;flex-direction:column;max-width:76%;min-width:0}
.msg.a .msg-body{align-items:flex-start}
.msg.u .msg-body{align-items:flex-end}
.bubble{width:fit-content;max-width:100%;padding:12px 15px;border-radius:var(--radius);font-size:var(--text-md);line-height:1.65;word-break:break-word;white-space:normal;position:relative}
.msg.u .bubble{background:var(--primary-gradient);color:#fff;border-bottom-right-radius:6px;box-shadow:var(--shadow-md)}
.msg.a .bubble{background:var(--surface);color:var(--text);border-bottom-left-radius:6px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.bubble-warm{animation:bubbleWarmGlow 2.5s ease-out forwards}
@keyframes bubbleWarmGlow{from{background:#FFF8F0;box-shadow:0 2px 20px rgba(139,126,200,.15),0 0 0 1px rgba(139,126,200,.08)}to{background:var(--surface);box-shadow:var(--shadow-sm)}}
.particle{position:fixed;pointer-events:none;z-index:99;font-size:var(--text-base);opacity:0;animation:particleFloat 1s ease-out forwards}
@keyframes particleFloat{0%{opacity:.6;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-60px) scale(.3)}}
/* 欢迎撒花 */
.confetti{position:fixed;pointer-events:none;z-index:98;opacity:0;animation:confettiFall 2.5s cubic-bezier(.16,1,.3,1) forwards}
@keyframes confettiFall{0%{opacity:.55;transform:translateY(-30px) rotate(0deg) scale(1)}70%{opacity:.3}100%{opacity:0;transform:translateY(85vh) rotate(540deg) scale(.4)}}
/* 头像互动 */
.hero-quote-wrap{position:relative;display:flex;flex-direction:column;align-items:center}
.hero-quote{position:absolute;top:-42px;left:50%;transform:translateX(-50%);background:var(--surface);color:var(--text2);font-size:var(--text-sm);padding:5px 12px;border-radius:var(--radius-full);box-shadow:var(--shadow-md);white-space:nowrap;pointer-events:none;opacity:0;transition:all 120ms cubic-bezier(.16,1,.3,1);border:1px solid var(--line);z-index:2}
.hero-quote.show{opacity:1;top:-50px}
.hero-quote::after{content:'';position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid var(--surface)}
/* 节日气泡 */
.festival-bubble{position:absolute;left:calc(100% + 8px);top:4px;background:#FFF8F0;color:#C0772E;font-size:var(--text-sm);padding:6px 12px;border-radius:var(--radius-lg);border:1px solid rgba(192,119,46,.18);white-space:nowrap;pointer-events:none;opacity:0;transform:scale(.6);transition:all .4s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 8px rgba(192,119,46,.1);z-index:3}
.festival-bubble.show{opacity:1;transform:scale(1)}
.festival-bubble::before{content:'';position:absolute;left:-6px;top:50%;transform:translateY(-50%);width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:6px solid rgba(192,119,46,.18)}
.festival-bubble::after{content:'';position:absolute;left:-4px;top:50%;transform:translateY(-50%);width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #FFF8F0}
@media(max-width:380px){.festival-bubble{left:50%;top:-36px;transform:translateX(-50%) scale(.6)}.festival-bubble.show{transform:translateX(-50%) scale(1)}.festival-bubble::before,.festival-bubble::after{left:50%;top:auto;bottom:-6px;transform:translateX(-50%);border:none}.festival-bubble::before{border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid rgba(192,119,46,.18)}.festival-bubble::after{bottom:-4px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid #FFF8F0}}
.msg.s .bubble{background:transparent;color:var(--text3);font-size:var(--text-sm);max-width:90%;padding:6px 12px}
.ts{font-size:var(--text-xs);color:var(--text4);margin-top:4px;line-height:1;padding:0 4px}
.msg.a .ts{text-align:left}
.msg.u .ts{color:rgba(255,255,255,.5);text-align:right}
.msg.u+.msg.u .ts,.msg.a+.msg.a .ts{display:none}

.btn-copy{position:absolute;top:4px;right:4px;width:26px;height:26px;border:none;border-radius:var(--radius-sm);background:var(--bg);color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 120ms;-webkit-tap-highlight-color:transparent;opacity:.25}
.msg.a:active .btn-copy,.btn-copy:active{opacity:.85;background:var(--primary-light);color:var(--primary)}

.bubble-content.collapsed{max-height:240px;overflow:hidden;position:relative}
.bubble-content.collapsed::after{content:'';position:absolute;left:0;right:0;bottom:0;height:48px;background:linear-gradient(transparent,var(--surface));pointer-events:none}
.btn-expand{display:block;width:100%;margin-top:8px;padding:6px 0;border:none;background:transparent;color:var(--primary);font-size:var(--text-sm);font-weight:500;text-align:center;cursor:pointer;border-top:1px dashed var(--line)}
.btn-expand:active{color:var(--text2)}

/* === Rich Message Content === */
.bubble-content p{margin:0}
.bubble-content h1,.bubble-content h2,.bubble-content h3,.bubble-content h4,.bubble-content h5,.bubble-content h6{margin:8px 0 4px;font-size:var(--text-md);font-weight:600}
.bubble-content ul,.bubble-content ol{margin:8px 0 8px 18px;padding:0}
.bubble-content li{margin:4px 0}
.bubble-content ul{list-style:none}
.bubble-content ul li{position:relative;padding-left:14px}
.bubble-content ul li::before{content:'';position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--primary)}
.bubble-content ol{counter-reset:item;list-style:none}
.bubble-content ol li{counter-increment:item;position:relative;padding-left:20px}
.bubble-content ol li::before{content:counter(item)'.';position:absolute;left:0;color:var(--primary);font-weight:600;font-size:var(--text-base)}
.bubble-content a{color:var(--primary);text-decoration:underline;text-underline-offset:2px}
.bubble-content a:active{opacity:.7}
.bubble-content blockquote{margin:8px 0;padding:8px 12px;border-left:3px solid var(--primary);background:var(--primary-light);border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--text2);font-size:var(--text-base)}
.bubble-content strong{color:var(--text);font-weight:600}
.bubble-content code{font-family:'SF Mono',Monaco,'Cascadia Code',monospace;font-size:var(--text-base);background:var(--primary-light);padding:2px 6px;border-radius:4px}
.bubble-content pre{background:var(--primary-light);border-radius:8px;padding:12px;overflow-x:auto;margin:8px 0;font-size:var(--text-base);line-height:1.6;white-space:pre-wrap}
.bubble-content pre code{background:none;padding:0;font-size:inherit}
.bubble-content table{width:100%;border-collapse:separate;border-spacing:0;margin:8px 0;font-size:var(--text-base);border-radius:8px;overflow:hidden;border:1px solid var(--line);display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
.bubble-content thead,.bubble-content tbody,.bubble-content tr{display:table;width:100%;table-layout:fixed}
.bubble-content th,.bubble-content td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bubble-content tr:last-child td{border-bottom:none}
.bubble-content tbody tr:nth-child(even){background:var(--primary-light)}
.bubble-content th{background:var(--primary-light);color:var(--text);font-weight:600;border-bottom:2px solid var(--line)}

.btn-retry{display:block;margin:8px auto 0;padding:6px 16px;border:1px solid var(--line);border-radius:var(--radius-full);background:var(--surface);color:var(--text2);font-size:var(--text-sm);cursor:pointer;transition:all 120ms;-webkit-tap-highlight-color:transparent}
.btn-retry:active{background:var(--primary-light);border-color:var(--primary-mid);color:var(--primary)}

/* === Thinking (Typing Indicator) === */
.think{display:flex;align-items:center;gap:8px;padding:8px 0}
.think-dots{display:inline-flex;gap:4px;align-items:center}
.think-dots span{width:8px;height:8px;border-radius:50%;background:var(--primary);display:inline-block;animation:dotRipple 1.4s infinite ease-in-out}
.think-dots span:nth-child(1){animation-delay:0s}
.think-dots span:nth-child(2){animation-delay:120ms}
.think-dots span:nth-child(3){animation-delay:.4s}
@keyframes dotRipple{0%,100%{opacity:.15;transform:scale(.6)}30%{opacity:1;transform:scale(1)}60%{opacity:.3;transform:scale(.8)}}
.think-text{font-size:var(--text-xs);color:var(--text4);margin-top:4px;animation:fadeUp 120ms cubic-bezier(.16,1,.3,1) .1s both}
.cursor{display:inline;animation:blink .8s ease-in-out infinite;color:var(--primary);opacity:.7;font-weight:300}
@keyframes blink{0%,100%{opacity:.7}50%{opacity:.3}}

/* === Toast === */
.toast{position:fixed;bottom:calc(80px + var(--safe-bottom));left:50%;transform:translateX(-50%);background:var(--text);color:#fff;padding:10px 22px;border-radius:10px;font-size:var(--text-base);font-weight:500;z-index:100;opacity:0;pointer-events:none;transition:opacity 120ms,transform 120ms;box-shadow:var(--shadow-md)}
.toast.show{opacity:1;transform:translateX(-50%) scale(1)}
.toast.hide{opacity:0;transform:translateX(-50%) translateY(10px) scale(.96)}

/* === Input Bar === */
.input-bar{flex-shrink:0;padding:10px 20px calc(10px + var(--safe-bottom));background:var(--surface);box-shadow:0 -1px 10px rgba(92,82,120,.05);display:flex;flex-direction:row;align-items:center;gap:8px}
.input-box{flex:1;display:flex;align-items:center;gap:4px;background:var(--bg);border-radius:var(--radius-xl);padding:3px 3px 3px 10px;transition:box-shadow 120ms,background 120ms,border-color 120ms;border:1px solid transparent}
.input-box:focus-within{background:var(--surface);border-color:var(--primary-mid);box-shadow:0 0 0 3px rgba(139,126,200,.1),0 0 12px rgba(139,126,200,.06)}
.input-box textarea{flex:1;border:none;background:transparent;font-size:var(--text-md);outline:none;font-family:inherit;color:var(--text);padding:6px 4px;min-width:0;resize:none;max-height:120px;line-height:1.4;overflow-y:auto}
.input-box textarea::placeholder{color:var(--text4)}
.btn-clear{width:28px;height:28px;border:none;border-radius:50%;background:transparent;color:var(--text4);cursor:pointer;display:none;align-items:center;justify-content:center;flex-shrink:0;transition:transform 120ms cubic-bezier(.16,1,.3,1),color 120ms,background 120ms}
.btn-clear.show{display:flex}
.btn-clear:active{background:var(--line);color:var(--text2)}
.btn-clear-spin{transform:rotate(90deg)!important}
.btn-send{width:34px;height:34px;border:none;border-radius:50%;background:var(--primary-gradient);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:opacity 120ms,transform 120ms cubic-bezier(.16,1,.3,1),box-shadow 120ms,background 120ms;opacity:.35;transform:scale(.86);pointer-events:none;flex-shrink:0;will-change:transform;position:relative}
.btn-send::after{content:'';position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--primary-mid);opacity:0;transition:opacity 120ms}
.btn-send.active{opacity:1;transform:scale(1);pointer-events:auto;box-shadow:0 2px 10px rgba(92,82,120,.25)}
.btn-send.active::after{opacity:1;animation:sendPulse 2s ease-in-out infinite}
@keyframes sendPulse{0%,100%{inset:-3px;opacity:.25}50%{inset:-6px;opacity:0}}
.btn-send:active{transform:scale(.88)!important;transition-duration:.05s!important}
.btn-send-sent{animation:sendSpring .35s cubic-bezier(.16,1,.3,1)!important}
@keyframes sendSpring{0%{transform:scale(.88)}40%{transform:scale(1.12)}70%{transform:scale(.95)}100%{transform:scale(1)}}
.btn-send .stop-icon{display:none}
.btn-send .send-icon{display:block}
.btn-send.stopping{background:#EF4444;box-shadow:0 2px 10px rgba(239,68,68,.25)}
.btn-send.stopping::after{border-color:rgba(255,255,255,.4);animation:none;opacity:0}
.btn-send.stopping::after{border-color:rgba(255,255,255,.4);animation:none;opacity:0}
.btn-send.stopping .send-icon{display:none}
.btn-send.stopping .stop-icon{display:block}

/* Disabled state */
.btn-send:disabled{opacity:.3;pointer-events:none}
.btn-send.stopping:disabled{opacity:1;pointer-events:auto}
input:disabled{opacity:.6}

/* === Scroll to Bottom === */
.scroll-bottom{position:fixed;right:16px;bottom:calc(80px + var(--safe-bottom));width:36px;height:36px;border:none;border-radius:50%;background:var(--surface);color:var(--text2);box-shadow:var(--shadow-md);border:1px solid var(--line);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 120ms;z-index:50;-webkit-tap-highlight-color:transparent;opacity:0;transform:translateY(10px);pointer-events:none}
.scroll-bottom.show{opacity:1;transform:translateY(0);pointer-events:auto}
.scroll-bottom:active{background:var(--primary-light);color:var(--primary);transform:scale(.94)}

/* === Footer === */
.footer{flex-shrink:0;text-align:center;padding:8px 16px 10px;font-size:var(--text-xs);background:var(--surface);line-height:1.6;border-top:1px solid var(--line)}
.footer .disclaimer{margin-bottom:4px;color:var(--text3);font-size:var(--text-xs);text-align:center;line-height:1.5}
.footer .disclaimer strong{font-weight:600;color:var(--text2)}
.footer-mini{padding:4px 16px 6px!important}
.footer-mini .disclaimer{font-size:var(--text-xs)!important;line-height:1.3!important}
.footer a{display:inline-flex;align-items:center;gap:4px;color:var(--text4);text-decoration:none}
.footer a:active{color:var(--primary)}
.footer a img{width:12px;height:12px}
.fb{font-weight:500;color:var(--text2)}
.ft{color:var(--text4)}

/* === Accessibility & Senior-Friendly Panel === */
.a11y-btn{flex-shrink:0;width:20px;height:20px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;margin-right:4px;border-radius:4px;transition:all 120ms;overflow:hidden}
.a11y-btn:hover{background:var(--primary-light)}
.a11y-btn:active{transform:scale(.9)}
.a11y-btn[aria-expanded="true"]{background:var(--primary-light)}
.a11y-icon{width:100%;height:100%;object-fit:contain}
.a11y-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:80;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.a11y-panel{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-radius:var(--radius) var(--radius) 0 0;padding:20px 20px calc(20px + var(--safe-bottom));z-index:90;transform:translateY(100%);transition:transform 120ms cubic-bezier(.16,1,.3,1);max-height:70vh;overflow-y:auto}
.a11y-panel:not([hidden]){transform:translateY(0)}
.a11y-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.a11y-header h2{font-size:var(--text-lg);font-weight:700;color:var(--text);margin:0}
.a11y-close{width:36px;height:36px;border-radius:50%;border:none;background:var(--bg);color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.a11y-close:active{background:var(--line)}
.a11y-section{margin-bottom:20px}
.a11y-section:last-child{margin-bottom:0}
.a11y-section h3{font-size:var(--text-base);font-weight:600;color:var(--text2);margin-bottom:10px}
.a11y-options{display:flex;flex-wrap:wrap;gap:10px}
.a11y-option{min-width:90px;padding:12px 16px;border:2px solid var(--line);border-radius:var(--radius);background:var(--bg);color:var(--text);font-size:var(--text-base);font-weight:500;cursor:pointer;text-align:center;transition:all 120ms}
.a11y-option:hover{border-color:var(--primary-mid)}
.a11y-option:active{transform:scale(.98)}
.a11y-option[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:#fff}
.a11y-option:focus{outline:3px solid var(--primary);outline-offset:2px}
.option-icon{margin-right:6px}

/* === Font & Line Spacing Modes === */
body.font-large,body.font-xlarge{--bubble-font:17px;--title-font:21px;--desc-font:14px}
body.font-large .bubble,body.font-xlarge .bubble{font-size:var(--bubble-font,17px);line-height:1.8}
body.font-large .hero-title,body.font-xlarge .hero-title{font-size:var(--title-font,21px)}
body.font-large .guide-desc,body.font-xlarge .guide-desc{font-size:var(--desc-font,14px)}
body.font-large .input-box,body.font-xlarge .input-box{padding:6px 6px 6px 14px;min-height:48px}
body.font-large .input-box textarea,body.font-xlarge .input-box textarea{font-size:var(--text-lg);padding:6px 4px}
body.font-large .btn-clear,body.font-xlarge .btn-clear{width:36px;height:36px}
body.font-large .btn-send,body.font-xlarge .btn-send{width:40px;height:40px;min-width:40px}

body.line-spacing-loose .bubble{line-height:2}
body.line-spacing-loose .chat{padding-top:16px}
body.line-spacing-xloose .bubble{line-height:2.4}
body.line-spacing-xloose .chat{padding-top:12px}

/* === High Contrast Mode === */
body.high-contrast{--primary:#6B5EB8;--primary-light:#E8E4F8;--primary-mid:#9588D8;--surface:#FFFFFF;--bg:#FFFFFF;--text:#000000;--text2:#333333;--text3:#555555;--text4:#777777;--line:#000000;--shadow-xs:0 1px 2px rgba(0,0,0,.15);--shadow-sm:0 1px 2px rgba(0,0,0,.15),0 0 0 1px rgba(0,0,0,.1);--shadow-md:0 4px 16px rgba(0,0,0,.2);--shadow-pop:0 10px 30px -10px rgba(0,0,0,.35)}
body.high-contrast .msg.u .bubble{background:#000;color:#fff}
body.high-contrast .msg.a .bubble{background:#fff;color:#000;border:2px solid #000}
body.high-contrast .input-bar{border-top:2px solid #000}
body.high-contrast .input-box{border:2px solid #000!important;background:#fff}
body.high-contrast .input-box textarea{color:#000}
body.high-contrast .input-box textarea::placeholder{color:#777}
body.high-contrast .btn-clear{color:#000}
body.high-contrast .a11y-btn{color:#000}
body.high-contrast .a11y-btn[aria-expanded="true"]{background:#000}
body.high-contrast .a11y-panel{border-top:2px solid #000}
body.high-contrast .a11y-option{border:2px solid #000;color:#000;background:#fff}
body.high-contrast .a11y-option[aria-pressed="true"]{background:#000;color:#fff;border-color:#000}
body.high-contrast .a11y-header{border-bottom:2px solid #000}
body.high-contrast .footer{border-top:2px solid #000}
body.high-contrast .disclaimer{color:#333}
body.high-contrast .guide-card{border:2px solid #000;background:#fff}
body.high-contrast .guide-desc{color:#333}
body.high-contrast .hero-title{color:#000}
body.high-contrast .skip-link:focus{background:#000;outline-color:#000}

/* === Eye Protection Mode === */
body.eye-protection{background:#F5E6D3}
body.eye-protection .chat{background:transparent}
body.eye-protection .bubble{background:rgba(255,248,240,.95)}
body.eye-protection .input-bar,.eye-protection .footer{background:#F0E0CC}
body.eye-protection .input-box{background:rgba(255,248,240,.95)}
body.eye-protection .a11y-panel{background:#F0E0CC}
body.eye-protection .a11y-option{background:rgba(255,248,240,.95)}
body.eye-protection .welcome .guide-card{background:rgba(255,248,240,.95)}

/* 小屏手机适配：进一步压缩垂直空间 */
@media(max-height:680px){
  .welcome{gap:6px;padding:8px 16px 4px}
  .hero-img{max-width:90px;max-height:min(110px,15vh);margin-bottom:4px}
  .hero-title{font-size:var(--text-lg)}
  .hero-subtitle{font-size:var(--text-sm);margin-bottom:4px}
  .pollen-card{padding:10px}
  .history-btn{margin-top:4px;padding:8px 14px;font-size:var(--text-sm)}
}
/* 聊天输入框上方：纯文字快捷跳转 */
/* 聊天输入框上方：纯文字快捷跳转（胶囊样式，重置链接默认蓝字/下划线） */
.quick-jumps{
  display:flex;
  gap:6px;
  padding:8px 10px 2px;
  flex-wrap:nowrap;
}
.quick-jump{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  flex:1 1 0;
  min-width:0;
  white-space:nowrap;
  font-size:var(--text-xs);
  font-weight:500;
  line-height:1;
  letter-spacing:-0.02em;
  color:var(--primary);
  text-decoration:none;
  padding:8px 2px;
  background:var(--brand-100);
  border:0.5px solid var(--brand-200);
  border-radius:var(--radius-full);
  -webkit-tap-highlight-color:transparent;
  cursor:pointer;
  transition:background 150ms,border-color 150ms,transform 120ms;
}
.quick-jump .qj-icon{
  display:flex;align-items:center;justify-content:center;
  color:var(--primary);opacity:.85;flex:none;
}
.quick-jump:link,
.quick-jump:visited,
.quick-jump:hover,
.quick-jump:active{
  color:var(--primary);
  text-decoration:none;
}
.quick-jump:hover{ background:var(--brand-200);border-color:var(--brand-300); }
.quick-jump:active{ transform:scale(0.95);background:var(--brand-200); }