@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400&family=Noto+Sans+SC:wght@300;400;500;700&family=Noto+Serif+SC:wght@300;400;500;600&family=Zhi+Mang+Xing&display=swap');
@font-face{font-family:'JH';src:url('/static/fonts/JingHuaLaoSong.ttf') format('truetype');font-display:swap}

/* ══════ RESET ══════ */
*{box-sizing:border-box;margin:0;padding:0}
::selection{background:rgba(113,129,200,.25);color:var(--text3)}
html{scroll-behavior:smooth;background-color:var(--bg4)}
button{border:none;background:none;cursor:pointer;font-family:inherit}
input,select,textarea{font-family:inherit}

/* ══════ THEMES ══════ */
[data-theme="mist"]{
  --bg1:#f1e5f6;--bg2:#e8ecf4;--bg3:#ede5f3;--bg4:#dde4f2;
  --grad:linear-gradient(150deg,#f1e5f6 0%,#e8ecf4 35%,#ede5f3 65%,#dde4f2 100%);
  --card:rgba(255,255,255,.5);--card-h:rgba(255,255,255,.68);--card-b:rgba(113,129,200,.18);
  --glass:rgba(255,255,255,.42);--glass-b:rgba(113,129,200,.2);
  --accent:#7181c8;--accent2:#ababdc;--accent3:#b7d3f4;--accent4:#f1cfed;
  --text:#2E3E6D;--text2:#6b6388;--text3:#1a2a50;--text-m:#9a92ac;
  --core:#9B7AAD;--long:#7181C8;--recent:#9CADD4;--rp:#C497B8;
  --sh:0 2px 16px rgba(46,62,109,.08);--sh-h:0 8px 32px rgba(46,62,109,.14);
  --quote:rgba(113,129,200,.06);--nav-bg:rgba(241,229,246,.88);
  --orb1:rgba(113,129,200,.15);--orb2:rgba(171,171,220,.12);--orb3:rgba(183,211,244,.1);
  --badge:rgba(113,129,200,.1);--divider:rgba(113,129,200,.12);
  --star-map-orbit:rgba(113,129,200,.2);--star-map-glow:rgba(113,129,200,.4);
  --bubble-ai:rgba(255,255,255,.75);--bubble-ai-b:rgba(113,129,200,.25);
}
[data-theme="star"]{
  --bg1:#070e28;--bg2:#0d1a40;--bg3:#102a6b;--bg4:#0a1535;
  --grad:linear-gradient(150deg,#070e28 0%,#0d1a40 35%,#102a6b 70%,#0a1535 100%);
  --card:rgba(16,42,107,.32);--card-h:rgba(16,42,107,.48);--card-b:rgba(112,135,187,.2);
  --glass:rgba(16,42,107,.28);--glass-b:rgba(112,135,187,.22);
  --accent:#7087BB;--accent2:#A2B7E4;--accent3:#BBD0ED;--accent4:#cca273;
  --text:#BBD0ED;--text2:#5a7099;--text3:#E5EDFA;--text-m:#4a5a7a;
  --core:#CCA273;--long:#8BA4CC;--recent:#B8CAE0;--rp:#9A8BB8;
  --sh:0 2px 16px rgba(0,0,0,.3);--sh-h:0 8px 32px rgba(10,21,53,.5);
  --quote:rgba(112,135,187,.08);--nav-bg:rgba(7,14,40,.92);
  --orb1:rgba(16,42,107,.5);--orb2:rgba(112,135,187,.15);--orb3:rgba(162,183,228,.08);
  --badge:rgba(112,135,187,.12);--divider:rgba(112,135,187,.15);
  --star-map-orbit:rgba(112,135,187,.25);--star-map-glow:rgba(187,208,237,.6);
  --bubble-ai:rgba(30,58,130,.65);--bubble-ai-b:rgba(112,135,187,.35);
}
[data-theme="amber"]{
  --bg1:#1a1410;--bg2:#2a2018;--bg3:#3a2e22;--bg4:#0f0c08;
  --grad:linear-gradient(150deg,#1a1410 0%,#2a2018 35%,#241c14 65%,#0f0c08 100%);
  --card:rgba(42,32,24,.45);--card-h:rgba(58,46,34,.6);--card-b:rgba(204,162,115,.18);
  --glass:rgba(42,32,24,.4);--glass-b:rgba(204,162,115,.18);
  --accent:#cca273;--accent2:#e8c9a0;--accent3:#a67c52;--accent4:#d4a574;
  --text:#d4c4b0;--text2:#8a7560;--text3:#f0e6d8;--text-m:#6a5a48;
  --core:#C4956A;--long:#B8A488;--recent:#D4C4A8;--rp:#A89098;
  --sh:0 2px 16px rgba(0,0,0,.35);--sh-h:0 8px 32px rgba(0,0,0,.5);
  --quote:rgba(204,162,115,.06);--nav-bg:rgba(26,20,16,.94);
  --orb1:rgba(204,162,115,.08);--orb2:rgba(42,32,24,.4);--orb3:rgba(204,162,115,.05);
  --badge:rgba(204,162,115,.1);--divider:rgba(204,162,115,.12);
  --star-map-orbit:rgba(204,162,115,.2);--star-map-glow:rgba(204,162,115,.5);
  --bubble-ai:rgba(62,48,36,.7);--bubble-ai-b:rgba(204,162,115,.28);
}

/* ══════ BODY ══════ */
body{
  background:var(--grad);color:var(--text);min-height:100vh;
  font-family:'JH','Noto Serif SC','Cormorant Garamond',serif;
  line-height:1.8;transition:background .6s,color .4s;
  position:relative;overflow-x:hidden;
}
body::before,body::after{content:'';position:fixed;border-radius:50%;pointer-events:none;z-index:0}
body::before{width:55vw;height:55vw;top:-12%;left:-12%;background:radial-gradient(circle,var(--orb1),transparent 70%)}
body::after{width:45vw;height:45vw;bottom:-8%;right:-8%;background:radial-gradient(circle,var(--orb2),transparent 70%)}
.ui{font-family:'Noto Sans SC',sans-serif}
.en{font-family:'Cormorant Garamond',serif}
::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--card-b);border-radius:2px}

/* ══════ PARTICLES (star/amber) ══════ */
#particles{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.ptc{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;animation:twinkle ease-in-out infinite alternate}
.ptc-glow{width:3px;height:3px;background:radial-gradient(circle,var(--accent4,.6),transparent 70%)}
@keyframes twinkle{from{opacity:.15;transform:scale(.7)}to{opacity:.9;transform:scale(1.3)}}

/* decorative symbols */
.deco-sym{position:fixed;pointer-events:none;z-index:0;animation:drift 22s ease-in-out infinite;color:var(--accent);opacity:.12;font-size:14px}
@keyframes drift{0%,100%{transform:translate(0,0) rotate(0)}33%{transform:translate(10px,-15px) rotate(60deg)}66%{transform:translate(-8px,8px) rotate(120deg)}}

/* ══════ LOGIN ══════ */
#login-screen{display:flex;align-items:center;justify-content:center;min-height:100vh;position:relative;z-index:1;padding-top:env(safe-area-inset-top,0)}
.login-box{width:360px;text-align:center;padding:3rem 2.4rem;position:relative;background:var(--glass);border:1px solid var(--glass-b);border-radius:20px;backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);box-shadow:var(--sh-h)}
.login-box::before{content:'';position:absolute;top:50%;left:50%;width:400px;height:400px;transform:translate(-50%,-50%);border:1px solid var(--accent);opacity:.08;border-radius:50%;pointer-events:none}
.login-box::after{content:'';position:absolute;top:50%;left:50%;width:460px;height:460px;transform:translate(-50%,-50%) rotate(18deg);border:1px solid var(--accent2);opacity:.04;border-radius:50%;pointer-events:none}
.login-title{font-size:2.6rem;color:var(--accent2);letter-spacing:.22em;margin-bottom:.1rem;line-height:1.3;text-shadow:0 0 30px var(--orb1)}
.login-sub{font-size:.72rem;color:var(--text2);letter-spacing:.25em;margin-bottom:.5rem;font-family:'Noto Sans SC',sans-serif;font-weight:300}
.login-verse{font-family:'Zhi Mang Xing',cursive;font-size:1rem;color:var(--text-m);margin-bottom:2.2rem;letter-spacing:.06em}
.login-input{width:100%;background:var(--card);border:1px solid var(--card-b);border-radius:12px;padding:.85rem 1rem;color:var(--text3);font-size:.88rem;font-family:'JH',serif;outline:none;text-align:center;letter-spacing:.15em;transition:.3s}
.login-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(113,129,200,.12)}
.login-btn{width:100%;margin-top:.7rem;background:var(--accent);color:#fff;border:none;border-radius:12px;padding:.85rem;font-size:.85rem;font-family:'Noto Sans SC',sans-serif;font-weight:500;cursor:pointer;letter-spacing:.12em;transition:.25s}
.login-btn:hover{filter:brightness(1.15);transform:translateY(-1px)}
.login-err{margin-top:.6rem;font-size:.72rem;color:var(--core);display:none}

/* ══════ APP SHELL ══════ */
#app{display:none;min-height:100vh;position:relative;z-index:1}

/* ═══ TOP HEADER ═══ */
.top-header{
  padding:.6rem 1.2rem;display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;
  position:sticky;top:0;z-index:100;
  background:var(--glass);border-bottom:1px solid var(--card-b);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
}
.h-title{font-size:1.2rem;color:var(--accent2);letter-spacing:.1em;white-space:nowrap;text-shadow:0 0 20px var(--orb1)}
.h-stats{display:flex;gap:.6rem;font-size:.65rem;color:var(--text2);flex-wrap:wrap;font-family:'Noto Sans SC',sans-serif}
.h-stat{display:flex;align-items:center;gap:.2rem}
.h-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}
.h-right{margin-left:auto;display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}
.theme-sw{display:flex;gap:2px;background:var(--card);border-radius:8px;padding:2px}
.t-btn{width:28px;height:24px;border-radius:6px;font-size:.6rem;display:flex;align-items:center;justify-content:center;background:transparent;color:var(--text2);transition:.2s;font-family:'Noto Sans SC',sans-serif}
.t-btn.active{background:var(--accent);color:#fff;opacity:.9}
.btn{padding:.28rem .65rem;border-radius:8px;font-size:.7rem;font-family:'Noto Sans SC',sans-serif;cursor:pointer;border:1px solid var(--card-b);background:var(--card);color:var(--text2);transition:.2s;white-space:nowrap;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.btn:hover{border-color:var(--accent);color:var(--accent2)}
.btn-p{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-p:hover{filter:brightness(1.15)}
.btn-d{color:var(--core);border-color:rgba(212,107,107,.2)}.btn-d:hover{background:rgba(212,107,107,.06)}

/* ═══ NAV TABS ═══ */
.nav-tabs{
  display:flex;gap:0;border-bottom:1px solid var(--card-b);
  background:var(--glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  position:sticky;top:49px;z-index:99;overflow-x:auto;
}
.nav-tab{
  padding:.5rem 1.1rem;font-size:.75rem;cursor:pointer;color:var(--text2);
  border-bottom:2px solid transparent;transition:.2s;
  font-family:'Noto Sans SC',sans-serif;white-space:nowrap;
}
.nav-tab:hover{color:var(--text)}.nav-tab.active{color:var(--accent2);border-bottom-color:var(--accent)}

/* ═══ BOTTOM NAV (mobile) ═══ */
.bottom-nav{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:100;
  height:calc(62px + env(safe-area-inset-bottom,0));background:var(--nav-bg);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-top:1px solid var(--card-b);
  align-items:center;justify-content:space-around;
  padding-bottom:env(safe-area-inset-bottom,0);
}
.bnav-item{display:flex;flex-direction:column;align-items:center;gap:.15rem;color:var(--text-m);transition:.2s;padding:.2rem .6rem}
.bnav-item.active{color:var(--accent)}
.bnav-icon{font-size:1.05rem}.bnav-label{font-size:.55rem;font-family:'Noto Sans SC',sans-serif;letter-spacing:.02em}
.bnav-center{
  width:42px;height:42px;border-radius:50%;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:1.1rem;box-shadow:0 3px 12px var(--sh);margin-top:-8px;
}

/* ═══ PAGE CONTAINERS ═══ */
.page{display:none}.page.active{display:block}

/* ══════ HOME PAGE ══════ */
.home{padding:1.2rem;max-width:680px;margin:0 auto}
.home-greeting{text-align:center;padding:1.5rem 0 .5rem}
.home-date{font-family:'Noto Sans SC',sans-serif;font-size:.68rem;color:var(--text-m);letter-spacing:.08em}
.home-hi{font-size:1.3rem;font-weight:400;color:var(--text3);margin-top:.2rem}
.home-counter{text-align:center;padding:1rem 0}
.counter-num{font-family:'Cormorant Garamond','Noto Serif SC',serif;font-size:3.2rem;font-weight:300;color:var(--accent);line-height:1;text-shadow:0 2px 20px var(--orb1)}
.counter-label{font-family:'Noto Sans SC',sans-serif;font-size:.72rem;color:var(--text-m);letter-spacing:.1em;margin-top:.3rem}
.counter-ann{font-family:'Noto Sans SC',sans-serif;font-size:.65rem;color:var(--accent2);margin-top:.2rem}
.counter-quote{font-family:'Zhi Mang Xing',cursive;font-size:1rem;color:var(--text2);margin-top:.8rem;letter-spacing:.04em}
.ornament{text-align:center;padding:.6rem 0;color:var(--text-m);font-size:.7rem;letter-spacing:.4em;opacity:.4}

/* glass card base */
.gc{background:var(--card);border:1px solid var(--card-b);border-radius:14px;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:var(--sh);transition:.25s}
.gc:hover{background:var(--card-h);box-shadow:var(--sh-h)}

.sec-hdr{display:flex;align-items:center;gap:.4rem;margin-bottom:.7rem;padding:0 .2rem}
.sec-icon{font-size:.85rem;color:var(--accent)}
.sec-title{font-family:'Noto Serif SC',serif;font-size:.92rem;font-weight:500;color:var(--text3);letter-spacing:.04em}
.sec-sub{font-family:'Noto Sans SC',sans-serif;font-size:.63rem;color:var(--text-m);margin-left:auto;cursor:pointer}
.sec-sub:hover{color:var(--accent)}

/* today memory */
.today-card{padding:1.1rem 1.2rem;margin-bottom:1.2rem;cursor:pointer}
.today-date{font-family:'Noto Sans SC',sans-serif;font-size:.64rem;color:var(--accent2);letter-spacing:.05em;margin-bottom:.4rem}
.today-text{font-size:.88rem;color:var(--text3);line-height:1.85}
.today-tags{display:flex;gap:.4rem;margin-top:.6rem;flex-wrap:wrap}
.tag{font-family:'Noto Sans SC',sans-serif;font-size:.6rem;padding:.12rem .5rem;border-radius:20px;background:var(--badge);color:var(--accent);letter-spacing:.02em}

/* stats row */
.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin-bottom:1.2rem}
.stat-card{padding:.9rem .6rem;text-align:center}
.stat-num{font-family:'Cormorant Garamond','Noto Serif SC',serif;font-size:1.5rem;font-weight:400;color:var(--accent)}
.stat-lbl{font-family:'Noto Sans SC',sans-serif;font-size:.6rem;color:var(--text-m);margin-top:.1rem}

/* module grid */
.mod-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;margin-bottom:1.2rem}
.mod-card{padding:1rem .9rem 1.1rem;position:relative;overflow:hidden;cursor:pointer}
.mod-icon{font-size:1.3rem;margin-bottom:.35rem;display:block;color:var(--accent2)}
.mod-name{font-family:'Noto Serif SC',serif;font-size:.88rem;font-weight:500;color:var(--text3);margin-bottom:.25rem}
.mod-desc{font-family:'Noto Sans SC',sans-serif;font-size:.62rem;color:var(--text-m);line-height:1.4}
.mod-badge{position:absolute;top:.8rem;right:.8rem;font-family:'Noto Sans SC',sans-serif;font-size:.58rem;color:var(--accent2);background:var(--badge);padding:.1rem .4rem;border-radius:8px}

/* recent list on home */
.recent-item{padding:.8rem 1rem;border-bottom:1px solid var(--divider);cursor:pointer;transition:.2s}
.recent-item:last-child{border-bottom:none}
.recent-item:hover{background:var(--card-h)}
.ri-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.2rem}
.ri-date{font-family:'Noto Sans SC',sans-serif;font-size:.64rem;color:var(--accent2)}
.ri-tier{font-family:'Noto Sans SC',sans-serif;font-size:.56rem;padding:.08rem .35rem;border-radius:6px}
.ri-tier-core{background:color-mix(in srgb,var(--core) 12%,transparent);color:var(--core)}
.ri-tier-long_term{background:color-mix(in srgb,var(--long) 12%,transparent);color:var(--long)}
.ri-tier-recent{background:color-mix(in srgb,var(--recent) 15%,transparent);color:var(--recent)}
.ri-sum{font-size:.82rem;color:var(--text);line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ri-kws{display:flex;gap:.3rem;margin-top:.35rem;flex-wrap:wrap}
.ri-kw{font-family:'Noto Sans SC',sans-serif;font-size:.56rem;color:var(--text-m);background:var(--badge);padding:.06rem .32rem;border-radius:5px}

/* ══════ MEMORY LIST PAGE ══════ */
.mem-layout{display:grid;grid-template-columns:210px 1fr;flex:1;min-height:calc(100vh - 95px)}
.sidebar{border-right:1px solid var(--card-b);padding:1rem .8rem;position:sticky;top:91px;height:calc(100vh - 91px);overflow-y:auto;background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.f-sec{margin-bottom:1.1rem}
.f-label{font-size:.56rem;letter-spacing:.2em;color:var(--text2);text-transform:uppercase;margin-bottom:.35rem;display:block;font-family:'Noto Sans SC',sans-serif;font-weight:500}
.search-box,.sort-sel{width:100%;background:var(--card);border:1px solid var(--card-b);border-radius:9px;padding:.4rem .6rem;color:var(--text3);font-size:.75rem;font-family:'JH',serif;outline:none;transition:.3s}
.search-box:focus,.sort-sel:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(113,129,200,.1)}
.sort-sel{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%237087BB'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .6rem center}
.chips{display:flex;flex-wrap:wrap;gap:.22rem}
.chip{padding:.12rem .42rem;border-radius:20px;font-size:.62rem;cursor:pointer;border:1px solid var(--card-b);color:var(--text2);background:transparent;transition:.2s;user-select:none;font-family:'Noto Sans SC',sans-serif}
.chip:hover{border-color:var(--accent);color:var(--accent2)}
.chip.active{background:rgba(113,129,200,.12);border-color:var(--accent);color:var(--accent2)}
.chip[data-val=core].active{background:color-mix(in srgb,var(--core) 12%,transparent);border-color:var(--core);color:var(--core)}
.chip[data-val=long_term].active{background:color-mix(in srgb,var(--long) 12%,transparent);border-color:var(--long);color:var(--long)}
.chip[data-val=recent].active{background:color-mix(in srgb,var(--recent) 12%,transparent);border-color:var(--recent);color:var(--recent)}

.main-col{padding:1rem 1.2rem;overflow-y:auto;min-width:0}
.result-bar{font-size:.66rem;color:var(--text2);margin-bottom:.6rem;font-family:'Noto Sans SC',sans-serif}

/* random memory module */
.rand-mod{background:var(--card);border:1px solid var(--glass-b);border-left:3px solid var(--accent);border-radius:14px;padding:.9rem 1.1rem;margin-bottom:1rem;position:relative;overflow:hidden;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:var(--sh);cursor:pointer;transition:.3s}
.rand-mod:hover{border-color:var(--accent);box-shadow:var(--sh-h)}
.rand-label{font-family:'Noto Sans SC',sans-serif;font-size:.55rem;letter-spacing:.2em;color:var(--accent);text-transform:uppercase;margin-bottom:.3rem}
.rand-title{font-size:.95rem;color:var(--text3);margin-bottom:.2rem;line-height:1.6}
.rand-sum{font-size:.8rem;color:var(--text);line-height:1.8}
.rand-date{font-size:.63rem;color:var(--text2);margin-top:.3rem;font-family:'Noto Sans SC',sans-serif}
.rand-deco{position:absolute;top:8px;right:12px;font-size:.65rem;color:var(--accent);opacity:.35;letter-spacing:.2em}

/* memory cards */
.grid{display:flex;flex-direction:column;gap:.45rem}
.card{background:var(--card);border:1px solid var(--card-b);border-radius:13px;padding:.75rem 1rem;cursor:pointer;transition:.25s;box-shadow:var(--sh);position:relative;overflow:hidden;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.card:hover{background:var(--card-h);border-color:var(--accent);box-shadow:var(--sh-h);transform:translateY(-1px)}
.card.expanded{border-color:var(--accent)}
.card.expanded::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),var(--accent2),transparent);opacity:.7}
.c-head{display:flex;align-items:center;gap:.4rem;margin-bottom:.25rem;flex-wrap:wrap}
.tier{padding:.06rem .36rem;border-radius:5px;font-size:.56rem;font-weight:500;font-family:'Noto Sans SC',sans-serif}
.tier-core{background:color-mix(in srgb,var(--core) 12%,transparent);color:var(--core)}.tier-long_term{background:color-mix(in srgb,var(--long) 12%,transparent);color:var(--long)}.tier-recent{background:color-mix(in srgb,var(--recent) 15%,transparent);color:var(--recent)}
.c-type{padding:.06rem .36rem;border-radius:5px;font-size:.56rem;color:var(--text2);background:var(--badge);font-family:'Noto Sans SC',sans-serif}
.c-rp{padding:.06rem .36rem;border-radius:5px;font-size:.56rem;background:rgba(168,139,205,.08);color:var(--rp);font-family:'Noto Sans SC',sans-serif}
.c-date{font-size:.6rem;color:var(--text2);margin-left:auto;font-family:'Noto Sans SC',sans-serif}
.c-title{font-size:.9rem;color:var(--text3);margin-bottom:.2rem;line-height:1.6}
.c-sum{font-size:.8rem;color:var(--text);line-height:1.8;opacity:.9}
.c-kws{margin-top:.35rem;display:flex;flex-wrap:wrap;gap:.2rem}
.kw{padding:.04rem .34rem;background:var(--card);border:1px solid var(--card-b);border-radius:4px;font-size:.58rem;color:var(--text2);font-family:'Noto Sans SC',sans-serif}
.c-detail{display:none;margin-top:.65rem;padding-top:.65rem;border-top:1px solid var(--card-b)}
.card.expanded .c-detail{display:block;animation:fadeIn .3s}
.c-quote{font-size:.8rem;color:var(--accent2);line-height:2;padding:.65rem .9rem;border-left:2px solid var(--accent);background:var(--quote);border-radius:0 10px 10px 0;margin-bottom:.65rem;white-space:pre-wrap;word-break:break-word;position:relative}
.c-quote::before{content:'"';position:absolute;font-size:2.4rem;font-family:'Zhi Mang Xing',cursive;color:var(--accent);opacity:.25;top:-.3rem;left:.1rem;line-height:1}
.d-row{display:flex;gap:.4rem;margin-bottom:.3rem;font-size:.75rem}
.d-k{color:var(--text2);min-width:58px;font-family:'Noto Sans SC',sans-serif;font-size:.66rem}
.d-v{color:var(--text);line-height:1.6;word-break:break-word}
.d-acts{display:flex;gap:.4rem;margin-top:.65rem;flex-wrap:wrap}
.w-high{color:var(--core)}.w-mid{color:var(--accent2)}.w-low{color:var(--text2)}
.pagi{display:flex;justify-content:center;gap:.25rem;margin-top:1.2rem;padding-bottom:2rem;flex-wrap:wrap}
.pg{padding:.25rem .5rem;background:var(--card);border:1px solid var(--card-b);border-radius:7px;color:var(--text2);font-size:.66rem;cursor:pointer;font-family:'Noto Sans SC',sans-serif;transition:.2s;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.pg:hover{border-color:var(--accent);color:var(--accent2)}.pg.active{background:var(--accent);border-color:var(--accent);color:#fff}.pg:disabled{opacity:.3;cursor:not-allowed}
.empty{text-align:center;padding:3rem 2rem;color:var(--text2);font-size:.82rem;line-height:2}

/* ══════ INNER WORLD ══════ */
.inner-tab.active{color:var(--accent2) !important;border-bottom-color:var(--accent) !important}
.inner-panel{animation:fadeIn .3s}
.locked-card{position:relative;overflow:hidden}
.locked-card .locked-content{filter:blur(8px);user-select:none;pointer-events:none}
.locked-card .locked-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(0,0,0,.05);border-radius:10px;cursor:pointer;z-index:1}
.locked-card .locked-overlay span{font-size:1.2rem;margin-bottom:.2rem}
.locked-card .locked-overlay small{font-size:.55rem;color:var(--text-m)}
.corridor-note{background:var(--card);border:1px solid var(--card-b);border-radius:10px;padding:.6rem .7rem;min-width:140px;max-width:100%;flex:1 1 45%;position:relative;transition:.2s;font-family:'JH',serif;font-size:.72rem;line-height:1.6;color:var(--text3)}
.corridor-note::before{content:'📌';position:absolute;top:-.3rem;right:.4rem;font-size:.7rem;opacity:.4}
.corridor-note.huai-note{background:linear-gradient(135deg,var(--card),rgba(204,162,115,.08));border-color:var(--accent4);border-style:dashed}
.corridor-note.huai-note::before{content:'🦊';opacity:.55}
#huai-note-box{overflow:hidden;transition:max-height .3s ease,opacity .25s;max-height:0;opacity:0}
#huai-note-box.open{max-height:160px;opacity:1}

/* ══════ STAR MAP PAGE ══════ */
.starmap-wrap{display:flex;flex-direction:column;align-items:center;padding:1.5rem;min-height:calc(100vh - 95px);position:relative;overflow:hidden}
/* 每个主题的星图页背景——半透明叠加，让body粒子透上来 + 极光光斑 */
.starmap-wrap::before{content:'';position:absolute;inset:0;z-index:-1;transition:background .6s}
.starmap-wrap::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none}
[data-theme="mist"] .starmap-wrap::before{
  background:radial-gradient(ellipse at 50% 50%,rgba(20,12,40,.6) 0%,rgba(15,8,30,.7) 50%,rgba(10,6,24,.75) 100%);
}
[data-theme="mist"] .starmap-wrap::after{
  background:
    radial-gradient(ellipse at 25% 20%,rgba(140,80,220,.18) 0%,transparent 45%),
    radial-gradient(ellipse at 75% 70%,rgba(80,100,220,.14) 0%,transparent 40%),
    radial-gradient(ellipse at 60% 30%,rgba(180,120,255,.08) 0%,transparent 35%),
    radial-gradient(ellipse at 35% 80%,rgba(100,140,240,.1) 0%,transparent 35%);
  animation:auroraShift 20s ease-in-out infinite alternate;
}
@keyframes auroraShift{
  0%{opacity:.8;transform:scale(1) rotate(0deg)}
  50%{opacity:1;transform:scale(1.02) rotate(.5deg)}
  100%{opacity:.85;transform:scale(1.01) rotate(-.5deg)}
}
[data-theme="star"] .starmap-wrap::before{
  background:radial-gradient(ellipse at 50% 45%,rgba(13,26,64,.35) 0%,rgba(7,14,40,.45) 40%,rgba(4,8,24,.55) 80%);
}
[data-theme="star"] .starmap-wrap::after{
  background:
    radial-gradient(ellipse at 30% 25%,rgba(60,100,180,.06) 0%,transparent 40%),
    radial-gradient(ellipse at 70% 75%,rgba(40,80,160,.05) 0%,transparent 35%);
}
[data-theme="amber"] .starmap-wrap::before{
  background:radial-gradient(ellipse at 50% 45%,rgba(24,18,12,.45) 0%,rgba(14,10,6,.55) 40%,rgba(8,6,4,.65) 80%);
}
[data-theme="amber"] .starmap-wrap::after{
  background:
    radial-gradient(ellipse at 35% 30%,rgba(204,162,115,.05) 0%,transparent 40%),
    radial-gradient(ellipse at 65% 70%,rgba(180,140,90,.04) 0%,transparent 35%);
}
/* 星图页内文字颜色强制适配深色背景 */
.starmap-wrap .starmap-title{color:#BBD0ED}
.starmap-wrap .starmap-sub{color:rgba(187,208,237,.5)}
[data-theme="mist"] .starmap-wrap .starmap-title{color:#c8b8e8}
[data-theme="mist"] .starmap-wrap .starmap-sub{color:rgba(200,184,232,.45)}
[data-theme="amber"] .starmap-wrap .starmap-title{color:#e8c9a0}
[data-theme="amber"] .starmap-wrap .starmap-sub{color:rgba(232,201,160,.45)}
.starmap-title{font-family:'Noto Serif SC',serif;font-size:1.1rem;color:var(--accent2);letter-spacing:.1em;margin-bottom:.3rem}
.starmap-sub{font-family:'Noto Sans SC',sans-serif;font-size:.65rem;color:var(--text-m);margin-bottom:1rem}
#starmap-canvas{border-radius:50%;cursor:crosshair;max-width:100%}
.starmap-legend{display:flex;gap:1rem;margin-top:1rem;flex-wrap:wrap;justify-content:center}
.legend-item{display:flex;align-items:center;gap:.3rem;font-family:'Noto Sans SC',sans-serif;font-size:.6rem;color:var(--text2)}
.legend-dot{width:8px;height:8px;border-radius:50%}
.starmap-tooltip{
  position:fixed;z-index:200;
  background:var(--card-h);border:1px solid var(--accent);border-radius:12px;
  padding:.8rem 1rem;max-width:280px;
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  box-shadow:var(--sh-h);display:none;pointer-events:none;
}
.stt-tier{font-family:'Noto Sans SC',sans-serif;font-size:.55rem;margin-bottom:.2rem}
.stt-title{font-size:.85rem;color:var(--text3);margin-bottom:.15rem}
.stt-date{font-family:'Noto Sans SC',sans-serif;font-size:.6rem;color:var(--accent2)}

/* ══════ IDENTITY PAGE ══════ */
#id-page{padding:1.5rem;max-width:880px;margin:0 auto}
.id-header{background:var(--card);border:1px solid var(--glass-b);border-radius:18px;padding:2rem 2rem 1.5rem;margin-bottom:1.1rem;text-align:center;position:relative;overflow:hidden;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:var(--sh)}
.id-header::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--orb1),transparent 60%,var(--orb2));pointer-events:none}
.id-name{font-size:2rem;color:var(--accent2);letter-spacing:.15em;position:relative;text-shadow:0 0 24px var(--orb1)}
.id-belief{font-size:.8rem;color:var(--text);margin-top:.4rem;line-height:1.8;position:relative}
.id-stat-row{display:flex;justify-content:center;gap:2rem;margin-top:1rem;position:relative}
.id-stat{text-align:center}.id-stat-num{font-size:1.4rem;color:var(--accent);font-family:'Cormorant Garamond',sans-serif;font-weight:600}.id-stat-label{font-size:.58rem;color:var(--text2);font-family:'Noto Sans SC',sans-serif}
.id-sec{background:var(--card);border:1px solid var(--card-b);border-radius:14px;padding:1.1rem 1.3rem;margin-bottom:.8rem;box-shadow:var(--sh);position:relative;overflow:hidden;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:.3s}
.id-sec:hover{box-shadow:var(--sh-h)}
.id-sec h3{font-size:.9rem;color:var(--accent2);font-weight:400;margin-bottom:.8rem;letter-spacing:.06em;display:flex;align-items:center;gap:.45rem}
.id-sec h3::before{content:'◇';font-size:.45rem;color:var(--accent);opacity:.5}
.id-sec h3::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--card-b),transparent)}
.id-sec-deco{position:absolute;top:8px;right:12px;font-size:.8rem;color:var(--accent);opacity:.2}
.id-row{display:grid;grid-template-columns:90px 1fr;gap:.4rem;margin-bottom:.45rem;font-size:.78rem}
.id-k{color:var(--text2);font-family:'Noto Sans SC',sans-serif;font-size:.68rem;padding-top:.1rem}
.id-v{color:var(--text3);line-height:1.75;word-break:break-word}
.id-tags{display:flex;flex-wrap:wrap;gap:.2rem}
.id-tag{padding:.08rem .42rem;background:var(--badge);border:1px solid var(--card-b);border-radius:5px;font-size:.65rem;color:var(--text)}
.letter{font-size:.8rem;color:var(--accent2);line-height:2.1;padding:1rem 1.2rem;border-left:3px solid var(--accent);background:var(--quote);border-radius:0 12px 12px 0;white-space:pre-wrap;word-break:break-word}
.promise{padding:.55rem .75rem;background:var(--badge);border:1px solid var(--card-b);border-radius:9px;margin-bottom:.4rem;font-size:.78rem;line-height:1.7}
.promise-c{color:var(--text3);margin-bottom:.15rem}.promise-m{font-size:.62rem;color:var(--text2);font-family:'Noto Sans SC',sans-serif}
.upload-zone{border:2px dashed var(--card-b);border-radius:14px;padding:1.8rem;text-align:center;cursor:pointer;transition:.25s;margin-bottom:1rem}
.upload-zone:hover{border-color:var(--accent);background:rgba(113,129,200,.04)}
.upload-zone p{font-size:.78rem;color:var(--text2);line-height:1.8}.upload-zone em{color:var(--accent2);font-style:normal}

