.heart-hero{padding:clamp(24px,5vw,58px);min-height:245px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(90deg,#21172ce8,#21172c5a 65%,transparent),url('art/garden-2.webp') center 52%/cover;display:flex;flex-direction:column;justify-content:end}.heart-hero p{max-width:34rem;color:var(--ink);margin:8px 0 0;line-height:1.5}.heart-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:14px;margin-top:15px;align-items:start}.heart-panel{background:var(--panel);border:1px solid var(--line);border-radius:17px;padding:clamp(13px,2.5vw,24px);min-width:0}.heart-panel h2{font-size:clamp(28px,4vw,39px)}.heart-panel p{line-height:1.5;color:var(--soft)}.feelings,#heartNames{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:12px}.feelings button,#heartNames button,#savedReadings button{text-align:left}.feelings button[aria-pressed=true]{border-color:var(--gold);color:var(--gold);background:#483345}.heart-note{border-top:1px solid var(--line);margin-top:14px;padding-top:10px}.heart-note summary{cursor:pointer;color:var(--gold)}.heart-note label{display:block;margin-top:12px;font-size:13px}.heart-note textarea{width:100%;background:#191625;color:var(--ink);border:1px solid var(--line);border-radius:10px;font:inherit;padding:9px;margin-top:6px;resize:vertical}.heart-note p,#heartHint{font-size:13px}#heartNames button span,#savedReadings button span{display:block;color:var(--soft);font-size:12px;margin-top:3px}#heartReading{border-top:1px solid var(--line);margin-top:16px;padding-top:10px;scroll-margin-top:120px}#heartReading h3{font:36px 'Instrument Serif',Georgia,serif;margin:0;scroll-margin-top:140px}#heartReading h3:focus{outline:none}#heartReading p{margin:4px 0 9px}#heartReading .heart-arabic{font:37px Georgia,serif;color:var(--gold);text-align:left}#heartReading .name-reflection{font:italic 23px/1.3 'Instrument Serif',Georgia,serif;color:var(--gold);margin:12px 0}.heart-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px;font-size:13px}#savedReadings{padding-left:18px}#savedReadings li{margin:5px 0}
@media(max-width:690px){.heart-grid{grid-template-columns:1fr}.feelings button{font-size:13px}}
.garden-journal{position:relative;margin-block:20px 12px;padding:clamp(14px,2.6vw,24px);background:linear-gradient(155deg,#fffaf4,#f4e8f5);border:1px solid #dfc9e0;border-radius:16px}
.garden-journal::after{content:"❧";position:absolute;inset-block-start:12px;inset-inline-end:18px;color:#9c6a9d;font:27px Georgia,serif;pointer-events:none}
.garden-journal>small{display:block;padding-inline-end:22px;color:#704379;letter-spacing:.14em;font-weight:700;font-size:10px}
.garden-journal h3{margin:5px 0 3px;color:#4b0d5c;font:clamp(27px,4vw,37px)/1.1 "Playfair Display",Georgia,serif}
.garden-journal p{margin:7px 0 11px}.garden-journal label{display:grid;gap:5px;color:#573361;font-size:.88rem}
.journal-date{justify-items:start;margin-block:15px 9px}
.garden-journal :is(input,select,textarea){box-sizing:border-box;max-width:100%;font:inherit;color:#412646;background:#fffaf7;border:1px solid #cbb0d0;border-radius:9px;padding:8px 10px}
.garden-journal textarea{display:block;width:100%;min-height:155px;line-height:1.65;resize:vertical;margin-block:8px 12px}
.garden-journal :is(input,select,textarea):focus-visible{outline:2px solid #8e5b9b;outline-offset:1px}
.journal-prompt{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:.86rem;color:#633e6b}
.journal-prompt button{padding:3px 10px;font-size:1.15rem}
.journal-meta,.journal-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px 12px}
.journal-meta p,.garden-journal .journal-privacy{font-size:.76rem;margin-block:8px 0}
#reflectionStatus{color:#5e326e;font-weight:700;margin-inline-start:auto}
.journal-actions{margin-top:12px}.journal-actions button{min-height:42px;padding:7px 11px}
.journal-card{padding:12px;margin-top:9px;border:1px solid #e4d3e5;border-radius:11px;background:#fffaf7}
.journal-card p{margin:5px 0;font-size:.87rem;overflow-wrap:anywhere;white-space:pre-wrap}
.journal-card time{color:#573361;font-weight:700}
.garden-journal [hidden]{display:none!important}
@media(max-width:480px){.journal-actions button{flex:1}.garden-journal textarea{font-size:16px}}