@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;700;900&display=swap');
:root{--bg:#0a0a0f;--cd:#12121a;--ch:#1a1a28;--bd:#2a2a3e;--tx:#e0e0e0;--t2:#8888aa;--ac:#d4a030;--gl:#d4a03044;--sc:#00ff88;--wn:#ffd700;--dg:#ff3355;--bl:#4488ff;--pu:#aa55ff}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Noto Sans SC',sans-serif;background:var(--bg);color:var(--tx);min-height:100vh;overflow-x:hidden}
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--bd);border-radius:2px}
.h{display:none!important}
.sc{min-height:100vh}
.flex-c{display:flex;align-items:center;justify-content:center}
.di{background:var(--cd);border:1px solid var(--bd);color:var(--tx);padding:9px 12px;border-radius:8px;font-size:13px;width:100%;outline:none;transition:.3s}
.di:focus{border-color:var(--ac);box-shadow:0 0 8px var(--gl)}
select.di{appearance:auto}
textarea.di{resize:vertical;font-family:inherit}
.db{background:linear-gradient(135deg,var(--ac),#c89020);border:none;color:#fff;padding:9px 18px;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;transition:.3s;text-shadow:0 1px 3px rgba(0,0,0,.3)}
.db:hover{transform:translateY(-2px);box-shadow:0 4px 15px var(--gl)}
.db.mi{padding:6px 12px;font-size:12px}
.db.suc{background:linear-gradient(135deg,#00cc66,#00ff88)}
.mt8{margin-top:8px}
.err{color:var(--dg);font-size:12px;min-height:18px;margin-top:6px}
.tc{text-align:center}
.tcg{color:var(--t2);font-size:12px}
.cs{color:var(--sc);font-size:15px;font-weight:700}

/* 登录 */
#authScreen{background:radial-gradient(ellipse at center,#1a0a0a 0%,#0a0a0f 70%);position:relative;overflow:hidden}
#authScreen::before{content:'';position:absolute;width:280px;height:280px;background:radial-gradient(circle,var(--gl) 0%,transparent 70%);top:20%;left:50%;transform:translateX(-50%);animation:pl 4s infinite}
@keyframes pl{0%,100%{opacity:.3}50%{opacity:.6}}
.ac{background:var(--cd);border:1px solid var(--bd);border-radius:18px;padding:32px;width:350px;text-align:center;position:relative;z-index:1}
.dl{font-size:70px;animation:fl 3s infinite}
@keyframes fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.gt{font-size:28px;font-weight:900;margin:8px 0}
.gt::after{content:' · 人生RPG';font-size:13px;color:var(--t2);font-weight:300;display:block}
.st{font-size:11px;color:var(--t2);margin:3px 0}
.atabs{display:flex;margin:16px 0;border-radius:8px;overflow:hidden;border:1px solid var(--bd)}
.atabs .tab{flex:1;padding:9px;background:var(--bg);border:none;color:var(--t2);cursor:pointer;font-size:13px;transition:.3s}
.atabs .tab.act{background:var(--ac);color:#fff}
#lf,#rf{display:flex;flex-direction:column;gap:10px;margin-top:12px}

/* 导航 */
.tn{background:rgba(10,10,15,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--bd);padding:8px 12px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:100;gap:6px}
.nl,.nr{display:flex;align-items:center;gap:6px}
.nt{display:none;font-size:20px;cursor:pointer;padding:6px 8px;flex-shrink:0;line-height:1;user-select:none;-webkit-tap-highlight-color:transparent}
.nlo{font-size:22px}
.nti{font-size:15px;font-weight:700;white-space:nowrap}
.nd{font-size:10px;color:var(--t2);background:var(--cd);padding:2px 7px;border-radius:8px;border:1px solid var(--bd);white-space:nowrap}
.nu{color:var(--ac);font-weight:700;font-size:13px}
.nlv{background:var(--wn);color:#000;padding:2px 6px;border-radius:6px;font-size:10px;font-weight:700;white-space:nowrap}
.nsc{color:var(--wn);font-weight:700;font-size:12px}
.nb{background:transparent;border:1px solid var(--dg);color:var(--dg);padding:4px 8px;border-radius:6px;cursor:pointer;font-size:11px;transition:.3s}
.nb:hover{background:var(--dg);color:#fff}

/* 布局 */
.mg{display:grid;grid-template-columns:200px 1fr 240px;gap:10px;padding:10px;max-width:1400px;margin:0 auto;min-height:calc(100vh - 48px)}

/* 卡片 */
.cd{background:var(--cd);border:1px solid var(--bd);border-radius:10px;padding:12px;margin-bottom:10px;transition:.3s}
.cd:hover{border-color:#3a3a5e}
.cd h3{font-size:14px;margin-bottom:8px;color:var(--ac)}
.cd h4{font-size:12px;margin-bottom:6px;color:var(--tx);display:flex;align-items:center;gap:4px}
.ch{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}

/* 左侧 */
.lp{position:sticky;top:56px;height:calc(100vh - 68px);overflow-y:auto}
.pcd{text-align:center}
.av{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--ac),var(--pu));display:flex;align-items:center;justify-content:center;margin:0 auto 6px}
.ave{font-size:24px}
.pt{font-size:11px;color:var(--wn);margin:3px 0 8px}
.lb{height:4px;background:var(--bg);border-radius:2px;overflow:hidden}
.lf{height:100%;background:linear-gradient(90deg,var(--ac),var(--wn));border-radius:2px;transition:width .5s}
.lt{font-size:10px;color:var(--t2);margin-top:3px}
.scd{background:var(--bg);border-radius:6px;padding:6px;margin-top:6px;font-size:18px;font-weight:900;color:var(--wn);display:flex;align-items:center;justify-content:center;gap:4px}

/* 属性 */
.ar{display:flex;align-items:center;gap:5px;margin:4px 0;font-size:11px}
.ar>span:first-child{width:24px;text-align:center;font-size:14px}
.ar>span.av{width:24px;text-align:right;color:var(--t2);font-size:10px;display:block;border-radius:0;background:none;height:auto;margin:0}
.ab{flex:1;height:3px;background:var(--bg);border-radius:2px;overflow:hidden}
.ab div{height:100%;border-radius:2px;transition:width .5s}
#aStr{background:linear-gradient(90deg,#d4a030,#e8b840)}
#aSta{background:linear-gradient(90deg,#3366cc,#5588ee)}
#aKno{background:linear-gradient(90deg,#8844cc,#aa66ee)}
#aPow{background:linear-gradient(90deg,#cc2244,#ee4466)}
#aJoy{background:linear-gradient(90deg,#d4a030,#f0c040)}
#aExe{background:linear-gradient(90deg,#00cc66,#33ee88)}
.sn{font-size:28px;font-weight:900;color:var(--ac);text-align:center}
.sl{text-align:center;font-size:11px;color:var(--t2)}

/* 中间 */
.asc{border-color:#3a2a2a;background:linear-gradient(135deg,var(--cd),#1a1215)}
.ash{display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-weight:700;font-size:14px;color:var(--ac)}
#asBody{overflow:hidden;transition:max-height .3s}
.cm{max-height:180px;overflow-y:auto;margin:6px 0}
.msg{padding:6px 10px;border-radius:8px;font-size:12px;margin-bottom:4px;line-height:1.5;word-break:break-word;white-space:pre-wrap}
.msg.a{background:var(--bg);color:var(--tx);border-left:3px solid var(--ac)}
.msg.u{background:var(--ac);color:#fff;margin-left:auto;max-width:80%}
.cir{display:flex;gap:5px}
#ci{flex:1;font-size:12px}

/* 任务 */
.tc2{border-color:#3a2a2a}
.td{font-size:10px;color:var(--t2)}
.tir{display:flex;gap:5px;margin-top:5px}
.tc{font-size:15px;font-weight:700;padding:8px;background:var(--bg);border-radius:6px;margin-bottom:4px;color:var(--wn);text-align:center}

/* 12格 */
.g12{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:10px}
.gi{background:var(--cd);border:1px solid var(--bd);color:var(--tx);padding:8px 4px;border-radius:6px;cursor:pointer;font-size:18px;transition:.3s;display:flex;flex-direction:column;align-items:center;gap:2px}
.gi:hover{border-color:var(--ac);background:var(--ch);transform:translateY(-2px)}
.gi span{font-size:9px;color:var(--t2)}

/* 流水 */
.sl{max-height:250px;overflow-y:auto}
.si p{font-size:12px;color:var(--tx);margin:3px 0}
.si p span{color:var(--ac);font-weight:700}
.si2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.si2 .si-item{background:var(--bg);padding:8px;border-radius:6px;text-align:center}
.si2 .si-item .num{font-size:20px;font-weight:900;color:var(--wn)}
.si2 .si-item .lbl{font-size:10px;color:var(--t2)}
.s-item{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border-bottom:1px solid var(--bd);font-size:11px}
.s-item:last-child{border-bottom:none}
.sa{font-weight:700;white-space:nowrap}
.sa.pos{color:var(--sc)}
.sa.neg{color:var(--dg)}
.sr{color:var(--t2);flex:1;padding:0 6px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st{font-size:9px;color:#555;white-space:nowrap}

/* 世界动态 */
.wf{max-height:280px;overflow-y:auto}
.f-item{padding:5px 0;border-bottom:1px solid var(--bd);font-size:11px}
.f-item:last-child{border-bottom:none}
.fu{color:var(--ac);font-weight:700}
.fs{font-size:9px}
.fs.done{color:var(--sc)}
.fs.pending{color:var(--wn)}

#subP{animation:si .3s}
@keyframes si{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* 右侧 */
.rp{position:sticky;top:56px;height:calc(100vh - 68px);overflow-y:auto}

.noti{position:fixed;top:60px;right:12px;background:var(--cd);border:1px solid var(--ac);padding:10px 14px;border-radius:8px;color:var(--tx);font-size:12px;z-index:999;max-width:280px;animation:ni .3s,no .3s 2.7s}
@keyframes ni{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
@keyframes no{from{opacity:1}to{opacity:0;transform:translateX(20px)}}

/* 子面板通用 */
.sub-section{margin-bottom:8px}
.ig{display:flex;gap:5px;margin-bottom:5px;flex-wrap:wrap}
.ig>*{flex-shrink:0}

@media(max-width:1024px){
  .mg{grid-template-columns:1fr}
  .lp,.rp{position:fixed;top:0;left:0;width:100%;height:100vh;height:100dvh;background:var(--bg);z-index:9999;padding:10px;padding-top:56px;overflow-y:auto;display:none}
  .lp.on,.rp.on{display:block}
  .nt{display:block}
}
.mb8{margin-bottom:8px}
#abAnalysis .msg{border-left-color:var(--purp);margin:8px 0}
#abProfile .cd{margin:8px 0}

/* ===== 吃喝玩乐推荐 ===== */
.rec-panel{animation:si .3s}
.rec-header{margin-bottom:10px}
.rec-city-bar{display:flex;align-items:center;gap:5px;margin-top:6px;flex-wrap:wrap}
.rec-cats{margin-bottom:12px}
.rec-cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.rec-cat-btn{background:var(--cd);border:1px solid var(--bd);border-radius:8px;padding:10px 6px;cursor:pointer;transition:.3s;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--tx)}
.rec-cat-btn:hover{border-color:var(--ac);background:var(--ch);transform:translateY(-2px)}
.rec-cat-icon{font-size:22px}
.rec-cat-name{font-size:12px;font-weight:700}
.rec-cat-tag{font-size:9px;color:var(--t2)}
.rec-results{min-height:100px}
.rec-item{display:flex;align-items:flex-start;gap:8px;padding:10px;margin-bottom:8px;background:var(--bg);border:1px solid var(--bd);border-radius:8px;transition:.3s}
.rec-item:hover{border-color:#3a3a5e}
.rec-item-sm{padding:6px 8px}
.rec-item-rank{font-size:18px;min-width:30px;text-align:center}
.rec-item-body{flex:1;min-width:0}
.rec-item-name{font-size:13px;font-weight:700;margin-bottom:2px;color:var(--tx)}
.rec-item-desc{font-size:11px;color:var(--t2);margin-bottom:4px}
.rec-item-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:10px;color:var(--t2);margin-bottom:3px}
.rec-item-meta span{white-space:nowrap}
.rec-item-reason{font-size:11px;color:#b8860b;background:#fff8e7;padding:4px 8px;border-radius:4px;margin-bottom:4px;line-height:1.5}
.rec-stars{color:var(--wn)}
.rec-item-tags{display:flex;flex-wrap:wrap;gap:3px}
.rec-tag{background:var(--cd);color:var(--ac);padding:1px 6px;border-radius:4px;font-size:9px;border:1px solid var(--gl)}
.rec-done-btn{background:transparent;border:1px solid var(--sc);color:var(--sc);border-radius:6px;padding:4px 6px;cursor:pointer;font-size:14px;opacity:.6;transition:.3s;min-width:32px;text-align:center}
.rec-done-btn:hover{opacity:1;background:rgba(0,255,136,.1)}
.rec-empty{text-align:center;padding:30px 10px;background:var(--bg);border-radius:8px;border:1px solid var(--bd)}
.rec-empty p{font-size:14px;margin-bottom:4px}
.rec-group{margin-bottom:10px}
.rec-group h5{font-size:13px;color:var(--ac);margin-bottom:5px;padding-bottom:3px;border-bottom:1px solid var(--bd)}

@media(max-width:600px){
  .rec-cat-grid{grid-template-columns:repeat(2,1fr)}
  .rec-item{padding:8px;gap:6px}
  .rec-item-rank{font-size:16px;min-width:24px}
  .rec-item-name{font-size:12px}
  .rec-item-desc{font-size:10px}
  .rec-item-reason{font-size:10px;padding:3px 6px}
  .rec-done-btn{padding:3px 5px;font-size:12px}
  .rec-item-meta{font-size:9px;gap:4px}
  .rec-tag{font-size:8px}
  .rec-empty{padding:20px 8px}
  .rec-empty p{font-size:12px}
  .lp,.rp{width:100%;left:0;right:0}
  .rp{left:auto}
  /* 属性面板 */
  .ar{flex-wrap:wrap}
  .ar>span{min-width:30px}
  .ab{flex:1;min-width:40px}
  .av{width:36px;font-size:10px}
  /* 导航按钮 */
  .gs{grid-template-columns:repeat(3,1fr);gap:4px}
  .gi{padding:6px 4px;font-size:9px;min-height:44px}
  .gi span{font-size:9px}
  /* 卡片 */
  .cd{padding:8px;margin:4px 0}
  /* 输入框 */
  .di{font-size:14px;padding:8px 10px;min-height:44px}
  /* 按钮 */
  .db{padding:10px 16px;font-size:13px;min-height:44px}
  .db.mi{padding:6px 10px;font-size:11px;min-height:36px}
  .nb{font-size:10px;padding:4px 8px}
  /* 子面板 */
  .sc{min-height:auto}
}