/* ══════ MODALS ══════ */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:200;display:none;align-items:center;justify-content:center;padding:1rem;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.modal-bg.show{display:flex}
.modal{background:var(--card-h);border:1px solid var(--card-b);border-radius:16px;padding:1.4rem;width:min(540px,100%);max-height:90vh;overflow-y:auto;box-shadow:0 16px 48px rgba(0,0,0,.25);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.modal h2{font-size:1rem;color:var(--accent2);margin-bottom:1rem;letter-spacing:.05em}
.f-row{margin-bottom:.7rem}
.f-lbl{font-size:.62rem;color:var(--text2);letter-spacing:.05em;margin-bottom:.25rem;display:block;font-family:'Noto Sans SC',sans-serif}
.f-in,.f-ta,.f-sel{width:100%;background:var(--card);border:1px solid var(--card-b);border-radius:9px;padding:.42rem .62rem;color:var(--text3);font-size:.78rem;font-family:'JH',serif;outline:none;transition:.3s}
.f-in:focus,.f-ta:focus,.f-sel:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(113,129,200,.1)}
.f-ta{resize:vertical;min-height:68px;line-height:1.7}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.m-acts{display:flex;gap:.5rem;justify-content:flex-end;margin-top:1rem}
.imp-drop{border:2px dashed var(--card-b);border-radius:12px;padding:1.4rem;text-align:center;cursor:pointer;transition:.25s;margin-bottom:.6rem}
.imp-drop:hover,.imp-drop.dragover{border-color:var(--accent);background:rgba(113,129,200,.04)}
.imp-drop p{font-size:.75rem;color:var(--text2)}.imp-drop em{color:var(--accent2);font-style:normal}

