.journal-view{align-items:stretch}
.journal{width:100%;max-width:1040px;margin:0 auto;padding-top:6px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
.j-editor{display:flex;flex-direction:column;gap:16px}
.j-head{display:flex;align-items:center;gap:8px}
.j-date{flex:1;text-align:center}
.j-date h2{font-size:clamp(1.3rem,4vw,1.7rem);font-weight:700;line-height:1.2}
.j-date p{margin-top:4px;font-weight:300;font-size:.9rem}
.j-moods{border:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center}
.j-moods legend{width:100%;text-align:center;color:var(--mist-dim);font-weight:300;font-size:.9rem;margin-bottom:8px}
.mood{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:68px;padding:8px 10px;border-radius:14px;border:1px solid var(--line);background:transparent;cursor:pointer;font-size:.8rem;color:var(--mist-dim);transition:.2s}
.mood .emo{font-size:1.5rem;line-height:1.2;filter:grayscale(.7);opacity:.75;transition:.2s}
.mood:hover{border-color:var(--gold)}
.mood.on{border-color:var(--gold);background:rgba(255,200,87,.12);color:var(--mist)}
.mood.on .emo,.mood:hover .emo{filter:none;opacity:1}
.j-prompt{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:14px;background:rgba(255,200,87,.07);border:1px solid rgba(255,200,87,.2);font-weight:300;line-height:1.4}
.j-prompt>div{display:flex;align-items:center;gap:4px;flex:none}
.j-text{min-height:260px;font-size:1.05rem;line-height:1.65;padding:14px 16px}
.j-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.j-two>div{display:flex;flex-direction:column;gap:8px}
.j-two h3{font-size:1rem;font-weight:500;color:var(--gold)}
.j-meta{display:flex;align-items:center;gap:14px;font-size:.85rem;color:var(--mist)}
.j-meta .st{flex:1;font-weight:300}
.j-meta .del[hidden]{display:none}
.j-side{display:flex;flex-direction:column;gap:12px;position:sticky;top:0;max-height:calc(100dvh - 190px);min-height:260px}
.j-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
.j-stats div{display:flex;flex-direction:column;padding:8px 4px;border-radius:12px;background:rgba(233,228,255,.05)}
.j-stats b{font-size:1.35rem;font-weight:700;color:var(--gold)}
.j-stats span{font-size:.75rem;color:var(--mist-dim)}
.j-search{position:relative;display:block}
.j-search .ico{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--mist-dim);pointer-events:none}
.j-search .field{padding-left:34px}
.j-list{list-style:none;padding:0;margin:0 -6px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;flex:1;min-height:0}
.j-item{width:100%;display:flex;align-items:center;gap:10px;text-align:left;background:transparent;border:1px solid transparent;border-radius:12px;padding:8px 10px;cursor:pointer;transition:.2s}
.j-item:hover{background:rgba(233,228,255,.06)}
.j-item.on{border-color:rgba(255,200,87,.45);background:rgba(255,200,87,.08)}
.j-mood{font-size:1.25rem;width:1.6rem;text-align:center;flex:none}
.j-item-b{flex:1;min-width:0;display:flex;flex-direction:column}
.j-item-b b{font-weight:500;font-size:.9rem}
.j-item-b em{font-style:normal;font-weight:300;font-size:.82rem;color:var(--mist-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.j-wc{font-size:.75rem}
.journal .empty{text-align:center;color:var(--mist-dim);font-weight:300;padding:18px 8px;font-size:.9rem}
@media (max-width:860px){.journal{grid-template-columns:1fr}.j-side{position:static;max-height:420px}}
@media (max-width:560px){.j-two{grid-template-columns:1fr}.mood{min-width:56px}.j-prompt{flex-direction:column;align-items:flex-start}}