:root{--pri:#E54D42;--bg-start:#FFD1C7;--bg-end:#FFC8B5}
*{box-sizing:border-box;margin:0;padding:0}
/* legacy body → scoped */
.app-page{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  background:linear-gradient(180deg,var(--bg-start) 0%,var(--bg-end) 50%,#fff5f0 100%);
  min-height:100vh;-webkit-font-smoothing:antialiased;
}
.header{padding:24px 20px 16px;text-align:center}
.logo img{height:36px;margin-bottom:4px}
.header .sub{font-size:13px;color:rgba(0,0,0,0.45);margin-top:4px}

.categories{display:flex;flex-wrap:wrap;gap:8px;padding:0 20px 12px;justify-content:center;max-width:600px;margin:0 auto}
.cat-btn{
  padding:7px 16px;border-radius:20px;border:1px solid rgba(0,0,0,0.12);
  background:#fff;font-size:13px;color:#555;cursor:pointer;
  transition:all 0.2s;white-space:nowrap;
}
.cat-btn.active{background:var(--pri);color:#fff;border-color:var(--pri)}

.scales{max-width:600px;margin:0 auto;padding:0 20px 40px}
.scale-card{
  display:flex;align-items:center;gap:12px;padding:16px;
  background:#fff;border-radius:12px;margin-bottom:10px;
  box-shadow:0 1px 6px rgba(0,0,0,0.05);cursor:pointer;
  transition:transform 0.12s;text-decoration:none;color:inherit;
}
.scale-card:active{transform:scale(0.98)}
.scale-card .icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.scale-card .icon.cat-综合{background:#FFECEC;color:var(--pri)}
.scale-card .icon.cat-人格{background:#E6F0FF;color:#4A90E2}
.scale-card .icon.cat-抑郁{background:#E6E0FF;color:#7C5CF2}
.scale-card .icon.cat-焦虑{background:#FFF0E6;color:#E8985A}
.scale-card .icon.cat-强迫{background:#E6FFE8;color:#5CB85C}
.scale-card .icon.cat-躁狂{background:#FFF8E6;color:#E8985A}
.scale-card .icon.cat-双相{background:#FFE6F0;color:#E0508C}
.scale-card .icon.cat-恐惧{background:#E6F5FF;color:#4A90E2}
.scale-card .icon.cat-智商{background:#F3E8FF;color:#8B5CF6}
.scale-card .icon.cat-情商{background:#FFF5EC;color:#C8923A}
.scale-card .icon.cat-其他{background:#F0F0F0;color:#888}
.scale-card .info{flex:1;min-width:0}
.scale-card .info .name{font-size:15px;font-weight:600;color:#333}
.scale-card .info .desc{font-size:12px;color:#999;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scale-card .count{font-size:12px;color:#aaa;flex-shrink:0}

.loading{text-align:center;padding:60px 20px;color:#999}
.empty{text-align:center;padding:40px 20px;color:#ccc;font-size:14px}
.back{display:inline-block;padding:8px 16px;color:var(--pri);text-decoration:none;font-size:14px;margin:8px 0 0 20px}