/* ══════ TOAST ══════ */
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);background:var(--card-h);border:1px solid var(--accent);color:var(--accent2);padding:.45rem 1.1rem;border-radius:10px;font-size:.76rem;z-index:300;opacity:0;transition:.3s;pointer-events:none;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--sh-h)}
.toast.show{opacity:1}

@keyframes fadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* ══════ RESPONSIVE ══════ */
@media(max-width:768px){
  .top-header{padding:.4rem .6rem;padding-top:max(44px, calc(.4rem + env(safe-area-inset-top,44px)));gap:.3rem;flex-wrap:nowrap;overflow-x:auto}
  .h-title{font-size:.88rem;min-width:0}
  .h-stats{display:none}
  .nav-tabs{display:none}
  .h-right{gap:.25rem;flex-wrap:nowrap;flex-shrink:0}
  .h-right>.btn:not(.f-btn-mobile):not([onclick*="showAdd"]){display:none !important}
  .theme-sw{display:none}
  .btn{padding:.22rem .42rem;font-size:.64rem}
  .mem-layout{grid-template-columns:1fr}
  .sidebar{display:none}
  .sidebar.m-show{display:block;position:fixed;inset:0;z-index:150;background:var(--bg1);padding:1rem;overflow-y:auto;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
  .main-col{padding:.7rem .8rem}
  .card{padding:.65rem .8rem}.c-title{font-size:.85rem}
  #id-page{padding:.8rem}
  .id-row{grid-template-columns:1fr;gap:.08rem}
  .f-grid{grid-template-columns:1fr}
  .modal{padding:1rem}
  .home{padding:.8rem}
  .f-btn-mobile{display:flex !important}
  #app{padding-bottom:calc(68px + env(safe-area-inset-bottom,0))}
}
@media(min-width:769px){
  .f-btn-mobile{display:none !important}
}
.f-btn-mobile{display:none;align-items:center;gap:.25rem}

/* ══════ CHAT PAGE ══════ */
.chat-layout{display:grid;grid-template-columns:240px 1fr;height:calc(100vh - 100px);overflow:hidden}
.chat-sidebar{background:var(--glass);border-right:1px solid var(--card-b);display:flex;flex-direction:column;overflow:hidden;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.chat-sb-head{padding:.6rem .8rem;border-bottom:1px solid var(--divider);display:flex;align-items:center;gap:.4rem}
.chat-sb-head .btn{flex:1;text-align:center;font-size:.68rem}
.chat-sb-list{flex:1;overflow-y:auto;padding:.3rem}
.chat-conv{padding:.55rem .7rem;border-radius:10px;cursor:pointer;margin-bottom:2px;transition:.2s;position:relative}
.chat-conv:hover{background:var(--card)}
.chat-conv.active{background:var(--card-h);border:1px solid var(--card-b)}
.chat-conv-title{font-size:.78rem;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:'Noto Sans SC',sans-serif}
.chat-conv-preview{font-size:.62rem;color:var(--text-m);margin-top:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-conv-del{font-size:.7rem;color:var(--text-m);opacity:0;transition:.2s;padding:2px 5px;border-radius:4px;cursor:pointer}
.chat-conv:hover .chat-conv-del{opacity:.6}
.chat-conv-del:hover{opacity:1;color:var(--core)}
.chat-conv-acts{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:flex;gap:2px}

.chat-main{display:flex;flex-direction:column;overflow:hidden}
.chat-topbar{padding:.4rem .8rem;display:flex;align-items:center;gap:.6rem;border-bottom:1px solid var(--divider);background:var(--glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);flex-shrink:0;transition:background .3s}
.chat-topbar-settings-mobile{display:none}
/* ── 三色主题球 ── */
.theme-orbs{display:flex;gap:6px;align-items:center}
.theme-orb{width:14px;height:14px;border-radius:50%;cursor:pointer;transition:transform .2s,box-shadow .25s;border:1.5px solid rgba(255,255,255,.15);position:relative}
.theme-orb:hover{transform:scale(1.2)}
.theme-orb.active{box-shadow:0 0 0 2.5px var(--bg4),0 0 0 4px currentColor;transform:scale(1.15)}
.theme-orb[data-t="mist"]{background:linear-gradient(135deg,#e8b4f0,#b7c8f4);color:#b7c8f4}
.theme-orb[data-t="star"]{background:linear-gradient(135deg,#7087BB,#BBD0ED);color:#7087BB}
.theme-orb[data-t="amber"]{background:linear-gradient(135deg,#cca273,#e8c9a0);color:#cca273}
.chat-mode-toggle{display:flex;gap:2px;background:var(--card);border-radius:8px;padding:2px}
.chat-mode-btn{padding:.22rem .55rem;border-radius:6px;font-size:.66rem;cursor:pointer;transition:.2s;color:var(--text2);font-family:'Noto Sans SC',sans-serif;white-space:nowrap}
.chat-mode-btn.active{background:var(--accent);color:#fff}
.chat-model-sel{background:var(--card);border:1px solid var(--card-b);border-radius:8px;padding:.22rem .5rem;font-size:.66rem;color:var(--text);font-family:'Noto Sans SC',sans-serif;outline:none;max-width:260px}
.chat-topbar-title{font-size:.82rem;color:var(--text3);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-quick-settings{padding:.3rem .8rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;border-bottom:1px solid var(--divider);background:var(--glass);font-size:.62rem;color:var(--text2);font-family:'Noto Sans SC',sans-serif}
.chat-quick-settings label{display:flex;align-items:center;gap:.3rem;white-space:nowrap}
.chat-quick-settings input[type=range]{width:70px;accent-color:var(--accent)}
.chat-quick-settings input[type=number]{background:var(--card);border:1px solid var(--card-b);border-radius:4px;color:var(--text);padding:1px 4px;font-size:.62rem;text-align:center}
.chat-quick-settings input[type=checkbox]{accent-color:var(--accent)}
.chat-memory-tags{padding:.25rem .8rem;display:flex;gap:.3rem;flex-wrap:wrap;border-bottom:1px solid var(--divider);background:var(--glass);font-size:.55rem}
.mem-tag{padding:.1rem .4rem;border-radius:10px;background:var(--badge);color:var(--text2);cursor:default;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.chat-messages{flex:1;overflow-y:auto;padding:.8rem;display:flex;flex-direction:column;gap:.6rem}
.chat-msg{display:flex;gap:.5rem;max-width:88%;animation:fadeIn .3s}
.chat-msg.user{align-self:flex-end;flex-direction:row-reverse}
.chat-msg.assistant{align-self:flex-start}
.chat-avatar{width:32px;height:32px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.7rem;background:var(--card);border:1px solid var(--card-b);color:var(--accent);overflow:hidden}
.chat-avatar img{width:100%;height:100%;object-fit:cover}
.chat-bubble{padding:.65rem .9rem;border-radius:18px;font-size:.82rem;line-height:1.6;position:relative;word-break:break-word;transition:background .2s}
.chat-msg.user .chat-bubble{background:var(--accent);color:#fff;border-bottom-right-radius:6px;box-shadow:0 1px 6px rgba(112,135,187,.15)}
.chat-msg.assistant .chat-bubble{background:var(--bubble-ai,var(--card));border:1px solid var(--bubble-ai-b,var(--card-b));color:var(--text3);border-bottom-left-radius:6px}
/* 多气泡组 */
.chat-msg-group{display:flex;gap:.4rem;padding:.15rem 0;align-items:flex-start}
.chat-msg-group .chat-avatar{flex:none}
.chat-bubbles-col{display:flex;flex-direction:column;gap:.5rem;max-width:100%;overflow:hidden}
.chat-bubbles-col .multi-bubble{background:var(--bubble-ai,var(--card));border:1px solid var(--bubble-ai-b,var(--card-b));border-radius:18px;border-bottom-left-radius:6px;padding:.55rem .75rem;font-size:.82rem;line-height:1.6;word-break:break-word;animation:bubblePop .25s ease-out;max-width:85vw}
@keyframes bubblePop{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
/* 流式多气泡 */
.stream-bubble{animation:bubblePop .2s ease-out}
.stream-bubble .chat-bubble{margin-bottom:0}
/* 思考链 */
.chat-thinking-chain{font-size:.7rem;color:var(--text-m);font-style:italic;opacity:.6;padding:.2rem 0;animation:thinkPulse 1.5s ease-in-out infinite;cursor:pointer}
.chat-thinking-chain:hover{opacity:.9}
@keyframes thinkPulse{0%,100%{opacity:.4}50%{opacity:.8}}
.thinking-expand{font-size:.68rem;color:var(--text-m);line-height:1.6;padding:.4rem .6rem;margin:.3rem 0;background:var(--bg1);border-radius:8px;border-left:2px solid var(--accent);max-height:200px;overflow-y:auto;display:none;opacity:.7}
.thinking-expand.show{display:block}
/* 引用回复 */
.chat-quote-bar{display:flex;align-items:center;gap:.4rem;padding:.3rem .6rem;background:var(--glass);border-left:3px solid var(--accent);border-radius:0 8px 8px 0;margin-bottom:.3rem;font-size:.65rem;color:var(--text-m);animation:bubblePop .15s ease-out}
.chat-quote-bar .quote-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-quote-bar .quote-close{cursor:pointer;opacity:.5;font-size:.8rem}
.chat-quote-bar .quote-close:hover{opacity:1}
.chat-bubble .bubble-quote{border-left:2px solid var(--accent);padding-left:.4rem;margin-bottom:.3rem;font-size:.65rem;color:var(--text-m);opacity:.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
.chat-msg-time{font-size:.55rem;color:var(--text-m);margin-top:.2rem;font-family:'Noto Sans SC',sans-serif}
.chat-msg.user .chat-msg-time{text-align:right}
.chat-msg-meta{font-size:.55rem;color:var(--text-m);cursor:pointer;margin-top:.15rem;font-family:'Noto Sans SC',sans-serif;opacity:.5}
.chat-msg-meta:hover{opacity:.8}
.chat-msg-acts{display:none;gap:.4rem;margin-top:.3rem;flex-wrap:wrap;transition:opacity .2s}
.chat-msg:hover .chat-msg-acts,.chat-msg:active .chat-msg-acts,.chat-msg-acts.visible,.chat-msg-acts:focus-within,
.chat-msg-group:hover .chat-msg-acts,.chat-msg-group:active .chat-msg-acts{display:flex;opacity:.5}
.chat-msg-acts:hover,.chat-msg-group .chat-msg-acts:hover{opacity:1}
@media(max-width:768px){.chat-msg-acts{font-size:.55rem}}
.chat-msg-acts .btn{font-size:.58rem;padding:.12rem .4rem}
.chat-act-btn{font-size:.6rem;padding:.1rem .35rem;border-radius:6px;color:var(--text2);background:var(--badge);cursor:pointer;font-family:'Noto Sans SC',sans-serif;transition:.15s;border:none}
.chat-act-btn:hover{background:var(--accent);color:#fff}
.chat-act-btn.danger:hover{background:#c44;color:#fff}
.chat-edit-area{width:100%;margin-top:.3rem}
.chat-edit-area textarea{width:100%;min-height:60px;background:var(--glass);border:1px solid var(--card-b);border-radius:8px;color:var(--text3);padding:.4rem .6rem;font-size:.78rem;line-height:1.6;resize:vertical;font-family:inherit}
.chat-edit-area .edit-btns{display:flex;gap:.3rem;margin-top:.25rem;justify-content:flex-end}
.chat-edit-area .edit-btns button{font-size:.6rem;padding:.15rem .5rem;border-radius:6px;cursor:pointer;border:none;font-family:'Noto Sans SC',sans-serif}
.chat-edit-area .edit-btns .save-btn{background:var(--accent);color:#fff}
.chat-edit-area .edit-btns .cancel-btn{background:var(--badge);color:var(--text2)}
.chat-typing{color:var(--accent);font-size:.75rem;padding:.3rem .5rem;font-family:'Noto Sans SC',sans-serif;animation:pulse 1.5s infinite}
@keyframes pulse{0%,100%{opacity:.4}50%{opacity:1}}

.chat-input-area{padding:.5rem .8rem calc(.5rem + env(safe-area-inset-bottom,0px));border-top:1px solid var(--divider);background:var(--glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);flex-shrink:0;transition:padding .15s}
.chat-inject-pills{display:flex;gap:.3rem;flex-wrap:wrap;margin-bottom:.3rem;min-height:0}
.chat-inject-pill{display:inline-flex;align-items:center;gap:.25rem;padding:.12rem .45rem;border-radius:12px;font-size:.58rem;background:var(--badge);color:var(--accent);cursor:pointer;font-family:'Noto Sans SC',sans-serif;transition:.2s}
.chat-inject-pill:hover{background:var(--accent);color:#fff}
.chat-inject-pill .pill-x{font-size:.6rem;opacity:.6}
.chat-input-row{display:flex;gap:.4rem;align-items:flex-end}
.chat-textarea{flex:1;background:var(--card);border:1px solid var(--card-b);border-radius:12px;padding:.5rem .7rem;color:var(--text3);font-size:.82rem;font-family:'JH',serif;resize:none;outline:none;min-height:38px;max-height:120px;line-height:1.6;transition:.2s}
.chat-textarea:focus{border-color:var(--accent)}
.chat-send-btn{width:38px;height:38px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1rem;cursor:pointer;transition:.2s;flex-shrink:0}
.chat-send-btn:hover{filter:brightness(1.15);transform:scale(1.05)}
.chat-send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}
.chat-img-btn{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.85rem;cursor:pointer;color:var(--text-m);transition:.2s}
.chat-img-btn:hover{color:var(--accent);background:var(--card)}

/* slash command popup */
.slash-popup{position:absolute;bottom:100%;left:0;right:0;background:var(--card-h);border:1px solid var(--card-b);border-radius:10px;max-height:200px;overflow-y:auto;display:none;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:var(--sh-h);z-index:50;margin-bottom:4px}
.slash-popup.show{display:block}
.slash-item{padding:.4rem .7rem;cursor:pointer;font-size:.72rem;font-family:'Noto Sans SC',sans-serif;transition:.15s;display:flex;align-items:center;gap:.4rem}
.slash-item:hover,.slash-item.active{background:var(--accent);color:#fff;border-radius:6px}
.slash-cmd{color:var(--accent);font-weight:500;min-width:50px}.slash-item:hover .slash-cmd,.slash-item.active .slash-cmd{color:#fff}
.slash-label{color:var(--text2);font-size:.65rem}.slash-item:hover .slash-label,.slash-item.active .slash-label{color:rgba(255,255,255,.8)}

.chat-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--text-m);gap:.8rem;font-family:'Noto Sans SC',sans-serif}
.chat-empty-icon{font-size:2.5rem;opacity:.3}
.chat-empty-text{font-size:.82rem;letter-spacing:.06em}
.chat-empty-sub{font-size:.65rem;opacity:.5}

/* ═══ SETTINGS MODAL ═══ */
.settings-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.settings-bg.show{display:flex}
.settings-panel{width:90vw;max-width:640px;max-height:80vh;background:var(--bg2);border:1px solid var(--card-b);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--sh-h)}
.settings-head{padding:.7rem 1rem;border-bottom:1px solid var(--divider);display:flex;align-items:center;gap:.5rem}
.settings-head h2{font-size:.9rem;color:var(--text3);flex:1;font-family:'Noto Sans SC',sans-serif;font-weight:500}
.settings-tabs{display:flex;gap:0;border-bottom:1px solid var(--divider);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding-bottom:2px;flex-shrink:0}
.settings-tab{padding:.4rem .7rem;font-size:.68rem;cursor:pointer;color:var(--text-m);border-bottom:2px solid transparent;transition:.2s;font-family:'Noto Sans SC',sans-serif;white-space:nowrap;flex-shrink:0}
.settings-tab:hover{color:var(--text)}.settings-tab.active{color:var(--accent);border-bottom-color:var(--accent)}
.settings-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:.8rem 1rem;min-height:0}
.s-section{margin-bottom:1rem}
.s-section h3{font-size:.78rem;color:var(--accent);margin-bottom:.4rem;font-family:'Noto Sans SC',sans-serif;font-weight:500}
.s-item{display:flex;align-items:center;gap:.5rem;padding:.4rem .5rem;border-radius:8px;margin-bottom:.3rem;background:var(--card);border:1px solid var(--card-b)}
.s-item-name{flex:1;font-size:.72rem;color:var(--text3);font-family:'Noto Sans SC',sans-serif}
.s-item-sub{font-size:.6rem;color:var(--text-m)}
.s-toggle{width:36px;height:20px;border-radius:10px;background:var(--card-b);cursor:pointer;position:relative;transition:.3s;flex-shrink:0}
.s-toggle.on{background:var(--accent)}
.s-toggle::after{content:'';width:16px;height:16px;border-radius:50%;background:#fff;position:absolute;top:2px;left:2px;transition:.3s}
.s-toggle.on::after{left:18px}
.s-form-row{display:flex;gap:.4rem;margin-bottom:.4rem;align-items:center}
.s-form-row label{font-size:.68rem;color:var(--text2);min-width:60px;font-family:'Noto Sans SC',sans-serif}
.s-form-row input,.s-form-row select{flex:1;background:var(--card);border:1px solid var(--card-b);border-radius:6px;padding:.3rem .5rem;font-size:.7rem;color:var(--text3);outline:none;font-family:'Noto Sans SC',sans-serif}
.s-form-row textarea{flex:1;background:var(--card);border:1px solid var(--card-b);border-radius:6px;padding:.3rem .5rem;font-size:.7rem;color:var(--text3);outline:none;font-family:'JH',serif;min-height:80px;resize:vertical;line-height:1.6}
.s-form-row input:focus,.s-form-row select:focus,.s-form-row textarea:focus{border-color:var(--accent)}
.s-acts{display:flex;gap:.3rem;justify-content:flex-end;margin-top:.5rem}

/* responsive chat */
@media(max-width:768px){
  :root{--app-vh:100vh;--kb-inset:0px;--vp-top:0px}
  #page-chat{overflow:hidden;height:var(--app-vh,100vh);position:fixed;top:var(--vp-top,0px);left:0;right:0;z-index:20}
  :root:not(.keyboard-open) #page-chat{padding-bottom:calc(62px + env(safe-area-inset-bottom,0px))}
  :root.keyboard-open #page-chat{padding-bottom:0}
  :root.keyboard-open.chat-active #bottom-nav{display:none !important}
  :root.keyboard-open.chat-active,:root.keyboard-open.chat-active body{overflow:hidden !important;height:100% !important;touch-action:none}
  /* ── 非聊天页滚动保障 ── */
  .page:not(#page-chat){overflow-y:auto;-webkit-overflow-scrolling:touch;min-height:0;padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}
  .chat-layout{grid-template-columns:1fr;display:flex;flex-direction:column;overflow:hidden;height:100%}
  .chat-main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}
  .chat-sidebar{display:none;position:fixed;inset:0;z-index:160;background:var(--bg1)}
  .chat-sidebar.m-show{display:flex}
  .chat-sb-close{display:block !important}
  .chat-topbar{padding:.35rem .6rem;flex-shrink:0;z-index:10;background:var(--glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);overflow-x:auto;display:flex;flex-wrap:nowrap;white-space:nowrap;gap:.35rem;padding-top:max(44px, env(safe-area-inset-top,44px)) !important;align-items:center}
  .chat-topbar-title{font-size:.75rem;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .chat-topbar-settings-mobile{display:inline-flex}
  .theme-orbs{gap:5px;flex-shrink:0}
  .theme-orb{width:12px;height:12px}
  .chat-model-sel{max-width:140px;font-size:.6rem}
  .chat-quick-settings{font-size:.58rem;gap:.5rem;flex-wrap:nowrap;overflow-x:auto;flex-shrink:0}
  .chat-messages{flex:1;overflow-y:auto;padding:.6rem .5rem;-webkit-overflow-scrolling:touch;min-height:0}
  .chat-input-area{flex-shrink:0;padding:.35rem .5rem;border-top:1px solid var(--card-b);background:var(--bg1);position:relative !important;bottom:auto !important;left:auto !important;right:auto !important;z-index:10}
  .chat-textarea{font-size:16px;min-height:36px;max-height:100px;padding:.4rem .6rem;border-radius:10px}
  .chat-send-btn{width:36px;height:36px;font-size:.9rem}
  .chat-img-btn{width:28px;height:28px;font-size:.75rem}
  .chat-input-row{gap:.3rem}
  .chat-inject-pills{margin-bottom:.2rem;gap:.2rem;overflow-x:auto;flex-wrap:nowrap}
  .chat-bubble{font-size:.78rem;padding:.5rem .7rem;max-width:85vw;border-radius:16px}
  .chat-msg.user .chat-bubble{border-bottom-right-radius:5px}
  .chat-msg.assistant .chat-bubble{border-bottom-left-radius:5px}
  .settings-panel{width:100vw;max-width:100vw;max-height:100vh;border-radius:0;height:100vh;min-height:0}
  .settings-head{padding-top:max(44px, env(safe-area-inset-top)) !important}
  .settings-body{padding-bottom:max(20px, env(safe-area-inset-bottom)) !important}
  .chat-sidebar{padding-top:max(44px, env(safe-area-inset-top)) !important}
  /* 记忆库手机端 */
  .mem-layout{grid-template-columns:1fr !important;min-height:auto}
  .sidebar{position:relative !important;top:auto !important;height:auto !important;border-right:none;border-bottom:1px solid var(--card-b);padding:.6rem}
}
@media(min-width:769px){
  .chat-sb-close{display:none !important}
}
/* ══ 自定义 Prompt 模态框（替代 iOS 上难看的原生 prompt） ══ */
.cprompt-bg{position:fixed;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:9999;display:none;align-items:center;justify-content:center;padding:1rem}
.cprompt-box{background:var(--glass);border:1px solid var(--divider);border-radius:16px;padding:1.2rem;width:min(88vw,340px);box-shadow:0 8px 32px rgba(0,0,0,.18);animation:modalIn .2s ease-out}
.cprompt-title{font-size:.82rem;color:var(--text3);font-family:'JH',serif;margin-bottom:.7rem;line-height:1.5}
.cprompt-input{width:100%;background:var(--bg1);border:1px solid var(--card-b);border-radius:8px;padding:.45rem .6rem;font-size:.78rem;color:var(--text3);font-family:'JH',serif;outline:none;box-sizing:border-box;transition:border-color .2s}
.cprompt-input:focus{border-color:var(--accent)}
.cprompt-btns{display:flex;gap:.4rem;justify-content:flex-end;margin-top:.7rem}
.cprompt-btns button{padding:.35rem .8rem;border-radius:8px;font-size:.72rem;cursor:pointer;border:none;font-family:'Noto Sans SC',sans-serif;transition:.2s}
.cprompt-cancel{background:var(--card);color:var(--text2)}
.cprompt-ok{background:var(--accent);color:#fff}

/* ═══ v5.3 新增样式 ═══ */
/* 语音气泡 */
.voice-bubble{display:flex;align-items:center;gap:.5rem;padding:.45rem .7rem;min-width:140px;cursor:pointer;user-select:none}
.voice-bubble .voice-play-btn{width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.7rem;flex-shrink:0;transition:.2s}
.voice-bubble .voice-play-btn.playing{background:#e74c3c}
.voice-bubble .voice-bars{flex:1;display:flex;align-items:center;gap:2px;height:22px}
.voice-bubble .voice-bars span{display:inline-block;width:3px;background:var(--text-m);border-radius:2px;transition:height .1s}
.voice-bubble .voice-dur{font-size:.6rem;color:var(--text-m);flex-shrink:0;min-width:24px;text-align:right}
.chat-msg.user .voice-bubble .voice-play-btn{background:rgba(255,255,255,.25)}
.chat-msg.user .voice-bubble .voice-bars span{background:rgba(255,255,255,.4)}
.chat-msg.user .voice-bubble .voice-dur{color:rgba(255,255,255,.6)}

/* 表情包气泡 */
.sticker-bubble{max-width:140px;max-height:140px;padding:.2rem}
.sticker-bubble img{max-width:100%;max-height:130px;border-radius:6px;display:block}

/* 表情包面板 */
.sticker-panel{display:none;position:absolute;bottom:100%;left:0;right:0;background:var(--glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--divider);max-height:50vh;z-index:100;flex-direction:column}
.sticker-panel.show{display:flex}
.sticker-panel-header{display:flex;padding:.4rem .6rem;gap:.4rem;align-items:center;border-bottom:1px solid var(--divider);flex-shrink:0}
.sticker-panel-header input{flex:1;background:var(--bg1);border:1px solid var(--card-b);border-radius:8px;padding:.25rem .5rem;font-size:.65rem;color:var(--text3);outline:none}
.sticker-grid{display:flex;flex-wrap:wrap;gap:.4rem;padding:.5rem;overflow-y:auto;flex:1;justify-content:flex-start;-webkit-overflow-scrolling:touch;min-height:0}
.sticker-grid .sticker-item{width:64px;height:64px;border-radius:8px;cursor:pointer;overflow:hidden;transition:transform .15s;display:flex;align-items:center;justify-content:center;background:var(--card)}
.sticker-grid .sticker-item:active{transform:scale(.9)}
.sticker-grid .sticker-item img{max-width:100%;max-height:100%;object-fit:contain}
.sticker-grid .sticker-add{border:2px dashed var(--card-b);font-size:1.2rem;color:var(--text-m)}

/* 输入区附加按钮 */
.chat-extra-btn{width:34px;height:34px;border-radius:50%;background:transparent;border:none;color:var(--text-m);display:flex;align-items:center;justify-content:center;font-size:1.1rem;cursor:pointer;flex-shrink:0;transition:.2s}
.chat-extra-btn:hover{background:var(--card)}
.chat-extra-btn.recording{color:#e74c3c;animation:pulse-rec 1s infinite}
@keyframes pulse-rec{0%,100%{opacity:1}50%{opacity:.4}}

/* 打字指示器 */
.typing-indicator{display:none;padding:.3rem .8rem;font-size:.65rem;color:var(--text-m);font-style:italic}
.typing-indicator.show{display:block}
.typing-dots{display:inline-flex;gap:3px;margin-left:4px}
.typing-dots span{width:4px;height:4px;background:var(--text-m);border-radius:50%;animation:typing-bounce .6s infinite}
.typing-dots span:nth-child(2){animation-delay:.15s}
.typing-dots span:nth-child(3){animation-delay:.3s}
@keyframes typing-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

/* 思考链 */
.thinking-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:.35rem .55rem;cursor:pointer;transition:all .2s}
.thinking-card:hover{background:rgba(255,255,255,.07)}
.thinking-header{display:flex;align-items:center;gap:.4rem;font-size:.62rem;color:var(--text-m)}
.thinking-header .thinking-toggle{transition:transform .2s;display:inline-block;font-size:.5rem}
.thinking-header .thinking-toggle.open{transform:rotate(90deg)}
.thinking-header .thinking-label{font-style:italic;font-family:'Georgia','Times New Roman',serif;letter-spacing:.5px;opacity:.7}
.thinking-body{display:none;margin-top:.35rem;padding-top:.35rem;border-top:1px solid rgba(255,255,255,.06);font-size:.65rem;color:var(--text2);line-height:1.7;white-space:pre-wrap;font-family:'JH','Noto Sans SC',serif;font-style:italic;opacity:.85}
.thinking-body.open{display:block}