/* =====================================================================
 * 39 梅雨季日程 · 视觉母题「入梅出梅日历条」
 * ---------------------------------------------------------------------
 * 色板：烟紫（--plum-pri #6b5b95）+ 灰紫（--plum-pri2）。
 * 版式：B 顶部横向控制条 + 全宽结果板 —— 一行铺满的参数条，结果整块铺开、表格为主。
 * 纯 CSS / 内联 SVG，零图片请求；只作用于 .b11--plum 容器。
 * ===================================================================== */

.b11--plum {
    --plum-pri: #6b5b95;
    --plum-pri2: #9285b5;
    --plum-hot: #a3462f;
    --plum-tint: #e7e3f1;
    --plum-ink: #3b3057;
    --b11-pri: #6b5b95;
    --b11-pri2: #9285b5;
    --b11-tint: #e7e3f1;
    --b11-bg: #f0eef4;
    --b11-bg2: #e4e0ec;
    --b11-card2: #f8f7fa;
    background-image:
        linear-gradient(to bottom, color-mix(in srgb, var(--plum-pri) 9%, transparent) 1px, transparent 1px);
    background-size: 100% 30px;
}
:root[data-theme="dark"] .b11.b11--plum {
    --plum-pri: #a294cc;
    --plum-pri2: #bdb1e0;
    --plum-hot: #e08a6c;
    --plum-tint: #262138;
    --plum-ink: #d5ccec;
    --b11-pri: #a294cc;
    --b11-pri2: #bdb1e0;
    --b11-tint: #262138;
    --b11-bg: #131218;
    --b11-bg2: #1a181f;
    --b11-card2: #211e28;
}

/* ---------- 首屏 ---------- */
.plum-hero { padding: 32px 0 4px; }
.plum-hero .b11-h1 em { color: var(--plum-pri); }
.plum-hero .b11-lead b { box-shadow: inset 0 -.42em 0 var(--plum-tint); }
.plum-hero .b11-lead { max-width: 880px; }

/* ---------- 顶部横向控制条（版式 B 特征） ---------- */
.plum-bar {
    margin-top: 24px; background: var(--b11-card); border: 1px solid var(--b11-line);
    border-top: 4px solid var(--plum-pri); box-shadow: var(--b11-shadow); padding: 18px 24px 16px;
    clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.plum-bar-t { font-size: var(--b11-md); color: var(--plum-ink); margin-bottom: 14px; padding-bottom: 9px; border-bottom: 2px solid var(--plum-pri); }
.plum-bar-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.plum-bar-row .b11-field { min-width: 0; }
.plum-bar-acts { margin-top: 18px; }

/* ---------- 日历条 ---------- */
.plum-strip { display: flex; flex-wrap: nowrap; overflow-x: auto; border: 1px solid var(--b11-line); background: var(--b11-card); padding: 10px 8px; gap: 2px; }
.plum-day { flex: 0 0 auto; width: 30px; text-align: center; }
.plum-day .d {
    height: 40px; display: grid; place-items: center;
    font-family: var(--b11-mono); font-size: 11px; color: var(--b11-mute);
    background: var(--b11-card2); border: 1px solid var(--b11-line);
}
.plum-day.in .d { background: var(--plum-tint); color: var(--plum-ink); border-color: color-mix(in srgb, var(--plum-pri) 40%, transparent); }
.plum-day.key .d { background: var(--plum-pri); color: var(--b11-on); border-color: var(--plum-pri); font-weight: 800; }
.plum-day.key .d::after { content: ""; display: block; width: 5px; height: 5px; border-radius: 50%; background: var(--b11-on); margin-top: 2px; }
.plum-day .w { font-size: 9px; color: var(--b11-mute); font-family: var(--b11-mono); margin-top: 3px; }
.plum-strip-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 12px; font-size: var(--b11-xs); color: var(--b11-sub); font-family: var(--b11-mono); }
.plum-strip-legend i { display: inline-block; width: 13px; height: 13px; margin-right: 5px; vertical-align: -2px; border: 1px solid var(--b11-line); }
.plum-strip-legend i.on { background: var(--plum-tint); border-color: var(--plum-pri); }
.plum-strip-legend i.key { background: var(--plum-pri); border-color: var(--plum-pri); }

/* ---------- 分位置提醒 ---------- */
.plum-place { list-style: none; margin: 0; padding: 0; }
.plum-place li {
    position: relative; padding: 10px 0 10px 30px; font-size: var(--b11-sm); color: var(--b11-sub);
    border-bottom: 1px dotted var(--b11-line2); line-height: 1.74;
}
.plum-place li:last-child { border-bottom: 0; }
.plum-place li::before {
    content: "▤"; position: absolute; left: 0; top: 10px; width: 20px; height: 20px;
    display: grid; place-items: center; background: var(--plum-tint); color: var(--plum-pri); font-size: 11px;
}
.plum-place li b { color: var(--b11-ink); }

/* ---------- 批量清洗条 ---------- */
.plum-cleanbar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
    margin-top: 14px; padding: 12px 14px; background: var(--b11-card2);
    border: 1px solid var(--b11-line); font-size: var(--b11-sm);
}
.plum-cleanbar > b { color: var(--plum-pri); font-family: var(--b11-mono); font-size: var(--b11-xs); letter-spacing: .08em; }
.plum-cleanbar code { margin-left: auto; }

/* ---------- 响应式 ---------- */
@media (max-width: 1000px) {
    .plum-bar-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .plum-bar-row { grid-template-columns: minmax(0, 1fr); }
    .plum-cleanbar code { margin-left: 0; }
}