/* ============================================================
   来源：views/tools/west/constellation.html 内联 <style> 第 1 块（原位抽离，38 行）
   说明：在原位置以 <link rel="stylesheet"> 引入，来源顺序不变，
        层叠结果与抽离前逐字一致，不会引起样式变化。
   ============================================================ */
.cz-nav { display: flex; gap: 4px; flex-wrap: nowrap; overflow: hidden; margin: 0 0 8px; }
.cz-nav button { flex: 1 1 0; min-width: 0; border: 1px solid #e2e8f4; background: #fff; border-radius: 8px; padding: 5px 0 4px; cursor: pointer; text-align: center; transition: all .14s; color: #5b5b56; }
.cz-nav button:hover { border-color: #8fa5dc; }
.cz-nav button.on { background: linear-gradient(135deg, #ffd98e, #f5b942); border-color: #e5a728; color: #5a3b07; box-shadow: 0 3px 10px rgba(229, 167, 40, .28); }
.cz-nav button .sym { display: block; font-size: 1.02rem; line-height: 1.2; }
.cz-nav button span { font-size: .68rem; white-space: nowrap; }
.cz-badge { display: flex; gap: 16px; align-items: center; border: 1px solid #efe3c6; background: linear-gradient(135deg, #fffdf6, #fdf6e4); border-radius: 14px; padding: 14px 18px; margin: 10px 0 12px; flex-wrap: wrap; }
.cz-badge .big { font-size: 2.5rem; line-height: 1; }
.cz-badge .nm b { font-size: 1.3rem; color: #5a3b07; }
.cz-badge .nm span { color: #8a7450; font-size: .82rem; }
.cz-badge .tags { display: flex; gap: 5px; flex-wrap: wrap; margin-left: auto; }
.cz-badge .tags i { font-style: normal; background: #fff; border: 1px solid #ecd9ae; color: #7a6534; border-radius: 12px; padding: 2px 10px; font-size: .72rem; }
.cz-sec { display: flex; align-items: baseline; gap: 8px; margin: 12px 0 6px; }
.cz-sec b { font-size: .94rem; color: #2f3b5e; }
.cz-sec span { font-size: .74rem; color: #a3aed0; }
.cz-today { border: 1px solid #e3e9f5; border-left: 4px solid #f5b942; border-radius: 10px; padding: 12px 16px; background: #fdfbf6; }
.cz-score-line { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.cz-score-line .num { font-size: 2rem; font-weight: 800; line-height: 1; }
.cz-score-line .lv { border-radius: 10px; color: #fff; padding: 2px 12px; font-size: .8rem; }
.cz-lucky { font-size: .76rem; color: #8a7450; }
.cz-tips { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 6px; margin-top: 8px; }
.cz-tips .t { background: #fff; border: 1px dashed #e6dcc0; border-radius: 8px; padding: 6px 10px; font-size: .78rem; color: #6a6a5e; line-height: 1.7; }
.cz-aspects { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 6px; margin-top: 8px; }
.cz-aspects .a { background: #fff; border: 1px solid #ece3d2; border-radius: 8px; padding: 6px 10px; }
.cz-aspects .a b { font-size: .8rem; display: block; }
.cz-aspects .a span { font-size: .68rem; color: #a08c62; }
.cz-aspects .a p { margin: 4px 0 0; font-size: .74rem; color: #6a6a5e; line-height: 1.6; }
.cz-aspects { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 6px; margin-top: 8px; }
.cz-aspects .a { background: #fff; border: 1px solid #ece3d2; border-radius: 8px; padding: 6px 10px; }
.cz-aspects .a b { font-size: .8rem; display: block; }
.cz-aspects .a span { font-size: .68rem; color: #a08c62; }
.cz-aspects .a p { margin: 4px 0 0; font-size: .74rem; color: #6a6a5e; line-height: 1.6; }
.cz-detail { font-size: .88rem; color: #5b5b56; line-height: 2; }
.cz-detail p { margin: 0 0 8px; }
.cz-quote { background: #fdf3e0; border: 1px dashed #ecd9b4; border-radius: 8px; padding: 8px 13px; margin-bottom: 10px; color: #9a6f2a; font-size: .85rem; }
.cz-pair { border: 1px dashed #e3b3b3; background: #fff7f7; border-radius: 12px; padding: 12px 16px; margin-top: 12px; font-size: .86rem; line-height: 1.9; color: #8a5050; }
.cz-pair b { font-size: .98rem; }
.cz-empty { text-align: center; color: #a3aed0; padding: 40px 10px; font-size: .88rem; line-height: 2; }
