/*! 40 · 下班边界与加班前确认清单 · 暮色确认卡（暮紫 × 时间倒推尺 × 可打印卡） */
.dk-40 {
    --ml-page: #f5f2fb;
    --ml-card: #ffffff;
    --ml-card-2: #faf8fe;
    --ml-ink: #241c38;
    --ml-sub: #574b73;
    --ml-faint: #8b7fa5;
    --ml-line: #e4dcf2;
    --ml-line-2: #f0ebfa;
    --ml-accent: #5b46a8;
    --ml-accent-2: #9a86d6;
    --ml-accent-soft: #ece6fb;
    --ml-good: #14795c;
    --ml-good-soft: #e2f3ea;
    --ml-warn: #a46b10;
    --ml-warn-soft: #faf0d8;
    --ml-bad: #b23e5a;
    --ml-bad-soft: #fae6ed;
    --ml-dusk: #e8a24c;
    --ml-font-display: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
    background: linear-gradient(180deg, rgba(91, 70, 168, .12), transparent 360px), var(--ml-page);
}
:root[data-theme="dark"] .dk-40 {
    --ml-page: #100c1c;
    --ml-card: #1b1630;
    --ml-card-2: #241d3e;
    --ml-ink: #efe9ff;
    --ml-sub: #c3b6e0;
    --ml-faint: #9184b2;
    --ml-line: #342a52;
    --ml-line-2: #2a2244;
    --ml-accent: #b6a2f5;
    --ml-accent-2: #745cc4;
    --ml-accent-soft: #2e244c;
    --ml-good-soft: #16352a;
    --ml-warn-soft: #382b13;
    --ml-bad-soft: #3a1c2a;
    --ml-dusk: #f0bd74;
}
.dk-40 .ml-hero { grid-template-columns: minmax(0, 1fr) minmax(410px, 500px); }
.dk-40 .ml-feature i { background: var(--ml-accent); color: #fff; }
.dk-40 .dk-console-h { background: linear-gradient(100deg, #352a66, #6b57b0); }
.dk-40 .dk-console { border-top: 3px solid var(--ml-dusk); }
.dk-40 .dk-opts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dk-40 .dk-line { border-left: 3px solid var(--ml-dusk); }

/* 时间倒推尺 */
.m40-ruler { padding: 16px 18px; border: 1px solid var(--ml-line); border-radius: 10px; background: var(--ml-card-2); }
.m40-track { position: relative; height: 22px; border-radius: 11px; background: var(--ml-line-2); margin: 18px 0 26px; }
.m40-track .bar { position: absolute; top: 5px; height: 12px; border-radius: 6px; background: linear-gradient(90deg, var(--ml-accent), var(--ml-dusk)); }
.m40-mark { position: absolute; top: -4px; width: 2px; height: 30px; background: var(--ml-ink); }
.m40-mark::after { content: attr(data-label); position: absolute; top: 33px; left: 50%; transform: translateX(-50%); white-space: nowrap; font: 700 11px/1.5 var(--ml-font-num); color: var(--ml-sub); }
.m40-mark.is-good { background: var(--ml-good); } .m40-mark.is-bad { background: var(--ml-bad); }
.m40-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 26px; font-size: 12px; color: var(--ml-sub); }
.m40-legend b { font-family: var(--ml-font-num); color: var(--ml-ink); }

/* 可打印确认卡 */
.m40-card { padding: 22px 24px; border: 2px solid var(--ml-ink); border-radius: 6px; background: var(--ml-card); }
.m40-card h3 { margin: 0 0 6px; font-size: 19px; letter-spacing: .06em; }
.m40-card .meta { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-bottom: 14px; font: 700 12px/1.8 var(--ml-font-num); color: var(--ml-sub); }
.m40-card .big { padding: 11px 14px; margin-bottom: 14px; border: 1px dashed var(--ml-accent); border-radius: 7px; background: var(--ml-accent-soft); }
.m40-card .big b { display: block; font: 800 28px/1.25 var(--ml-font-num); color: var(--ml-accent); }
.m40-card label { display: flex; align-items: flex-start; gap: 10px; padding: 9px 0; border-top: 1px dashed var(--ml-line); font-size: 13px; line-height: 1.7; cursor: pointer; }
.m40-card input { margin-top: 6px; accent-color: var(--ml-accent); }
.m40-card small { display: block; color: var(--ml-faint); font-size: 11.5px; }
.m40-card .foot { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--ml-line); font-size: 11.5px; color: var(--ml-faint); }
.m40-moved { display: grid; gap: 7px; }
.m40-moved div { padding: 8px 11px; border-left: 3px solid var(--ml-warn); border-radius: 6px; background: var(--ml-warn-soft); font-size: 12.5px; }
@media (max-width: 900px) { .dk-40 .ml-hero { grid-template-columns: 1fr; } .dk-40 .dk-opts { grid-template-columns: repeat(2, 1fr); } }