.life-module .life-visual { margin:16px 0; min-width:0; }
.life-clock { text-align:center; }
.life-clock svg { width:min(100%,280px); height:auto; }
.life-clock p { font-size:1.4rem; font-variant-numeric:tabular-nums; }
.life-timeline { padding:12px; border-block:1px solid var(--line); text-align:center; overflow-wrap:anywhere; }
.life-timeline progress { width:min(100%,320px); accent-color:var(--blue-dark); }
.life-counted-note { flex:0 1 280px; min-width:0; text-align:center; }
.life-counted-note.is-counted { outline:2px solid var(--blue-dark); outline-offset:2px; }
.life-pairs { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.life-pairs > div { display:grid; justify-items:center; align-content:start; gap:8px; padding:8px; border:1px solid var(--line); }
.life-pairs .is-extra { background:var(--yellow-soft); outline:2px solid var(--blue-dark); }
.life-calendar { max-width:440px; margin:14px auto; }
.life-calendar h4 { margin:10px 0; text-align:center; font-size:1.2rem; }
.life-calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; }
.life-calendar-grid > * { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:44px; border:1px solid var(--line); border-radius:6px; font-variant-numeric:tabular-nums; padding:2px; }
.life-calendar-grid small { font-size:.7rem; color:var(--blue-dark); }
.life-calendar-grid .is-marked,.life-calendar-grid [aria-pressed=true] { background:#f7e6a2; color:#173e52; outline:2px solid var(--blue-dark); outline-offset:-2px; }
.life-calendar-grid .life-weekday { border:0; background:#eef3f3; font-weight:700; }
.life-notes { display:flex; align-items:flex-start; justify-content:center; flex-wrap:wrap; gap:12px; }
.life-note { width:180px; min-height:135px; display:grid; gap:4px; border:2px dashed #7691a0; border-radius:18px 4px; padding:10px; background:#f0f5f6; color:#294a60; }
.life-note[data-issuer="1"] { border-radius:4px 18px; background:#f6f2e6; }
.life-note[data-issuer="2"] { border-radius:16px; background:#edf3e9; }
.life-note small { font-size:.68rem; }
.life-note > span { font-size:.85rem; }
.life-note strong { font-size:1.65rem; }
.life-note-pattern { text-align:right; }
.life-price { display:table; margin:20px auto; padding:18px; background:var(--yellow-soft); font-size:2rem; font-variant-numeric:tabular-nums; }
.life-fruit { width:28px; height:32px; flex:0 0 28px; fill:#d8998d; stroke:#6e4d42; stroke-width:1.7; }
.life-fruit.fruit-1 { fill:#e5c965; }.life-fruit.fruit-2 { fill:#a3be88; }
.life-objects { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; padding:12px; border:1px dashed var(--line); }
.life-objects > span { display:grid; justify-items:center; }
.life-objects small { font-size:.75rem; }
.life-chart { display:flex; gap:14px; margin:18px 0; }
.life-chart.horizontal { flex-direction:column; }
.life-chart-category { display:flex; gap:10px; align-items:center; }
.life-chart-category > strong { min-width:48px; font-size:1rem; }
.life-chart-category > div { display:flex; flex-wrap:wrap; gap:3px; }
.life-chart.vertical { justify-content:center; align-items:flex-end; gap:18px; }
.life-chart.vertical .life-chart-category { flex-direction:column-reverse; gap:8px; }
.life-chart.vertical .life-chart-category > div { flex-direction:column-reverse; flex-wrap:nowrap; min-height:32px; }
.life-chart-key { font-size:.95rem; color:var(--blue-dark); }
.life-response { margin:16px 0; text-align:center; }
.life-response label { display:block; margin:12px 0 6px; }
.life-response input { display:block; margin-inline:auto; max-width:100%; width:calc(5ch + 2.5rem); padding:10px 16px; min-height:58px; font-size:1.75rem; text-align:center; }
.life-response input[type=time] { width:190px; font-size:1.4rem; }
.life-choice-list { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }
.life-choice-list [aria-pressed=true] { background:#e8f1f3; outline:2px solid var(--blue-dark); }
.life-classification { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; }
.life-classification > div { display:grid; gap:6px; justify-items:center; padding:8px; border-bottom:1px solid var(--line); margin:0; }
.life-classification select { max-width:100%; padding:8px; font:inherit; }
.life-build-row { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; align-items:center; margin:12px 0; }
.life-build-row > strong { min-width:80px; }
.life-build-row output { min-width:30px; text-align:center; }
.life-build-row button { width:44px; }
.life-counts .life-fruit { vertical-align:middle; margin-right:10px; }
@media(max-width:380px) { .life-calendar-grid { gap:1px; }.life-calendar-grid > * { font-size:.9rem; }.life-chart.vertical { gap:12px; }.life-note { width:165px; }.life-stage-nav button { font-size:.9rem; } }

.life-note { width:min(100%,280px); min-height:0; margin:0; padding:6px; border:1px solid var(--line); border-radius:8px; background:white; }
.life-note img { display:block; width:100%; height:auto; aspect-ratio:1200/675; object-fit:contain; }
.life-note figcaption { display:grid; gap:3px; text-align:center; overflow-wrap:anywhere; }
.life-note figcaption > span { font-size:.85rem; }
.life-note figcaption small { font-size:.8rem; }
.life-choice-list button { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
@media(max-width:380px){ .life-note { width:100%; } }