/* ── Reset & Root ── */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  color-scheme: light;
  --bg:#fbf9f5;--card:#ffffff;--border:#ece8df;--text:#1c1b18;--sub:#6a635a;--dim:#a8a299;
  --accent:#d4916a;--a-soft:#fdf6f1;--a-mid:#eecfba;--a-btn:#be7c57;
  --green:#6aaa88;--g-soft:#eef7f2;
  --r:10px;--r-lg:18px;
  --sh:0 1px 6px rgba(0,0,0,.05);--sh-md:0 4px 20px rgba(0,0,0,.08);
  --sans:'Noto Sans SC',-apple-system,sans-serif;
  --serif:'Source Serif 4','Noto Serif SC',Georgia,serif;
  --mono:'JetBrains Mono','SF Mono',ui-monospace,Menlo,monospace;
  --topbar:58px;
}

body{font-family:var(--sans);background:var(--bg);color:var(--text);font-size:14px;line-height:1.65}
button{cursor:pointer;font-family:inherit}
input,textarea{font-family:inherit}
svg{display:block;flex-shrink:0}

.ico{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ico-sm{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.mascot{font-family:'Segoe UI Emoji',system-ui,sans-serif;line-height:1.1;user-select:none;font-style:normal}
.mascot-xl{font-size:28px}.mascot-lg{font-size:20px}.mascot-sm{font-size:11px}

/* ── Pages ── */
.page{display:none;height:100vh;height:var(--vvh,100dvh);overflow:hidden}
.page.on{display:flex}
#p-login{align-items:center;justify-content:center;background:var(--bg)}

/* ── Sidebar ── */
.sb{width:240px;flex-shrink:0;background:var(--card);border-right:1px solid var(--border);height:100vh;display:flex;flex-direction:column}
.sb-logo{height:var(--topbar);padding:0 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-shrink:0}
.sb-mark{width:auto;height:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0;white-space:nowrap}
.sb-name{font-size:15px;font-weight:700;color:var(--text)}
.sb-tagline{font-size:11px;color:var(--dim);margin-top:1px}
.sb-nav{flex:1;padding:8px;overflow-y:auto}
.sb-sec{font-size:10px;color:var(--dim);padding:0 8px;margin:12px 0 4px;letter-spacing:.05em}
.sb-a{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--r);font-size:13px;color:var(--sub);transition:.15s;cursor:pointer}
.sb-a:hover{background:var(--bg);color:var(--text)}
.sb-a.on{background:transparent;color:var(--text)}
.sb-a.on::before{content:'';display:inline-block;width:3px;height:14px;background:var(--accent);border-radius:2px;margin-right:6px;margin-left:-9px;flex-shrink:0}
.sb-a .lbl{flex:1}
.sb-user{padding:12px 14px;border-top:1px solid var(--border);display:flex;align-items:center;gap:9px}
.sb-uname{font-size:13px;font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.sb-logout{background:none;border:none;color:var(--dim);width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:.15s;flex-shrink:0}
.sb-logout:hover{background:var(--bg);color:#e05555}
.sb-icp{text-align:center;padding:4px 0 8px;font-size:10px;color:var(--dim);opacity:.6}.sb-icp a{color:inherit;text-decoration:none}.sb-icp a:hover{color:var(--sub)}

/* ── Main area ── */
.main{flex:1;min-width:0;display:flex;flex-direction:column;height:100vh;overflow:hidden}
.ph{height:var(--topbar);padding:0 26px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;background:var(--card)}
.ph-t{font-size:17px;font-weight:700}.ph-s{font-size:12px;color:var(--sub);margin-top:2px}
.scroll{flex:1;overflow-y:auto}

/* ── Buttons & Inputs ── */
.btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 16px;border-radius:99px;font-size:13px;font-weight:500;border:none;transition:.15s}
.btn-p{background:var(--accent);color:#fff}.btn-p:hover{background:var(--a-btn)}
.btn-g{background:transparent;color:var(--sub);border:1.5px solid var(--border)}.btn-g:hover{color:var(--text);border-color:var(--dim)}
.inp{height:38px;background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r);padding:0 12px;font-size:13px;color:var(--text);outline:none;transition:.15s}
.inp:focus{border-color:var(--accent);background:#fff}

/* ── Toast ── */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#1c1b18;color:#fff;font-size:12px;padding:8px 18px;border-radius:99px;z-index:9999;opacity:0;transition:opacity .2s;pointer-events:none}
.toast.show{opacity:1}

/* ══════════ LOGIN ══════════ */
.login-box{display:flex;background:var(--card);border:1px solid var(--border);border-radius:22px;overflow:hidden;width:820px;box-shadow:var(--sh-md)}
.login-l{flex:1;background:#fdf8f4;border-right:1px solid var(--border);padding:44px 40px;display:flex;flex-direction:column;justify-content:space-between}
.login-l h1{font-size:36px;font-weight:700;line-height:1.3;margin-bottom:0}
.login-l h1 span{color:var(--accent)}
.login-l p{font-size:13px;color:var(--sub);line-height:1.8;margin-bottom:18px}
.login-feats{display:flex;flex-direction:column;gap:7px}
.login-feat{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--sub)}
.feat-ico{width:28px;height:28px;border-radius:7px;background:var(--a-soft);border:1px solid var(--a-mid);display:flex;align-items:center;justify-content:center;color:var(--accent);flex-shrink:0}
.login-r{width:320px;padding:40px 32px;display:flex;flex-direction:column;justify-content:center}
.login-r h2{font-size:17px;font-weight:700;margin-bottom:3px}
.login-r p{font-size:12px;color:var(--sub);margin-bottom:22px}
.field{margin-bottom:13px}
.field label{display:block;font-size:11px;color:var(--sub);font-weight:500;margin-bottom:5px}
.btn-login{width:100%;height:42px;background:var(--accent);color:#fff;border:none;border-radius:99px;font-size:14px;font-weight:700;margin-top:4px;box-shadow:0 3px 14px rgba(212,145,106,.28);cursor:pointer}
.btn-login:disabled{opacity:.5;cursor:default}
.auth-tabs{position:relative;display:flex;border-bottom:1px solid var(--border);margin-bottom:20px}
.auth-tab{flex:1;height:40px;background:none;border:none;cursor:pointer;font-size:13px;color:var(--sub);font-weight:500;transition:color .22s cubic-bezier(.4,0,.2,1)}
.auth-tab[aria-selected="true"]{color:var(--text);font-weight:700}
.auth-tab:hover:not([aria-selected="true"]){color:var(--text)}
.auth-tab-ind{position:absolute;left:0;bottom:-1px;height:2px;background:var(--accent);border-radius:2px;transition:transform .34s cubic-bezier(.4,0,.2,1),width .34s cubic-bezier(.4,0,.2,1)}
.auth-form-stack{position:relative;display:grid}
.auth-form{grid-area:1/1;display:flex;flex-direction:column;transition:opacity .22s cubic-bezier(.4,0,.2,1),transform .32s cubic-bezier(.4,0,.2,1),filter .22s cubic-bezier(.4,0,.2,1);will-change:opacity,transform}
.auth-form[aria-hidden="true"]{opacity:0;transform:translateY(6px);pointer-events:none;filter:blur(.4px)}
.auth-form[aria-hidden="false"]{opacity:1;transform:translateY(0);transition-delay:.06s}
.agree{font-size:11px;color:var(--dim);text-align:center;margin-top:10px}
.agree a{color:var(--sub)}
.login-mobile-hd{display:none;text-align:center;margin-bottom:32px}

/* ══════════ CHAT ══════════ */
.chat-wrap{flex:1;display:flex;flex-direction:column;overflow:hidden}
.chat-top{height:var(--topbar);padding:0 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-shrink:0;background:var(--card)}
.chat-top-r{margin-left:auto;display:flex;align-items:center;gap:6px}
.daily-tag{font-size:11px;color:var(--dim);background:var(--bg);border:1px solid var(--border);padding:3px 9px;border-radius:99px;white-space:nowrap;transition:background .25s ease,border-color .25s ease,color .25s ease}
.daily-tag.balance-pulse{border-color:var(--accent);background:var(--a-soft);color:var(--accent);animation:balance-pulse 1.2s ease-out}
@keyframes balance-pulse{0%{box-shadow:0 0 0 0 rgba(212,145,106,.55);transform:scale(1)}40%{box-shadow:0 0 0 12px rgba(212,145,106,0);transform:scale(1.05)}100%{box-shadow:0 0 0 18px rgba(212,145,106,0);transform:scale(1)}}
.chat-body{flex:1;overflow-y:auto;padding:22px 26px;display:flex;flex-direction:column;gap:16px;background:var(--bg)}
.chat-welcome{text-align:center;padding:32px 0 20px;display:flex;flex-direction:column;align-items:center}
.msg{display:flex;flex-direction:column;align-items:flex-start;max-width:78%}
.msg.user{align-items:flex-end;margin-left:auto}
.av{width:32px;height:32px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;line-height:1.1}
.av-ai{background:transparent;border:none;overflow:visible;white-space:nowrap;font-size:9px;flex-shrink:0;font-family:system-ui;margin-bottom:4px;line-height:1.2}
.av-me{background:var(--g-soft);border:1.5px solid #c0dece;color:var(--green)}
.msg-body{min-width:0;max-width:100%}
.bubble{padding:11px 16px;border-radius:18px;font-size:13.5px;line-height:1.75;border:1px solid var(--border);display:inline-block;word-break:break-word}
.bubble.ai{background:var(--card);border-color:var(--border);border-bottom-left-radius:6px}
.bubble.me{background:var(--accent);color:#fff;border:none;border-bottom-right-radius:6px}
.bubble.ai strong{color:var(--accent)}
.msg-meta{font-size:11px;color:var(--dim);margin-top:4px;display:flex;align-items:center;gap:7px}
.msg.user .msg-meta{justify-content:flex-end}
.chat-foot{padding:12px 26px 24px;border-top:none;background:transparent;flex-shrink:0}
.chat-in-row{display:flex;align-items:flex-end;gap:8px}
.chat-ta{flex:1;min-height:42px;max-height:120px;background:#fff;border:1.5px solid var(--border);border-radius:20px;padding:10px 16px;font-size:13.5px;color:var(--text);resize:none;outline:none;transition:.2s;box-shadow:0 1px 4px rgba(0,0,0,.04);box-sizing:border-box;line-height:1.6}
.chat-ta:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(212,145,106,.1)}
.btn-send{width:42px;height:42px;border-radius:50%;background:var(--accent);color:#fff;border:none;display:flex;align-items:center;justify-content:center;transition:.2s;flex-shrink:0;box-shadow:0 2px 8px rgba(212,145,106,.3);padding:0;font-size:0}
.btn-send svg{width:18px;height:18px}
.btn-send:hover{background:var(--a-btn);transform:scale(1.05)}
.btn-send:disabled{opacity:.4;cursor:default;transform:none}
.chat-hint{font-size:11px;color:var(--dim);margin-top:6px;display:flex;gap:12px;padding:0 3px}

/* Sessions */
.sess-panel{width:206px;border-left:1px solid var(--border);overflow-y:auto;flex-shrink:0;background:var(--card);display:flex;flex-direction:column}
.sess-hd{font-size:10px;color:var(--dim);padding:0 10px;letter-spacing:.05em;height:var(--topbar);display:flex;align-items:center;flex-shrink:0;border-bottom:1px solid var(--border)}
.sess-list{padding:8px;flex:1;overflow-y:auto}
.sess-item{padding:5px 6px 5px 9px;border-radius:var(--r);transition:.15s;margin-bottom:1px;display:flex;align-items:center;gap:4px}
.sess-item:hover{background:var(--bg)}
.sess-item.on{background:var(--a-soft)}
.sess-info{flex:1;min-width:0;cursor:pointer}
.sess-name{font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sess-item.on .sess-name{color:var(--accent)}
.sess-meta{font-size:10px;color:var(--dim);margin-top:2px}
.sess-acts{display:flex;gap:1px;flex-shrink:0;opacity:0;transition:.15s}
.sess-item:hover .sess-acts{opacity:1}
.sess-act{width:22px;height:22px;border:none;background:transparent;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--dim);transition:.1s}
.sess-act svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sess-act:hover{background:var(--border);color:var(--text)}
.sess-act.del:hover{color:#e05555}

/* 气泡分句浮入（方案 B · 280ms 错位） */
.bubble.ai .seg{display:block;opacity:0;transform:translateY(4px);animation:seg-rise .5s cubic-bezier(.2,.7,.3,1) forwards}
.bubble.ai .seg + .seg{margin-top:6px}
@keyframes seg-rise{to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){
  .bubble.ai .seg{animation:none;opacity:1;transform:none}
}

/* Typing — 思考态（方案 B · 同步呼吸 1.8s） */
.typing{display:flex;align-items:center;gap:10px;font-family:var(--italic);font-style:italic;font-size:13px;color:var(--sub);line-height:1}
.typing-label{letter-spacing:.02em}
.typing-label::after{content:'…';display:inline-block;margin-left:1px;animation:typing-cursor 1.4s ease-in-out infinite}
.typing-dots{display:inline-flex;align-items:center;gap:5px}
.typing-dots span{width:6px;height:6px;border-radius:50%;background:var(--accent);display:inline-block;animation:typing-sync 1.8s ease-in-out infinite}
@keyframes typing-sync{0%,100%{transform:scale(.75);opacity:.4}50%{transform:scale(1.15);opacity:1}}
@keyframes typing-cursor{0%,100%{opacity:.2}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .typing-dots span,.typing-label::after{animation:none}
  .typing-dots span{transform:scale(1);opacity:.7}
  .typing-label::after{opacity:.6}
}

.md-h1{font-size:14px;font-weight:700;margin:6px 0 2px;color:var(--text)}
.md-h2{font-size:13px;font-weight:600;margin:4px 0 2px;color:var(--sub)}
.md-h3{font-size:12px;font-weight:600;margin:3px 0 2px;color:var(--sub)}
.md-ul{padding-left:15px;margin:4px 0;list-style:disc}
.md-ul li{margin-bottom:2px;line-height:1.65}
.md-table-wrap{overflow-x:auto;margin:6px 0}
.md-table{border-collapse:collapse;font-size:12px;width:100%}
.md-table th,.md-table td{border:1px solid #e5e0db;padding:5px 8px;text-align:left;line-height:1.5;white-space:normal;word-break:break-word}
.md-table th{background:#f7f1e9;font-weight:600;color:var(--text)}
.md-table td{color:var(--sub)}
.md-table tr:nth-child(even) td{background:#faf6ee}
/* ══════════ PROFILE ══════════ */
.dash-grid{padding:20px 26px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:11px;flex-shrink:0}
.about-card,.recharge-section,.panels{flex-shrink:0}
.stat{background:var(--card);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:17px 20px;box-shadow:var(--sh)}
.stat-n{font-size:26px;font-weight:700;line-height:1}
.stat-l{font-size:11px;color:var(--sub);margin-top:4px}
.panels{padding:0 26px 22px;display:grid;grid-template-columns:1fr;gap:11px}
.panel{background:var(--card);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh)}
.panel-h{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.panel-t{font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px}
.li{padding:9px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);font-size:12px}
.li:last-child{border-bottom:none}
.li-l{color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.li-v{font-weight:600;white-space:nowrap}.li-v.g{color:var(--green)}.li-v.d{color:var(--dim);font-weight:400}
.about-card{background:var(--card);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:16px 20px;margin:0 26px 16px;box-shadow:var(--sh)}
.about-ta{width:100%;min-height:60px;max-height:120px;background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r);padding:9px 12px;font-size:13px;color:var(--text);resize:none;outline:none;font-family:var(--sans);line-height:1.65;transition:.15s}
.about-ta:focus{border-color:var(--accent);background:#fff}

/* Recharge */
.recharge-section{background:var(--card);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:20px;margin:0 26px 16px;box-shadow:var(--sh)}
.recharge-title{font-size:15px;font-weight:700;margin-bottom:8px}
.recharge-link-main{display:flex;align-items:center;justify-content:center;height:40px;border-radius:var(--r);border:1.5px solid var(--accent);color:var(--accent);font-size:13px;font-weight:600;text-decoration:none;transition:.15s}
.recharge-link-main:hover{background:var(--a-soft)}
.redeem-inp{display:flex;gap:7px}
.redeem-inp input{flex:1;height:38px;background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r);padding:0 12px;font-size:13px;outline:none;transition:.15s}
.redeem-inp input:focus{border-color:var(--accent)}
.redeem-inp input::placeholder{color:var(--dim)}

/* Plan grid (recharge cards) */
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:8px}
.plan-card{position:relative;background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r);padding:14px 10px;text-align:center;cursor:pointer;transition:.15s;user-select:none}
.plan-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.05)}
.plan-tag{position:absolute;top:-8px;right:8px;background:var(--accent);color:#fff;font-size:10px;font-weight:600;padding:2px 8px;border-radius:8px;letter-spacing:.05em}
.plan-name{font-size:13px;font-weight:600;color:var(--text);margin-bottom:6px}
.plan-credits{font-size:11px;color:var(--dim);margin-bottom:8px}
.plan-price{font-size:18px;font-weight:700;color:var(--accent);font-family:var(--serif)}
.plan-foot{margin-top:12px;text-align:center;font-size:11px;color:var(--dim)}
@media (max-width: 720px){
  .plan-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .plan-card{padding:12px 8px}
}

/* ══════════ MODAL ══════════ */
.modal-ov{position:fixed;inset:0;background:rgba(28,27,24,.22);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px);z-index:100}
.modal{background:var(--card);border:1.5px solid var(--border);border-radius:22px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.12);max-height:90vh;display:flex;flex-direction:column}
.modal-h{padding:16px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.modal-h h3{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px}
.modal-x{background:none;border:none;color:var(--dim);width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:.15s}
.modal-x:hover{background:var(--bg);color:var(--text)}
.modal-ft{padding:12px 18px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:7px}

/* Empty states */
.empty-state{padding:60px 26px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.empty-state h3{font-size:16px;font-weight:700}
.empty-state p{font-size:13px;color:var(--sub);max-width:300px;line-height:1.7}

/* ══════════ MOBILE BOTTOM NAV ══════════ */
.mob-nav{display:none !important;position:fixed;bottom:0;left:0;right:0;height:56px;background:var(--card);border-top:1px solid var(--border);z-index:40}
.mob-nav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:none;border:none;color:var(--sub);font-size:10px;font-weight:500;cursor:pointer;transition:.15s;padding:6px 0}
.mob-nav-btn svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.mob-nav-btn.on{color:var(--accent)}
.mob-sess-bg{display:none;position:fixed;inset:0;z-index:49;background:rgba(28,27,24,.3)}
.mob-sess-bg.show{display:block}

/* ══════════ MOBILE ══════════ */
@media(max-width:768px){
  .page{height:var(--vvh,100dvh)}
  .login-box{width:100%;max-width:none;border-radius:0;min-height:100dvh;border:none;box-shadow:none;flex-direction:column}
  .login-l{display:none}
  .login-r{width:100%;padding:52px 28px 32px;justify-content:flex-start}
  .sb{display:none}
  .main{padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}
  .chat-wrap{padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}
  .sess-panel{position:fixed;top:0;right:0;bottom:56px;width:82vw;max-width:300px;z-index:50;transform:translateX(100%);transition:transform .25s ease;display:flex !important;box-shadow:-8px 0 32px rgba(0,0,0,.12)}
  .sess-panel.mob-open{transform:translateX(0)}
  .mob-nav.active{display:flex !important;height:calc(56px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px)}
  #btn-mob-sessions{display:inline-flex !important}
  #quest-progress{display:none !important}
  .chat-top{padding:0 14px}
  .chat-body{padding:12px;gap:12px}
  .chat-foot{padding:8px 14px 14px;position:sticky;bottom:0;z-index:10}
  .chat-ta{min-height:42px;max-height:120px}
  .btn-send{width:40px;height:40px}
  .chat-hint{display:none}
  .msg{max-width:100%}
  .ph{padding:0 14px}
  .dash-grid{grid-template-columns:1fr 1fr;padding:14px}
  .stat-n{font-size:22px}
  .panels{grid-template-columns:1fr;padding:0 14px 14px}
  .about-card{margin:0 14px 14px}
  .recharge-section{margin:0 14px 14px;padding:14px;box-sizing:border-box}
  .recharge-section .redeem-inp input{min-width:0;flex:1 1 0}
  .about-card{box-sizing:border-box}
  .about-card input{min-width:0}
  .modal-ov{align-items:flex-end}
  .modal{width:100% !important;border-radius:20px 20px 0 0 !important;max-height:85vh}
}

/* ══════════════════════════════════════════════════════════════
   Direction B overhaul — 原色系 · 不加时间 · 不加无意义英文
   ══════════════════════════════════════════════════════════════ */

/* hide noisy time metadata on chat messages */
.msg-meta{display:none}

/* ── Type roles ── */
.login-l h1,.login-r h2,.ph-t,.sb-name,.stat-n,.panel-t,.recharge-title,.modal-h h3,.empty-state h3,.mascot{letter-spacing:-0.3px}
.login-l h1,.login-r h2,.ph-t,.sb-name,.stat-n,.panel-t,.recharge-title,.modal-h h3,.empty-state h3{font-family:var(--serif)}
.sb-tagline,.sb-icp,.ph-s,.sess-meta,.daily-tag,.field label,.chat-hint,.stat-l,.li-v,.agree,.mob-nav-btn{font-family:var(--mono);letter-spacing:0.03em}
.field label{letter-spacing:0.08em}
.stat-l{letter-spacing:0.08em}

/* ── Login ── */
.login-box{width:920px;border-radius:22px;box-shadow:0 30px 60px -30px rgba(28,27,24,0.2);border:1px solid var(--border)}
.login-l{background:#fff;padding:56px 52px;border-right:1px dashed var(--border)}
.login-l h1{font-size:56px;font-weight:500;letter-spacing:-1.5px;line-height:1.15;margin:0}
.login-l h1 span{font-style:italic;font-weight:400;color:var(--accent)}
.login-l p{font-family:var(--serif);font-size:15px;line-height:1.9;color:var(--sub);margin:22px 0 28px}
.login-feats{gap:10px}
.login-feat{font-family:var(--serif);font-size:13px;gap:12px;color:var(--sub)}
.feat-ico{width:30px;height:30px;border-radius:8px}
.login-r{width:340px;background:#faf7f2;padding:56px 40px;border-left:1px dashed var(--border)}
.login-r h2{font-family:var(--serif);font-size:26px;font-weight:500;letter-spacing:-0.4px;margin-bottom:4px}
.login-r #auth-tab-hint{font-family:var(--mono);font-size:10px;letter-spacing:0.15em;text-transform:uppercase;color:var(--sub);margin-bottom:22px}
.auth-tab{height:40px;font-size:13px}
.field label{font-size:10px;color:var(--sub);margin-bottom:6px}
.inp{height:44px;font-size:14px;border-radius:10px;border:1.5px solid #d0ccc2;background:#fff;padding:0 14px}
.inp:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--a-soft)}
.btn-login{height:48px;border-radius:99px;font-size:14px;font-weight:600;box-shadow:0 8px 22px -8px rgba(190,124,87,0.6)}
.btn-login:hover{box-shadow:0 10px 28px -8px rgba(190,124,87,0.7)}
.agree{font-family:var(--mono);font-size:10px;color:var(--dim);letter-spacing:0.03em}

/* ── Sidebar ── */
.sb{background:#fbf9f5;border-right:1px dashed var(--border)}
.sb-logo{height:64px;background:#fbf9f5;border-bottom:1px dashed var(--border);padding:0 22px}
.sb-name{font-family:var(--serif);font-size:17px;font-weight:600;letter-spacing:-0.2px}
.sb-tagline{font-size:10px;color:var(--dim);letter-spacing:0.08em;margin-top:1px}
.sb-nav{padding:18px 14px}
.sb-sec{font-family:var(--mono);font-size:10px;color:var(--dim);letter-spacing:0.15em;text-transform:uppercase;padding:0 8px;margin:18px 0 4px}
.sb-a{font-family:var(--serif);font-size:13px;padding:9px 12px;border-radius:8px;gap:10px;border-left:2px solid transparent;color:var(--ink)}
.sb-a:hover{background:var(--bg)}
.sb-a.on{background:transparent;color:var(--text);border-left-color:transparent;padding-left:12px}
.sb-a .ico{color:currentColor;opacity:0.6}
.sb-a.on .ico{opacity:1}
.sb-user{background:transparent;border-top:1px dashed var(--border);padding:14px 16px}
.sb-uname{font-family:var(--serif);font-size:13px;font-weight:600}

/* ── Main · header ── */
.main{background:var(--bg)}
.ph{height:64px;background:#fbf9f5;border-bottom:1px dashed var(--border);padding:0 30px}
.ph-t{font-family:var(--serif);font-size:15px;font-weight:600;letter-spacing:-0.2px}
.daily-tag{font-size:10px;padding:4px 10px;border-radius:99px;letter-spacing:0.08em}

/* ── Chat ── */
.chat-wrap{background:var(--bg)}
.chat-top{height:64px;background:#fbf9f5;border-bottom:1px dashed var(--border);padding:0 22px}
.chat-body{padding:30px 64px 16px;gap:20px}
.chat-welcome{padding:44px 0 28px}
.bubble{padding:12px 18px;font-size:14px;line-height:1.75;border-radius:18px}
.bubble.ai{background:#fff;border:1px solid var(--border);border-radius:4px 18px 18px 18px;font-family:var(--serif);font-size:14.5px;line-height:1.9;box-shadow:0 1px 2px rgba(0,0,0,0.02);color:var(--ink)}
.bubble.ai strong{color:var(--accent);font-weight:600}
.bubble.ai em{color:var(--accent);font-style:italic;font-weight:500}
.bubble.me{background:var(--accent);color:#fff;border:none;border-radius:18px 18px 4px 18px;box-shadow:0 4px 14px -6px var(--a-btn)}
.av-ai{background:transparent;border:none;font-size:14px;line-height:1;width:auto;height:auto;margin-bottom:4px;color:var(--accent)}
.av-me{background:var(--g-soft);border:1.5px solid #c0dece}
.chat-foot{padding:12px 64px 26px;background:transparent}
.chat-ta{min-height:48px;background:#fff;border:1.5px solid var(--accent);border-radius:22px;padding:12px 20px;font-size:14px;box-shadow:0 0 0 4px var(--a-soft);line-height:1.6}
.chat-ta:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--a-soft)}
.btn-send{width:46px;height:46px;border-radius:14px;box-shadow:0 4px 12px -4px var(--a-btn)}
.btn-send:hover{transform:none;box-shadow:0 6px 16px -4px var(--a-btn)}
.chat-hint{font-family:var(--mono);font-size:10px;color:var(--dim);letter-spacing:0.03em;margin-top:10px;gap:14px}

/* sessions panel */
.sess-panel{background:#fbf9f5;border-left:1px dashed var(--border)}
.sess-hd{font-family:var(--mono);font-size:10px;letter-spacing:0.15em;text-transform:uppercase;height:64px;border-bottom:1px dashed var(--border);padding:0 14px}
.sess-item{padding:9px 10px;border-radius:8px;border-left:2px solid transparent;margin-bottom:2px}
.sess-item.on{background:#f0ebe3;border-left-color:var(--accent);padding-left:9px}
.sess-name{font-family:var(--serif);font-size:13px}
.sess-meta{font-family:var(--mono);font-size:10px;color:var(--dim);letter-spacing:0.03em;margin-top:2px}

/* ── Profile ── */
.dash-grid{padding:24px 40px;gap:14px}
.stat{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px 26px;box-shadow:0 1px 3px rgba(28,27,24,0.03)}
.stat-n{font-family:var(--serif);font-size:38px;font-weight:500;letter-spacing:-1px;line-height:1;margin-bottom:12px}
.stat-l{font-family:var(--mono);font-size:10px;color:var(--sub);letter-spacing:0.12em;text-transform:uppercase;margin-top:0}
.panel{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 1px 3px rgba(28,27,24,0.03);overflow:hidden}
.panels{padding:0 40px 20px;gap:14px}
.panel-h{padding:16px 22px;border-bottom:1px dashed var(--border)}
.panel-t{font-family:var(--serif);font-size:14px;font-weight:600}
.li{padding:13px 22px;border-bottom:1px dashed var(--border);font-size:13px}
.li-l{font-family:var(--serif);color:var(--ink)}
.li-v{font-family:var(--mono);font-weight:700;font-size:14px;letter-spacing:0.03em}
.about-card{margin:0 40px 14px;padding:22px;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 1px 3px rgba(28,27,24,0.03)}
.about-ta{background:var(--bg);border:1px dashed #d0ccc2;border-radius:10px;padding:14px 16px;font-family:var(--serif);font-style:italic;color:var(--sub);font-size:13px;line-height:1.9;min-height:80px}
.recharge-section{margin:0 40px 14px;padding:22px;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 1px 3px rgba(28,27,24,0.03);position:relative;overflow:hidden}
.recharge-section::after{content:'✦';position:absolute;top:-20px;right:-20px;font-size:120px;color:var(--accent);opacity:0.06;pointer-events:none}
.recharge-title{font-family:var(--serif);font-size:15px;font-weight:600}
.recharge-link-main{border-radius:10px;height:42px;font-size:13px;font-weight:600}
.redeem-inp input{background:var(--bg);border:1.5px solid #d0ccc2;border-radius:10px;height:42px;padding:0 14px;font-family:var(--mono);font-size:13px;letter-spacing:0.08em}
.redeem-inp input:focus{border-color:var(--accent);background:#fff}

/* ── Modal ── */
.modal-ov{background:rgba(28,27,24,0.32);backdrop-filter:blur(10px)}
.modal{border-radius:22px;border:1px solid var(--border);box-shadow:0 30px 80px -20px rgba(28,27,24,0.35)}
.modal-h{padding:20px 26px;border-bottom:1px dashed var(--border);background:var(--a-soft)}
.modal-h h3{font-family:var(--serif);font-size:18px;font-weight:600;letter-spacing:-0.3px}
.modal-ft{padding:16px 26px;border-top:1px dashed var(--border)}
.modal-x{width:28px;height:28px;border:1px solid var(--border);border-radius:8px;background:#fff}
.modal-x:hover{border-color:var(--dim)}

/* buttons — pill everywhere */
.btn{height:36px;border-radius:99px;padding:0 18px}
.btn-p{background:var(--accent);color:#fff;box-shadow:0 6px 18px -8px rgba(190,124,87,0.5)}
.btn-p:hover{background:var(--a-btn);box-shadow:0 8px 22px -8px rgba(190,124,87,0.6)}
.btn-g{border:1px solid var(--border);color:var(--sub);background:transparent}
.btn-g:hover{border-color:var(--dim);color:var(--ink)}

/* empty state */
.empty-state h3{font-family:var(--serif);font-size:19px;font-weight:500;letter-spacing:-0.3px}
.empty-state p{font-family:var(--serif);font-size:13px;font-style:italic;line-height:1.9}

/* mobile overrides for new type rules */
@media(max-width:768px){
  .login-l{display:none}
  .login-mobile-hd{display:block}
  .login-desktop-mascot{display:none}
  .login-box{width:100%;min-height:100%;flex-direction:column;align-items:center;justify-content:center;background:transparent;box-shadow:none;border:none;border-radius:0}
  .login-r{width:100%;max-width:400px;padding:48px 28px 40px;background:transparent;border-left:none;justify-content:flex-start}
  .login-r h2{font-size:22px}
  .chat-body{padding:18px 16px;gap:14px}
  .chat-foot{padding:10px 16px 16px}
  .stat-n{font-size:28px}
  .dash-grid{padding:16px}
  .panels{padding:0 16px 16px}
  .about-card,.recharge-section{margin:0 16px 14px;padding:18px}
}

/* ─── 支点 / Pivot ────────────────────────────────────────── */
.pivot-grid{padding:24px 26px 80px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;grid-auto-rows:1fr;align-items:stretch}
.pivot-empty{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--dim);font-size:13px}
.pivot-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px;cursor:pointer;display:flex;flex-direction:column;gap:8px;min-height:120px;position:relative;overflow:hidden;transition:all .22s cubic-bezier(.2,.7,.3,1)}
.pivot-card::before{content:'';position:absolute;top:-40%;right:-40%;width:160%;height:160%;background:radial-gradient(circle at 80% 20%,rgba(212,145,106,.22),transparent 50%);opacity:0;transition:opacity .35s;pointer-events:none;z-index:0}
.pivot-card > *{position:relative;z-index:1}
.pivot-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(190,124,87,.22),0 2px 6px -2px rgba(28,27,24,.06)}
.pivot-card:hover::before{opacity:1}
.pivot-card-name{font-size:16px;font-weight:600;color:var(--text);line-height:1.4}
.pivot-card-meta{font-size:12px;color:var(--dim);display:flex;gap:10px;flex-wrap:wrap;margin-top:auto}
.pivot-card-meta-item{display:inline-flex;align-items:center;gap:4px}
.pivot-card-meta-item::before{content:'·';color:var(--dim)}
.pivot-card-meta-item:first-child::before{display:none}
.pivot-card-desc{font-size:13px;color:var(--sub);line-height:1.65}


@media (max-width:780px){
  .pivot-grid{padding:16px;grid-template-columns:1fr}
}

@media(max-width:768px){
  .report-modal{max-width:100% !important;max-height:85vh !important}
  #report-modal-content{padding:16px 16px !important}
  .report-notice{flex-wrap:wrap;gap:10px}
  .report-notice-actions{flex-direction:row;width:100%;justify-content:flex-end}
}

/* ─── 支点卡片下方的报告区块 ─── */
.pivot-card-reports{margin-top:12px;padding-top:12px;border-top:1px dashed var(--border);display:flex;flex-direction:column;gap:6px}
.pivot-card-reports-h{font-size:11px;color:var(--dim);letter-spacing:.05em;text-transform:uppercase;margin-bottom:2px}
.pivot-report-row{display:flex;align-items:center;justify-content:space-between;padding:6px 0;font-size:12px;gap:10px}
.pivot-report-info{flex:1;min-width:0;cursor:pointer;color:var(--sub)}
.pivot-report-info:hover{color:var(--accent)}
.pivot-report-link{font-size:12px;color:var(--accent);font-weight:500}
.pivot-report-toggle{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:var(--sub);cursor:pointer;user-select:none;flex-shrink:0}
.pivot-report-toggle input[type=checkbox]{accent-color:var(--accent);width:13px;height:13px;cursor:pointer}
.pivot-report-toggle:has(input:checked) .pivot-report-toggle-lbl{color:var(--accent);font-weight:600}

/* ─── chat 顶部「答答记得 X 份」pill ─── */
.chat-pivot-pill{margin:8px 26px 0;padding:8px 14px;background:var(--a-soft);border:1px solid var(--a-mid);border-radius:99px;font-size:12px;color:var(--accent);display:flex;align-items:center;gap:8px;flex-shrink:0}
.chat-pivot-pill-icon{font-size:13px}
.chat-pivot-pill strong{color:var(--accent);font-weight:600}
.chat-pivot-pill-names{color:var(--sub);margin-left:6px;font-size:11px;font-style:italic}
@media(max-width:780px){
  .chat-pivot-pill{margin:8px 16px 0;font-size:11px;padding:7px 12px}
  .chat-pivot-pill-names{display:none}
}

/* ─── 支点报告通知（chat 内联） ─── */
.report-notice{display:flex;align-items:center;gap:12px;background:var(--a-soft);border:1px solid var(--a-mid);border-radius:14px;padding:14px 18px;margin:8px 0}
.report-notice-icon{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.report-notice-text{flex:1;font-size:13px;color:var(--text);line-height:1.5}
.report-notice-text strong{color:var(--accent);font-weight:600}
.report-notice-sub{font-size:11px;color:var(--dim);margin-top:2px}
.report-notice-actions{display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.report-notice-btn{background:var(--accent);color:#fff;border:none;border-radius:99px;padding:8px 18px;font-size:13px;font-weight:500;cursor:pointer;transition:.15s;white-space:nowrap}
.report-notice-btn:hover{background:var(--a-btn)}

/* ─── 桌面端：主导航常驻，仅历史栏跟随鼠标自动隐藏/展开 ─── */
@media(min-width:769px){
  #p-chat{position:relative}
  /* 右侧留出 16px 槽位给历史栏边缘把手 */
  .chat-wrap{margin-right:16px}

  .sess-dock{position:absolute;top:0;bottom:0;right:0;width:16px;z-index:40}

  /* 边缘把手提示：一根细竖条，hover 时淡出 */
  .sess-dock::before{
    content:'';position:absolute;top:50%;right:6px;transform:translateY(-50%);
    width:3px;height:46px;border-radius:3px;background:var(--border);
    transition:opacity .2s;
  }
  .sess-dock:hover::before{opacity:0}

  /* 历史栏默认滑出屏外，hover 把手区域时滑入（面板是 dock 子元素，hover 会保持） */
  .sess-dock .sess-panel{
    position:absolute;top:0;bottom:0;right:0;height:auto;
    transform:translateX(100%);
    transition:transform .24s cubic-bezier(.4,0,.2,1);
    box-shadow:-3px 0 28px rgba(28,27,24,.12);z-index:41;
  }
  .sess-dock:hover .sess-panel{transform:translateX(0)}
}
.report-notice-btn:disabled{opacity:.55;cursor:default}
.report-notice-btn-secondary{background:transparent;color:var(--accent);border:1.5px solid var(--accent)}
.report-notice-btn-secondary:hover{background:var(--a-soft)}
.typing-report-hint{font-size:.82em;color:var(--dim);padding:6px 4px;display:block;line-height:1.5}

/* writing 状态 — 报告生成等待气泡（first / regen 共用） */
.bubble.ai.writing{padding:12px 16px;background:linear-gradient(180deg,var(--a-soft) 0%,#fff 60%);border-color:var(--a-mid)}
.writing-bubble .w-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.writing-bubble .w-star{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--accent);display:inline-block;animation:w-spin 6s linear infinite;transform-origin:50% 54%}
@keyframes w-spin{to{transform:rotate(360deg)}}
.writing-bubble .w-title{font-family:var(--serif);font-style:italic;font-size:14.5px;color:var(--text);letter-spacing:-.1px}
.writing-bubble .w-sub-stage{height:24px;position:relative;margin-bottom:10px}
.writing-bubble .w-sub{position:absolute;left:0;right:0;font-family:var(--serif);font-size:13px;color:var(--sub);line-height:1.7;opacity:0;transform:translateY(4px);transition:opacity .5s ease,transform .5s ease}
.writing-bubble .w-sub.on{opacity:1;transform:translateY(0)}
.writing-bubble .w-bar{height:2px;background:rgba(212,145,106,.12);border-radius:99px;overflow:hidden;position:relative}
.writing-bubble .w-bar-fill{position:absolute;top:0;height:100%;width:50%;background:linear-gradient(90deg,transparent,var(--a-mid),var(--accent),transparent);border-radius:99px;animation:w-sweep 1.7s ease-in-out infinite}
@keyframes w-sweep{0%{transform:translateX(-60%)}100%{transform:translateX(160%)}}
/* 报告 modal 内：让 writing bubble 居中 + 限宽，模拟一条气泡而不是占满 */
.report-modal-writing{display:flex;justify-content:center;padding:60px 24px}
.report-modal-writing .msg{max-width:380px;width:100%;display:flex;flex-direction:column;align-items:flex-start}
.report-modal-writing .bubble.ai.writing{max-width:100%}

/* 报告 modal 重新生成按钮 */
.btn-ghost-sm{background:transparent;color:var(--dim);border:1px solid var(--border);border-radius:99px;padding:5px 14px;font-size:12px;cursor:pointer;transition:.15s;white-space:nowrap}
.btn-ghost-sm:hover{color:var(--text);border-color:var(--text)}
.btn-ghost-sm:disabled{opacity:.45;cursor:default}

/* ─── 报告 modal 内容 ─── */
.report-modal .modal-h{flex-shrink:0}
.report-name{font-family:var(--serif);font-size:24px;font-weight:600;margin-bottom:6px;color:var(--text)}
.report-meta{font-size:12px;color:var(--dim);margin-bottom:24px}
.report-body{font-size:14.5px;line-height:1.85;color:var(--text)}
.report-body hr{display:none}
.report-body .md-h1{font-size:18px;margin:18px 0 8px}
.report-body .md-h2{font-size:15px;margin:14px 0 6px}
.report-body .md-h3{font-size:13px;margin:10px 0 4px}
.report-body .md-ul{padding-left:18px;margin:8px 0}
.report-body strong{color:var(--accent);font-weight:600}

/* ══════════════════════════════════════════════════════════════
   Apple-inspired calm overhaul — 2026-05-15
   ══════════════════════════════════════════════════════════════ */

/* ── Additional design tokens ── */
:root {
  --hairline:    rgba(28, 27, 24, 0.06);
  --ink-2:       #3a362e;
  --accent-glow: rgba(212, 145, 106, 0.16);
  --ease-out:    cubic-bezier(.22,.61,.36,1);
  --t-fast: .18s;
  --t-mid:  .32s;
}

/* ── Font rendering ── */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ── Subtle ambient warmth in chat area ── */
.chat-body {
  background:
    radial-gradient(ellipse 90% 40% at 50% -10%, rgba(212,145,106,.055), transparent 55%),
    var(--bg);
}

/* ── Sidebar — frosted glass ── */
.sb {
  background: rgba(251, 249, 245, 0.80);
  backdrop-filter: saturate(150%) blur(20px);
  -webkit-backdrop-filter: saturate(150%) blur(20px);
  border-right: 1px solid var(--hairline);
}
.sb-logo { border-bottom: 1px solid var(--hairline); background: transparent; }
.sb-user { border-top: 1px solid var(--hairline); }

/* ── Topbars — hairline + subtle frost ── */
.chat-top, .ph {
  border-bottom: 1px solid var(--hairline);
  background: rgba(251,249,245,.94);
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
}
.sess-hd {
  border-bottom: 1px solid var(--hairline);
  background: rgba(251,249,245,.94);
}

/* ── 居中阅读列（max 960px）── 比原 720 宽，但超宽屏不至于无限拉
   屏宽 ≤ 1056px 时按 48px 贴边；更宽时自动两侧均分留白让中间 960 居中 */
.chat-body {
  padding-left:  max(48px, calc((100% - 960px) / 2));
  padding-right: max(48px, calc((100% - 960px) / 2));
  padding-top: 28px;
}
.chat-foot {
  padding-left:  max(48px, calc((100% - 960px) / 2));
  padding-right: max(48px, calc((100% - 960px) / 2));
}

/* ── AI bubble — paper card, 16px ── */
.bubble.ai {
  font-size: 16px;
  line-height: 1.80;
  background: rgba(255,255,255,0.78);
  border: 1px solid var(--hairline);
  border-radius: 6px 18px 18px 18px;
  padding: 14px 20px;
  box-shadow: 0 1px 3px rgba(28,27,24,.03), 0 6px 18px -6px rgba(28,27,24,.05);
  color: var(--ink-2);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* ── User bubble — rounder pill ── */
.bubble.me {
  border-radius: 20px 20px 6px 20px;
  font-size: 14.5px;
  box-shadow: 0 4px 14px -6px rgba(190,124,87,.45);
}

/* ── Segment rise — smoother easing ── */
.bubble.ai .seg {
  opacity: 0;
  transform: translateY(5px);
  animation: seg-rise .52s cubic-bezier(.22,.61,.36,1) forwards;
}
@keyframes seg-rise { to { opacity: 1; transform: translateY(0); } }
.bubble.ai .seg + .seg { margin-top: 6px; }

/* ── Typing — single breathing dot ── */
.typing {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 14.5px;
  color: var(--sub);
}
.typing-label::after { display: none; }
.typing-dots { order: -1; }
.typing-dots span:not(:first-child) { display: none; }
.typing-dots span:first-child {
  width: 8px;
  height: 8px;
  background: var(--accent);
  animation: breathe-dot 1.8s ease-in-out infinite;
}
@keyframes breathe-dot {
  0%, 100% { transform: scale(0.72); opacity: .35; }
  50%       { transform: scale(1.1);  opacity: 1; }
}

/* ── Composer — calm focus ring only ── */
.chat-ta {
  border: 1.5px solid var(--border);
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
  min-height: 46px;
  padding: 11px 18px;
  font-size: 14.5px;
}
.chat-ta:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-glow);
}
.chat-ta::placeholder { color: var(--dim); }
.btn-send { border-radius: 12px; }

/* ── chat-hint keyboard keys ── */
.chat-hint kbd {
  font-family: var(--mono);
  font-size: 10px;
  background: rgba(28,27,24,.04);
  border: 1px solid var(--hairline);
  border-radius: 4px;
  padding: 1px 5px;
  color: var(--sub);
}

/* ── Welcome screen — fade-in ── */
@keyframes welcome-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.chat-welcome { animation: welcome-in .8s cubic-bezier(.22,.61,.36,1) both; }

/* ── Mobile ── */
@media (max-width: 768px) {
  .chat-body { padding: 16px 16px 12px; }
  .chat-foot { padding: 8px 16px 16px; }
}

/* ── 布局核心：消息全宽 + AI 气泡撑满阅读列 ── */
.msg {
  max-width: 100%;
  width: 100%;
}
.msg.user {
  margin-left: 0;   /* width:100% 已经撑满，不再需要 margin-left:auto */
}
.msg.user .msg-body {
  width: 100%;      /* 防止 flex-end 收缩到 min-content，确保 .bubble.me 的 max-width:82% 以聊天区宽度为基准 */
}
.bubble.ai {
  display: block;
  width: 100%;
  box-sizing: border-box;
}
.bubble.me {
  display: block;
  width: fit-content;
  max-width: 82%;
  margin-left: auto;    /* 靠右 */
}

/* ══════════════════════════════════════════════════════════════
   统一侧边栏：导航 + 历史会话合并到 .sb，去掉右侧 sess-dock
   ══════════════════════════════════════════════════════════════ */

/* 侧边栏拓宽一点装下历史会话列表 */
.sb { width: 264px; }

/* 桌面端：取消 chat-wrap 右侧 16px 让位 + 隐藏 sess-dock hover 把手 */
@media (min-width: 769px) {
  .chat-wrap { margin-right: 0; }
  .sess-dock { display: none; }
  .sess-dock::before { display: none; }
  .sess-dock .sess-panel { display: none; }
}

/* 历史会话标题：和 sb-sec 同款但带 + 新对话按钮 */
.sb-sess-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 4px;
  margin-top: 22px;
}
.sb-new {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--sub);
  width: 22px;
  height: 22px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .15s;
  padding: 0;
  font-family: inherit;
}
.sb-new:hover { background: var(--bg); color: var(--accent); border-color: var(--accent); }

/* 侧边栏内的 sess-list：贴合 .sb-nav 间距，不要原 sess-panel 的边框 */
.sb-nav .sess-list {
  padding: 4px 0 12px;
  flex: none;     /* 在 .sb-nav 里跟随自然高度，由 .sb-nav 自身滚动 */
  overflow: visible;
}
.sb-nav .sess-item {
  padding: 7px 10px;
  border-radius: 8px;
  border-left: 2px solid transparent;
  margin-bottom: 1px;
}
.sb-nav .sess-item.on {
  background: var(--a-soft);
  border-left-color: var(--accent);
  padding-left: 8px;
}
.sb-nav .sess-name { font-family: var(--serif); font-size: 13px; }
.sb-nav .sess-meta { font-size: 10px; }

/* 移动端：.sb 不再隐藏，改成从左滑出的抽屉（替代原 sess-panel 抽屉） */
@media (max-width: 768px) {
  #p-chat .sb {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 82vw;
    max-width: 320px;
    z-index: 50;
    transform: translateX(-100%);
    transition: transform .25s ease;
    box-shadow: 8px 0 32px rgba(0,0,0,.12);
    /* 抽屉强制实色奶米 + 关闭 backdrop-filter
       否则 80% 透明会把背后 mob-sess-bg 的暗色遮罩 (rgba(28,27,24,.3))
       透上来，抽屉看起来灰暗。这里覆盖 line 564 的 Apple Polish 半透明。*/
    background: #fbf9f5;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  #p-chat .sb.mob-open { transform: translateX(0); }
/* 其它页的 .sb 仍隐藏 */
  #p-profile .sb, #p-pivot .sb { display: none; }
}


/* ══════════════════════════════════════════════════════════════
   Polish · 2026-05-16 ── 桌面端专用（≥769px）
   毛玻璃、半透明顶栏/侧栏、暖色环境光渐变，都是为桌面端做的视觉
   升级。移动端不进入这段：Chrome Android 的 force-dark / 透明
   元素合成 / safe-area 缝隙都会让这些"亮起来"的技巧反而变难看。
   移动端继续走文件上半部分的原版规则，保持你之前看习惯的样子。
   ══════════════════════════════════════════════════════════════ */
@media (min-width: 769px) {
  /* 1 · 页面级的暖色环境光 ── 给毛玻璃喂料 */
  #p-chat, #p-pivot, #p-profile {
    background:
      radial-gradient(70% 45% at 50% -8%, rgba(212,145,106,.055), transparent 58%),
      var(--bg);
  }

  /* 2 · 顶栏 · 透 + 重模糊 ── 内容会从下面"穿过" */
  .chat-top, .ph {
    background: rgba(251, 249, 245, 0.62);
    backdrop-filter: blur(22px) saturate(180%);
    -webkit-backdrop-filter: blur(22px) saturate(180%);
  }

  /* 3 · 侧栏 · 浮起来的感觉 */
  .sb {
    background: rgba(251, 249, 245, 0.68);
    backdrop-filter: blur(22px) saturate(170%);
    -webkit-backdrop-filter: blur(22px) saturate(170%);
  }

  /* 历史会话区共用同样的色温（在 .sb 之内自然继承，
     但 .sb-user 之前有写实色，这里轻覆盖一下） */
  .sb-user { background: transparent; }

  /* 4 · 模态遮罩 · 玻璃为主，暗色只是一层淡淡的影 */
  .modal-ov {
    background: rgba(28, 27, 24, 0.14);
    backdrop-filter: blur(24px) saturate(140%);
    -webkit-backdrop-filter: blur(24px) saturate(140%);
  }

  /* 5 · sess-panel 顶色一致 */
  .sess-hd, .sess-panel {
    background: rgba(251, 249, 245, 0.62);
  }

  /* 6 · 旧浏览器后备：不支持 backdrop-filter 时退回稍浓实色 */
  @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .sb       { background: #fbf9f5; }
    .chat-top,
    .ph       { background: #fbf9f5; }
    .modal-ov { background: rgba(28,27,24,.35); }
  }
}
