/*! 37 · 打断次数与恢复成本日志 · 复盘热力台（玫瑰红 × 24 格热力 × 成本榜） */
.dk-37 {
    --ml-page: #fdf2f3;
    --ml-card: #ffffff;
    --ml-card-2: #fdf7f8;
    --ml-ink: #351a22;
    --ml-sub: #6b4b54;
    --ml-faint: #a18189;
    --ml-line: #f0dade;
    --ml-line-2: #f9edf0;
    --ml-accent: #b23b53;
    --ml-accent-2: #e08a9c;
    --ml-accent-soft: #fbe6ec;
    --ml-good: #14795c;
    --ml-good-soft: #e2f3ea;
    --ml-warn: #9a6810;
    --ml-warn-soft: #faf0d8;
    --ml-bad: #b23e3e;
    --ml-bad-soft: #fae6e4;
    --ml-font-display: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
    background: radial-gradient(860px 320px at 2% -8%, rgba(224, 138, 156, .2), transparent 62%), var(--ml-page);
}
:root[data-theme="dark"] .dk-37 {
    --ml-page: #190d12;
    --ml-card: #25151c;
    --ml-card-2: #2e1b23;
    --ml-ink: #fbe9ee;
    --ml-sub: #d6b3bd;
    --ml-faint: #a6858f;
    --ml-line: #3d2630;
    --ml-line-2: #33202a;
    --ml-accent: #f2a0b3;
    --ml-accent-2: #c45672;
    --ml-accent-soft: #3a2030;
    --ml-good-soft: #16352a;
    --ml-warn-soft: #382b13;
    --ml-bad-soft: #3a1d1c;
}
.dk-37 .ml-hero { grid-template-columns: minmax(0, 1fr) minmax(400px, 490px); }
.dk-37 .ml-feature i { background: var(--ml-accent); color: #fff; }
.dk-37 .dk-console-h { background: linear-gradient(100deg, #9c2f47, #d27189); }
.dk-37 .dk-console { border-top: 3px solid #efbdc9; }
.dk-37 .dk-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dk-37 .dk-line { border-left: 3px solid var(--ml-accent); }

/* 24 小时热力格 */
.m37-heat { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; }
.m37-cell { padding: 9px 4px; border: 1px solid var(--ml-line); border-radius: 7px; background: var(--ml-card-2); text-align: center; }
.m37-cell b { display: block; font: 800 12px/1.4 var(--ml-font-num); color: var(--ml-ink); }
.m37-cell small { display: block; font: 700 10px/1.5 var(--ml-font-num); color: var(--ml-faint); }
.m37-cell.lv1 { background: var(--ml-accent-soft); }
.m37-cell.lv2 { background: #f6c9d3; }
.m37-cell.lv3 { background: #e58ea2; color: #fff; }
.m37-cell.lv3 small { color: #fff; }
:root[data-theme="dark"] .m37-cell.lv2 { background: #5b2b3c; }
:root[data-theme="dark"] .m37-cell.lv3 { background: #a03f5b; }
.m37-heat-note { margin-top: 10px; font-size: 11.5px; color: var(--ml-faint); }

.m37-expensive { display: grid; gap: 8px; }
.m37-cost { display: grid; grid-template-columns: 32px 1fr auto; gap: 10px; align-items: center; padding: 9px 11px; border: 1px solid var(--ml-line); border-left: 3px solid var(--ml-accent); border-radius: 7px; background: var(--ml-card-2); font-size: 12.5px; }
.m37-cost .no { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ml-accent-soft); color: var(--ml-accent); font: 800 12px/1 var(--ml-font-num); }
.m37-cost b { font: 800 13px/1.5 var(--ml-font-num); white-space: nowrap; }
.m37-cost small { display: block; }
.m37-focus { padding: 14px 16px; border-radius: 9px; background: var(--ml-accent-soft); font-size: 13px; line-height: 1.8; }
.m37-focus b { font: 800 22px/1.3 var(--ml-font-num); color: var(--ml-accent); }
@media (max-width: 900px) { .dk-37 .ml-hero { grid-template-columns: 1fr; } .m37-heat { grid-template-columns: repeat(8, 1fr); } }
@media (max-width: 560px) { .m37-heat { grid-template-columns: repeat(6, 1fr); } }
