.calendar-panel { display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:40px; margin-top:24px; padding:32px 40px; background:#fff; border-radius:32px; }
.calendar-heading { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:20px; }
.calendar-heading h2 { font-size:26px; line-height:1.25; letter-spacing:-.03em; }
.calendar-heading p { font-size:13px; line-height:1.6; color:var(--muted); margin-top:8px; }
.month-controls { display:flex; align-items:center; gap:4px; margin-left:auto; }
.month-controls .icon-button { font-size:26px; width:32px; height:36px; }
.month-picker input { border:0; background:#f1f3f5; color:#242426; font-family:inherit; font-size:14px; padding:10px 12px; border-radius:12px; width:166px; min-height:40px; }
.calendar-summary { font-size:14px; line-height:1.6; margin-top:24px; color:#53606d; }
.calendar-weekdays,.calendar-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; }
.calendar-weekdays { font-size:11px; color:#65717c; text-align:center; margin-block:24px 12px; }
.calendar-day { min-width:0; min-height:84px; border-radius:12px; padding:10px 6px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:6px; background:#f4f6f8; }
.calendar-day > span:first-child { font-size:12px; line-height:1.3; color:#63707c; }
.calendar-day strong { font-size:12px; line-height:1.35; font-weight:500; white-space:nowrap; letter-spacing:0; font-variant-numeric:tabular-nums; }
.calendar-day small { font-size:11px; line-height:1.3; color:#596c64; }
.calendar-day i { font-style:normal; color:#a6aeb7; margin-block:auto; }
.calendar-day.day-profit { color:#146e48; background:#e7f5ed; }
.calendar-day.day-loss { color:#a12c3c; background:#fbecee; }
.calendar-day.day-loss small { color:#885461; }
.calendar-day.day-flat { color:#455565; background:#e9eef2; }
.calendar-day:hover { filter:brightness(.96); }
.calendar-day[aria-pressed=true] { background:#252527; color:#fff; }
.calendar-day[aria-pressed=true] > span,.calendar-day[aria-pressed=true] small,.calendar-day[aria-pressed=true] i { color:#e0e4e9; }
.calendar-day.day-today > span:first-child { text-decoration:underline; text-underline-offset:4px; }
.calendar-scope { font-size:11px; color:#697580; line-height:1.6; margin-top:16px; }
.month-review { padding:4px 0 0 8px; min-width:0; display:flex; flex-direction:column; align-items:start; }
.month-review h3 { font-size:22px; letter-spacing:-.025em; }
.month-review > p { font-size:13px; color:var(--muted); line-height:1.7; margin-top:16px; }
.review-progress { height:4px; width:100%; background:#e8edf1; border-radius:4px; overflow:hidden; margin-top:20px; }
.review-progress i { display:block; height:100%; background:#3d765d;  }
.review-counts { display:flex; justify-content:space-between; gap:12px; width:100%; font-size:11px; color:#6a7680; margin-top:10px; }
.month-review > .button { margin-top:24px; font-size:13px; padding-inline:16px; min-height:44px; }
.month-lesson { margin-top:32px; padding-top:24px; width:100%; }
.small-label { font-size:12px; color:#6a7680; }
#month-last-lesson { font-size:16px; line-height:1.65; margin-top:12px; overflow-wrap:anywhere; white-space:pre-wrap; }
.month-lesson .text-link { margin-top:12px; font-size:12px; }
.selected-day { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; align-items:center; margin-top:20px; background:#edf1f4; padding:12px 16px; border-radius:12px; font-size:13px; }
.selected-day .text-link { font-size:12px; }
.review-status { font-size:12px; color:#65727c; padding-block:8px; white-space:nowrap; }
.review-status:hover { color:#bd2936; }
.breakdown-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.breakdown-heading select { color:#3c4854; background:#eff2f4; font-size:13px; min-height:40px; padding:10px 14px; }
.setup-review > p { margin-top:16px; }
#risk-coverage { color:#687580; font-size:11px; line-height:1.6; display:block; margin-top:6px; }
.trade-dialog { width:680px; }
.trade-tabs { display:flex; align-items:center; gap:8px; padding:0 32px 20px; background:white; position:relative; z-index:1; }
.trade-tabs > button { min-height:40px; padding:10px 16px; font-size:14px; border-radius:24px; color:#66717c; }
.trade-tabs > button[aria-selected=true] { color:white; background:#252527; }
.trade-tabs > button:hover { background:#edf1f4; color:#181818; }
.trade-tabs > button[aria-selected=true]:hover { background:#3c3c40; color:white; }
#trade-card-result { font-size:12px; color:#6b7781; margin-left:auto; line-height:1.5; text-align:right; }
.result-mode,.plan-field { border:0; padding:0; margin:0; min-width:0; }
.result-mode legend,.plan-field legend { font-size:14px; line-height:1.5; margin-bottom:10px; }
.plan-options { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.plan-options label { position:relative; display:flex; min-height:44px; cursor:pointer; }
.plan-options input { position:absolute; inset:0; opacity:0; margin:0; width:100%; height:100%; cursor:pointer; }
.plan-options span { width:100%; display:grid; place-items:center; border-radius:12px; background:#eef1f4; font-size:13px; padding:12px 8px; }
.plan-options input:checked + span { color:#fff; background:#333638; }
.plan-options input:focus-visible + span { outline:2px solid #566c80; outline-offset:3px; }
.plan-field > .text-link { font-size:11px; margin-top:8px; }
.review-fields { margin-top:24px; }
.mistake-presets { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.mistake-presets button { background:#f1f3f5; border-radius:20px; font-size:12px; line-height:1.4; padding:8px 12px; }
.mistake-presets button:hover { background:#e1e7eb; }
.mistake-presets button[aria-pressed=true] { color:#fff; background:#535e67; }
.form-result { flex-wrap:wrap; }
.form-result output { margin-left:auto; }
#form-r { color:#64717c; font-size:13px; }
.screenshot-field { margin-top:28px; }
.screenshot-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:14px; margin-bottom:12px; }
.screenshot-heading .optional { margin-left:8px; font-size:12px; color:#74808a; }
.screenshot-heading .text-link { font-size:12px; }
.screenshot-upload { display:flex; flex-direction:column; gap:8px; align-items:center; justify-content:center; position:relative; background:#f0f3f5; border-radius:16px; padding:24px; cursor:pointer; min-height:106px; text-align:center; }
.screenshot-upload > span { font-size:15px; }
.screenshot-upload > small { font-size:11px; line-height:1.6; color:#66727c; }
.screenshot-upload input { opacity:0; position:absolute; inset:0; width:100%; height:100%; cursor:pointer; }
.screenshot-upload:focus-within { outline:2px solid #566c80; outline-offset:3px; }
.screenshot-preview { width:100%; display:block; padding:0; border-radius:16px; background:#edf0f3; overflow:hidden; cursor:zoom-in; }
.screenshot-preview img { display:block; width:100%; height:auto; max-height:270px; object-fit:contain; }
.screenshot-field > p { margin-top:10px; }
.chart-dialog { width:min(1100px,calc(100% - 32px)); }
.chart-dialog > img { width:100%; height:auto; display:block; object-fit:contain; max-height:calc(100dvh - 150px); background:#eff2f4; }
.import-dialog { width:760px; }
.import-file-stats { color:#546371; font-size:12px; margin-top:16px; line-height:1.6; }
.csv-mapper { margin-top:28px; }
.csv-mapper h3 { font-size:22px; letter-spacing:-.025em; margin-bottom:20px; }
.mapping-grid,.mapping-settings { display:grid; grid-template-columns:1fr 1fr; gap:20px 24px; }
.mapping-settings { margin-top:24px; }
.mapping-grid label,.mapping-settings label { display:flex; flex-direction:column; gap:10px; font-size:13px; min-width:0; }
.mapping-grid select,.mapping-settings select,.mapping-settings input { width:100%; color:#26323c; background:#f0f3f5; border:0; border-radius:12px; font:inherit; font-size:14px; min-height:46px; padding:12px 14px; }
.mapping-grid small { font-size:11px; line-height:1.6; color:#6a7781; overflow-wrap:anywhere; }
.import-options { margin-block:24px; padding:16px 0; }
.import-options > summary { display:flex; align-items:center; justify-content:space-between; font-size:14px; min-height:40px; gap:16px; }
.import-options > summary > span { font-size:22px; color:#6a7781; }
.import-options[open] > summary > span { transform:rotate(45deg); }
.import-options > .mapping-grid { margin-top:24px; }
.skip-matches { display:flex; align-items:flex-start; gap:12px; font-size:13px; line-height:1.6; margin-block:16px 24px; }
.skip-matches input { accent-color:#3d494f; width:18px; height:18px; flex-shrink:0; margin:2px 0 0; }
.skip-matches small { display:block; font-size:11px; line-height:1.65; color:#66737f; margin-top:8px; }
.outcome-tabs { max-width:100%; overflow-x:auto; }
.calendar-amount-short { display:none; }
@media(max-width:1199px){
  .calendar-panel { padding:28px 32px; grid-template-columns:minmax(0,1fr) 210px; gap:28px; }
  .calendar-day { padding-inline:4px; }
  .calendar-day strong { font-size:11px; }
  .calendar-heading { gap:16px; }
}
@media(max-width:1023px){
  .calendar-panel { grid-template-columns:minmax(0,1fr); padding:28px; gap:32px; }
  .month-review { padding:0; display:grid; grid-template-columns:1fr auto; gap:0 32px; align-items:start; }
  .month-review > h3,.month-review > p,.month-review > .review-progress,.month-review > .review-counts { grid-column:1; }
  .month-review > .button { grid-column:2; grid-row:1/4; margin-top:0; }
  .month-lesson { grid-column:1/-1; margin-top:20px; padding-top:0; }
}
@media(max-width:767px){
  .calendar-panel { border-radius:24px; margin-top:16px; padding:24px 16px; gap:28px; }
  .calendar-heading h2 { font-size:24px; }
  .calendar-heading p { font-size:12px; max-width:260px; }
  .month-controls { margin-left:0; }
  .month-picker input { width:160px; font-size:14px; min-height:40px; }
  .calendar-summary { font-size:12px; margin-top:16px; }
  .calendar-weekdays { font-size:11px; margin-block:20px 10px; }
  .calendar-weekdays,.calendar-days { gap:4px; }
  .calendar-day { min-height:66px; gap:6px; padding:8px 1px; border-radius:8px; }
  .calendar-day > span:first-child { font-size:11px; }
  .calendar-day strong { font-size:11px; letter-spacing:0; }
  .calendar-amount-full { display:none; }.calendar-amount-short { display:inline; }
  .calendar-day small { font-size:11px; }
  .calendar-scope { font-size:11px; }
  .month-review { display:flex; }
  .month-review h3 { font-size:21px; }
  .month-review > p { font-size:12px; margin-top:12px; }
  .month-review > .button { margin-top:20px; }
  .month-lesson { margin-top:24px; }
  #month-last-lesson { font-size:15px; }
  .trade-dialog { width:100%; }
  .trade-tabs { padding:0 20px 16px; flex-wrap:wrap; gap:6px; }
  .trade-tabs > button { font-size:13px; padding:10px 14px; }
  #trade-card-result { display:none; }
  .plan-options { grid-template-columns:1fr 1fr; }
  .plan-options span { font-size:12px; }
  .plan-field legend,.result-mode legend { font-size:13px; }
  .form-grid > .result-mode { grid-column:1/-1; }
  .form-grid [name=initial_risk] { min-width:0; }
  .form-grid > label:has([name=initial_risk]) { grid-column:1/-1; }
  .form-grid > label:has([name=setup]) { grid-column:1/-1; }
  .review-fields { margin-top:20px; }
  .review-fields > label { grid-column:1/-1; }
  .screenshot-heading { font-size:13px; }
  .screenshot-heading .optional { font-size:11px; }
  .screenshot-upload { padding:20px 12px; }
  .screenshot-upload > span { font-size:14px; }
  .screenshot-upload > small { font-size:10px; }
  .screenshot-preview img { max-height:210px; }
  .import-dialog { width:100%; }
  .mapping-grid,.mapping-settings { gap:20px 16px; }
  .mapping-grid label,.mapping-settings label { font-size:12px; }
  .mapping-grid select,.mapping-settings select,.mapping-settings input { font-size:13px; padding:12px 10px; }
  .mapping-grid small { font-size:10px; }
  .import-options > summary { font-size:13px; }
  .skip-matches { font-size:12px; }
  .skip-matches small { font-size:10px; }
  .breakdown-heading select { font-size:12px; }
  .outcome-tabs { width:100%; }
  .outcome-tabs button { padding-inline:10px; }
}

#trade-history { scroll-margin-top:144px; }
@media(max-width:767px){#trade-history {scroll-margin-top:104px;}}

.form-grid input,.form-grid select,.form-grid textarea { font-family:inherit; }

.calendar-rounding { display:none; }
@media(max-width:767px){.calendar-rounding {display:block; margin-top:4px;}}

/* Keep results and the calendar together; reserve a stable, compact chart area. */
.hero { padding-block:32px 24px; }
.hero h1 { font-size:56px; }
.hero-description { font-size:20px; margin-top:12px; }
.quick-guide { padding-bottom:16px; }
.journal-dashboard { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; }
.journal-dashboard > * { min-width:0; }
.journal-dashboard .overview { display:flex; flex-direction:column; padding:24px; border-radius:24px; }
.journal-dashboard .overview-top { margin-bottom:20px; gap:12px; }
.journal-dashboard .overview h2 { font-size:22px; }
.journal-dashboard .overview-filters { gap:12px; }
.journal-dashboard .select-label { font-size:12px; gap:8px; }
.journal-dashboard .select-wrap select { min-height:40px; padding:10px 32px 10px 12px; font-size:13px; }
.journal-dashboard .select-wrap > svg { right:10px; }
.journal-dashboard .performance-grid { display:flex; flex:1; flex-direction:column; justify-content:space-between; gap:20px; }
.journal-dashboard .net-total { font-size:44px; margin-top:8px; }
.journal-dashboard .metric-label { font-size:12px; gap:6px; }
.journal-dashboard .help { width:24px; height:24px; font-size:12px; }
.journal-dashboard .total-caption { font-size:12px; margin-top:6px; }
.journal-dashboard .chart-wrap { height:192px; min-height:0; margin-top:16px; }
.journal-dashboard #pnl-chart { width:100%; height:100%; aspect-ratio:auto; }
.journal-dashboard .chart-footer { font-size:11px; margin-top:8px; }
.journal-dashboard .chart-empty > p { font-size:21px; }
.journal-dashboard .chart-empty > span { font-size:12px; }
.journal-dashboard .chart-empty > div { flex-direction:row; gap:16px; margin-top:20px; }
.journal-dashboard .chart-empty .button { min-height:44px; padding:10px 16px; font-size:13px; }
.journal-dashboard .chart-empty .text-link { font-size:12px; }
.journal-dashboard .key-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; padding:0; border:0; }
.journal-dashboard .key-metrics .metric > p:nth-child(2) { font-size:28px; margin:8px 0 6px; }
.journal-dashboard .metric > span { font-size:11px; }
.journal-dashboard .win-rate-track { margin-top:10px; height:3px; }
.journal-dashboard .date-range { margin:0 0 20px; gap:12px; font-size:12px; }
.journal-dashboard .date-range input { width:140px; }
.journal-dashboard .calendar-panel { grid-template-columns:minmax(0,1fr); gap:16px; margin:0; padding:24px; border-radius:24px; }
.journal-dashboard .calendar-heading { gap:12px; align-items:center; }
.journal-dashboard .calendar-heading h2 { font-size:22px; }
.journal-dashboard .calendar-heading p { margin-top:4px; font-size:12px; }
.journal-dashboard .month-picker input { width:146px; padding:10px; font-size:12px; }
.journal-dashboard .calendar-summary { margin-top:12px; font-size:12px; }
.journal-dashboard .calendar-weekdays { margin-block:12px 8px; }
.journal-dashboard .calendar-weekdays,.journal-dashboard .calendar-days { gap:4px; }
.journal-dashboard .calendar-day { min-height:44px; padding:6px 2px; gap:3px; border-radius:8px; }
.journal-dashboard .calendar-day > span:first-child { font-size:11px; }
.journal-dashboard .calendar-day strong { font-size:11px; }
.journal-dashboard .calendar-day small { display:none; }
.journal-dashboard .calendar-amount-full { display:none; }
.journal-dashboard .calendar-amount-short { display:inline; }
.journal-dashboard .calendar-scope { margin-top:8px; }
.journal-dashboard .calendar-rounding { display:block; margin-top:2px; }
.journal-dashboard .month-review { padding:0; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 16px; align-items:start; }
.journal-dashboard .month-review > h3 { grid-column:1; font-size:16px; line-height:1.4; }
.journal-dashboard .month-review > p { grid-column:1; margin-top:4px; font-size:12px; line-height:1.5; }
.journal-dashboard .month-review > .review-progress { grid-column:1; height:3px; margin-top:8px; }
.journal-dashboard .month-review > .review-counts { grid-column:1; margin-top:6px; }
.journal-dashboard .month-review > .button { grid-column:2; grid-row:1/5; align-self:center; min-height:44px; margin:0; padding:10px 12px; font-size:12px; }
.journal-dashboard .month-lesson { grid-column:1/-1; margin-top:12px; padding:0; }
.journal-dashboard .month-lesson > summary { display:flex; justify-content:space-between; align-items:center; min-height:28px; gap:16px; color:#56616d; font-size:12px; }
.journal-dashboard .month-lesson > summary > span { font-size:20px; }
.journal-dashboard .month-lesson[open] > summary > span { transform:rotate(45deg); }
.journal-dashboard #month-last-lesson { margin-top:8px; font-size:14px; line-height:1.6; }

@media(min-width:1120px){
  .journal-dashboard { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; }
  .journal-dashboard:has(> .calendar-panel[hidden]) { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:767px){
  .hero { padding-block:24px 20px; }
  .hero h1 { font-size:42px; }
  .hero-description { font-size:18px; }
  .journal-dashboard { gap:16px; }
  .journal-dashboard .overview,.journal-dashboard .calendar-panel { padding:20px 16px; }
  .journal-dashboard .overview-top { flex-direction:row; flex-wrap:wrap; }
  .journal-dashboard .overview-filters { width:100%; justify-content:space-between; }
  .journal-dashboard .net-total { font-size:40px; }
  .journal-dashboard .key-metrics { gap:12px; }
  .journal-dashboard .key-metrics .metric > p:nth-child(2) { font-size:26px; }
  .journal-dashboard .metric-label { flex-wrap:wrap; }
  .journal-dashboard .calendar-heading { gap:16px; }
  .journal-dashboard .month-controls { margin-left:0; }
  .journal-dashboard .calendar-day { min-height:44px; }
  .journal-dashboard .month-review { grid-template-columns:minmax(0,1fr); }
  .journal-dashboard .month-review > .button { grid-column:1; grid-row:auto; justify-self:start; margin-top:12px; }
}