/* 32 · 发财树黄叶诊断 —— 视觉母题「叶片标本 / 权重条」
   独立布局：Hero 左侧文字 + 右侧 CSS 绘制叶片；结果用横向权重条 + 成因卡 + 浇水日历轨。 */
.b29.py-wrap {
    --b29-bg: #f6f6ec;
    --b29-surface: #fffefa;
    --b29-surface-2: #f2f3e7;
    --b29-ink: #243024;
    --b29-sub: #515f50;
    --b29-muted: #8a9485;
    --b29-line: #e2e6d5;
    --b29-line-strong: #cbd3b8;
    --b29-accent: #3f7047;
    --b29-accent-2: #b0723c;
    --b29-tint: #e8f2e4;
    --b29-radius: 22px;
    --b29-radius-sm: 11px;
}
:root[data-theme="dark"] .b29.py-wrap {
    --b29-bg: #10140f;
    --b29-surface: #1a2119;
    --b29-surface-2: #222b20;
    --b29-ink: #edf3e9;
    --b29-sub: #b8c6b3;
    --b29-muted: #8b9a86;
    --b29-line: #2c372a;
    --b29-line-strong: #3c4a37;
    --b29-accent: #8bc98c;
    --b29-accent-2: #e0ad71;
    --b29-tint: #223622;
}
.py-hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 26px; align-items: center; }
.py-hero h1 em { font-style: normal; color: var(--b29-accent-2); display: block; font-size: .58em; margin-top: 10px; }
.py-leaf { display: flex; flex-direction: column; align-items: center; gap: 12px; color: var(--b29-muted); font-size: var(--b29-xs); letter-spacing: .1em; }
.py-leaf-body { position: relative; width: 130px; height: 152px; border-radius: 100% 8% 100% 8%; transform: rotate(-32deg);
    background: linear-gradient(135deg, #7fa860, #4e7a43 58%, #3d6236); box-shadow: inset 0 0 0 2px rgba(255,255,255,.18), 0 18px 34px rgba(40,70,35,.22);
    border-left: 3px solid rgba(255,255,255,.3); }
.py-leaf-body i { position: absolute; left: 12%; right: 12%; height: 2px; background: rgba(255,255,255,.32); transform: rotate(-18deg); }
.py-leaf-body i:nth-child(1) { top: 22%; } .py-leaf-body i:nth-child(2) { top: 36%; }
.py-leaf-body i:nth-child(3) { top: 50%; } .py-leaf-body i:nth-child(4) { top: 64%; } .py-leaf-body i:nth-child(5) { top: 78%; }
:root[data-theme="dark"] .py-leaf-body { opacity: .82; }

.py-console { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 0;
    border: 1px solid var(--b29-line); border-radius: var(--b29-radius); overflow: hidden; box-shadow: var(--b29-shadow); }
.py-console-main { padding: 28px; background: var(--b29-surface); }
.py-console-tag { font-family: var(--b29-mono); font-size: 11.5px; letter-spacing: .16em; color: var(--b29-accent-2); margin-bottom: 12px; }
.py-console-main h2 { font-size: var(--b29-xl); margin-bottom: 18px; }
.py-signs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.py-sign { position: relative; display: flex; align-items: center; gap: 10px; cursor: pointer; padding: 12px 14px;
    border: 1.5px solid var(--b29-line-strong); border-radius: 10px; background: var(--b29-surface-2); font-size: var(--b29-sm); transition: all .16s; }
.py-sign:hover { border-color: var(--b29-accent); }
.py-sign input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.py-sign::before { content: ""; flex: none; width: 11px; height: 11px; border-radius: 3px; border: 2px solid var(--b29-line-strong); }
.py-sign:has(input:checked) { border-color: var(--b29-accent); background: var(--b29-tint); font-weight: 750; }
.py-sign:has(input:checked)::before { border-color: var(--b29-accent); background: var(--b29-accent); }
.py-sign input:focus-visible + span { outline: 2px solid var(--b29-accent); outline-offset: 3px; }
.py-console-side { padding: 26px 24px; background: var(--b29-surface-2); border-left: 1px solid var(--b29-line); display: flex; flex-direction: column; gap: 13px; }
.py-side-title { font-size: var(--b29-sm); font-weight: 800; letter-spacing: .1em; color: var(--b29-accent); }

/* 权重横条 */
.py-bars { display: flex; flex-direction: column; gap: 11px; }
.py-bar { display: grid; grid-template-columns: 132px minmax(0, 1fr) 54px; gap: 14px; align-items: center; font-size: var(--b29-sm); }
.py-bar-name { font-weight: 750; }
.py-bar-track { height: 15px; border-radius: 999px; background: var(--b29-surface-2); border: 1px solid var(--b29-line); overflow: hidden; }
.py-bar-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--b29-accent), var(--b29-accent-2)); transition: width .4s ease; }
.py-bar.is-top .py-bar-fill { background: linear-gradient(90deg, var(--b29-accent-2), #d08a4c); }
.py-bar-pct { font-family: var(--b29-mono); font-weight: 800; color: var(--b29-accent); text-align: right; }
.py-causes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 22px; }
.py-cause { padding: 18px 20px; border-radius: var(--b29-radius-sm); background: var(--b29-surface); border: 1px solid var(--b29-line); border-top: 4px solid var(--b29-accent); }
.py-cause.is-top { border-top-color: var(--b29-accent-2); }
.py-cause h3 { font-size: var(--b29-md); margin-bottom: 7px; }
.py-cause p { font-size: var(--b29-sm); color: var(--b29-sub); line-height: 1.8; margin: 0 0 9px; }
.py-cause .py-cause-do { font-size: var(--b29-xs); color: var(--b29-warn); line-height: 1.75; }

/* 浇水日历轨 */
.py-schedule { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.py-day { padding: 16px; border-radius: var(--b29-radius-sm); background: var(--b29-surface); border: 1px solid var(--b29-line); text-align: center; }
.py-day span { display: block; font-size: var(--b29-xs); color: var(--b29-muted); letter-spacing: .08em; }
.py-day b { display: block; font-family: var(--b29-mono); font-size: var(--b29-md); color: var(--b29-accent); margin: 7px 0 5px; }
.py-day small { display: block; font-size: var(--b29-xs); color: var(--b29-muted); line-height: 1.65; }

.py-ai-box { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px;
    padding: 20px 22px; border: 2px dashed var(--b29-accent); border-radius: var(--b29-radius); background: var(--b29-tint); }
.py-ai-box b { font-size: var(--b29-md); }
.py-ai-box p { font-size: var(--b29-sm); color: var(--b29-sub); line-height: 1.75; margin: 6px 0 0; max-width: 700px; }

@media (max-width: 900px) {
    .py-hero, .py-console { grid-template-columns: minmax(0, 1fr); }
    .py-console-side { border-left: 0; border-top: 1px solid var(--b29-line); }
    .py-causes, .py-schedule { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .py-leaf { display: none; }
}
@media (max-width: 560px) {
    .py-console-main, .py-console-side { padding: 18px 16px; }
    .py-signs, .py-causes, .py-schedule { grid-template-columns: minmax(0, 1fr); }
    .py-bar { grid-template-columns: 100px minmax(0, 1fr) 46px; gap: 8px; font-size: var(--b29-xs); }
}