/* —— 解签页专属 —— */
/* 签系选择卡 */
.sys-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-3); }
@media (max-width:560px){ .sys-grid { grid-template-columns:1fr; } }
.sys-card { cursor:pointer; border:1px solid var(--c-line); border-radius:var(--radius-lg); background:#fff; padding:var(--sp-4); transition:.18s; position:relative; }
.sys-card:hover { border-color:var(--c-gold-light); box-shadow:var(--shadow-sm); }
.sys-card.sel { border-color:var(--c-primary); box-shadow:0 0 0 2px var(--c-primary-soft); background:
  radial-gradient(120% 120% at 100% 0, rgba(192,57,43,.06), transparent 55%), #fff; }
.sys-card .nm { font-family:var(--font-serif); font-weight:900; font-size:var(--t-h2); color:var(--c-primary-deep); }
.sys-card .ds { font-size:var(--t-xs); color:var(--c-ink-3); margin-top:4px; line-height:1.6; }
.sys-card .ck { position:absolute; top:10px; right:10px; width:20px; height:20px; border-radius:50%; background:var(--c-primary); color:#fff; display:none; place-items:center; font-size:12px; }
.sys-card.sel .ck { display:grid; }

/* 摇签区 */
.draw-wrap { display:flex; gap:var(--sp-5); align-items:center; flex-wrap:wrap; justify-content:center; text-align:center; }
.tube { --w:108px; width:var(--w); flex:none; position:relative; margin:0 auto; }
.tube .sticks { position:relative; height:84px; display:flex; justify-content:center; align-items:flex-end; gap:5px; }
.tube .sticks i { display:block; width:6px; border-radius:3px 3px 0 0; background:linear-gradient(180deg,var(--c-gold-light),var(--c-gold)); transform-origin:bottom center; }
.tube .sticks i:nth-child(1){ height:70px; transform:rotate(-9deg) }
.tube .sticks i:nth-child(2){ height:82px; transform:rotate(-4deg) }
.tube .sticks i:nth-child(3){ height:90px; }
.tube .sticks i:nth-child(4){ height:80px; transform:rotate(5deg) }
.tube .sticks i:nth-child(5){ height:74px; transform:rotate(10deg) }
.tube .body { height:96px; border-radius:8px 8px 12px 12px; position:relative;
  background:linear-gradient(160deg,var(--c-primary),var(--c-primary-deep));
  box-shadow:inset 0 0 0 2px var(--c-gold-light), var(--shadow);
  display:grid; place-items:center; }
.tube .body::before { content:""; position:absolute; top:0; left:6px; right:6px; height:10px; border-radius:50%;
  background:rgba(43,43,43,.35); box-shadow:inset 0 2px 4px rgba(0,0,0,.4); }
.tube .body span { font-family:var(--font-serif); writing-mode:vertical-rl; color:var(--c-gold-light); font-size:22px; font-weight:900; letter-spacing:4px; }
.tube.shaking { animation:tubeShake .12s linear infinite; }
@keyframes tubeShake { 0%{transform:rotate(-4deg)} 50%{transform:rotate(4deg)} 100%{transform:rotate(-4deg)} }
.draw-cta { flex:1; min-width:220px; }
.draw-cta p { font-size:var(--t-sm); color:var(--c-ink-2); margin:0 0 var(--sp-3); }
.draw-result { margin-top:var(--sp-4); display:none; }
.draw-result.show { display:block; animation:pop .25s ease; }
.draw-result .hit { font-family:var(--font-serif); font-weight:900; font-size:var(--t-h1); color:var(--c-primary); }

/* 签文详情 */
.qian-grade { display:inline-block; font-family:var(--font-serif); font-size:var(--t-sm); padding:4px 12px; border-radius:var(--radius-pill);
  background:linear-gradient(160deg,var(--c-gold-light),var(--c-gold)); color:#4a3403; }
.poem { text-align:center; padding:var(--sp-5) var(--sp-3); margin:var(--sp-4) 0;
  background:radial-gradient(130% 120% at 50% 0, var(--c-primary-soft), transparent 60%);
  border:1px solid var(--c-line); border-radius:var(--radius-lg); }
.poem p { font-family:var(--font-serif); font-weight:700; font-size:22px; line-height:2; color:var(--c-primary-deep); margin:0; letter-spacing:2px; }
@media (max-width:420px){ .poem p { font-size:19px; } }
.jie-say { font-size:var(--t-body); color:var(--c-ink-2); line-height:1.9; }
.jie-say .em { font-family:var(--font-serif); color:var(--c-ink); }

/* 分项解读 */
.fen-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:560px){ .fen-grid { grid-template-columns:1fr; } }
.fen { background:var(--c-paper); border:1px solid var(--c-line); border-radius:var(--radius); padding:10px 12px; }
.fen .h { display:flex; align-items:center; gap:6px; font-family:var(--font-serif); font-weight:700; font-size:var(--t-sm); color:var(--c-primary-deep); margin-bottom:4px; }
.fen .h .lv { margin-left:auto; font-size:11px; padding:1px 7px; border-radius:var(--radius-pill); }
.fen .h .lv.good { background:rgba(46,125,50,.12); color:var(--c-yi); }
.fen .h .lv.mid { background:rgba(201,154,46,.14); color:var(--c-gold); }
.fen .h .lv.bad { background:#f1f1f1; color:var(--c-bad); }
.fen p { margin:0; font-size:var(--t-sm); color:var(--c-ink-2); line-height:1.7; }

/* 侧栏：今日运势 */
.fortune { text-align:center; padding:var(--sp-3) 0; }
.fortune .star { color:var(--c-gold); font-size:18px; letter-spacing:2px; }
.fortune .lab { font-family:var(--font-serif); font-size:var(--t-h2); color:var(--c-primary-deep); margin-top:4px; }
.his-item { display:flex; align-items:baseline; gap:8px; padding:8px 0; border-bottom:1px dashed var(--c-line); font-size:var(--t-sm); }
.his-item:last-child { border-bottom:0; }
.his-item b { font-family:var(--font-serif); color:var(--c-ink); }
.his-item .d { margin-left:auto; font-size:var(--t-xs); color:var(--c-ink-3); font-family:var(--font-mono); }
.his-item .lv { font-size:11px; padding:1px 7px; border-radius:var(--radius-pill); }
.his-item .lv.good { background:rgba(46,125,50,.12); color:var(--c-yi); }
.his-item .lv.mid { background:rgba(201,154,46,.14); color:var(--c-gold); }
.his-item .lv.bad { background:#f1f1f1; color:var(--c-bad); }