.journal-main { padding: 44px 0 82px; }
.journal-wrap { display: grid; gap: 18px; }
.journal-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 2px; }
.journal-heading h1 { max-width: 790px; margin: 13px 0 12px; font-size: clamp(2.25rem,4.8vw,4.5rem); line-height: .98; letter-spacing: -.06em; }
.journal-heading .lede { max-width: 770px; color: var(--muted); }
.journal-counter { min-width: 150px; display: grid; gap: 2px; padding: 16px 18px; border: 1px solid var(--line-strong); border-radius: 14px; background: var(--surface); }
.journal-counter strong { color: var(--accent); font: 800 1.6rem/1 ui-monospace,SFMono-Regular,Menlo,monospace; }
.journal-counter span,.panel-title p { color: var(--muted); font-size: .83rem; }
.journal-privacy { padding: 14px 17px; border: 1px solid var(--line-strong); border-left: 3px solid var(--accent); border-radius: 12px; color: var(--muted); background: var(--surface); font-size: .9rem; }
.journal-privacy strong { color: var(--text); }
.journal-entry,.journal-chart,.journal-handoff,.journal-records { padding: 22px; }
.panel-title { display: flex; align-items: start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.panel-title h2,.handoff-copy h2 { margin: 0; font-size: 1.2rem; letter-spacing: -.025em; }
.panel-title > span { color: var(--muted); font-size: .8rem; }
.panel-title p { margin: 5px 0 0; }
.journal-form { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; align-items: end; }
.journal-field { display: grid; gap: 6px; min-width: 0; }
.journal-field label { color: var(--text); font-size: .83rem; font-weight: 700; }
.journal-field label span { margin-left: 4px; color: var(--muted); font-size: .72rem; font-weight: 450; }
.journal-field input,.journal-field select { min-height: 44px; width: 100%; padding: 9px 11px; border: 1px solid var(--line-strong); border-radius: 9px; color: var(--text); background: var(--surface); }
.journal-field input:focus,.journal-field select:focus { outline: 3px solid rgba(33,124,84,.18); border-color: var(--accent); }
.journal-field small { color: var(--muted); font-size: .74rem; line-height: 1.4; }
.journal-field-wide { grid-column: span 2; }
.journal-button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: 9px 13px; border: 1px solid transparent; border-radius: 9px; cursor: pointer; font-family: inherit; font-size: .84rem; font-weight: 750; line-height: 1.2; text-align: center; transition: transform .15s ease,border-color .15s ease,background .15s ease; }
.journal-button:hover { transform: translateY(-1px); }
.journal-button:focus-visible,.import-button:focus-within { outline: 3px solid rgba(33,124,84,.24); outline-offset: 2px; }
.journal-primary { color: #fff; background: var(--accent); }
.journal-secondary { border-color: var(--line-strong); color: var(--text); background: var(--surface); text-decoration: none; }
.journal-secondary:hover { border-color: var(--accent); color: var(--accent); }
.journal-button[aria-disabled="true"] { opacity: .52; cursor: not-allowed; }
.journal-danger { border-color: transparent; color: var(--danger); background: transparent; }
.journal-danger:hover { border-color: var(--danger); }
.journal-message,.handoff-status { min-height: 1.4em; margin: 0; color: var(--muted); font-size: .83rem; }
.journal-message[data-tone="error"],.journal-handoff-warning { color: var(--danger); }
.journal-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.journal-stat { min-height: 104px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 6px; padding: 15px 17px; border: 1px solid var(--line-strong); border-radius: 13px; background: var(--surface); }
.journal-stat > span { color: var(--muted); font-size: .79rem; }
.journal-stat > span small { color: var(--muted); font-size: .68rem; }
.journal-stat strong { font: 800 1.35rem/1.1 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing: -.045em; }
.journal-stat > small { color: var(--muted); font-size: .73rem; }
.journal-stat strong[data-tone="positive"] { color: var(--accent); }
.journal-stat strong[data-tone="negative"] { color: var(--danger); }
.journal-chart-frame { min-height: 270px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.journal-chart-frame svg { display: block; width: 100%; height: auto; min-height: 220px; }
.journal-empty { margin: 20px; color: var(--muted); text-align: center; }
.journal-handoff { display: grid; grid-template-columns: minmax(220px,.8fr) minmax(0,1.4fr); gap: 28px; background: rgba(13,24,21,.94); color: #f3f6f1; }
.handoff-copy .eyebrow { margin-bottom: 12px; }
.handoff-copy h2 { font-size: clamp(1.6rem,2.7vw,2.25rem); }
.handoff-copy p { color: #9aada6; font-size: .9rem; line-height: 1.65; }
.journal-handoff-warning { margin-top: 10px; }
.handoff-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-content: start; }
.journal-handoff .journal-field label { color: #d5dfd9; }
.journal-handoff .journal-field input,.journal-handoff .journal-field select { border-color: #3a5149; color: #f3f6f1; background: #08120f; }
.journal-handoff .journal-field small { color: #9aada6; }
.handoff-links { grid-column: 1/-1; display: flex; flex-wrap: wrap; gap: 9px; }
.handoff-links .journal-button { flex: 1 1 165px; }
.journal-handoff .journal-secondary { border-color: #3a5149; color: #f3f6f1; background: #111f1b; }
.journal-handoff .journal-secondary:hover { border-color: #54d6a8; color: #54d6a8; }
.journal-handoff .handoff-status { grid-column: 1/-1; color: #9aada6; }
.records-heading { align-items: center; }
.record-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.import-button { cursor: pointer; }
.journal-table-wrap { max-height: 520px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.older-trades { margin-top: 12px; }
.journal-table-wrap table { width: 100%; border-collapse: collapse; text-align: left; }
.journal-table-wrap th,.journal-table-wrap td { padding: 11px 13px; border-bottom: 1px solid var(--line); vertical-align: top; }
.journal-table-wrap th { position: sticky; top: 0; z-index: 1; color: var(--muted); background: var(--surface-2); font-size: .75rem; }
.journal-table-wrap td { font-size: .86rem; }
.journal-table-wrap tr:last-child td { border-bottom: 0; }
.journal-empty-row { padding: 25px!important; color: var(--muted); text-align: center; }
.trade-result { font: 750 .85rem ui-monospace,SFMono-Regular,Menlo,monospace; }
.trade-result[data-tone="positive"] { color: var(--accent); }
.trade-result[data-tone="negative"] { color: var(--danger); }
.trade-note { max-width: 480px; color: var(--muted); white-space: pre-wrap; overflow-wrap: anywhere; }
.delete-trade { padding: 5px 8px; border: 0; border-radius: 7px; color: var(--muted); background: transparent; cursor: pointer; }
.delete-trade:hover { color: var(--danger); background: var(--surface-2); }
.journal-limit-note { margin: 14px 0 0; color: var(--muted); font-size: .79rem; line-height: 1.55; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
html[data-theme="dark"] .journal-main { --accent: #72d59f; --danger: #f09288; --surface: #101e19; --surface-2: #14231e; --line: #263b33; --line-strong: #355044; --text: #edf4f0; --muted: #91a49b; }
html[data-theme="dark"] .journal-handoff { background: #0d1b16; }
html[data-theme="dark"] .journal-handoff .journal-secondary { border-color: #355044; color: #edf4f0; background: #14231e; }
html[data-theme="dark"] .journal-handoff .journal-secondary:hover { color: #72d59f; }
html[data-theme="dark"] .journal-chart-frame { background: #0a1511; }
html[data-theme="dark"] .journal-primary { color: #07110f; }
html[data-theme="dark"] footer { border-top-color: #20332b; background: #07110f; }
@media (max-width: 900px) { .journal-form { grid-template-columns: repeat(2,minmax(0,1fr)); } .journal-stats { grid-template-columns: repeat(2,minmax(0,1fr)); } .journal-handoff { grid-template-columns: 1fr; gap: 12px; } }
@media (max-width: 640px) { .journal-main { padding-top: 26px; } .journal-heading { align-items: start; flex-direction: column; gap: 16px; } .journal-heading h1 { font-size: clamp(2.15rem,11vw,3.2rem); } .journal-counter { min-width: 0; } .journal-form { grid-template-columns: 1fr; } .journal-field-wide { grid-column: auto; } .journal-entry,.journal-chart,.journal-handoff,.journal-records { padding: 16px; } .journal-stats { gap: 8px; } .journal-stat { min-height: 96px; padding: 12px; } .records-heading { align-items: start; flex-direction: column; } .record-actions { width: 100%; } .record-actions .journal-button,.import-button { flex: 1; } .handoff-controls { grid-template-columns: 1fr; } .handoff-links,.journal-handoff .handoff-status { grid-column: auto; } .handoff-links { flex-direction: column; } .journal-table-wrap th,.journal-table-wrap td { padding: 9px 8px; font-size: .76rem; } .journal-table-wrap th:nth-child(4),.journal-table-wrap td:nth-child(4) { min-width: 145px; } }
