/* ============================================================
   《岐黄医馆》国风样式 · 电脑 / 手机自适应
   ============================================================ */
:root{
  --paper:#f5ead2; --paper2:#efe0c0; --card:#fffaf0; --ink:#3a2413;
  --wood:#6b4423; --wood-light:#8b5a2b; --line:#d8bd8c;
  --red:#8c1f1f; --red-deep:#6d1414; --gold:#b8860b; --jade:#2f6b4f;
  --blue:#1e5f8a; --shadow:0 6px 24px rgba(90,55,20,.18);
  --radius:14px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
  color:var(--ink);
  background:
    radial-gradient(1200px 500px at 80% -10%, #e7d2a4 0%, transparent 60%),
    radial-gradient(900px 500px at -10% 110%, #dec692 0%, transparent 55%),
    var(--paper);
  min-height:100vh;line-height:1.6;font-size:15px;
}
#app{max-width:1080px;margin:0 auto;min-height:100vh;position:relative}
.hidden{display:none !important}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
h1,h2,h3{margin:0}
input,select{font-family:inherit}

/* ---------------- 开场页 ---------------- */
#view-login,#view-create{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.create-wrap{text-align:center;width:100%;max-width:520px}
.seal{
  width:84px;height:84px;line-height:1.15;margin:0 auto 14px;border-radius:12px;
  background:linear-gradient(145deg,#a52828,#7c1515);color:#ffe9c7;
  font-size:26px;font-weight:900;letter-spacing:2px;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 22px rgba(120,20,20,.4),inset 0 0 0 3px rgba(255,230,180,.35);
  transform:rotate(-4deg);
}
.game-title{font-size:42px;color:var(--red-deep);letter-spacing:8px;margin-bottom:2px;
  text-shadow:0 2px 0 #fff,0 6px 14px rgba(120,60,20,.25)}
.game-sub{color:var(--wood-light);letter-spacing:5px;font-size:13px;margin:0 0 22px}
.create-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 22px 24px;box-shadow:var(--shadow);text-align:left;
  background-image:linear-gradient(rgba(255,255,255,.6),rgba(255,255,255,.2));
}
.create-tip{color:#7a5c38;font-size:13.5px;margin:0 0 16px;padding:10px 12px;background:#f3e7c8;border-radius:8px;border-left:3px solid var(--gold)}
.create-card label{display:block;font-size:13px;color:var(--wood);font-weight:bold;margin:12px 0 5px}
.create-card input{
  width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:9px;
  font-size:16px;background:#fffef9;color:var(--ink);
}
.create-card input:focus{outline:2px solid rgba(184,134,11,.45);border-color:var(--gold)}
.btn-primary{
  width:100%;margin-top:20px;padding:13px;border-radius:10px;font-size:17px;font-weight:bold;
  color:#ffe9c7;background:linear-gradient(180deg,#9d2b2b,var(--red-deep));
  box-shadow:0 5px 0 #520e0e,0 10px 20px rgba(120,20,20,.3);letter-spacing:4px;
}
.btn-primary:active{transform:translateY(3px);box-shadow:0 2px 0 #520e0e}
.create-foot{margin-top:18px;color:#a98c5e;font-size:12.5px;letter-spacing:2px}
.create-foot a{color:#8c6a3f}

/* 登录 / 注册 */
.auth-card{padding-top:14px}
.auth-tabs{display:flex;gap:8px;margin-bottom:6px}
.auth-tab{flex:1;padding:10px 0;border:1px solid var(--line);border-radius:9px 9px 0 0;background:#f3e7c8;
  color:#8a6c44;font-size:15px;font-weight:bold;letter-spacing:3px;border-bottom:none}
.auth-tab.on{background:#fffef9;color:var(--red-deep);box-shadow:0 -2px 0 var(--gold) inset}
.auth-pane{border:1px solid var(--line);border-top:2px solid var(--gold);border-radius:0 0 9px 9px;
  padding:4px 18px 18px;background:rgba(255,254,249,.85)}
.auth-admin{text-decoration:none}
.auth-hi{text-align:right;font-size:12.5px;color:#8a6c44;margin:0 0 10px}
.auth-hi a{color:var(--red-deep)}
.mp-form label{display:block;font-size:13px;color:var(--wood);font-weight:bold;margin:10px 0 4px}
.mp-form input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:9px;font-size:15px;background:#fffef9}

/* ---------------- 顶栏 ---------------- */
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 14px;background:linear-gradient(180deg,#70461f,#5a3516);
  color:#f6e7c4;box-shadow:0 3px 12px rgba(60,30,5,.35);
  position:sticky;top:0;z-index:30;
}
.tb-clinic{font-size:17px;font-weight:900;letter-spacing:2px}
.tb-doctor{display:block;font-size:11.5px;color:#d8bd8c}
.tb-stats{display:flex;gap:8px}
.stat{background:rgba(0,0,0,.25);border:1px solid rgba(255,230,180,.25);border-radius:20px;
  padding:3px 11px;font-size:13px;font-style:normal;display:inline-flex;align-items:center;gap:5px}
.stat b{font-weight:900;color:#e8c87a;font-style:normal}
.stat.silver b{color:#e8e8e8}
.exp-bar{height:5px;background:#dcc99f}
.exp-fill{height:100%;width:0;background:linear-gradient(90deg,#c79a3a,#f0d17a);transition:width .5s}

/* ---------------- 大厅 ---------------- */
.hub-scene{padding:14px}
.hub-banner{
  position:relative;border-radius:var(--radius);overflow:hidden;min-height:150px;
  border:1px solid var(--line);box-shadow:var(--shadow);
  background:
    linear-gradient(95deg,rgba(60,30,10,.82) 0%,rgba(60,30,10,.55) 45%,rgba(60,30,10,.15) 100%),
    url('https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=Traditional%20Chinese%20medicine%20clinic%20hall%2C%20ink%20wash%20painting%2C%20wooden%20herb%20cabinets%20with%20hundreds%20of%20small%20drawers%2C%20hanging%20red%20lanterns%2C%20apothecary%20counter%20with%20brass%20mortar%2C%20warm%20candlelight%2C%20Song%20dynasty%20style%2C%20cinematic%2C%20high%20detail&image_size=landscape_16_9') center/cover,
    linear-gradient(135deg,#8b5a2b,#5a3516);
}
.banner-text{position:relative;z-index:1;padding:26px 22px;color:#ffeecb;max-width:70%}
.banner-text h2{font-size:21px;letter-spacing:3px;text-shadow:0 2px 6px rgba(0,0,0,.5)}
.banner-text p{margin:8px 0 0;font-size:13px;color:#f2dfb8}
.banner-text b{color:#ffd77a}

.module-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px}
.module{
  position:relative;text-align:left;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:16px 14px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:2px;overflow:hidden;min-height:118px;
  transition:transform .12s,box-shadow .12s;
}
.module:active{transform:scale(.97)}
.module::after{content:"";position:absolute;right:-18px;bottom:-18px;width:72px;height:72px;
  border-radius:50%;background:rgba(184,134,11,.08)}
.mod-icon{font-size:30px;line-height:1.2}
.mod-name{font-size:18px;font-weight:900;color:var(--red-deep);letter-spacing:2px}
.mod-desc{font-size:12.5px;color:#8a6c44}
.mod-badge{position:absolute;top:8px;right:8px;background:var(--red);color:#fff;font-size:11px;
  border-radius:10px;padding:1px 8px;font-weight:bold;animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(140,31,31,.5)}50%{box-shadow:0 0 0 6px rgba(140,31,31,0)}}
.hub-foot{margin-top:14px;background:#f0e2c2;border:1px dashed #bfa06a;border-radius:var(--radius);padding:12px 16px}
.hub-foot h3{font-size:14px;color:var(--wood)}
.hub-foot p{margin:5px 0 0;font-size:13px;color:#6e5535}
.hub-foot-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.hub-quit{margin:0;background:transparent;border:1px solid #bfa06a;color:#8a6c44;
  border-radius:20px;padding:6px 18px;font-size:12.5px;cursor:pointer}
.hub-quit:active{background:#e6d3aa}
.tb-acct{font-size:12px;color:#d8c194;border:1px solid #8a6a3c;border-radius:14px;padding:1px 10px;margin-left:4px}
@media(max-width:480px){.tb-acct{display:none}}

/* ---------------- 医题阁 ---------------- */
.quiz-daily{border-radius:10px;padding:9px 13px;font-size:13.5px;margin-bottom:12px;line-height:1.6}
.quiz-daily.done{background:#eaf4ee;border-left:3px solid var(--jade);color:#31583f}
.quiz-daily.todo{background:#f8ead6;border-left:3px solid var(--gold);color:#7a5c38}
.quiz-cats{display:flex;flex-direction:column;gap:10px}
.quiz-cat{display:flex;align-items:center;gap:13px;padding:13px 15px;cursor:pointer;margin-bottom:0}
.quiz-cat:active{transform:scale(.99)}
.quiz-cat-emoji{font-size:32px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;
  background:#f3e6c8;border-radius:12px;flex-shrink:0}
.quiz-cat-info h3{font-size:16.5px;color:var(--red-deep);margin-bottom:2px}
.quiz-cat-info p{font-size:12.5px;margin-bottom:4px}
.quiz-cat-arrow{margin-left:auto;font-size:22px;color:#b59463;flex-shrink:0}
.quiz-q h4{font-size:15px;line-height:1.7;color:var(--ink);margin-bottom:9px;font-weight:700}
.quiz-opt{font-size:14.5px;padding:11px 13px;margin-bottom:7px;border-color:#d8bd8c;background:#fffdf6}
.quiz-opt[data-pick="1"]{background:#f6e2cf;border-color:var(--red);box-shadow:0 0 0 1px var(--red) inset}
.quiz-opt:disabled{cursor:default;opacity:.92}
.quiz-opt.q-correct{background:#e3f2e8;border-color:#7fae92;box-shadow:0 0 0 1px #7fae92 inset}
.quiz-opt.q-wrong{background:#f7e2de;border-color:#c98a82;box-shadow:0 0 0 1px #c98a82 inset}
.quiz-explain{margin-top:7px;border-radius:8px;padding:8px 11px;font-size:13px;line-height:1.7}
.quiz-explain.ok{background:#eaf4ee;color:#2f5e42}
.quiz-explain.no{background:#f9eae7;color:#8c3a30}
.quiz-result{text-align:center}
.quiz-result h3{color:var(--red-deep);margin-bottom:4px}

/* ---------------- 子视图通用 ---------------- */
.subbar{
  display:flex;align-items:center;gap:10px;padding:10px 12px;
  background:linear-gradient(180deg,#70461f,#5a3516);color:#f6e7c4;
  position:sticky;top:0;z-index:30;box-shadow:0 3px 12px rgba(60,30,5,.3);
}
.btn-back{color:#ffe9c7;font-size:15px;padding:6px 12px;border:1px solid rgba(255,230,180,.35);
  border-radius:8px;background:rgba(0,0,0,.18);white-space:nowrap}
.btn-back:active{background:rgba(0,0,0,.35)}
.subbar h2{font-size:17px;letter-spacing:2px;flex:1}
.subbar-right{font-size:12.5px;color:#e2c996;white-space:nowrap}
.page-body{padding:14px 12px 90px}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:15px;box-shadow:var(--shadow);margin-bottom:12px}
.card h3{font-size:16px;color:var(--red-deep);margin-bottom:8px;letter-spacing:1px}
.card .muted{color:#93805f;font-size:12.5px}
.tag{display:inline-block;font-size:11.5px;padding:1px 9px;border-radius:20px;margin:2px 4px 2px 0;
  background:#efe1c0;color:#7a5527;border:1px solid #dcc596}
.tag.red{background:#f7e2de;color:#8c1f1f;border-color:#e2b7b0}
.tag.jade{background:#dceee4;color:var(--jade);border-color:#a9cdb8}
.tag.gold{background:#f6eccf;color:#8a6510;border-color:#dec78a}
.tag.blue{background:#deebf5;color:var(--blue);border-color:#a9c7dc}

.btn{display:inline-block;padding:9px 18px;border-radius:9px;font-size:14.5px;font-weight:bold;
  background:#efe1c0;color:var(--wood);border:1px solid #d3b682;transition:transform .1s}
.btn:active{transform:scale(.96)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.big{width:100%;padding:13px;font-size:16px;letter-spacing:3px;margin-top:6px}
.btn.red{background:linear-gradient(180deg,#9d2b2b,var(--red-deep));color:#ffe9c7;border-color:#520e0e;
  box-shadow:0 4px 0 #520e0e}
.btn.red:active{box-shadow:0 1px 0 #520e0e;transform:translateY(3px)}
.btn.jade{background:var(--jade);color:#eafaf0;border-color:#1e4e38}
.btn.ghost{background:transparent}
.btn.sm{padding:5px 12px;font-size:13px}
.btn-row{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.btn-row .btn{flex:1;min-width:120px}

/* ---------------- 患者列表 ---------------- */
.patient-card{display:flex;gap:13px;align-items:center;cursor:pointer}
.patient-card:active{transform:scale(.99)}
.p-avatar{
  width:62px;height:62px;min-width:62px;border-radius:50%;font-size:34px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#f7ecd2,#e9d3a5);border:2px solid #d3b682;
}
.p-info{flex:1;min-width:0}
.p-name{font-size:16.5px;font-weight:900;color:var(--red-deep)}
.p-name .p-sex{font-size:12px;color:#9a7a4f;font-weight:400;margin-left:6px}
.p-title{font-size:13.5px;color:#6e5535;margin:2px 0}
.p-meta{font-size:12px;color:#9a8258;display:flex;gap:8px;flex-wrap:wrap}
.p-lock{filter:grayscale(.9);opacity:.72}
.lock-mask{font-size:12.5px;color:#8a6c44;background:#f0e4c8;border-radius:8px;padding:6px 10px;margin-top:6px}
.best-tag{font-size:11.5px;color:#fff;background:var(--jade);border-radius:6px;padding:0 7px}

/* ---------------- 诊疗流程 ---------------- */
.stepper{display:flex;gap:4px;margin-bottom:14px;overflow-x:auto;padding-bottom:4px}
.step{flex:1;min-width:52px;text-align:center;font-size:11.5px;color:#9a8258;position:relative;padding-top:22px}
.step::before{content:attr(data-k);position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:22px;height:22px;border-radius:50%;background:#e6d5af;color:#8a6c44;font-weight:bold;
  font-size:12px;display:flex;align-items:center;justify-content:center;border:1px solid #cdb484}
.step.done::before{background:var(--jade);color:#fff;border-color:var(--jade)}
.step.now::before{background:var(--red);color:#fff;border-color:var(--red);
  box-shadow:0 0 0 3px rgba(140,31,31,.18)}
.step.now{color:var(--red);font-weight:bold}
.case-scene{background:linear-gradient(160deg,#fdf4df,#f3e2bd);border:1px solid var(--line);
  border-radius:var(--radius);padding:15px 16px;margin-bottom:12px;display:flex;gap:13px}
.case-scene .p-avatar{width:56px;height:56px;min-width:56px;font-size:30px}
.case-scene p{margin:0;font-size:14px;color:#5e4626}
.stage-title{font-size:17px;font-weight:900;color:var(--red-deep);margin:4px 0 4px;letter-spacing:1px}
.stage-desc{font-size:13.5px;color:#7a5c38;margin:0 0 12px}

/* 面色舌象展示 */
.face-area{display:flex;gap:14px;justify-content:center;margin:6px 0 14px;flex-wrap:wrap}
.face-box,.tongue-box{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;text-align:center;width:140px}
.face-emoji{font-size:56px;line-height:1.2}
.tongue{
  width:108px;height:70px;border-radius:50% / 60%;margin:6px auto 4px;position:relative;
  background:var(--tc,#e88c8c);box-shadow:inset 0 -6px 12px rgba(0,0,0,.12);
}
.tongue::after{content:"";position:absolute;left:50%;top:4px;width:2px;height:80%;background:rgba(120,40,40,.18);transform:translateX(-50%)}
.face-box small,.tongue-box small{display:block;color:#9a8258;font-size:12px;margin-top:3px}

/* 选项卡 */
.opt{
  display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;
  background:#fffef9;border:1.5px solid var(--line);border-radius:11px;padding:11px 13px;margin-bottom:9px;
  font-size:14.5px;color:var(--ink);transition:all .12s;
}
.opt:active{transform:scale(.99)}
.opt .tick{
  width:20px;height:20px;min-width:20px;border-radius:50%;border:2px solid #c9b080;margin-top:1px;
  display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff;
}
.opt.multi .tick{border-radius:6px}
.opt.sel{border-color:var(--red);background:#fdf0ec}
.opt.sel .tick{background:var(--red);border-color:var(--red)}
.opt.right{border-color:var(--jade);background:#eef8f1}
.opt.right .tick{background:var(--jade);border-color:var(--jade)}
.opt.wrong{border-color:#c05a4a;background:#fcebe8}
.opt.wrong .tick{background:#c05a4a;border-color:#c05a4a}
.opt.disabled{pointer-events:none;opacity:.86}
.opt-pinyin{display:block;font-size:11.5px;color:#a98c5e;margin-top:1px}

/* 闻诊 */
.sound-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px;
  border-radius:12px;background:linear-gradient(180deg,#3a6ea5,#274f7a);color:#eaf3fb;font-size:15px;
  font-weight:bold;margin-bottom:12px;box-shadow:0 4px 0 #1d3c5c}
.sound-btn:active{transform:translateY(2px);box-shadow:0 2px 0 #1d3c5c}
.wave{display:flex;gap:3px;align-items:center;height:24px;margin-left:6px}
.wave i{width:3px;background:#bfe0f5;border-radius:2px;animation:wave 1s infinite ease-in-out}
.wave i:nth-child(1){height:10px;animation-delay:0s}.wave i:nth-child(2){height:20px;animation-delay:.15s}
.wave i:nth-child(3){height:14px;animation-delay:.3s}.wave i:nth-child(4){height:22px;animation-delay:.45s}
.wave i:nth-child(5){height:12px;animation-delay:.6s}
@keyframes wave{0%,100%{transform:scaleY(.5)}50%{transform:scaleY(1)}}

/* 君臣佐使配伍 */
.role-stage{margin:8px 0}
.role-bin{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px dashed #c9a86a;border-radius:11px;
  padding:8px 10px;margin-bottom:8px;min-height:52px}
.role-bin b{width:44px;min-width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  font-size:15px;color:#ffe9c7}
.role-bin[data-role="君"] b{background:linear-gradient(160deg,#a52828,#7c1515)}
.role-bin[data-role="臣"] b{background:linear-gradient(160deg,#b8860b,#8a6510)}
.role-bin[data-role="佐"] b{background:linear-gradient(160deg,#2f6b4f,#1e4e38)}
.role-bin[data-role="佐使"] b{background:linear-gradient(160deg,#3a7d62,#1e4e38)}
.role-bin[data-role="使"] b{background:linear-gradient(160deg,#3a6ea5,#274f7a)}
.role-bin small{color:#9a8258;font-size:11.5px}
.herb-chip{display:inline-flex;align-items:center;gap:4px;background:#f6ead0;border:1px solid #d3b682;border-radius:20px;
  padding:5px 13px;font-size:13.5px;font-weight:bold;color:var(--wood);margin:3px;cursor:pointer;user-select:none}
.herb-chip:active{transform:scale(.94)}
.herb-chip.used{opacity:.3;pointer-events:none}
.herb-pool{background:#fbf4e3;border:1px solid var(--line);border-radius:12px;padding:10px;margin-top:8px;text-align:center}

/* 穴位人体图 */
.acu-wrap{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.acu-figure{position:relative;width:220px;height:420px;background:linear-gradient(180deg,#fdf6e6,#f5e7c6);
  border:1px solid var(--line);border-radius:14px;overflow:hidden}
.acu-figure svg{width:100%;height:100%;display:block}
.ap-dot{cursor:pointer;fill:#c9624e;stroke:#7a3526;stroke-width:1;transition:r .15s,fill .15s}
.ap-dot:active{r:11}
.ap-dot.sel{fill:var(--jade);stroke:#1e4e38}
.ap-dot.right{fill:#3fae6f;stroke:#1e4e38}
.ap-dot.wrong{fill:#b83a2c}
.ap-label{font-size:10px;fill:#5a3516;text-anchor:middle;pointer-events:none;font-weight:bold}
.acu-side{flex:1;min-width:220px;max-width:320px}
.ap-list-item{display:flex;justify-content:space-between;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);
  border-radius:9px;padding:7px 11px;margin-bottom:6px;font-size:13px}
.ap-list-item b{color:var(--red-deep)}
.ap-tip{background:#eaf4ee;border-left:3px solid var(--jade);border-radius:6px;padding:7px 10px;font-size:12.5px;color:#31583f;margin-bottom:8px}

/* 结算 */
.settle-grade{text-align:center;padding:8px 0 4px}
.grade-circle{display:inline-flex;align-items:center;justify-content:center;width:88px;height:88px;border-radius:50%;
  font-size:42px;font-weight:900;color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.25)}
.grade-S{background:linear-gradient(160deg,#e8b83c,#b8810b)}
.grade-A{background:linear-gradient(160deg,#3fae6f,#25764a)}
.grade-B{background:linear-gradient(160deg,#4a90c4,#2b6189)}
.grade-C{background:linear-gradient(160deg,#c0804a,#8a5527)}
.grade-D{background:linear-gradient(160deg,#9a9a9a,#666)}
.score-line{font-size:15px;color:#7a5c38;margin-top:6px}
.reward-row{display:flex;gap:10px;justify-content:center;margin:12px 0;flex-wrap:wrap}
.reward-pill{background:#f6ead0;border:1px solid #d3b682;border-radius:24px;padding:6px 16px;font-size:14px;font-weight:bold;color:var(--wood)}
.teach-box{background:#fbf4e3;border:1px solid #e0c996;border-radius:11px;padding:12px 14px;margin-top:8px}
.teach-box h4{margin:10px 0 3px;font-size:14px;color:var(--red-deep)}
.teach-box h4:first-child{margin-top:0}
.teach-box p{margin:0;font-size:13.5px;color:#5e4626}
.stage-breakdown{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.bd-pill{font-size:12px;padding:3px 10px;border-radius:20px;background:#efe1c0;color:#7a5527}
.bd-pill b{color:var(--red-deep)}

/* ---------------- 技能树 / 修炼 ---------------- */
.skill-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:6px}
.skill-tab{white-space:nowrap;padding:8px 14px;border-radius:20px;background:#ede0c0;border:1px solid #d3b682;
  font-size:14px;font-weight:bold;color:#7a5527}
.skill-tab.active{background:var(--red);color:#ffe9c7;border-color:var(--red-deep)}
.skill-head{display:flex;align-items:center;gap:12px}
.skill-head .big-icon{font-size:40px}
.skill-head h3{font-size:18px}
.skill-xpbar{height:10px;background:#e6d5af;border-radius:6px;margin:10px 0 4px;overflow:hidden}
.skill-xpfill{height:100%;border-radius:6px;transition:width .5s}
.level-list{margin:10px 0 0;padding:0;list-style:none}
.level-list li{display:flex;gap:10px;align-items:flex-start;padding:9px 4px;border-bottom:1px dashed #e0cda0;font-size:13.5px}
.level-list li:last-child{border-bottom:none}
.lv-dot{min-width:26px;height:26px;border-radius:50%;background:#ddcba3;color:#8a6c44;font-weight:bold;
  display:flex;align-items:center;justify-content:center;font-size:12.5px}
.level-list li.on .lv-dot{background:var(--jade);color:#fff}
.level-list li.cur{background:#fdf0df;border-radius:8px;padding-left:8px}
.level-list li.cur .lv-dot{background:var(--red);color:#fff}
.lv-title{font-weight:bold;color:var(--red-deep)}
.lv-perk{color:#8a6c44;font-size:12.5px}

/* 小游戏通用 */
.minigame{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:16px;text-align:center;margin:10px 0}
.mg-timer{font-size:13px;color:#9a8258;margin-bottom:6px}
.mg-timer b{color:var(--red);font-size:17px}
.mg-q{font-size:16px;font-weight:bold;margin:8px 0 12px;color:var(--red-deep)}
.tn-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.tn{aspect-ratio:1;border-radius:14px;font-size:30px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#3a6ea5,#274f7a);color:#dcecf8;box-shadow:0 4px 0 #1d3c5c;user-select:none}
.tn:active{transform:translateY(3px);box-shadow:0 1px 0 #1d3c5c}
.tn.lit{background:linear-gradient(160deg,#e8b83c,#b8810b);box-shadow:0 4px 0 #8a6510}
.mg-progress{font-size:13px;color:var(--wood);margin-top:8px;font-weight:bold}

/* ---------------- 剧情 ---------------- */
.story-map{display:flex;flex-direction:column;gap:10px}
.chapter-row{display:flex;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}
.chapter-num{width:54px;height:54px;min-width:54px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:26px;font-weight:900;background:linear-gradient(160deg,#a52828,#7c1515);color:#ffe9c7}
.chapter-row.locked{opacity:.7}
.chapter-row .ch-info{flex:1}
.chapter-row h3{font-size:16px;color:var(--red-deep)}
.chapter-row p{margin:2px 0 0;font-size:12.5px;color:#9a8258}
.story-scene{text-align:center;padding:6px 0 4px}
.story-emoji{font-size:58px;display:block;margin-bottom:6px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.15))}
.story-text{white-space:pre-wrap;font-size:15px;line-height:1.95;color:#47301a}
.story-note{background:#f3e7c8;border-left:4px solid var(--gold);border-radius:6px;padding:10px 13px;
  font-size:13.5px;color:#6e5535;margin:12px 0;white-space:pre-wrap}
.choice-btn{width:100%;text-align:left;padding:13px 15px;margin-bottom:9px;border-radius:11px;font-size:15px;
  background:linear-gradient(180deg,#fdf6e6,#f5e7c6);border:1.5px solid #d3b682;color:var(--ink);
  box-shadow:0 3px 0 #cdb484;line-height:1.5}
.choice-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #cdb484}
.ending-emoji{font-size:64px;display:block;text-align:center;margin-bottom:6px}

/* 剧情中的医理小考 */
.story-quiz{margin-top:14px;border:1.5px solid #c9b17e;border-radius:13px;padding:14px 14px 12px;
  background:linear-gradient(180deg,#fbf3df,#f3e6c5);box-shadow:0 3px 0 #cdb484}
.sq-head{font-weight:700;color:var(--red-deep);font-size:15.5px;display:flex;flex-wrap:wrap;
  align-items:baseline;gap:8px;margin-bottom:6px}
.sq-head span{font-weight:400;font-size:12px;color:#8a6d43}
.sq-q{font-size:15px;line-height:1.7;color:var(--ink);margin:2px 0 10px;font-weight:600}
.sq-opt{font-size:14px;padding:11px 13px;box-shadow:0 2px 0 #cdb484}
.sq-opt b{display:inline-block;width:1.6em;color:var(--red-deep)}
.sq-opt.q-correct{background:#e3f2e8;border-color:#7fae92;box-shadow:0 0 0 1px #7fae92 inset}
.sq-opt.q-wrong{background:#f7e2de;border-color:#c98a82;box-shadow:0 0 0 1px #c98a82 inset}
.sq-exp{margin-top:6px;line-height:1.75;font-weight:400;white-space:pre-wrap}
.story-quiz .quiz-explain{font-weight:600}
.story-quiz .quiz-explain .sq-exp{font-weight:400}

/* ---------------- 图鉴 / 药铺 ---------------- */
.catalog-tabs{display:flex;gap:8px;margin-bottom:12px}
.catalog-tabs button{flex:1;padding:9px;border-radius:9px;background:#ede0c0;border:1px solid #d3b682;font-weight:bold;font-size:14px;color:#7a5527}
.catalog-tabs button.active{background:var(--red);color:#ffe9c7;border-color:var(--red-deep)}
.ich-card{display:flex;gap:12px;align-items:center}
.ich-emoji{font-size:38px;min-width:54px;height:54px;border-radius:12px;background:#f3e7c8;
  display:flex;align-items:center;justify-content:center;border:1px solid #ddc694}
.ich-card h3{font-size:15.5px;color:var(--red-deep)}
.ich-card .lvl{font-size:12px;color:var(--jade);font-weight:bold}
.herb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.herb-tile{background:#fffef9;border:1px solid var(--line);border-radius:12px;padding:11px;text-align:center;cursor:pointer;
  box-shadow:0 2px 8px rgba(90,55,20,.08);transition:transform .1s}
.herb-tile:active{transform:scale(.95)}
.herb-tile .h-emoji{font-size:32px}
.herb-tile h4{margin:3px 0;font-size:14.5px;color:var(--red-deep)}
.herb-tile small{color:#9a8258;font-size:11.5px;display:block}
.herb-tile .h-price{margin-top:4px;font-size:12px;color:#8a6510;font-weight:bold}
.detail-head{display:flex;gap:14px;align-items:center;margin-bottom:8px}
.detail-head .h-emoji{font-size:52px;min-width:72px;height:72px;border-radius:14px;background:#f3e7c8;
  display:flex;align-items:center;justify-content:center;border:1px solid #ddc694}
.detail-head h3{font-size:21px;color:var(--red-deep)}
.kv{margin:7px 0;font-size:13.5px}
.kv b{color:var(--wood);display:inline-block;min-width:64px}
.detail-sec{margin-top:10px;padding-top:9px;border-top:1px dashed #ddc694;font-size:13.5px;line-height:1.75}
.detail-sec h4{margin:0 0 3px;font-size:14px;color:var(--red-deep)}
.detail-sec p{margin:0;color:#4f3820}
.ich-banner{background:linear-gradient(135deg,#fdf2da,#f2e0b5);border:1px solid #dcc58e;border-radius:11px;padding:11px 13px;margin-top:8px}
.ich-banner b{color:var(--red-deep)}

/* 药铺 */
.shop-list .herb-row{display:flex;align-items:center;gap:10px;background:#fffef9;border:1px solid var(--line);
  border-radius:11px;padding:9px 12px;margin-bottom:8px}
.herb-row .h-emoji{font-size:26px;min-width:34px;text-align:center}
.herb-row .hr-name{flex:1;min-width:0}
.herb-row .hr-name b{font-size:14.5px;color:var(--red-deep)}
.herb-row .hr-name small{display:block;color:#9a8258;font-size:11.5px}
.herb-row .stock{font-size:12.5px;color:var(--jade);font-weight:bold;min-width:56px;text-align:center}
.qty-box{display:inline-flex;align-items:center;border:1px solid #d3b682;border-radius:8px;overflow:hidden}
.qty-box button{width:30px;height:30px;background:#f0e4c8;font-size:17px;font-weight:bold;color:var(--wood)}
.qty-box span{min-width:36px;text-align:center;font-size:14px}
.stock-warn{color:#c05a4a !important}
.shop-silver{display:none;float:right;color:#8a6510;font-weight:bold;white-space:nowrap}

/* 提示 / 弹窗 */
.toast{
  position:fixed;left:50%;bottom:88px;transform:translateX(-50%);z-index:80;
  background:rgba(58,36,19,.95);color:#ffeecb;padding:10px 20px;border-radius:24px;font-size:14px;
  max-width:88%;text-align:center;box-shadow:0 8px 30px rgba(0,0,0,.35);
}
.modal-mask{position:fixed;inset:0;background:rgba(40,22,8,.55);z-index:70;display:flex;
  align-items:center;justify-content:center;padding:18px}
.modal-card{background:var(--card);border:1px solid var(--line);border-radius:16px;max-width:520px;width:100%;
  max-height:86vh;overflow-y:auto;padding:20px;box-shadow:0 18px 50px rgba(0,0,0,.4)}
.modal-card h3{font-size:19px;color:var(--red-deep);margin-bottom:8px;text-align:center}

/* ---------------- 响应式 ---------------- */
@media (min-width:720px){
  body{font-size:15px}
  .module-grid{grid-template-columns:repeat(3,1fr)}
  .module{min-height:132px;padding:20px}
  .banner-text h2{font-size:26px}
  .hub-banner{min-height:190px}
  .page-body{padding:18px}
}
@media (max-width:380px){
  .game-title{font-size:34px;letter-spacing:5px}
  .stat{padding:3px 8px;font-size:12px}
  .banner-text{max-width:88%}
}

/* ================= 启动遮罩 ================= */
#splash{position:fixed;inset:0;z-index:200;background:radial-gradient(circle at 50% 38%,#6d4520,#3f2410 75%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  transition:opacity .35s}
#splash.hidden{display:none}
.splash-seal{width:84px;height:84px;border-radius:12px;background:linear-gradient(145deg,#a52828,#7c1515);
  color:#ffe9c7;font-size:26px;font-weight:900;letter-spacing:2px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 22px rgba(0,0,0,.4),inset 0 0 0 3px rgba(255,230,180,.35);transform:rotate(-4deg);
  animation:splashBreath 1.6s ease-in-out infinite}
.splash-tip{color:#e8d3a2;font-size:14px;letter-spacing:3px}
@keyframes splashBreath{0%,100%{transform:rotate(-4deg) scale(1)}50%{transform:rotate(-4deg) scale(1.06)}}

/* ================= 静音开关 ================= */
.sound-toggle{width:34px;height:26px;border-radius:20px;border:1px solid rgba(255,230,180,.28);
  background:rgba(0,0,0,.22);color:#ffe9c7;font-size:14px;line-height:1;cursor:pointer;padding:0;flex:none}
.sound-toggle.off{opacity:.62}
.subbar .sound-toggle{margin-left:2px}

/* ================= 临床脉诊模拟 ================= */
.pe-card{margin-bottom:12px}
.pe-desc{font-size:13px;color:#7a5c38;line-height:1.75;margin:4px 0 10px}
.pe-wrist{max-width:280px;margin:0 auto}
.pe-wrist svg{width:100%;height:auto;display:block}
.pe-point{cursor:pointer}
.pe-point .pe-hit{fill:transparent}
.pe-dot{fill:#fffdf7;stroke:var(--red);stroke-width:2.4;transition:fill .15s,r .15s}
.pe-point:active .pe-dot{r:10}
.pe-dot.on{fill:var(--red)}
.pe-svgt{font-size:11px;fill:#9a8258}
.pe-svgl{font-size:13px;font-weight:bold;fill:var(--red-deep);text-anchor:middle}
.pe-placed{text-align:center;font-size:13px;color:var(--jade);margin:8px 0 4px;min-height:20px}
.pe-console{border:1px dashed #d3b682;border-radius:12px;padding:12px;background:#fffdf6;margin-top:6px}
.pe-fingers{display:flex;gap:8px;margin-bottom:8px}
.pe-fbtn{flex:1;border:1px solid #d3b682;border-radius:10px;background:#fff;color:#7a5c38;
  padding:8px 4px;font-size:13px;font-weight:bold;cursor:pointer;line-height:1.35}
.pe-fbtn small{display:block;font-size:11px;color:#a98c5e;font-weight:normal}
.pe-fbtn.on{border-color:var(--red);background:#f6e5df;color:var(--red-deep)}
.pe-press{display:flex;gap:8px;margin-bottom:10px}
.pe-pbtn{flex:1;border:1px solid #d3b682;border-radius:10px;background:#f7eeda;padding:8px 4px;
  font-size:13px;color:#7a5c38;cursor:pointer}
.pe-pbtn.on{border-color:var(--jade);background:#e6f2eb;color:var(--jade);font-weight:bold}
.pe-listen{width:100%;border:none;border-radius:10px;padding:11px;font-size:14.5px;font-weight:bold;
  background:linear-gradient(180deg,#9d2b2b,var(--red-deep));color:#ffe9c7;cursor:pointer;letter-spacing:2px}
.pe-listen.listening{background:linear-gradient(180deg,#3a7a5b,#24563f);animation:peBreathe 1.4s ease-in-out infinite}
@keyframes peBreathe{0%,100%{box-shadow:0 0 0 0 rgba(47,107,79,.35)}50%{box-shadow:0 0 0 8px rgba(47,107,79,0)}}
.pe-feeltext{margin-top:10px;min-height:58px;background:#f4ead4;border-radius:9px;padding:10px 12px;
  font-size:13.5px;line-height:1.7;color:#5d4428}
.pe-feeltext b{color:var(--red-deep)}
.pe-meter{margin-top:8px;text-align:center;font-size:12.5px;color:#9a8258}
.pe-sheet{margin-top:12px;border-top:1px dashed #d3b682;padding-top:10px;transition:opacity .25s}
.pe-lock{opacity:.42;pointer-events:none;filter:grayscale(.55)}
.pe-group h4{font-size:13.5px;color:var(--red-deep);margin:10px 0 6px}
.pe-opts{display:flex;flex-wrap:wrap;gap:7px}
.pe-opt{border:1px solid var(--line);background:#fffef9;border-radius:9px;padding:8px 11px;
  font-size:13px;color:#5d4428;cursor:pointer;text-align:left;line-height:1.4}
.pe-opt:active{transform:scale(.98)}
.pe-opt.on{border-color:var(--red);background:#fdf0ec;color:var(--red-deep);font-weight:bold;
  box-shadow:0 0 0 1px var(--red) inset}
.pe-opt.disabled{pointer-events:none}
.pe-opt.right{border-color:var(--jade);background:#eef8f1;color:var(--jade);font-weight:bold}
.pe-opt.wrong{border-color:#c05a4a;background:#fcebe8;color:#a04638;text-decoration:line-through}
.pe-done .pe-opt{pointer-events:none}
.pe-loading:before{content:"";display:inline-block;width:13px;height:13px;margin-right:7px;border-radius:50%;
  border:2px solid rgba(255,233,199,.4);border-top-color:#ffe9c7;vertical-align:-2px;
  animation:peSpin .7s linear infinite}
@keyframes peSpin{to{transform:rotate(360deg)}}

/* 经穴透明大热区 */
.ap-hit{fill:transparent;cursor:pointer}

/* 舌象放大 */
.tongue-zoomable{cursor:zoom-in}
.tongue-peek{display:flex;flex-direction:column;align-items:center}
.tongue-peek .tongue{cursor:default}

/* 辨证前的四诊案卷 */
.dossier{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 15px;margin-bottom:12px;box-shadow:var(--shadow)}
.dossier h4{font-size:14.5px;color:var(--red-deep);margin-bottom:8px}
.dossier-item{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.65;
  color:#5d4428;padding:4px 0;border-bottom:1px dashed #e7d6b4}
.dossier-item:last-child{border-bottom:none}
.dossier-tag{flex:none;width:22px;height:22px;border-radius:6px;font-size:12px;font-weight:bold;
  display:inline-flex;align-items:center;justify-content:center;color:#fff}
.tg-wang{background:#8a6d3b}.tg-wen{background:#5a6f8c}.tg-ask{background:#6d8a52}.tg-pulse{background:#8c3b3b}
.text-jade{color:var(--jade) !important}

@media (max-width:603px){
  .pe-fingers,.pe-press{flex-wrap:wrap}
  .pe-fbtn{min-width:30%}
  .pe-pbtn{flex:1 1 30%}
  .pe-opt{font-size:12.5px;padding:7px 9px}
  /* 窄屏隐藏副标语，避免顶栏横向溢出（药铺余额移至页内提示行） */
  .subbar{gap:8px;padding:10px}
  .subbar-right{display:none}
  .shop-silver{display:inline-block}
}

/* ============================================================
   精进四阁：汤头歌诀 / 日诊一案 / 禁忌 / 成就堂
   ============================================================ */
.tb-title{font-size:12px;color:#ffe0a8;background:rgba(184,134,11,.35);
  border:1px solid rgba(255,210,140,.5);border-radius:14px;padding:1px 10px;margin-left:2px;
  white-space:nowrap}
.block-h{margin:16px 2px 8px;font-size:15px;color:var(--wood);letter-spacing:1px}

/* 大厅新模块点缀 */
.mod-daily .mod-icon{filter:drop-shadow(0 2px 3px rgba(140,80,20,.25))}
.mod-songs{background:linear-gradient(160deg,#fffaf0,#f7ecd2)}
.mod-taboo{background:linear-gradient(160deg,#fff7ef,#f9e3d6)}
.mod-honors{background:linear-gradient(160deg,#fffaf0,#f6e7c6)}

/* 歌诀统计条 */
.song-stat-row{display:flex;gap:10px;margin:10px 0}
.song-stat{flex:1;background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:10px 6px;text-align:center;box-shadow:var(--shadow)}
.song-stat b{display:block;font-size:22px;color:var(--red-deep);line-height:1.2}
.song-stat span{font-size:12px;color:#8a6c44}

/* 玩法入口 */
.song-modes{display:flex;flex-direction:column;gap:10px}
.song-mode{display:flex;align-items:center;gap:12px;cursor:pointer}
.song-mode-emoji{font-size:30px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;
  background:#f4e8cc;border-radius:12px;flex:none}
.song-mode h3{font-size:16px;color:var(--red-deep)}
.song-mode p{margin:2px 0 0;font-size:12.5px}
.song-mode .quiz-cat-arrow{margin-left:auto;font-size:24px;color:#c2a26d}

/* 方目 chips */
.song-index{display:flex;flex-wrap:wrap;gap:8px}
.song-chip{display:flex;flex-direction:column;align-items:flex-start;gap:1px;
  background:var(--card);border:1px solid var(--line);border-radius:10px;padding:7px 12px;
  font-size:14px;font-weight:bold;color:var(--wood);box-shadow:0 2px 8px rgba(90,55,20,.1)}
.song-chip small{font-weight:400;font-size:11px;color:#a8895c}
.song-chip:active{transform:scale(.95)}

/* 诵读展开 */
.song-recite-head{display:flex;align-items:center;gap:10px;cursor:pointer}
.song-recite-name{font-weight:bold;color:var(--red-deep)}
.song-recite-head .muted{font-size:12px}
.song-recite-head .quiz-cat-arrow{margin-left:auto;font-size:22px;color:#c2a26d}
.song-recite-body{margin-top:10px;border-top:1px dashed var(--line);padding-top:10px}
.song-verse{background:#fbf3df;border:1px solid #e3cf9e;border-radius:10px;padding:10px 14px;
  text-align:center;margin-bottom:8px}
.song-line{font-size:16.5px;letter-spacing:2px;color:#5a3a18;line-height:2}
.song-method{font-size:13.5px;color:var(--jade);font-weight:bold;margin:6px 2px}
.song-roles{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.role-pill{display:inline-flex;align-items:center;gap:4px;border-radius:20px;padding:3px 12px;
  font-size:13px;font-weight:bold;background:#f0e4c8;border:1px solid #d6bd89;color:#6e5230}
.role-pill b{font-size:11px;border-radius:8px;padding:0 6px;color:#fff;margin-left:2px}
.role-君 b{background:#a52828}.role-臣 b{background:#b8860b}
.role-佐 b,.role-佐使 b{background:#2f6b4f}.role-使 b{background:#1e5f8a}
.song-comment{font-size:13px;line-height:1.8;margin:6px 2px 0}

/* 填空演练 */
.song-q h4{font-size:15.5px;margin-bottom:10px}
.song-q h4 small{font-weight:400;font-size:12px}
.song-blank{margin-bottom:14px;border-bottom:1px dashed #e2d0a8;padding-bottom:8px}
.song-blank:last-child{border-bottom:none}
.song-blank-line{font-size:16px;letter-spacing:1px;color:#4d3419;margin-bottom:7px;line-height:1.9}
.song-slot{display:inline-block;min-width:56px;text-align:center;font-style:normal;color:var(--red);
  border-bottom:2px solid var(--red);margin:0 2px;font-weight:bold}
.song-opts,.match-opts{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}
.song-opt,.match-opt{width:100%;text-align:center;margin:0;padding:9px 6px;font-size:14px}
.choice-btn[data-pick="1"]{background:#f3e2bd;border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset;font-weight:bold}
.choice-btn.q-correct{background:#e3f2e8 !important;border-color:#7fae92;box-shadow:0 0 0 1px #7fae92 inset}
.choice-btn.q-wrong{background:#f9e6e1 !important;border-color:#c98a7d;box-shadow:0 0 0 1px #c98a7d inset;
  text-decoration:line-through;text-decoration-color:rgba(150,60,40,.55)}
.song-res{margin-top:5px}
.song-fullverse{margin-top:6px}
.song-verse-ans{background:#eef5ef;border:1px solid #bdd6c4;border-radius:10px;padding:8px 12px;
  text-align:center;font-size:14px;color:#35583f;letter-spacing:1px}
.song-verse-q{background:#fbf3df;border:1px solid #e3cf9e;border-radius:10px;padding:8px 14px;
  margin-bottom:10px}
.song-verse-q .song-line{font-size:15.5px}

/* 日诊一案 */
.daily-streak-card{display:flex;align-items:center;gap:14px;background:linear-gradient(140deg,#fff6df,#fbe7c3);
  border:1px solid #e0bf7d;border-radius:var(--radius);padding:14px 16px;margin-bottom:12px;box-shadow:var(--shadow)}
.streak-flame{font-size:40px;animation:flicker 1.4s infinite alternate;flex:none}
@keyframes flicker{from{transform:scale(1) rotate(-3deg)}to{transform:scale(1.1) rotate(3deg)}}
.streak-num{font-size:18px;font-weight:900;color:var(--red-deep)}
.streak-num b{font-size:24px;color:#d2691e}
.streak-info{flex:none}
.streak-rule{margin-left:auto;font-size:12px;color:#8a6535;line-height:1.7;text-align:right}
.daily-case-card{display:flex;gap:14px}
.daily-case-card .p-avatar{font-size:44px;flex:none}
.daily-tag{background:var(--red);color:#ffe9c7;border-radius:12px;padding:1px 9px;font-size:12px}
.daily-intro{margin:8px 0 0;font-size:13.5px;color:#5e4626;line-height:1.8}
.daily-done-tip{margin-top:6px;font-size:13.5px;color:var(--jade)}
.grade-mini{display:inline-block;border-radius:8px;color:#fff;font-size:12px;font-style:normal;
  padding:1px 9px;margin-left:4px;font-weight:bold}
.daily-bonus-banner{background:linear-gradient(140deg,#fdf0d0,#f8dfac);border:1px solid #d9b36a;
  border-radius:11px;padding:10px 14px;margin:8px 0;font-size:14px;color:#7a4d16;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.daily-bonus-banner b{color:var(--red-deep)}

/* 禁忌 */
.taboo-song-card h3{font-size:15px;color:var(--red-deep);margin:10px 0 4px}
.taboo-song-card h3:first-child{margin-top:0}
.taboo-song{background:#fbf3df;border-left:3px solid var(--red);border-radius:6px;padding:8px 12px;
  font-size:15px;line-height:2;letter-spacing:1px;color:#5a3a18}
.taboo-group{display:flex;gap:12px}
.taboo-kind{flex:none;width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  font-size:20px;font-weight:900;color:#fff}
.taboo-kind-反{background:linear-gradient(150deg,#b23b31,#84201a)}
.taboo-kind-畏{background:linear-gradient(150deg,#c47f2a,#96591a)}
.taboo-ginfo h4{margin:0 0 4px;font-size:15px;color:var(--red-deep)}
.taboo-ginfo p{margin:0 0 5px;font-size:13.5px;line-height:1.75}

/* 成就堂 */
.honors-head{display:flex;justify-content:space-between;align-items:center}
.honors-count b{font-size:24px;color:var(--red-deep)}
.honors-cur{margin-top:4px;font-size:14px;color:#7a5c38;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cur-title{color:#9a6a12;font-weight:bold}
.btn.mini{padding:3px 12px;font-size:12.5px;border-radius:16px;border:1px solid #c9ab73;
  background:#f3e7c8;color:#7a5527}
.title-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.title-chip{border:1px solid var(--line);background:var(--card);border-radius:22px;padding:7px 16px;
  font-size:14px;font-weight:bold;color:#7a5c38}
.title-chip.on{background:linear-gradient(150deg,#d9a93f,#b07f18);color:#fff8e4;border-color:#93680f;
  box-shadow:0 3px 10px rgba(160,110,20,.35)}
.title-chip.lock{opacity:.45}
.honor-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.honor-cell{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px;
  text-align:center;filter:grayscale(.9);opacity:.62;transition:filter .2s}
.honor-cell.on{filter:none;opacity:1;border-color:#d8b35f;
  box-shadow:0 4px 14px rgba(160,120,30,.18);background:linear-gradient(170deg,#fffdf6,#fbf0d6)}
.honor-emoji{font-size:30px;line-height:1.2}
.honor-name{font-weight:bold;color:var(--red-deep);margin-top:3px}
.honor-name small{display:block;font-size:11px;font-weight:400;color:#a8895c}
.honor-desc{font-size:12px;min-height:34px}
.honor-bar{height:6px;border-radius:4px;background:#e8dcc0;overflow:hidden;margin:6px 2px 3px}
.honor-bar i{display:block;height:100%;background:linear-gradient(90deg,#d9a93f,#b07f18);border-radius:4px}
.honor-prog{font-size:11.5px;color:#9a7f52}
.honor-cell.on .honor-prog{color:#a9812c}

/* 成就贺匾 */
.honor-fanfare{text-align:center}
.honor-fan-emoji{font-size:52px;line-height:1.3;animation:flicker 1s infinite alternate}
.honor-fanfare h3{color:var(--red-deep);letter-spacing:3px;margin-bottom:12px;font-size:22px}
.honor-fan-item{display:flex;gap:12px;align-items:center;text-align:left;
  background:#fbf2dc;border:1px solid #e0c384;border-radius:12px;padding:10px 14px;margin-bottom:8px}
.honor-fan-e{font-size:30px;flex:none}
.honor-fan-name{font-weight:bold;color:var(--red-deep)}
.honor-fan-title{margin-top:3px;font-size:12.5px;color:#9a6a12;font-weight:bold}

@media (max-width:603px){
  .tb-title{display:none}
  .song-stat b{font-size:18px}
  .song-stat span{font-size:11px}
  .streak-rule{display:none}
  .song-opts,.match-opts{grid-template-columns:1fr 1fr}
  .honor-grid{grid-template-columns:1fr 1fr;gap:8px}
  .honor-desc{font-size:11.5px;min-height:40px}
  .song-line{font-size:15px}
}
@media (max-width:375px){
  .song-opts,.match-opts{grid-template-columns:1fr}
  .song-opt,.match-opt{font-size:13.5px}
}