/**
 * BRL Journal -- Trading Journal Dashboard styles.
 *
 * Loaded by class-brl-journal-view.php whenever the
 * [brl_journal_dashboard] shortcode is rendered on a page.
 *
 * Refactored out of the PHP file in Phase 1 (lighter PHP, browser-cached CSS).
 *
 * Cache-busting: bump the version constant in the PHP file when this changes.
 */

/* ============================================================
   BLOOMBERG PRO THEME — token re-declaration (v2.8.0)
   Existing class names are preserved; only the design tokens are
   re-mapped so the whole UI inherits the new look automatically.
   Targeted overrides for hardcoded colors live at the bottom of
   this file under "BLOOMBERG PRO OVERRIDES".
   ============================================================ */
.brl-jnl{
    --bg:#0a0e1a; --card:#0f1727; --card-2:#131c30; --border:#1a2438;
    --border-strong:#233252;
    --text:#e6ebf5; --muted:#8b97b1;
    --accent:#00d4ff;
    --pos:#00ff9c; --neg:#ff4757;
    --amber:#ffaa00;
    --cyan-glow:rgba(0,212,255,0.18);
    --pos-soft:rgba(0,255,156,0.10);
    --neg-soft:rgba(255,71,87,0.10);
    --amber-soft:rgba(255,170,0,0.12);
    --mono:'JetBrains Mono','Fira Code','SFMono-Regular',Menlo,Consolas,'Courier New',monospace;
    background:var(--bg); color:var(--text);
    line-height:1.5;
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    font-size:13px;

    /* Full-bleed: break out of theme's content container and span the
       full viewport width while keeping the inner content centered. */
    position:relative;
    width:100vw;
    left:50%;
    margin-left:-50vw;
    margin-right:-50vw;
    border-radius:0;
    padding:32px max(20px, calc(50vw - 720px));
}
.brl-jnl *{ box-sizing:border-box; }
.brl-jnl-header{ margin-bottom:24px; }
.brl-jnl-title{ font-size:24px; font-weight:600; margin:0 0 4px; color:var(--text); }
.brl-jnl-subtitle{ color:var(--muted); font-size:13px; }

.brl-jnl-stats{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
    gap:12px; margin-bottom:32px;
}
.brl-jnl-stat{
    background:var(--card); border:1px solid var(--border);
    border-radius:8px; padding:16px;
}
.brl-jnl-stat-label{
    color:var(--muted); font-size:11px; text-transform:uppercase;
    letter-spacing:0.5px; margin-bottom:8px;
}
.brl-jnl-stat-value{ font-size:22px; font-weight:600; font-variant-numeric:tabular-nums; }
.brl-jnl-stat-sub{ font-size:11px; color:var(--muted); margin-top:2px; }
.brl-jnl-stat-value.pos{ color:var(--pos); }
.brl-jnl-stat-value.neg{ color:var(--neg); }
.brl-jnl-stat-value.brl-jnl-stat-empty{ color:var(--muted); font-weight:500; }

/* Stat values that show two halves (e.g. Avg W / Avg L, Streaks) */
.brl-jnl-stat-value.brl-jnl-stat-pair{
    display:flex; align-items:baseline; gap:6px;
    font-variant-numeric:tabular-nums;
}
.brl-jnl-stat-value.brl-jnl-stat-pair .pos{ color:var(--pos); }
.brl-jnl-stat-value.brl-jnl-stat-pair .neg{ color:var(--neg); }
.brl-jnl-stat-sep{
    color:var(--muted); font-weight:400; font-size:18px;
}
.brl-jnl-stat-sub .pos{ color:var(--pos); }
.brl-jnl-stat-sub .neg{ color:var(--neg); }

/* Equity curve */
.brl-jnl-equity{
    background:var(--card); border:1px solid var(--border);
    border-radius:8px; padding:16px;
}
.brl-jnl-equity-svg{
    display:block; width:100%; height:auto;
    max-height:320px;
}
.brl-jnl-equity-line{
    stroke:#9ca3af; stroke-width:2;
    stroke-linejoin:round; stroke-linecap:round;
    vector-effect:non-scaling-stroke;
}
.brl-jnl-equity-svg.pos .brl-jnl-equity-line{ stroke:var(--pos); }
.brl-jnl-equity-svg.neg .brl-jnl-equity-line{ stroke:var(--neg); }

.brl-jnl-equity-grid{
    stroke:var(--border); stroke-width:1;
    stroke-dasharray:2 4;
    vector-effect:non-scaling-stroke;
}
.brl-jnl-equity-grid.zero{
    stroke:var(--muted); stroke-dasharray:0;
    stroke-opacity:0.5;
}
.brl-jnl-equity-axis{
    fill:var(--muted); font-size:10px;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
.brl-jnl-equity-dot{
    fill:var(--card); stroke-width:2;
    cursor:pointer;
    transition:r .15s, stroke-width .15s;
}
.brl-jnl-equity-dot.pos{ stroke:var(--pos); }
.brl-jnl-equity-dot.neg{ stroke:var(--neg); }
.brl-jnl-equity-dot:hover{ r:5; stroke-width:3; }

.brl-jnl-equity-foot{
    display:flex; gap:18px; flex-wrap:wrap;
    margin-top:12px; padding-top:12px;
    border-top:1px solid var(--border);
    font-size:12px; color:var(--muted);
}
.brl-jnl-equity-foot strong{
    font-variant-numeric:tabular-nums;
    margin-left:4px;
}
.brl-jnl-equity-foot strong.pos{ color:var(--pos); }
.brl-jnl-equity-foot strong.neg{ color:var(--neg); }
.brl-jnl-equity-empty{
    background:var(--card); border:1px dashed var(--border);
    border-radius:8px; padding:24px;
    text-align:center;
}

/* Filter toolbar */
.brl-jnl-filters{
    display:flex; gap:14px; align-items:flex-end; flex-wrap:wrap;
    margin-bottom:14px;
}
.brl-jnl-filter{
    display:flex; flex-direction:column; gap:4px;
}
.brl-jnl-filter-label{
    font-size:10px; font-weight:600; color:var(--muted);
    text-transform:uppercase; letter-spacing:0.5px;
}
.brl-jnl-filter-select{
    background:var(--card); color:var(--text);
    border:1px solid var(--border); border-radius:5px;
    padding:6px 10px; font-size:13px;
    min-width:120px;
    cursor:pointer;
    transition:border-color .12s;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
.brl-jnl-filter-select:hover,
.brl-jnl-filter-select:focus{
    border-color:var(--accent);
    outline:none;
}
.brl-jnl-filter-reset{
    background:transparent; color:var(--muted);
    border:1px solid var(--border); border-radius:5px;
    padding:6px 14px; font-size:12px; font-weight:600;
    cursor:pointer;
    transition:background .12s, color .12s, border-color .12s;
    align-self:flex-end;
}
.brl-jnl-filter-reset:hover{
    background:var(--card-2); color:var(--text); border-color:var(--text);
}
.brl-jnl-btn-export{
    display:inline-flex; align-items:center; gap:6px;
    background:transparent; color:var(--muted);
    border:1px solid var(--border); border-radius:5px;
    padding:6px 12px; font-size:12px; font-weight:600;
    cursor:pointer;
    transition:background .12s, color .12s, border-color .12s;
    align-self:flex-end;
}
.brl-jnl-btn-export:hover{
    background:var(--card-2); color:var(--accent); border-color:var(--accent);
}
.brl-jnl-btn-export:active{ transform:translateY(1px); }
.brl-jnl-btn-export svg{ flex-shrink:0; }
.brl-jnl-btn-export.is-busy{
    opacity:.6; cursor:wait;
}
.brl-jnl-filter-count{
    margin-left:auto;
    font-size:12px; color:var(--muted);
    align-self:flex-end;
    padding-bottom:7px;
    font-variant-numeric:tabular-nums;
}
.brl-jnl-empty-row td{
    text-align:center !important;
    color:var(--muted) !important;
    padding:24px !important;
    font-style:italic;
}

/* Calendar cell interactivity */
.brl-jnl-cell-clickable{
    cursor:pointer;
    transition:transform .12s, outline .12s;
}
.brl-jnl-cell-clickable:hover{
    transform:scale(1.18);
    outline:1px solid var(--text);
}
.brl-jnl-cell-clickable:focus{
    outline:2px solid var(--accent);
    outline-offset:1px;
}
.brl-jnl-cell-active{
    outline:2px solid #fff !important;
    outline-offset:1px;
    transform:scale(1.18);
}

/* Day filter pill */
.brl-jnl-day-pill[hidden]{ display:none; }
.brl-jnl-day-pill{
    display:inline-flex; align-items:center; gap:8px;
    background:var(--card-2);
    border:1px solid var(--accent);
    border-radius:999px;
    padding:6px 8px 6px 14px;
    font-size:13px; color:var(--text);
    margin-bottom:12px;
}
.brl-jnl-day-pill-icon{
    font-size:14px; opacity:0.85;
}
.brl-jnl-day-pill strong{
    color:var(--accent); font-weight:600;
}
.brl-jnl-day-pill-close{
    background:transparent; border:none;
    color:var(--muted); font-size:18px; line-height:1;
    cursor:pointer; padding:0 6px;
    border-radius:50%;
    transition:background .12s, color .12s;
}
.brl-jnl-day-pill-close:hover{
    background:var(--card); color:var(--text);
}

/* ---- Header with refresh button ---- */
.brl-jnl-header{
    display:flex; align-items:flex-start; justify-content:space-between;
    gap:16px;
}
.brl-jnl-header-main{ flex:1; min-width:0; }
.brl-jnl-live-dot{
    display:inline-block; width:7px; height:7px;
    border-radius:50%; background:var(--muted);
    margin:0 8px 0 6px; vertical-align:middle;
    transition:background .3s, box-shadow .3s;
}
.brl-jnl-live-dot.is-active{
    background:var(--pos);
    box-shadow:0 0 0 0 rgba(34,197,94,0.5);
    animation:brl-jnl-pulse 2s infinite;
}
@keyframes brl-jnl-pulse{
    0%   { box-shadow:0 0 0 0   rgba(34,197,94,0.55); }
    70%  { box-shadow:0 0 0 6px rgba(34,197,94,0);    }
    100% { box-shadow:0 0 0 0   rgba(34,197,94,0);    }
}
.brl-jnl-last-updated{
    color:var(--muted); font-size:11px;
    font-variant-numeric:tabular-nums;
}
.brl-jnl-refresh-btn{
    display:inline-flex; align-items:center; gap:6px;
    background:var(--card); color:var(--text);
    border:1px solid var(--border); border-radius:6px;
    padding:7px 12px; font-size:12px; font-weight:600;
    cursor:pointer;
    transition:background .12s, border-color .12s;
}
.brl-jnl-refresh-btn:hover{
    background:var(--card-2); border-color:var(--text);
}
.brl-jnl-refresh-btn:disabled{
    opacity:0.7; cursor:not-allowed;
}
.brl-jnl-refresh-btn.is-spinning .brl-jnl-refresh-icon{
    animation:brl-jnl-spin 0.8s linear infinite;
}
@keyframes brl-jnl-spin{
    from { transform:rotate(0deg); }
    to   { transform:rotate(360deg); }
}

/* ---- Sparkline ---- */
.brl-jnl-spark{
    display:block; width:100%; height:24px;
    margin-top:8px;
}
.brl-jnl-spark-line{
    fill:none; stroke-width:1.5;
    stroke-linejoin:round; stroke-linecap:round;
    vector-effect:non-scaling-stroke;
}
.brl-jnl-spark.pos .brl-jnl-spark-line{ stroke:var(--pos); }
.brl-jnl-spark.neg .brl-jnl-spark-line{ stroke:var(--neg); }
.brl-jnl-spark-area{
    stroke:none;
}
.brl-jnl-spark.pos .brl-jnl-spark-area{ fill:rgba(34,197,94,0.18); }
.brl-jnl-spark.neg .brl-jnl-spark-area{ fill:rgba(239,68,68,0.18); }

/* ---- Sortable headers ---- */
.brl-jnl-sort{
    cursor:pointer; user-select:none;
    transition:color .12s;
}
.brl-jnl-sort:hover{ color:var(--text); }
.brl-jnl-sort-arrow{
    display:inline-block; width:10px; margin-left:4px;
    opacity:0.4; transition:opacity .12s;
    font-size:9px; vertical-align:middle;
}
.brl-jnl-sort.sort-asc .brl-jnl-sort-arrow::after{
    content:'\25B2';   /* up triangle */
}
.brl-jnl-sort.sort-desc .brl-jnl-sort-arrow::after{
    content:'\25BC';   /* down triangle */
}
.brl-jnl-sort.sort-asc,
.brl-jnl-sort.sort-desc{
    color:var(--accent);
}
.brl-jnl-sort.sort-asc .brl-jnl-sort-arrow,
.brl-jnl-sort.sort-desc .brl-jnl-sort-arrow{
    opacity:1;
}

/* ---- Pagination (Load more) ---- */
.brl-jnl-loadmore-wrap[hidden]{ display:none; }
.brl-jnl-loadmore-wrap{
    text-align:center; margin-top:14px;
}
.brl-jnl-loadmore{
    background:var(--card); color:var(--text);
    border:1px solid var(--border); border-radius:6px;
    padding:8px 22px; font-size:13px; font-weight:600;
    cursor:pointer;
    transition:background .12s, border-color .12s;
}
.brl-jnl-loadmore:hover{
    background:var(--card-2); border-color:var(--accent);
}
.brl-jnl-paged-out{
    display:none !important;
}

/* ============ Performance Breakdown ============ */
.brl-jnl-bd-head{
    display:flex; align-items:center; justify-content:space-between;
    gap:14px; flex-wrap:wrap;
    margin-bottom:12px;
}
.brl-jnl-bd-head .brl-jnl-section-title{ margin:0; }
.brl-jnl-bd-tabs{
    display:inline-flex; gap:4px;
    background:var(--card); border:1px solid var(--border);
    border-radius:8px; padding:3px;
}
.brl-jnl-bd-tab{
    background:transparent; color:var(--muted);
    border:none; border-radius:5px;
    padding:6px 14px; font-size:12px; font-weight:600;
    cursor:pointer;
    transition:background .12s, color .12s;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
.brl-jnl-bd-tab:hover{ color:var(--text); }
.brl-jnl-bd-tab.is-active{
    background:var(--card-2); color:var(--text);
}
.brl-jnl-bd-panel[hidden]{ display:none; }
.brl-jnl-bd-empty{
    background:var(--card); border:1px dashed var(--border);
    border-radius:8px; padding:24px;
    text-align:center; color:var(--muted); font-size:13px;
}
.brl-jnl-bd-sub{
    color:var(--muted); font-size:11px; margin-left:4px;
    font-weight:400;
}
.brl-jnl-bd-hint{
    font-size:11px; color:var(--muted); margin:8px 4px 0;
}

/* By-symbol table tweaks (uses base brl-jnl-table styles) */
.brl-jnl-bd-table{ background:var(--card); }

/* Bar charts (Day, R-multiple) */
.brl-jnl-bd-bars{
    background:var(--card); border:1px solid var(--border);
    border-radius:8px; padding:14px 16px;
}
.brl-jnl-bd-bar-row{
    display:grid;
    grid-template-columns:80px 1fr 88px 110px;
    align-items:center;
    gap:10px;
    padding:6px 0;
    font-size:12px;
}
.brl-jnl-bd-bar-row.is-empty{ opacity:0.45; }
.brl-jnl-bd-bar-label{
    color:var(--muted); font-weight:600;
    font-variant-numeric:tabular-nums;
}
.brl-jnl-bd-bar-track{
    background:var(--card-2); height:18px;
    border-radius:3px; overflow:hidden;
    position:relative;
}
.brl-jnl-bd-bar-fill{
    height:100%;
    transition:width .3s ease;
}
.brl-jnl-bd-bar-fill.pos{ background:rgba(34,197,94,0.55); }
.brl-jnl-bd-bar-fill.neg{ background:rgba(239,68,68,0.55); }
.brl-jnl-bd-bar-value{
    text-align:right;
    font-variant-numeric:tabular-nums;
    font-weight:600;
}
.brl-jnl-bd-bar-value.pos{ color:var(--pos); }
.brl-jnl-bd-bar-value.neg{ color:var(--neg); }
.brl-jnl-bd-bar-meta{
    color:var(--muted); font-size:11px;
    text-align:right;
    font-variant-numeric:tabular-nums;
}

/* Hour heatmap */
.brl-jnl-bd-hours{
    display:grid; grid-template-columns:repeat(24, 1fr);
    gap:4px;
    background:var(--card); border:1px solid var(--border);
    border-radius:8px; padding:14px;
}
.brl-jnl-bd-hour{
    aspect-ratio:1;
    background:var(--card-2);
    border-radius:4px;
    display:flex; align-items:center; justify-content:center;
    transition:transform .12s;
    cursor:default;
}
.brl-jnl-bd-hour:not(.is-empty):hover{
    transform:scale(1.12);
}
.brl-jnl-bd-hour.pos{ background:var(--pos); }
.brl-jnl-bd-hour.neg{ background:var(--neg); }
.brl-jnl-bd-hour-num{
    font-size:9px; color:rgba(255,255,255,0.85);
    font-weight:600;
}
.brl-jnl-bd-hour.is-empty .brl-jnl-bd-hour-num{
    color:var(--muted);
}
.brl-jnl-bd-hour-legend{
    display:flex; justify-content:space-between;
    margin:6px 14px 0;
    color:var(--muted); font-size:10px;
    font-variant-numeric:tabular-nums;
}

@media (max-width:600px){
    .brl-jnl-bd-bar-row{ grid-template-columns:60px 1fr 78px; }
    .brl-jnl-bd-bar-meta{ display:none; }
    .brl-jnl-bd-hours{ gap:2px; padding:10px; }
    .brl-jnl-bd-hour-num{ font-size:8px; }
}

@media (max-width:600px){
    .brl-jnl-filters{ gap:10px; }
    .brl-jnl-filter-select{ min-width:100px; font-size:12px; }
    .brl-jnl-filter-count{ width:100%; margin-left:0; padding-bottom:0; }
    .brl-jnl-header{ flex-direction:column; gap:10px; }
    .brl-jnl-refresh-btn{ align-self:flex-start; }
}

.brl-jnl-section{ margin-bottom:32px; }
.brl-jnl-section-title{
    font-size:12px; font-weight:600; color:var(--muted);
    text-transform:uppercase; letter-spacing:0.8px; margin:0 0 12px;
}

.brl-jnl-cal{
    display:grid; grid-template-columns:repeat(auto-fill,minmax(18px,1fr));
    gap:4px; background:var(--card); border:1px solid var(--border);
    border-radius:8px; padding:16px;
}
.brl-jnl-cell{
    aspect-ratio:1; border-radius:3px; background:var(--card-2);
    transition:transform .15s;
}
.brl-jnl-cell.pos{ background:var(--pos); }
.brl-jnl-cell.neg{ background:var(--neg); }
.brl-jnl-cell:hover{ transform:scale(1.4); z-index:1; box-shadow:0 0 0 2px var(--accent); }

.brl-jnl-legend{
    display:flex; gap:16px; margin-top:8px; padding:0 4px;
    font-size:11px; color:var(--muted);
}
.brl-jnl-legend-item{ display:inline-flex; align-items:center; gap:6px; }
.brl-jnl-legend-cell{ width:12px; height:12px; border-radius:2px; display:inline-block; }
.brl-jnl-legend-cell.pos{ background:var(--pos); }
.brl-jnl-legend-cell.neg{ background:var(--neg); }
.brl-jnl-legend-cell.empty{ background:var(--card-2); border:1px solid var(--border); }

.brl-jnl-table-wrap{
    background:var(--card); border:1px solid var(--border);
    border-radius:8px; overflow-x:auto;
}
.brl-jnl-table{ width:100%; border-collapse:collapse; font-size:13px; }
.brl-jnl-table th, .brl-jnl-table td{
    padding:10px 14px; text-align:left; border-bottom:1px solid var(--border);
}
.brl-jnl-table th{
    background:var(--card-2); color:var(--muted); font-weight:500;
    text-transform:uppercase; font-size:11px; letter-spacing:0.5px;
}
.brl-jnl-table td.num, .brl-jnl-table th.num{
    text-align:right; font-variant-numeric:tabular-nums;
}
.brl-jnl-table td.sym{ font-weight:500; letter-spacing:0.3px; }
.brl-jnl-table td.pos{ color:var(--pos); font-weight:500; }
.brl-jnl-table td.neg{ color:var(--neg); font-weight:500; }
.brl-jnl-table tbody tr:last-child td{ border-bottom:none; }
.brl-jnl-table tbody tr:hover{ background:var(--card-2); }

.brl-jnl-side{
    display:inline-block; padding:2px 8px; border-radius:3px;
    font-size:10px; font-weight:700; letter-spacing:0.5px;
}
.brl-jnl-side.buy{  background:rgba(34,197,94,0.15);  color:var(--pos); }
.brl-jnl-side.sell{ background:rgba(239,68,68,0.15);  color:var(--neg); }

.brl-jnl-empty{ text-align:center; padding:60px 20px; }
.brl-jnl-empty-icon{ font-size:48px; margin-bottom:16px; line-height:1; }
.brl-jnl-empty-text{ color:var(--muted); font-size:14px; line-height:1.7; }

.brl-jnl-muted{ color:var(--muted); padding:16px; }

/* Clickable trade rows */
.brl-jnl-table-clickable tbody tr.brl-jnl-row{
    cursor:pointer;
    transition:background .12s;
}
.brl-jnl-table-clickable tbody tr.brl-jnl-row:hover{
    background:var(--card-2);
}
.brl-jnl-table-clickable tbody tr.brl-jnl-row:focus{
    outline:2px solid var(--accent);
    outline-offset:-2px;
}

/* ---------- Trade Detail Modal ---------- */
.brl-jnl-modal[hidden]{ display:none; }
.brl-jnl-modal{
    position:fixed; inset:0;
    display:flex; align-items:center; justify-content:center;
    z-index:99999;
    padding:20px;
}
.brl-jnl-modal-backdrop{
    position:absolute; inset:0;
    background:rgba(0,0,0,0.65);
    backdrop-filter:blur(2px);
}
.brl-jnl-modal-card{
    position:relative;
    background:var(--card); color:var(--text);
    border:1px solid var(--border);
    border-radius:12px;
    width:100%; max-width:560px;
    max-height:90vh; overflow:auto;
    box-shadow:0 20px 60px rgba(0,0,0,0.5);
}
.brl-jnl-modal-head{
    display:flex; align-items:flex-start; justify-content:space-between;
    gap:12px; padding:20px 24px 12px;
    border-bottom:1px solid var(--border);
    position:sticky; top:0;
    background:var(--card);
}
.brl-jnl-modal-head-main{ flex:1; min-width:0; }
.brl-jnl-modal-title{
    margin:0 0 4px; font-size:16px; font-weight:600;
    display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.brl-jnl-modal-symbol{
    font-size:18px; letter-spacing:0.4px;
}
.brl-jnl-modal-lot{
    font-size:13px; color:var(--muted); font-weight:400;
}
.brl-jnl-modal-sub{
    font-size:12px; color:var(--muted);
}
.brl-jnl-modal-close{
    background:transparent; border:none;
    color:var(--muted); font-size:24px; line-height:1;
    cursor:pointer; padding:4px 8px; border-radius:4px;
    transition:background .12s, color .12s;
}
.brl-jnl-modal-close:hover{
    background:var(--card-2); color:var(--text);
}
.brl-jnl-modal-body{ padding:16px 24px 24px; }
.brl-jnl-modal-section{ margin-bottom:20px; }
.brl-jnl-modal-section-title{
    font-size:11px; font-weight:600; color:var(--muted);
    text-transform:uppercase; letter-spacing:0.6px;
    margin:0 0 8px; padding-bottom:6px;
    border-bottom:1px solid var(--border);
}
.brl-jnl-modal-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:8px 16px;
}
.brl-jnl-modal-row{
    display:flex; justify-content:space-between; align-items:center;
    font-size:13px; padding:4px 0;
}
.brl-jnl-modal-label{ color:var(--muted); }
.brl-jnl-modal-value{
    font-variant-numeric:tabular-nums;
    font-weight:500;
}
.brl-jnl-modal-value.pos{ color:var(--pos); }
.brl-jnl-modal-value.neg{ color:var(--neg); }
.brl-jnl-modal-placeholder{
    margin-top:8px;
    padding:12px 14px;
    background:var(--card-2);
    border:1px dashed var(--border);
    border-radius:6px;
    font-size:12px; color:var(--muted);
    text-align:center;
}

/* Notes section */
.brl-jnl-notes-head{
    display:flex; justify-content:space-between; align-items:center;
    gap:8px;
}
.brl-jnl-notes-edit{
    background:transparent; border:1px solid var(--border);
    color:var(--muted); font-size:11px; font-weight:600;
    text-transform:uppercase; letter-spacing:0.4px;
    padding:3px 10px; border-radius:4px;
    cursor:pointer; transition:background .12s, color .12s, border-color .12s;
}
.brl-jnl-notes-edit:hover{
    background:var(--card-2); color:var(--text); border-color:var(--text);
}
.brl-jnl-notes-display .brl-jnl-notes-text{
    font-size:13px; line-height:1.6; color:var(--text);
    background:var(--card-2); border:1px solid var(--border);
    border-radius:6px; padding:12px 14px;
    white-space:pre-wrap; word-wrap:break-word;
}
.brl-jnl-notes-display .brl-jnl-notes-empty{
    font-size:12px; color:var(--muted);
    background:var(--card-2); border:1px dashed var(--border);
    border-radius:6px; padding:14px;
    text-align:center;
}
.brl-jnl-notes-textarea{
    width:100%; box-sizing:border-box;
    background:var(--card-2); color:var(--text);
    border:1px solid var(--border); border-radius:6px;
    padding:10px 12px; font-size:13px; line-height:1.5;
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    resize:vertical; min-height:90px;
    transition:border-color .12s;
}
.brl-jnl-notes-textarea:focus{
    outline:none;
    border-color:var(--accent);
}
.brl-jnl-notes-actions{
    display:flex; justify-content:flex-end; align-items:center;
    gap:8px; margin-top:8px;
}
.brl-jnl-notes-status{
    font-size:11px; color:var(--muted);
    margin-right:auto;
}
.brl-jnl-notes-status.ok{ color:var(--pos); }
.brl-jnl-notes-status.err{ color:var(--neg); }
.brl-jnl-notes-cancel,
.brl-jnl-notes-save{
    border:1px solid var(--border);
    font-size:12px; font-weight:600;
    padding:5px 14px; border-radius:4px;
    cursor:pointer;
    transition:background .12s, color .12s, opacity .12s;
}
.brl-jnl-notes-cancel{
    background:transparent; color:var(--muted);
}
.brl-jnl-notes-cancel:hover{
    background:var(--card-2); color:var(--text);
}
.brl-jnl-notes-save{
    background:var(--accent); color:#000; border-color:var(--accent);
}
.brl-jnl-notes-save:hover{
    opacity:0.9;
}
.brl-jnl-notes-save:disabled{
    opacity:0.5; cursor:not-allowed;
}

/* ---- Tags section ---- */
.brl-jnl-tags-head{
    display:flex; justify-content:space-between; align-items:center;
    gap:8px;
}
/* Pill list: a flex-wrap row of tag chips + the add control */
.brl-jnl-tags-list{
    display:flex; flex-wrap:wrap;
    gap:6px;
    align-items:center;
    min-height:32px;
}
/* Empty state when no tags yet */
.brl-jnl-tags-empty{
    font-size:12px; color:var(--muted);
    font-style:italic;
}
/* The chip itself */
.brl-jnl-tag-chip{
    display:inline-flex; align-items:center; gap:4px;
    background:var(--card-2);
    color:var(--text);
    border:1px solid var(--border);
    border-radius:12px;
    padding:3px 4px 3px 10px;
    font-size:12px; font-weight:500;
    line-height:1.4;
    transition:border-color .12s, background .12s;
}
.brl-jnl-tag-chip:hover{
    border-color:var(--text);
}
.brl-jnl-tag-chip-name{
    white-space:nowrap;
}
/* The little X to detach the tag */
.brl-jnl-tag-chip-remove{
    background:transparent; border:none;
    color:var(--muted);
    width:18px; height:18px;
    border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center;
    cursor:pointer; padding:0;
    font-size:14px; line-height:1;
    transition:background .12s, color .12s;
}
.brl-jnl-tag-chip-remove:hover{
    background:var(--neg);
    color:#fff;
}
.brl-jnl-tag-chip.is-busy{
    opacity:0.5; pointer-events:none;
}
/* The "+ Add" control: starts as a small button, grows into an input */
.brl-jnl-tag-add-btn{
    background:transparent;
    color:var(--muted);
    border:1px dashed var(--border);
    border-radius:12px;
    padding:3px 10px;
    font-size:12px; font-weight:500;
    cursor:pointer;
    transition:border-color .12s, color .12s;
}
.brl-jnl-tag-add-btn:hover{
    border-color:var(--accent);
    color:var(--accent);
}
.brl-jnl-tag-add-form{
    display:inline-flex; align-items:center; gap:4px;
    position:relative;
}
.brl-jnl-tag-add-input{
    background:var(--card-2);
    color:var(--text);
    border:1px solid var(--accent);
    border-radius:12px;
    padding:3px 10px;
    font-size:12px;
    width:140px;
    font-family:inherit;
    outline:none;
}
.brl-jnl-tag-add-input::placeholder{
    color:var(--muted);
}
/* Suggestions dropdown that appears below the input */
.brl-jnl-tag-suggest{
    position:absolute;
    top:calc(100% + 4px);
    left:0;
    min-width:160px;
    max-height:200px;
    overflow-y:auto;
    background:var(--card);
    border:1px solid var(--border);
    border-radius:6px;
    box-shadow:0 4px 12px rgba(0,0,0,0.4);
    z-index:10;
}
.brl-jnl-tag-suggest-item{
    display:flex; justify-content:space-between; align-items:center;
    gap:10px;
    padding:6px 12px;
    font-size:12px;
    color:var(--text);
    cursor:pointer;
    transition:background .1s;
}
.brl-jnl-tag-suggest-item:hover,
.brl-jnl-tag-suggest-item.is-active{
    background:var(--card-2);
    color:var(--accent);
}
.brl-jnl-tag-suggest-count{
    color:var(--muted);
    font-size:11px;
}
.brl-jnl-tag-suggest-empty{
    padding:8px 12px;
    font-size:12px;
    color:var(--muted);
    font-style:italic;
}
.brl-jnl-tag-status{
    font-size:11px;
    color:var(--muted);
    margin-left:6px;
}
.brl-jnl-tag-status.err{ color:var(--neg); }

/* Tag column / inline tags in the trades table */
.brl-jnl-table-tags{
    display:flex; flex-wrap:wrap;
    gap:3px;
}
.brl-jnl-table-tag{
    display:inline-block;
    background:var(--card-2);
    color:var(--muted);
    border:1px solid var(--border);
    border-radius:8px;
    padding:1px 8px;
    font-size:10px; font-weight:500;
    line-height:1.5;
    white-space:nowrap;
}

/* Screenshot */
.brl-jnl-shot-link{
    display:block; line-height:0;
    position:relative;
    border:1px solid var(--border); border-radius:6px;
    overflow:hidden;
    background:transparent;
    padding:0;
    width:100%;
    cursor:zoom-in;
    transition:border-color .12s;
}
.brl-jnl-shot-link:hover{
    border-color:var(--accent);
}
.brl-jnl-shot-link:hover .brl-jnl-shot-zoom{
    opacity:1;
}
.brl-jnl-shot{
    display:block; width:100%; height:auto;
}
.brl-jnl-shot-zoom{
    position:absolute; right:8px; bottom:8px;
    width:32px; height:32px; line-height:32px;
    text-align:center;
    background:rgba(0,0,0,0.6);
    color:#fff; font-size:18px;
    border-radius:50%;
    opacity:0; transition:opacity .15s;
    pointer-events:none;
}
.brl-jnl-shot-empty{
    font-size:12px; color:var(--muted);
    background:var(--card-2); border:1px dashed var(--border);
    border-radius:6px; padding:14px;
    text-align:center;
}

/* Lightbox */
.brl-jnl-lightbox[hidden]{ display:none; }
.brl-jnl-lightbox{
    position:fixed; inset:0;
    z-index:100000;
    display:flex; align-items:center; justify-content:center;
}
.brl-jnl-lightbox-backdrop{
    position:absolute; inset:0;
    background:rgba(0,0,0,0.92);
    cursor:zoom-out;
}
.brl-jnl-lightbox-close{
    position:absolute; top:16px; right:16px;
    width:40px; height:40px; line-height:38px;
    border-radius:50%;
    background:rgba(255,255,255,0.08);
    color:#fff; font-size:24px;
    border:1px solid rgba(255,255,255,0.15);
    cursor:pointer;
    transition:background .12s, border-color .12s;
    z-index:2;
}
.brl-jnl-lightbox-close:hover{
    background:rgba(255,255,255,0.15);
    border-color:rgba(255,255,255,0.3);
}
.brl-jnl-lightbox-stage{
    position:relative;
    max-width:96vw; max-height:92vh;
    display:flex; align-items:center; justify-content:center;
    z-index:1;
    pointer-events:none;
}
.brl-jnl-lightbox-img{
    max-width:96vw; max-height:92vh;
    width:auto; height:auto;
    object-fit:contain;
    border-radius:4px;
    box-shadow:0 20px 80px rgba(0,0,0,0.6);
    pointer-events:auto;
}

@media (max-width:600px){
    .brl-jnl{ padding:24px 16px; }
    .brl-jnl-stats{ grid-template-columns:repeat(2,1fr); }
    .brl-jnl-table th, .brl-jnl-table td{ padding:8px 10px; font-size:12px; }
    .brl-jnl-modal-card{ max-width:100%; }
    .brl-jnl-modal-grid{ grid-template-columns:1fr; }
    .brl-jnl-modal-head{ padding:16px 18px 10px; }
    .brl-jnl-modal-body{ padding:12px 18px 20px; }
}
/* ================================================================
   APPEND TO END OF /assets/journal/journal.css
   Mistake tracking (Phase 3) styles.
   ================================================================ */

/* The By-Mistake panel uses the same .brl-jnl-bd-bars grid as the
   By-Day and R-Multiple panels, so most styles already apply.
   These rules only handle the long mistake labels (some are 16+
   chars, longer than day-of-week or R-bucket labels). */

[data-bd-panel="mistake"] .brl-jnl-bd-bar-row{
    grid-template-columns: minmax(140px, 1.3fr) 1fr 88px 130px;
}

[data-bd-panel="mistake"] .brl-jnl-bd-bar-label{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 600;
    color: var(--text, #e5e7eb);
}

@media (max-width: 600px) {
    [data-bd-panel="mistake"] .brl-jnl-bd-bar-row{
        grid-template-columns: 1fr 1fr 70px;
    }
    [data-bd-panel="mistake"] .brl-jnl-bd-bar-meta{
        display: none;
    }
}
/* ================================================================
   APPEND TO END OF /assets/journal/journal.css
   Mistake tracking - Phase B (Modal UI + inline pill)
   ================================================================ */

/* ---- By-Mistake breakdown panel (Phase A re-included) ---------- */
[data-bd-panel="mistake"] .brl-jnl-bd-bar-row{
    grid-template-columns: minmax(140px, 1.3fr) 1fr 88px 130px;
}
[data-bd-panel="mistake"] .brl-jnl-bd-bar-label{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 600;
    color: var(--text, #e5e7eb);
}
@media (max-width: 600px) {
    [data-bd-panel="mistake"] .brl-jnl-bd-bar-row{
        grid-template-columns: 1fr 1fr 70px;
    }
    [data-bd-panel="mistake"] .brl-jnl-bd-bar-meta{
        display: none;
    }
}

/* ---- Modal: Mistakes section ----------------------------------- */
.brl-jnl-mistakes-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.brl-jnl-mistake-status{
    font-size: 11px;
    color: var(--muted, #9ca3af);
    font-weight: 400;
    transition: opacity .15s;
}
.brl-jnl-mistake-status.err{
    color: var(--neg, #ef4444);
}
.brl-jnl-mistakes-list{
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 4px;
}
.brl-jnl-mistakes-loading,
.brl-jnl-mistakes-empty{
    color: var(--muted, #9ca3af);
    font-size: 13px;
    padding: 8px 0;
}
.brl-jnl-mistakes-group{
    border: 1px solid var(--border, #2a2d35);
    background: var(--card, #0f1115);
    border-radius: 8px;
    padding: 10px 12px;
}
.brl-jnl-mistakes-group-title{
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted, #9ca3af);
    margin-bottom: 8px;
}
.brl-jnl-mistakes-group-items{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.brl-jnl-mistake-chip{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    background: var(--card-2, #1a1d24);
    border: 1px solid var(--border, #2a2d35);
    border-radius: 14px;
    font-size: 12px;
    cursor: pointer;
    user-select: none;
    transition: background .12s, border-color .12s, color .12s;
}
.brl-jnl-mistake-chip:hover{
    background: var(--card, #0f1115);
    border-color: var(--text, #e5e7eb);
}
.brl-jnl-mistake-cb{
    margin: 0;
    cursor: pointer;
    accent-color: var(--neg, #ef4444);
}
.brl-jnl-mistake-chip:has(.brl-jnl-mistake-cb:checked){
    background: rgba(239, 68, 68, 0.15);
    border-color: var(--neg, #ef4444);
    color: var(--text, #e5e7eb);
}
.brl-jnl-mistake-chip-label{
    line-height: 1;
}

/* ---- Inline mistake pill in trades table row ------------------- */
.brl-jnl-table-mistake-pill{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    margin-left: 6px;
    background: rgba(239, 68, 68, 0.2);
    color: var(--neg, #ef4444);
    border: 1px solid rgba(239, 68, 68, 0.4);
    border-radius: 9px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    cursor: help;
}
.brl-jnl-table-mistake-count{
    margin-left: 2px;
}

@media (max-width: 600px) {
    .brl-jnl-mistake-chip{
        font-size: 11px;
        padding: 4px 8px;
    }
    .brl-jnl-mistakes-group{
        padding: 8px 10px;
    }
}
/* ====================================================================
   v1.6.0 — Option C Hero Section
   Append this to the END of journal.css.
   ==================================================================== */

/* --------------------------------------------------------------------
   Hide the WordPress page title block ("My Journal" white area)
   that the theme prints above our shortcode output.
   We scope this to the body class WordPress adds for the journal page
   so we don't accidentally hide titles on other pages.

   If your slug differs from 'my-journal', duplicate the selector with
   the right class name.
   -------------------------------------------------------------------- */
body.page-my-journal .elementor-page-title,
body.page-my-journal .page-title,
body.page-my-journal .entry-title,
body.page-my-journal .page-header,
body.page-my-journal .single-page__header,
body.page-my-journal .vc_custom_heading,
body.page-my-journal header.entry-header,
body.page-journal .elementor-page-title,
body.page-journal .page-title,
body.page-journal .entry-title,
body.page-journal .page-header,
body.page-journal header.entry-header {
  display: none !important;
}

/* Also hide any breadcrumbs / hero printed by the theme on the journal page */
body.page-my-journal .breadcrumbs,
body.page-journal .breadcrumbs {
  display: none !important;
}

/* --------------------------------------------------------------------
   Make the .brl-jnl container break out of the theme's centered
   content column so the dark hero stretches edge-to-edge.

   These rules are duplicated from the v1.3 full-bleed block; keep them
   in case someone clears them upstream.
   -------------------------------------------------------------------- */
.brl-jnl {
  position: relative;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  border-radius: 0;
  /* IMPORTANT: kill the old padding so the hero can paint to the edges.
     The content sections below the hero re-introduce their own padding. */
  padding: 0;
}

/* --------------------------------------------------------------------
   HERO
   -------------------------------------------------------------------- */
.brl-jnl-hero {
  position: relative;
  background: #0a0c10;
  color: #fff;
  padding: 44px max(24px, calc(50vw - 700px)) 36px;
  border-bottom: 1px solid #1f2229;
  overflow: hidden;
}

/* Subtle radial accent in the top-right corner.
   Tint is red-ish when journal is loss-heavy; we don't know that at
   CSS-time, so we use a brand-neutral blue tint.                       */
.brl-jnl-hero-bg {
  position: absolute;
  top: -80px;
  right: -80px;
  width: 460px;
  height: 360px;
  background: radial-gradient(
    circle at top right,
    rgba(74, 114, 255, 0.10) 0%,
    rgba(74, 114, 255, 0.04) 40%,
    transparent 70%
  );
  pointer-events: none;
}

.brl-jnl-hero-inner {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}

/* ---- LEFT side: title block ---- */
.brl-jnl-hero-left {
  flex: 1 1 320px;
  min-width: 0;
}

.brl-jnl-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #888;
  margin-bottom: 10px;
}

.brl-jnl-hero-eyebrow svg {
  width: 14px;
  height: 14px;
}

.brl-jnl-hero-title {
  margin: 0;
  font-size: 34px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.5px;
  color: #fff;
}

.brl-jnl-hero-tagline {
  font-size: 13px;
  color: #999;
  margin-top: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

/* live dot inherits its size/color from journal.css base, but we tighten
   margins so it sits cleanly inline with the tagline */
.brl-jnl-hero-tagline .brl-jnl-live-dot { margin: 0 2px; }
.brl-jnl-hero-tagline .brl-jnl-last-updated { color: #888; font-size: 12px; }

/* ---- RIGHT side: inline metric strip + refresh ---- */
.brl-jnl-hero-right {
  display: flex;
  align-items: flex-end;
  gap: 22px;
  flex-wrap: wrap;
}

.brl-jnl-hero-metric {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 72px;
}

.brl-jnl-hero-metric-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #666;
}

.brl-jnl-hero-metric-value {
  font-size: 26px;
  font-weight: 500;
  line-height: 1;
  color: #fff;
  font-variant-numeric: tabular-nums;
}

.brl-jnl-hero-metric-value.pos { color: #4ade80; }
.brl-jnl-hero-metric-value.neg { color: #ef4444; }

.brl-jnl-hero-divider {
  width: 1px;
  height: 36px;
  background: #1f2229;
  align-self: flex-end;
  margin-bottom: 4px;
}

/* ---- Refresh button: white pill, premium feel ---- */
.brl-jnl-hero-refresh {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 14px;
  border-radius: 8px;
  background: #fff;
  color: #0a0c10;
  border: none;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: transform 0.12s ease, background 0.12s ease;
  font-family: inherit;
  margin-bottom: 1px;
}

.brl-jnl-hero-refresh:hover {
  background: #f0f0f0;
  transform: translateY(-1px);
}

.brl-jnl-hero-refresh:active {
  transform: translateY(0);
}

.brl-jnl-hero-refresh.is-loading .brl-jnl-refresh-icon {
  animation: brl-jnl-spin 0.9s linear infinite;
}

@keyframes brl-jnl-spin {
  to { transform: rotate(360deg); }
}

/* --------------------------------------------------------------------
   Content sections below the hero: re-introduce the horizontal padding
   that .brl-jnl previously provided, so stats/table/etc. don't go to
   the very edge.

   Trick: target the FIRST direct child after the hero, plus all
   subsequent direct children. We can't use :nth-child reliably because
   the locked/empty states have different structures, so we use a more
   permissive approach: pad everything inside .brl-jnl except the hero.
   -------------------------------------------------------------------- */
.brl-jnl > *:not(.brl-jnl-hero) {
  padding-left: max(24px, calc(50vw - 700px));
  padding-right: max(24px, calc(50vw - 700px));
}

/* First section right under the hero gets a bit of top breathing room.
   The first non-hero element after the hero. */
.brl-jnl-hero + * {
  padding-top: 32px;
}

/* Empty state needs vertical centering inside its padded area */
.brl-jnl-empty {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

/* --------------------------------------------------------------------
   Responsive: stack hero on small screens
   -------------------------------------------------------------------- */
@media (max-width: 720px) {
  .brl-jnl-hero {
    padding: 32px 20px 28px;
  }
  .brl-jnl-hero-inner {
    align-items: flex-start;
    gap: 24px;
  }
  .brl-jnl-hero-title {
    font-size: 26px;
  }
  .brl-jnl-hero-right {
    width: 100%;
    gap: 14px;
  }
  .brl-jnl-hero-metric { min-width: 60px; }
  .brl-jnl-hero-metric-value { font-size: 20px; }
  .brl-jnl-hero-divider { display: none; }
  .brl-jnl-hero-refresh { margin-left: auto; }
}
/* ====================================================================
   v1.6.1 — Option C Hero Section (Final)
   Append this to the END of journal.css.
   If you already pasted v1.6.0, REPLACE that whole block with this.
   ==================================================================== */

/* --------------------------------------------------------------------
   1. HIDE the WordPress / Elementor page title block above our shortcode.
   The journal page on this site has body class `page-id-460` (verified
   via DevTools). Theme is Hello Elementor, so we cover Elementor headings
   too — plus generic theme title classes as a safety net.
   -------------------------------------------------------------------- */
body.page-id-460 .elementor-page-title,
body.page-id-460 .page-title,
body.page-id-460 .entry-title,
body.page-id-460 h1.elementor-heading-title,
body.page-id-460 .page-header,
body.page-id-460 header.entry-header,
body.page-id-460 .breadcrumbs,
body.page-id-460 .vc_custom_heading,
body.page-id-460 .single-page__header {
  display: none !important;
}

/* Some Elementor themes wrap the title in a Section/Container — kill any
   container whose ONLY purpose was to hold the page title so we don't
   leave an empty gray band above the hero.
   We target sections that:
     - sit before our .brl-jnl
     - contain a heading element
     - have no other meaningful content
   This is a best-effort cleanup; if a gap remains, send a screenshot. */
body.page-id-460 .elementor-section:has(h1.elementor-heading-title):not(:has(.brl-jnl)) {
  display: none !important;
}

/* --------------------------------------------------------------------
   2. HIDE the yellow "Need help choosing a broker?" banner that floats
   over the dashboard. It appears as a fixed/sticky bar at the bottom.
   We can't see the exact selector, so we cover several common patterns.
   -------------------------------------------------------------------- */
body.page-id-460 .broker-cta-banner,
body.page-id-460 .brl-floating-cta,
body.page-id-460 .floating-cta,
body.page-id-460 [class*="broker-help"],
body.page-id-460 [class*="choose-broker"],
body.page-id-460 .cta-floating,
body.page-id-460 .sticky-cta {
  display: none !important;
}

/* --------------------------------------------------------------------
   3. Full-bleed container (carried over from v1.3)
   -------------------------------------------------------------------- */
.brl-jnl {
  position: relative;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  border-radius: 0;
  padding: 0;
}

/* --------------------------------------------------------------------
   4. HERO
   -------------------------------------------------------------------- */
.brl-jnl-hero {
  position: relative;
  background: #0a0c10;
  color: #fff;
  padding: 44px max(24px, calc(50vw - 700px)) 36px;
  border-bottom: 1px solid #1f2229;
  overflow: hidden;
}

.brl-jnl-hero-bg {
  position: absolute;
  top: -80px;
  right: -80px;
  width: 460px;
  height: 360px;
  background: radial-gradient(
    circle at top right,
    rgba(74, 114, 255, 0.10) 0%,
    rgba(74, 114, 255, 0.04) 40%,
    transparent 70%
  );
  pointer-events: none;
}

.brl-jnl-hero-inner {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}

.brl-jnl-hero-left {
  flex: 1 1 320px;
  min-width: 0;
}

.brl-jnl-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #888;
  margin-bottom: 10px;
}
.brl-jnl-hero-eyebrow svg { width: 14px; height: 14px; }

.brl-jnl-hero-title {
  margin: 0;
  font-size: 34px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.5px;
  color: #fff;
}

.brl-jnl-hero-tagline {
  font-size: 13px;
  color: #999;
  margin-top: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.brl-jnl-hero-tagline .brl-jnl-live-dot { margin: 0 2px; }
.brl-jnl-hero-tagline .brl-jnl-last-updated { color: #888; font-size: 12px; }

/* ---- RIGHT side ---- */
.brl-jnl-hero-right {
  display: flex;
  align-items: flex-end;
  gap: 22px;
  flex-wrap: wrap;
}

.brl-jnl-hero-metric {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 72px;
}

.brl-jnl-hero-metric-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #666;
}

.brl-jnl-hero-metric-value {
  font-size: 26px;
  font-weight: 500;
  line-height: 1;
  color: #fff;
  font-variant-numeric: tabular-nums;
}

.brl-jnl-hero-metric-value.pos { color: #4ade80; }
.brl-jnl-hero-metric-value.neg { color: #ef4444; }

/* Mini sparkline below P/L value */
.brl-jnl-hero-spark {
  margin-top: 6px;
  line-height: 0;
  opacity: 0.85;
}
.brl-jnl-hero-spark svg,
.brl-jnl-hero-spark .brl-jnl-sparkline {
  display: block;
  max-width: 100px;
  height: 22px;
}

.brl-jnl-hero-divider {
  width: 1px;
  height: 36px;
  background: #1f2229;
  align-self: flex-end;
  margin-bottom: 4px;
}

/* ---- Refresh button ---- */
.brl-jnl-hero-refresh {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 14px;
  border-radius: 8px;
  background: #fff;
  color: #0a0c10;
  border: none;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: transform 0.12s ease, background 0.12s ease;
  font-family: inherit;
  margin-bottom: 1px;
}
.brl-jnl-hero-refresh:hover { background: #f0f0f0; transform: translateY(-1px); }
.brl-jnl-hero-refresh:active { transform: translateY(0); }
.brl-jnl-hero-refresh.is-loading .brl-jnl-refresh-icon { animation: brl-jnl-spin 0.9s linear infinite; }

@keyframes brl-jnl-spin { to { transform: rotate(360deg); } }

/* --------------------------------------------------------------------
   5. Pad non-hero sections back to the centered column
   -------------------------------------------------------------------- */
.brl-jnl > *:not(.brl-jnl-hero) {
  padding-left: max(24px, calc(50vw - 700px));
  padding-right: max(24px, calc(50vw - 700px));
}

.brl-jnl-hero + * {
  padding-top: 32px;
}

.brl-jnl-empty {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

/* --------------------------------------------------------------------
   6. Responsive
   -------------------------------------------------------------------- */
@media (max-width: 720px) {
  .brl-jnl-hero {
    padding: 32px 20px 28px;
  }
  .brl-jnl-hero-inner {
    align-items: flex-start;
    gap: 24px;
  }
  .brl-jnl-hero-title { font-size: 26px; }
  .brl-jnl-hero-right {
    width: 100%;
    gap: 14px;
  }
  .brl-jnl-hero-metric { min-width: 60px; }
  .brl-jnl-hero-metric-value { font-size: 20px; }
  .brl-jnl-hero-divider { display: none; }
  .brl-jnl-hero-refresh { margin-left: auto; }
  .brl-jnl-hero-spark svg,
  .brl-jnl-hero-spark .brl-jnl-sparkline { max-width: 80px; height: 18px; }
}
/* ====================================================================
   v1.6.2 PATCH — Hide chx-promoFloating banner on journal page
   ====================================================================
   This is a SMALL patch you can append to journal.css OR paste at the
   end of journal-css-append-v1.6.1.css (replacing the old banner-hide
   block at the top, if you want a clean file).

   Effect: hides the yellow "Need help choosing a broker?" floating bar
   only on the My Journal page. The banner still appears elsewhere on
   the site for lead-generation.

   If you want it hidden site-wide instead, change every
   `body.page-id-460` below to `body`.
   ==================================================================== */

body.page-id-460 .chx-promoFloating,
body.page-id-460 [class*="chx-promoFloating"],
body.page-id-460 [class*="promoFloating"] {
  display: none !important;
}

/* Also kill the helper script tag's promo node if the markup is
   slightly different on a future update. */
body.page-id-460 [data-chx-float-position] {
  display: none !important;
}
/* ====================================================================
   v1.7.0 — Edge Finder insight banner + Big-card calendar
   Append this to the END of journal.css (after v1.6.x blocks).
   ==================================================================== */

/* --------------------------------------------------------------------
   1. EDGE FINDER INSIGHT BANNER
   Severity-based color: danger (red), warning (amber), healthy (teal).
   The .brl-jnl-ins-{severity} class sets all the colors via CSS vars.
   -------------------------------------------------------------------- */
.brl-jnl-insights {
  margin: 24px max(24px, calc(50vw - 700px)) 0;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 14px 16px;
  border-radius: 10px;
  background: var(--ins-bg, rgba(239, 158, 68, 0.08));
  border: 1px solid var(--ins-border, rgba(239, 158, 68, 0.25));
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.brl-jnl-insights.is-dismissed {
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  height: 0;
  margin: 0 max(24px, calc(50vw - 700px));
  padding: 0;
  border: none;
  overflow: hidden;
}

/* Severity color variables */
.brl-jnl-ins-danger {
  --ins-bg: rgba(239, 68, 68, 0.10);
  --ins-border: rgba(239, 68, 68, 0.35);
  --ins-icon-bg: rgba(239, 68, 68, 0.18);
  --ins-icon-fg: #ef4444;
  --ins-accent: #ef4444;
}
.brl-jnl-ins-warning {
  --ins-bg: rgba(239, 158, 68, 0.08);
  --ins-border: rgba(239, 158, 68, 0.25);
  --ins-icon-bg: rgba(239, 158, 68, 0.15);
  --ins-icon-fg: #ef9e44;
  --ins-accent: #ef9e44;
}
.brl-jnl-ins-healthy {
  --ins-bg: rgba(93, 202, 165, 0.10);
  --ins-border: rgba(93, 202, 165, 0.30);
  --ins-icon-bg: rgba(93, 202, 165, 0.18);
  --ins-icon-fg: #5dcaa5;
  --ins-accent: #5dcaa5;
}

.brl-jnl-ins-icon {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ins-icon-bg);
  color: var(--ins-icon-fg);
  display: flex;
  align-items: center;
  justify-content: center;
}
.brl-jnl-ins-icon svg { display: block; }

.brl-jnl-ins-body {
  flex: 1;
  min-width: 0;
}

.brl-jnl-ins-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

.brl-jnl-ins-title {
  font-size: 11px;
  letter-spacing: 1.5px;
  color: var(--ins-accent);
  font-weight: 500;
  text-transform: uppercase;
}

.brl-jnl-ins-sub {
  font-size: 11px;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.brl-jnl-ins-dot-sep {
  width: 3px;
  height: 3px;
  background: #555;
  border-radius: 50%;
}

.brl-jnl-ins-list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
  color: #ddd;
  line-height: 1.7;
}

.brl-jnl-ins-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 1px 0;
}

.brl-jnl-ins-bullet {
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-top: 8px;
  background: #888;
}
.brl-jnl-ins-dot-danger  { background: #ef4444; }
.brl-jnl-ins-dot-warning { background: #ef9e44; }
.brl-jnl-ins-dot-healthy { background: #5dcaa5; }

.brl-jnl-ins-dismiss {
  flex-shrink: 0;
  background: transparent;
  border: 0.5px solid #333;
  color: #aaa;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 11px;
  cursor: pointer;
  font-family: inherit;
  align-self: flex-start;
  transition: background 0.12s ease, color 0.12s ease;
}
.brl-jnl-ins-dismiss:hover {
  background: rgba(255, 255, 255, 0.05);
  color: #fff;
}

/* --------------------------------------------------------------------
   2. BIG-CARD CALENDAR
   Replaces the old tiny-square grid. Each cell is large enough to show
   the date, P/L, and trade count inline. Mon-Sun weekday headers above.
   Override the old .brl-jnl-cal selectors with .brl-jnl-cal-wrap.
   -------------------------------------------------------------------- */

/* Kill the old tiny-square grid if its rule is still cascading.
   The new layout uses .brl-jnl-cal-wrap instead of .brl-jnl-cal. */
.brl-jnl-cal-wrap {
  margin-top: 8px;
}

.brl-jnl-cal-headers {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  margin-bottom: 6px;
}

.brl-jnl-cal-header {
  font-size: 10px;
  letter-spacing: 1px;
  color: #666;
  font-weight: 500;
  text-align: center;
  padding: 4px 0;
  text-transform: uppercase;
}

.brl-jnl-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

.brl-jnl-cal-cell {
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 7px;
  padding: 10px 8px;
  min-height: 76px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform 0.12s ease, border-color 0.12s ease;
}

.brl-jnl-cal-cell-future {
  opacity: 0.35;
}

.brl-jnl-cal-cell.neg {
  background: rgba(239, 68, 68, 0.18);
  border-color: rgba(239, 68, 68, 0.4);
}

.brl-jnl-cal-cell.pos {
  background: rgba(74, 222, 128, 0.18);
  border-color: rgba(74, 222, 128, 0.4);
}

.brl-jnl-cell-clickable {
  cursor: pointer;
}
.brl-jnl-cell-clickable:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, 0.3);
}
.brl-jnl-cell-clickable:focus {
  outline: 2px solid rgba(255, 255, 255, 0.4);
  outline-offset: 1px;
}

.brl-jnl-cal-cell-date {
  font-size: 11px;
  color: #999;
  font-weight: 500;
}

.brl-jnl-cal-cell.neg .brl-jnl-cal-cell-date,
.brl-jnl-cal-cell.pos .brl-jnl-cal-cell-date {
  color: #fff;
}

.brl-jnl-cal-cell-pnl {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}

.brl-jnl-cal-cell.neg .brl-jnl-cal-cell-pnl { color: #fca5a5; }
.brl-jnl-cal-cell.pos .brl-jnl-cal-cell-pnl { color: #86efac; }

.brl-jnl-cal-cell-count {
  font-size: 10px;
  color: #888;
  margin-top: 2px;
}

.brl-jnl-cal-cell.neg .brl-jnl-cal-cell-count,
.brl-jnl-cal-cell.pos .brl-jnl-cal-cell-count {
  color: rgba(255, 255, 255, 0.65);
}

.brl-jnl-cal-cell-empty {
  font-size: 11px;
  color: #444;
  align-self: flex-end;
}

/* Active day highlight (set by JS when filtering trades) */
.brl-jnl-cal-cell.brl-jnl-cal-cell-active {
  border-color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);
}

/* --------------------------------------------------------------------
   3. RESPONSIVE
   -------------------------------------------------------------------- */
@media (max-width: 720px) {
  .brl-jnl-insights {
    margin: 18px 20px 0;
    flex-wrap: wrap;
    gap: 10px;
  }
  .brl-jnl-ins-dismiss { margin-left: auto; }

  .brl-jnl-cal-cell {
    min-height: 60px;
    padding: 6px 5px;
    border-radius: 5px;
  }
  .brl-jnl-cal-cell-date { font-size: 10px; }
  .brl-jnl-cal-cell-pnl  { font-size: 12px; }
  .brl-jnl-cal-cell-count { font-size: 9px; }
  .brl-jnl-cal-headers,
  .brl-jnl-cal-grid { gap: 4px; }
  .brl-jnl-cal-header { font-size: 9px; }
}
.brl-jnl-tabs-strip {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  margin: 14px 0 16px;
  background: #16181d;
  border: 0.5px solid #1f2229;
  border-radius: 7px;
}

.brl-jnl-tab-btn {
  background: transparent;
  border: none;
  color: #888;
  padding: 6px 14px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.12s ease, color 0.12s ease;
  position: relative;
}

.brl-jnl-tab-btn:hover {
  color: #ccc;
}

.brl-jnl-tab-btn.is-active {
  background: #2a2d34;
  color: #fff;
}

.brl-jnl-tab-btn.is-active:hover {
  color: #fff;
}

.brl-jnl-tab-btn.is-disabled {
  color: #444;
  cursor: not-allowed;
}

.brl-jnl-tab-btn.is-disabled:hover {
  color: #555;
}

.brl-jnl-tab-empty-chart {
  background: #16181d;
  border: 0.5px solid #1f2229;
  border-radius: 6px;
  padding: 40px 20px;
  text-align: center;
  color: #666;
  font-size: 13px;
  margin: 16px 0;
}

@media (max-width: 480px) {
  .brl-jnl-tabs-strip {
    width: 100%;
    display: flex;
  }
  .brl-jnl-tab-btn {
    flex: 1;
    padding: 6px 8px;
    font-size: 11px;
  }
}
.brl-jnl-strat-wrap {
  margin: 14px 0;
}

.brl-jnl-strat-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.brl-jnl-strat-title {
  font-size: 10px;
  letter-spacing: 1px;
  color: #666;
  font-weight: 500;
  text-transform: uppercase;
}

.brl-jnl-strat-count {
  color: #86efac;
  margin-left: 6px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  font-size: 11px;
}

.brl-jnl-strat-new-btn {
  background: transparent;
  border: 0.5px dashed #444;
  color: #999;
  padding: 3px 9px;
  border-radius: 11px;
  font-size: 11px;
  cursor: pointer;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: border-color 0.12s ease, color 0.12s ease;
}
.brl-jnl-strat-new-btn:hover {
  border-color: #666;
  color: #ccc;
}
.brl-jnl-strat-new-btn svg { flex-shrink: 0; }

.brl-jnl-strat-pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.brl-jnl-strat-pill {
  background: transparent;
  border: 0.5px solid #333;
  color: #888;
  padding: 4px 12px;
  border-radius: 14px;
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.brl-jnl-strat-pill:hover:not(:disabled) {
  border-color: #555;
  color: #ccc;
}

.brl-jnl-strat-pill.is-selected {
  background: rgba(74, 222, 128, 0.15);
  border-color: rgba(74, 222, 128, 0.4);
  color: #86efac;
  font-weight: 500;
}

.brl-jnl-strat-pill.is-selected:hover:not(:disabled) {
  background: rgba(74, 222, 128, 0.22);
  border-color: rgba(74, 222, 128, 0.55);
  color: #a7f3c8;
}

.brl-jnl-strat-pill.is-pending {
  opacity: 0.5;
  cursor: progress;
}

.brl-jnl-strat-pill svg { flex-shrink: 0; }

.brl-jnl-strat-empty {
  font-size: 12px;
  color: #555;
  padding: 8px 0;
  font-style: italic;
}

.brl-jnl-strat-loading {
  font-size: 12px;
  color: #555;
  padding: 8px 0;
}

.brl-jnl-strat-create {
  margin-top: 10px;
  padding: 10px;
  background: #16181d;
  border: 0.5px solid #2a2d34;
  border-radius: 7px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.brl-jnl-strat-input {
  flex: 1;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 13px;
  outline: none;
  font-family: inherit;
  padding: 4px 0;
}
.brl-jnl-strat-input::placeholder { color: #555; }

.brl-jnl-strat-save {
  background: #2a2d34;
  border: none;
  color: #fff;
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.12s ease;
}
.brl-jnl-strat-save:hover { background: #353841; }

.brl-jnl-strat-cancel {
  background: transparent;
  border: 0.5px solid #333;
  color: #888;
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 11px;
  cursor: pointer;
  font-family: inherit;
  transition: color 0.12s ease, border-color 0.12s ease;
}
.brl-jnl-strat-cancel:hover {
  color: #ccc;
  border-color: #555;
}

@media (max-width: 480px) {
  .brl-jnl-strat-pill {
    padding: 5px 11px;
    font-size: 12px;
  }
  .brl-jnl-strat-create {
    flex-wrap: wrap;
  }
  .brl-jnl-strat-input {
    min-width: 0;
    width: 100%;
    margin-bottom: 6px;
  }
}


/* ====================================================================
   v2.0.0 — Responsive overhaul
   Unified breakpoints + grid behavior across devices.
   These rules use higher specificity (body.page-id-460 prefix) and
   come last in the file, so they override the older inconsistent
   media queries above. Three breakpoints:

     ≤ 480px   Phone
     ≤ 768px   Tablet
     ≤ 1024px  Small laptop / large tablet
     > 1024px  Desktop (default rules apply)

   Goal: every device gets a sensible layout, no awkward in-between
   sizes between 600-720px or 720-1024px.
   ==================================================================== */

/* --------------------------------------------------------------------
   Universal: prevent horizontal scroll, fix box-sizing, smooth borders
   -------------------------------------------------------------------- */
body.page-id-460 .brl-jnl,
body.page-id-460 .brl-jnl * {
  box-sizing: border-box;
}

body.page-id-460 .brl-jnl {
  overflow-x: hidden;
}

/* Hero metric cluster: never overflow on any width */
body.page-id-460 .brl-jnl-hero-right {
  max-width: 100%;
}

/* Stats grid: predictable column count at every size */
body.page-id-460 .brl-jnl-stats {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

/* Performance breakdown tabs: allow wrap, scroll if overflow */
body.page-id-460 .brl-jnl-bd-tabs {
  flex-wrap: wrap;
  overflow-x: auto;
  scrollbar-width: thin;
  max-width: 100%;
}

/* Strategy pills: cap pill width on very small screens so a long
   strategy name doesn't push the row off-screen */
body.page-id-460 .brl-jnl-strat-pill {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Modal: cap width at viewport on every size, never overflow */
body.page-id-460 .brl-jnl-modal {
  padding: 12px;
}

body.page-id-460 .brl-jnl-modal-card {
  max-height: 92vh;
}

/* --------------------------------------------------------------------
   ≤ 1024px — Small laptops + large tablets
   -------------------------------------------------------------------- */
@media (max-width: 1024px) {
  /* Stats: 4 columns (top row) + 3 wrap (bottom row) */
  body.page-id-460 .brl-jnl-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }

  /* Hero metric labels stay readable */
  body.page-id-460 .brl-jnl-hero-title {
    font-size: 28px;
  }

  /* Performance breakdown bars need a bit less label width */
  body.page-id-460 .brl-jnl-bd-bar-row {
    grid-template-columns: 70px 1fr 78px 100px;
  }
}

/* --------------------------------------------------------------------
   ≤ 768px — Tablet portrait
   -------------------------------------------------------------------- */
@media (max-width: 768px) {
  /* Hero: stack vertically, smaller title */
  body.page-id-460 .brl-jnl-hero {
    padding: 28px 18px 24px;
  }
  body.page-id-460 .brl-jnl-hero-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }
  body.page-id-460 .brl-jnl-hero-title {
    font-size: 24px;
  }
  body.page-id-460 .brl-jnl-hero-right {
    width: 100%;
    gap: 14px;
    justify-content: flex-start;
  }
  body.page-id-460 .brl-jnl-hero-divider {
    display: none;
  }
  body.page-id-460 .brl-jnl-hero-metric-value {
    font-size: 18px;
  }
  body.page-id-460 .brl-jnl-hero-refresh {
    margin-left: auto;
  }

  /* Stats: 3 columns */
  body.page-id-460 .brl-jnl-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }
  body.page-id-460 .brl-jnl-stat {
    padding: 10px;
  }
  body.page-id-460 .brl-jnl-stat-value {
    font-size: 18px;
  }

  /* Insight banner: stack icon + text, dismiss below */
  body.page-id-460 .brl-jnl-insights {
    flex-wrap: wrap;
    margin: 16px 18px 0;
    padding: 12px 14px;
  }
  body.page-id-460 .brl-jnl-ins-dismiss {
    margin-left: auto;
    margin-top: 6px;
  }

  /* Calendar: tighter cells */
  body.page-id-460 .brl-jnl-cal-cell {
    min-height: 56px;
    padding: 6px 5px;
    border-radius: 5px;
  }
  body.page-id-460 .brl-jnl-cal-cell-date {
    font-size: 9px;
  }
  body.page-id-460 .brl-jnl-cal-cell-pnl {
    font-size: 11px;
  }
  body.page-id-460 .brl-jnl-cal-cell-count {
    font-size: 9px;
  }
  body.page-id-460 .brl-jnl-cal-headers,
  body.page-id-460 .brl-jnl-cal-grid {
    gap: 3px;
  }
  body.page-id-460 .brl-jnl-cal-header {
    font-size: 9px;
  }

  /* Filters wrap; full width per filter on tablet */
  body.page-id-460 .brl-jnl-filters {
    gap: 8px;
  }
  body.page-id-460 .brl-jnl-filter-select {
    min-width: 90px;
    font-size: 12px;
  }
  body.page-id-460 .brl-jnl-filter-count {
    width: 100%;
    margin-left: 0;
    padding-bottom: 0;
  }

  /* Performance breakdown bars */
  body.page-id-460 .brl-jnl-bd-bar-row {
    grid-template-columns: 60px 1fr 72px;
  }
  body.page-id-460 .brl-jnl-bd-bar-meta {
    display: none;
  }
  body.page-id-460 .brl-jnl-bd-tab {
    padding: 5px 10px;
    font-size: 11px;
  }

  /* Trade table: smaller cells */
  body.page-id-460 .brl-jnl-table th,
  body.page-id-460 .brl-jnl-table td {
    padding: 8px 8px;
    font-size: 11px;
  }

  /* Modal: full viewport on tablet */
  body.page-id-460 .brl-jnl-modal {
    padding: 8px;
  }
  body.page-id-460 .brl-jnl-modal-card {
    max-width: 100%;
    max-height: 96vh;
    border-radius: 8px;
  }
  body.page-id-460 .brl-jnl-modal-grid {
    grid-template-columns: 1fr;
    gap: 4px 0;
  }
  body.page-id-460 .brl-jnl-modal-head {
    padding: 14px 16px 10px;
  }
  body.page-id-460 .brl-jnl-modal-body {
    padding: 12px 16px 18px;
  }
  body.page-id-460 .brl-jnl-modal-section {
    margin-bottom: 16px;
  }

  /* Tabs strip: spread evenly */
  body.page-id-460 .brl-jnl-tabs-strip {
    width: 100%;
    display: flex;
  }
  body.page-id-460 .brl-jnl-tab-btn {
    flex: 1;
    padding: 6px 10px;
    font-size: 12px;
  }

  /* Strategy pills: smaller */
  body.page-id-460 .brl-jnl-strat-pill {
    padding: 5px 10px;
    font-size: 11px;
  }

  /* Mistake chips: smaller */
  body.page-id-460 .brl-jnl-mistake-chip {
    padding: 4px 8px;
    font-size: 11px;
  }
  body.page-id-460 .brl-jnl-mistakes-group {
    padding: 8px 10px;
  }
  body.page-id-460 .brl-jnl-mistakes-group-title {
    font-size: 10px;
  }

  /* Equity curve: shorter */
  body.page-id-460 .brl-jnl-equity-svg {
    max-height: 220px;
  }
}

/* --------------------------------------------------------------------
   ≤ 480px — Phone
   -------------------------------------------------------------------- */
@media (max-width: 480px) {
  /* Hero: minimal padding */
  body.page-id-460 .brl-jnl-hero {
    padding: 22px 14px 18px;
  }
  body.page-id-460 .brl-jnl-hero-title {
    font-size: 20px;
  }
  body.page-id-460 .brl-jnl-hero-eyebrow {
    font-size: 10px;
    letter-spacing: 1.5px;
  }
  body.page-id-460 .brl-jnl-hero-metric-value {
    font-size: 16px;
  }
  body.page-id-460 .brl-jnl-hero-metric-label {
    font-size: 9px;
  }
  body.page-id-460 .brl-jnl-hero-metric {
    min-width: 50px;
  }
  body.page-id-460 .brl-jnl-hero-tagline {
    font-size: 11px;
  }

  /* Stats: 2 columns */
  body.page-id-460 .brl-jnl-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  body.page-id-460 .brl-jnl-stat {
    padding: 9px;
  }
  body.page-id-460 .brl-jnl-stat-label {
    font-size: 9px;
  }
  body.page-id-460 .brl-jnl-stat-value {
    font-size: 16px;
  }
  body.page-id-460 .brl-jnl-stat-sub {
    font-size: 10px;
  }

  /* Insight banner: compact */
  body.page-id-460 .brl-jnl-insights {
    margin: 14px 14px 0;
    padding: 10px 12px;
    gap: 10px;
  }
  body.page-id-460 .brl-jnl-ins-icon {
    width: 24px;
    height: 24px;
  }
  body.page-id-460 .brl-jnl-ins-list {
    font-size: 11px;
    line-height: 1.5;
  }
  body.page-id-460 .brl-jnl-ins-title {
    font-size: 10px;
  }

  /* Calendar: small but readable */
  body.page-id-460 .brl-jnl-cal-cell {
    min-height: 44px;
    padding: 4px 3px;
    border-radius: 4px;
  }
  body.page-id-460 .brl-jnl-cal-cell-date {
    font-size: 8px;
  }
  body.page-id-460 .brl-jnl-cal-cell-pnl {
    font-size: 10px;
  }
  body.page-id-460 .brl-jnl-cal-cell-count {
    font-size: 8px;
    display: none; /* save space on tiny screens */
  }
  body.page-id-460 .brl-jnl-cal-headers {
    gap: 2px;
  }
  body.page-id-460 .brl-jnl-cal-grid {
    gap: 2px;
  }

  /* Filters: full width */
  body.page-id-460 .brl-jnl-filters {
    flex-direction: column;
    align-items: stretch;
  }
  body.page-id-460 .brl-jnl-filter {
    width: 100%;
  }
  body.page-id-460 .brl-jnl-filter-select {
    width: 100%;
  }

  /* Trade table: hide some columns */
  body.page-id-460 .brl-jnl-table th,
  body.page-id-460 .brl-jnl-table td {
    padding: 6px 5px;
    font-size: 10px;
  }
  body.page-id-460 .brl-jnl-table .brl-jnl-side {
    font-size: 9px;
    padding: 1px 5px;
  }

  /* Performance breakdown: tabs scroll horizontally */
  body.page-id-460 .brl-jnl-bd-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  body.page-id-460 .brl-jnl-bd-tab {
    flex-shrink: 0;
    padding: 5px 8px;
    font-size: 10px;
  }

  /* Modal: nearly fullscreen */
  body.page-id-460 .brl-jnl-modal {
    padding: 0;
  }
  body.page-id-460 .brl-jnl-modal-card {
    max-width: 100%;
    max-height: 100vh;
    height: 100vh;
    border-radius: 0;
    border: none;
  }
  body.page-id-460 .brl-jnl-modal-head {
    padding: 12px 14px 8px;
  }
  body.page-id-460 .brl-jnl-modal-title {
    font-size: 14px;
  }
  body.page-id-460 .brl-jnl-modal-symbol {
    font-size: 15px;
  }
  body.page-id-460 .brl-jnl-modal-body {
    padding: 10px 14px 16px;
  }
  body.page-id-460 .brl-jnl-modal-section-title {
    font-size: 10px;
  }
  body.page-id-460 .brl-jnl-modal-row {
    font-size: 12px;
  }

  /* Tabs strip: compact */
  body.page-id-460 .brl-jnl-tab-btn {
    padding: 5px 6px;
    font-size: 10px;
  }

  /* Strategy pills: very compact */
  body.page-id-460 .brl-jnl-strat-pills {
    gap: 4px;
  }
  body.page-id-460 .brl-jnl-strat-pill {
    padding: 4px 8px;
    font-size: 10px;
    border-radius: 11px;
  }
  body.page-id-460 .brl-jnl-strat-header {
    flex-wrap: wrap;
    gap: 6px;
  }

  /* Mistake chips */
  body.page-id-460 .brl-jnl-mistake-chip {
    padding: 4px 7px;
    font-size: 10px;
  }
  body.page-id-460 .brl-jnl-mistakes-group-items {
    gap: 4px;
  }

  /* Notes textarea */
  body.page-id-460 .brl-jnl-notes-textarea {
    font-size: 12px;
    min-height: 70px;
  }

  /* Equity curve */
  body.page-id-460 .brl-jnl-equity-svg {
    max-height: 180px;
  }

  /* Performance bar rows: minimal */
  body.page-id-460 .brl-jnl-bd-bar-row {
    grid-template-columns: 50px 1fr 60px;
    gap: 6px;
    font-size: 10px;
  }
  body.page-id-460 .brl-jnl-bd-bar-track {
    height: 14px;
  }
}

/* --------------------------------------------------------------------
   Touch-friendly: bigger tap targets on touch devices regardless of size
   -------------------------------------------------------------------- */
@media (hover: none) and (pointer: coarse) {
  body.page-id-460 .brl-jnl-strat-pill,
  body.page-id-460 .brl-jnl-mistake-chip,
  body.page-id-460 .brl-jnl-tab-btn,
  body.page-id-460 .brl-jnl-bd-tab {
    min-height: 32px;
  }
  body.page-id-460 .brl-jnl-cal-cell {
    min-height: max(44px, 8vw);
  }
}


/* ====================================================================
   v2.1.0 — Soft radial glow background
   Adds two subtle gradient blobs (top-left blue, bottom-right red)
   to break up the flat darkness without competing with data.
   ==================================================================== */

/* Apply the glow to the dashboard wrapper (full-bleed area), not to
   the page body — we don't want to tint the WP header/footer too. */
body.page-id-460 .brl-jnl {
  background-color: #0a0c10;
  background-image:
    radial-gradient(circle at 15% 0%,   rgba(74, 114, 255, 0.10), transparent 50%),
    radial-gradient(circle at 85% 100%, rgba(239,  68,  68, 0.06), transparent 50%);
  background-attachment: fixed;
}

/* The hero already has its own background (#0a0c10) which would block
   the glow on the top edge. Make it transparent so the glow shows
   through, but keep the bottom border. */
body.page-id-460 .brl-jnl-hero {
  background: transparent;
}

/* Hero's own subtle accent circle (the existing radial-gradient at
   top-right) might double up with the new glow. Soften it a bit. */
body.page-id-460 .brl-jnl-hero-bg {
  opacity: 0.6;
}


/* ====================================================================
   v2.3.0 — Phase 1 (clean approach)

   Sidebar lives OUTSIDE .brl-jnl, so the dashboard's existing
   full-bleed CSS is completely untouched. The .brl-jnl-app wrapper
   becomes a grid: [sidebar | dashboard]. Each cell has its own
   width and the dashboard breaks out of its grid cell using its
   own existing 100vw + negative margin trick — but we clamp it.

   On mobile, the grid collapses to a single column and the sidebar
   becomes a fixed overlay triggered by the hamburger button.
   ==================================================================== */

/* Convert selectors from page-id-460 to a class-wildcard so the
   sidebar pages (Edge Finder, Setup Playbook) get the same theme
   as the dashboard. */
body[class*="page-id-"] .brl-jnl-app {
  display: flex;
  align-items: stretch;
  background: #0a0c10;
  position: relative;
  min-height: 100vh;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

body[class*="page-id-"] .brl-jnl-app .brl-jnl-sb {
  flex: 0 0 215px;
  width: 215px;
  background: #0c0e13;
  border-right: 1px solid #1f2229;
  padding: 18px 12px 16px;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  position: sticky;
  top: 0;
  height: 100vh;
  z-index: 2;
}

body[class*="page-id-"] .brl-jnl-app .brl-jnl-page {
  flex: 1 1 0;
  min-width: 0;
  padding: 24px 32px;
  color: #fff;
}

/* When the inner page is the dashboard (.brl-jnl-page contains .brl-jnl-hero),
   the dashboard's own full-bleed CSS would push it past the page boundary.
   Cancel that. */
body[class*="page-id-"] .brl-jnl-app .brl-jnl-page .brl-jnl {
  width: auto !important;
  position: static !important;
  left: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
}

/* Now the dashboard's internal sections (hero, stats, calendar, ...)
   need flat padding instead of the old calc(50vw - 700px). */
body[class*="page-id-"] .brl-jnl-app .brl-jnl > .brl-jnl-hero {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

body[class*="page-id-"] .brl-jnl-app .brl-jnl > *:not(.brl-jnl-hero) {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

/* Stats: predictable 4-up inside the layout. */
body[class*="page-id-"] .brl-jnl-app .brl-jnl-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px;
}

/* Calendar cells shrink with the container. */
body[class*="page-id-"] .brl-jnl-app .brl-jnl-cal-grid,
body[class*="page-id-"] .brl-jnl-app .brl-jnl-cal-headers {
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}

/* Sidebar navigation */
body[class*="page-id-"] .brl-jnl-sb-section-title {
  font-size: 9px;
  letter-spacing: 1.5px;
  color: #555;
  padding: 0 8px 10px;
  text-transform: uppercase;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-sb-nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

body[class*="page-id-"] .brl-jnl-sb-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  font-size: 12.5px;
  color: #aaa;
  border-radius: 7px;
  text-decoration: none;
  border: 1px solid transparent;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
  line-height: 1.3;
}

body[class*="page-id-"] .brl-jnl-sb-item:hover {
  background: #16181d;
  color: #ddd;
  text-decoration: none;
}

body[class*="page-id-"] .brl-jnl-sb-item.is-active {
  background: rgba(74, 114, 255, 0.10);
  color: #fff;
  border-color: rgba(74, 114, 255, 0.30);
}

body[class*="page-id-"] .brl-jnl-sb-item.is-locked {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

body[class*="page-id-"] .brl-jnl-sb-icon {
  display: inline-flex;
  width: 18px; height: 18px;
  align-items: center; justify-content: center;
  flex-shrink: 0;
}

body[class*="page-id-"] .brl-jnl-sb-label {
  flex: 1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

body[class*="page-id-"] .brl-jnl-sb-badge {
  font-size: 9px;
  letter-spacing: 0.5px;
  padding: 1px 5px;
  border-radius: 4px;
  font-weight: 500;
  flex-shrink: 0;
}
body[class*="page-id-"] .brl-jnl-sb-badge-new { background: rgba(74,114,255,0.15); color:#85b7eb; }
body[class*="page-id-"] .brl-jnl-sb-badge-p2,
body[class*="page-id-"] .brl-jnl-sb-badge-p3,
body[class*="page-id-"] .brl-jnl-sb-badge-p4 { background:#1f2229; color:#666; }

body[class*="page-id-"] .brl-jnl-sb-spacer { flex: 1; }

body[class*="page-id-"] .brl-jnl-sb-expert {
  margin-top: 16px;
  padding: 10px 12px;
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 7px;
}
body[class*="page-id-"] .brl-jnl-sb-expert-head {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; color: #888;
  margin-bottom: 3px;
}
body[class*="page-id-"] .brl-jnl-sb-expert.is-active .brl-jnl-sb-expert-head { color:#86efac; }
body[class*="page-id-"] .brl-jnl-sb-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #555;
}
body[class*="page-id-"] .brl-jnl-sb-expert.is-active .brl-jnl-sb-dot {
  background:#4ade80; box-shadow:0 0 6px rgba(74,222,128,0.5);
}
body[class*="page-id-"] .brl-jnl-sb-expert-sub { font-size: 10px; color: #666; line-height: 1.4; }

body[class*="page-id-"] .brl-jnl-sb-toggle {
  display: none;
  align-items: center; gap: 8px;
  background: #0c0e13; color: #fff;
  border: 1px solid #1f2229;
  padding: 9px 12px; border-radius: 7px;
  font-size: 12px; cursor: pointer;
  margin: 12px;
}

/* Page chrome for Edge Finder + Setup Playbook */
body[class*="page-id-"] .brl-jnl-page-head {
  padding: 4px 0 16px;
}
body[class*="page-id-"] .brl-jnl-page-eyebrow {
  font-size: 10px; letter-spacing: 2px; color: #666;
  margin-bottom: 6px; text-transform: uppercase;
}
body[class*="page-id-"] .brl-jnl-page-title {
  font-size: 24px; font-weight: 500; color: #fff;
  margin: 0 0 6px; line-height: 1.2;
}
body[class*="page-id-"] .brl-jnl-page-sub {
  font-size: 12px; color: #999; margin: 0; line-height: 1.5;
}

body[class*="page-id-"] .brl-jnl-empty-state {
  margin: 16px 0;
  padding: 40px 24px;
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 10px;
  text-align: center;
}
body[class*="page-id-"] .brl-jnl-empty-state-title { font-size: 14px; font-weight: 500; color: #ddd; margin-bottom: 6px; }
body[class*="page-id-"] .brl-jnl-empty-state-sub { font-size: 12px; color: #888; line-height: 1.6; max-width: 440px; margin: 0 auto; }

/* Edge Finder Pro page */
body[class*="page-id-"] .brl-jnl-ef-summary { display: flex; gap: 6px; flex-wrap: wrap; padding: 0 0 16px; }
body[class*="page-id-"] .brl-jnl-ef-pill { font-size: 11px; padding: 3px 10px; border-radius: 11px; font-weight: 500; border: 1px solid transparent; }
body[class*="page-id-"] .brl-jnl-ef-pill.is-danger { background: rgba(239,68,68,0.12); color:#fca5a5; border-color: rgba(239,68,68,0.30); }
body[class*="page-id-"] .brl-jnl-ef-pill.is-warning { background: rgba(239,158,68,0.12); color:#fcd34d; border-color: rgba(239,158,68,0.30); }
body[class*="page-id-"] .brl-jnl-ef-pill.is-healthy { background: rgba(74,222,128,0.12); color:#86efac; border-color: rgba(74,222,128,0.30); }

body[class*="page-id-"] .brl-jnl-ef-list { display: flex; flex-direction: column; gap: 8px; padding-bottom: 32px; }
body[class*="page-id-"] .brl-jnl-ef-card { display: flex; gap: 12px; padding: 14px 16px; border-radius: 10px; border: 1px solid; }
body[class*="page-id-"] .brl-jnl-ef-card.is-danger  { background: rgba(239,68,68,0.07);  border-color: rgba(239,68,68,0.30); }
body[class*="page-id-"] .brl-jnl-ef-card.is-warning { background: rgba(239,158,68,0.07); border-color: rgba(239,158,68,0.30); }
body[class*="page-id-"] .brl-jnl-ef-card.is-healthy { background: rgba(74,222,128,0.07); border-color: rgba(74,222,128,0.30); }
body[class*="page-id-"] .brl-jnl-ef-card.is-info    { background: #16181d; border-color: #1f2229; }
body[class*="page-id-"] .brl-jnl-ef-icon { flex-shrink:0; width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-top:1px; }
body[class*="page-id-"] .brl-jnl-ef-card.is-danger  .brl-jnl-ef-icon { background: rgba(239,68,68,0.18);  color: #ef4444; }
body[class*="page-id-"] .brl-jnl-ef-card.is-warning .brl-jnl-ef-icon { background: rgba(239,158,68,0.18); color: #ef9e44; }
body[class*="page-id-"] .brl-jnl-ef-card.is-healthy .brl-jnl-ef-icon { background: rgba(74,222,128,0.18); color: #4ade80; }
body[class*="page-id-"] .brl-jnl-ef-card.is-info    .brl-jnl-ef-icon { background: rgba(133,183,235,0.18); color: #85b7eb; }
body[class*="page-id-"] .brl-jnl-ef-body { flex: 1; min-width: 0; }
body[class*="page-id-"] .brl-jnl-ef-tag { font-size: 9px; letter-spacing: 1.5px; font-weight: 500; margin-bottom: 4px; text-transform: uppercase; }
body[class*="page-id-"] .brl-jnl-ef-card.is-danger  .brl-jnl-ef-tag { color: #ef4444; }
body[class*="page-id-"] .brl-jnl-ef-card.is-warning .brl-jnl-ef-tag { color: #ef9e44; }
body[class*="page-id-"] .brl-jnl-ef-card.is-healthy .brl-jnl-ef-tag { color: #4ade80; }
body[class*="page-id-"] .brl-jnl-ef-card.is-info    .brl-jnl-ef-tag { color: #85b7eb; }
body[class*="page-id-"] .brl-jnl-ef-title { font-size: 14px; font-weight: 500; color: #fff; margin-bottom: 4px; line-height: 1.35; }
body[class*="page-id-"] .brl-jnl-ef-text { font-size: 12px; color: #bbb; line-height: 1.55; }

/* Setup Playbook page */
body[class*="page-id-"] .brl-jnl-sp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-bottom: 32px; }
body[class*="page-id-"] .brl-jnl-sp-card { background: #16181d; border: 1px solid #1f2229; border-radius: 10px; padding: 14px 16px; }
body[class*="page-id-"] .brl-jnl-sp-card-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 12px; }
body[class*="page-id-"] .brl-jnl-sp-name { font-size: 14px; font-weight: 500; color: #fff; }
body[class*="page-id-"] .brl-jnl-sp-trades { font-size: 11px; color: #888; }
body[class*="page-id-"] .brl-jnl-sp-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-bottom: 12px; }
body[class*="page-id-"] .brl-jnl-sp-stat { background: #0c0e13; padding: 8px 9px; border-radius: 6px; min-width: 0; }
body[class*="page-id-"] .brl-jnl-sp-stat-label { font-size: 8.5px; letter-spacing: 0.5px; color: #666; margin-bottom: 2px; }
body[class*="page-id-"] .brl-jnl-sp-stat-value { font-size: 15px; font-weight: 500; color: #fff; font-variant-numeric: tabular-nums; }
body[class*="page-id-"] .brl-jnl-sp-stat-value.is-pos { color: #86efac; }
body[class*="page-id-"] .brl-jnl-sp-stat-value.is-neg { color: #fca5a5; }
body[class*="page-id-"] .brl-jnl-sp-stat-value-small { font-size: 11px; font-weight: 500; color: #ddd; }
body[class*="page-id-"] .brl-jnl-sp-dow { font-size: 9px; color: #888; }
body[class*="page-id-"] .brl-jnl-sp-rules { border-top: 1px solid #1f2229; padding-top: 10px; }
body[class*="page-id-"] .brl-jnl-sp-rules-label { font-size: 9px; letter-spacing: 1px; color: #888; margin-bottom: 5px; font-weight: 500; }
body[class*="page-id-"] .brl-jnl-sp-rules-input { width: 100%; background: #0c0e13; color: #ddd; border: 1px solid #1f2229; border-radius: 6px; padding: 8px 10px; font-size: 12px; font-family: inherit; resize: vertical; line-height: 1.5; min-height: 60px; }
body[class*="page-id-"] .brl-jnl-sp-rules-save { margin-top: 6px; background: transparent; color: #aaa; border: 1px solid #1f2229; padding: 5px 12px; border-radius: 5px; font-size: 11px; cursor: pointer; }
body[class*="page-id-"] .brl-jnl-sp-rules-save:hover { background: #1f2229; color: #fff; }
body[class*="page-id-"] .brl-jnl-sp-rules-status { margin-left: 8px; font-size: 11px; }
body[class*="page-id-"] .brl-jnl-sp-rules-status.is-ok  { color: #86efac; }
body[class*="page-id-"] .brl-jnl-sp-rules-status.is-err { color: #fca5a5; }

/* Mobile: sidebar becomes overlay */
@media (max-width: 900px) {
  body[class*="page-id-"] .brl-jnl-app { display: block; min-height: 0; }
  body[class*="page-id-"] .brl-jnl-app .brl-jnl-sb {
    position: fixed; top: 0; left: 0; height: 100vh;
    z-index: 9999;
    transform: translateX(-100%);
    transition: transform 0.22s ease;
  }
  body[class*="page-id-"] .brl-jnl-app.is-sb-open .brl-jnl-sb { transform: translateX(0); }
  body[class*="page-id-"] .brl-jnl-sb-toggle { display: inline-flex; }
}

@media (max-width: 768px) {
  body[class*="page-id-"] .brl-jnl-app .brl-jnl-page { padding: 16px 18px; }
  body[class*="page-id-"] .brl-jnl-app .brl-jnl-stats { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body[class*="page-id-"] .brl-jnl-sp-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  body[class*="page-id-"] .brl-jnl-app .brl-jnl-page { padding: 12px 14px; }
  body[class*="page-id-"] .brl-jnl-app .brl-jnl-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[class*="page-id-"] .brl-jnl-sp-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* ====================================================================
   v2.3.0 — Phase 2: Diary + Compare

   New page chrome for two more journal sections. Re-uses the page
   header / sidebar from Phase 1; everything below is page-specific.
   ==================================================================== */


/* ====================================================================
   Diary page
   ==================================================================== */

body[class*="page-id-"] .brl-jnl-diary-toolbar {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 0 0 14px;
}

body[class*="page-id-"] .brl-jnl-diary-search {
  flex: 1;
  background: #16181d;
  border: 1px solid #1f2229;
  color: #fff;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-family: inherit;
}
body[class*="page-id-"] .brl-jnl-diary-search:focus {
  outline: none;
  border-color: rgba(74, 114, 255, 0.4);
}
body[class*="page-id-"] .brl-jnl-diary-search::placeholder { color: #555; }

body[class*="page-id-"] .brl-jnl-diary-new-btn {
  background: #fff;
  color: #0a0c10;
  border: none;
  padding: 8px 14px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
}
body[class*="page-id-"] .brl-jnl-diary-new-btn:hover {
  background: #f0f0f0;
}

body[class*="page-id-"] .brl-jnl-diary-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 32px;
}

body[class*="page-id-"] .brl-jnl-diary-card {
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 10px;
  padding: 14px 16px;
  transition: border-color 0.12s;
}
body[class*="page-id-"] .brl-jnl-diary-card.is-hidden { display: none; }

body[class*="page-id-"] .brl-jnl-diary-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-diary-card-date {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

body[class*="page-id-"] .brl-jnl-diary-card-date-main {
  font-size: 14px;
  font-weight: 500;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-diary-card-day {
  font-size: 11px;
  color: #888;
}

body[class*="page-id-"] .brl-jnl-diary-card-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  color: #aaa;
  font-variant-numeric: tabular-nums;
}

body[class*="page-id-"] .brl-jnl-diary-card-meta .is-pos { color: #86efac; }
body[class*="page-id-"] .brl-jnl-diary-card-meta .is-neg { color: #fca5a5; }

body[class*="page-id-"] .brl-jnl-diary-card-mood {
  font-size: 18px;
  line-height: 1;
}

body[class*="page-id-"] .brl-jnl-diary-card-edit,
body[class*="page-id-"] .brl-jnl-diary-card-delete {
  background: transparent;
  border: 1px solid #1f2229;
  color: #888;
  padding: 3px 8px;
  border-radius: 5px;
  font-size: 10px;
  cursor: pointer;
  font-family: inherit;
}
body[class*="page-id-"] .brl-jnl-diary-card-edit:hover { background: #1f2229; color: #ddd; }
body[class*="page-id-"] .brl-jnl-diary-card-delete:hover {
  background: rgba(239, 68, 68, 0.15);
  border-color: rgba(239, 68, 68, 0.4);
  color: #fca5a5;
}

body[class*="page-id-"] .brl-jnl-diary-card-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 10px;
}

body[class*="page-id-"] .brl-jnl-diary-field {
  background: #0c0e13;
  border: 1px solid #1f2229;
  border-radius: 6px;
  padding: 8px 10px;
}

body[class*="page-id-"] .brl-jnl-diary-field-wide { grid-column: span 2; }

body[class*="page-id-"] .brl-jnl-diary-field-label {
  font-size: 9px;
  letter-spacing: 1px;
  color: #888;
  margin-bottom: 4px;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-diary-field-text {
  font-size: 12px;
  color: #ddd;
  line-height: 1.55;
  word-wrap: break-word;
}

body[class*="page-id-"] .brl-jnl-diary-card-trades {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding-top: 10px;
  border-top: 1px solid #1f2229;
  align-items: center;
}

body[class*="page-id-"] .brl-jnl-diary-card-trades-label {
  font-size: 9px;
  letter-spacing: 1px;
  color: #666;
  font-weight: 500;
  margin-right: 4px;
}

body[class*="page-id-"] .brl-jnl-diary-trade-pill {
  display: inline-block;
  font-size: 10px;
  padding: 3px 8px;
  border-radius: 11px;
  background: #0c0e13;
  border: 1px solid #1f2229;
  color: #aaa;
  font-variant-numeric: tabular-nums;
}
body[class*="page-id-"] .brl-jnl-diary-trade-pill.is-pos {
  color: #86efac;
  border-color: rgba(74, 222, 128, 0.3);
}
body[class*="page-id-"] .brl-jnl-diary-trade-pill.is-neg {
  color: #fca5a5;
  border-color: rgba(239, 68, 68, 0.3);
}


/* ---- Diary editor (modal-ish overlay) ---- */
body[class*="page-id-"] .brl-jnl-diary-editor[hidden] { display: none; }

body[class*="page-id-"] .brl-jnl-diary-editor {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

body[class*="page-id-"] .brl-jnl-diary-editor-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(2px);
}

body[class*="page-id-"] .brl-jnl-diary-editor-card {
  position: relative;
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 12px;
  width: 100%;
  max-width: 560px;
  max-height: 92vh;
  overflow: auto;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-diary-editor-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px 12px;
  border-bottom: 1px solid #1f2229;
}

body[class*="page-id-"] .brl-jnl-diary-editor-title {
  margin: 0;
  font-size: 15px;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-diary-editor-close {
  background: transparent;
  border: none;
  color: #888;
  font-size: 22px;
  cursor: pointer;
  padding: 2px 8px;
  border-radius: 4px;
}
body[class*="page-id-"] .brl-jnl-diary-editor-close:hover { background: #1f2229; color: #fff; }

body[class*="page-id-"] .brl-jnl-diary-editor-body {
  padding: 16px 20px;
}

body[class*="page-id-"] .brl-jnl-diary-editor-row {
  margin-bottom: 14px;
}

body[class*="page-id-"] .brl-jnl-diary-editor-label {
  display: block;
  font-size: 10px;
  letter-spacing: 1.2px;
  color: #888;
  text-transform: uppercase;
  font-weight: 500;
  margin-bottom: 6px;
}

body[class*="page-id-"] .brl-jnl-diary-editor-input,
body[class*="page-id-"] .brl-jnl-diary-editor-textarea {
  width: 100%;
  background: #0c0e13;
  color: #ddd;
  border: 1px solid #1f2229;
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 12px;
  font-family: inherit;
  resize: vertical;
  line-height: 1.5;
}

body[class*="page-id-"] .brl-jnl-diary-editor-input:focus,
body[class*="page-id-"] .brl-jnl-diary-editor-textarea:focus {
  outline: none;
  border-color: rgba(74, 114, 255, 0.4);
}

body[class*="page-id-"] .brl-jnl-diary-mood-picker {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-diary-mood-btn {
  background: #0c0e13;
  border: 1px solid #1f2229;
  color: #888;
  font-size: 20px;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  transition: background 0.12s, border-color 0.12s;
}

body[class*="page-id-"] .brl-jnl-diary-mood-btn:hover {
  background: #1f2229;
  border-color: #333;
}

body[class*="page-id-"] .brl-jnl-diary-mood-btn.is-selected {
  background: rgba(74, 114, 255, 0.15);
  border-color: rgba(74, 114, 255, 0.4);
}

body[class*="page-id-"] .brl-jnl-diary-editor-foot {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  border-top: 1px solid #1f2229;
}

body[class*="page-id-"] .brl-jnl-diary-editor-status {
  margin-right: auto;
  font-size: 11px;
  color: #888;
}
body[class*="page-id-"] .brl-jnl-diary-editor-status.is-ok  { color: #86efac; }
body[class*="page-id-"] .brl-jnl-diary-editor-status.is-err { color: #fca5a5; }

body[class*="page-id-"] .brl-jnl-diary-editor-cancel,
body[class*="page-id-"] .brl-jnl-diary-editor-save {
  border: 1px solid #1f2229;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
}

body[class*="page-id-"] .brl-jnl-diary-editor-cancel {
  background: transparent;
  color: #888;
}
body[class*="page-id-"] .brl-jnl-diary-editor-cancel:hover {
  background: #1f2229;
  color: #ddd;
}

body[class*="page-id-"] .brl-jnl-diary-editor-save {
  background: #fff;
  color: #0a0c10;
  border-color: #fff;
  font-weight: 500;
}
body[class*="page-id-"] .brl-jnl-diary-editor-save:hover { background: #f0f0f0; }
body[class*="page-id-"] .brl-jnl-diary-editor-save:disabled { opacity: 0.6; cursor: wait; }


/* ====================================================================
   Compare page
   ==================================================================== */

body[class*="page-id-"] .brl-jnl-compare-toolbar {
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 14px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-compare-toolbar-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 140px;
}

body[class*="page-id-"] .brl-jnl-compare-label {
  font-size: 10px;
  letter-spacing: 1px;
  color: #888;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-compare-select {
  background: #0c0e13;
  border: 1px solid #1f2229;
  color: #fff;
  padding: 6px 10px;
  border-radius: 5px;
  font-size: 12px;
  font-family: inherit;
  cursor: pointer;
}
body[class*="page-id-"] .brl-jnl-compare-select:focus {
  outline: none;
  border-color: rgba(74, 114, 255, 0.4);
}

body[class*="page-id-"] .brl-jnl-compare-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 14px;
}

body[class*="page-id-"] .brl-jnl-compare-side {
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 10px;
  padding: 14px;
}

body[class*="page-id-"] .brl-jnl-compare-side.is-winner {
  border-color: rgba(74, 222, 128, 0.4);
}

body[class*="page-id-"] .brl-jnl-compare-side-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
  gap: 8px;
}

body[class*="page-id-"] .brl-jnl-compare-side-name {
  font-size: 13px;
  font-weight: 500;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-compare-winner-badge {
  background: rgba(74, 222, 128, 0.15);
  border: 1px solid rgba(74, 222, 128, 0.3);
  color: #86efac;
  font-size: 9px;
  letter-spacing: 1px;
  padding: 2px 8px;
  border-radius: 9px;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-compare-side-pnl {
  font-size: 22px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  margin-bottom: 4px;
}
body[class*="page-id-"] .brl-jnl-compare-side-pnl.is-pos { color: #86efac; }
body[class*="page-id-"] .brl-jnl-compare-side-pnl.is-neg { color: #fca5a5; }

body[class*="page-id-"] .brl-jnl-compare-side-sub {
  font-size: 11px;
  color: #888;
  margin-bottom: 10px;
}

body[class*="page-id-"] .brl-jnl-compare-row {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
  font-size: 12px;
  border-top: 1px solid #1f2229;
}
body[class*="page-id-"] .brl-jnl-compare-row:first-of-type { border-top: none; }

body[class*="page-id-"] .brl-jnl-compare-row-label { color: #888; }

body[class*="page-id-"] .brl-jnl-compare-row-value {
  color: #fff;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
body[class*="page-id-"] .brl-jnl-compare-row-value.is-pos { color: #86efac; }
body[class*="page-id-"] .brl-jnl-compare-row-value.is-neg { color: #fca5a5; }

body[class*="page-id-"] .brl-jnl-compare-delta {
  background: rgba(74, 222, 128, 0.07);
  border: 1px solid rgba(74, 222, 128, 0.25);
  border-radius: 8px;
  padding: 12px 14px;
  margin-bottom: 32px;
}

body[class*="page-id-"] .brl-jnl-compare-delta-eyebrow {
  font-size: 9px;
  letter-spacing: 1.5px;
  color: #4ade80;
  margin-bottom: 4px;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-compare-delta-text {
  font-size: 12px;
  color: #ddd;
  line-height: 1.55;
}

body[class*="page-id-"] .brl-jnl-compare-delta-text .is-pos { color: #86efac; }
body[class*="page-id-"] .brl-jnl-compare-delta-text .is-neg { color: #fca5a5; }

body[class*="page-id-"] .brl-jnl-compare-empty {
  background: #16181d;
  border: 1px dashed #1f2229;
  border-radius: 10px;
  padding: 24px;
  text-align: center;
  font-size: 12px;
  color: #888;
  margin-bottom: 32px;
}


/* ====================================================================
   Responsive
   ==================================================================== */

@media (max-width: 768px) {
  body[class*="page-id-"] .brl-jnl-diary-card-fields {
    grid-template-columns: 1fr;
  }
  body[class*="page-id-"] .brl-jnl-diary-field-wide {
    grid-column: span 1;
  }
  body[class*="page-id-"] .brl-jnl-compare-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  body[class*="page-id-"] .brl-jnl-diary-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
  body[class*="page-id-"] .brl-jnl-diary-mood-btn {
    width: 36px;
    height: 36px;
    font-size: 18px;
  }
  body[class*="page-id-"] .brl-jnl-diary-editor-card {
    max-width: 100%;
    max-height: 100vh;
    height: 100vh;
    border-radius: 0;
  }
}


/* ====================================================================
   v2.4.0 — Phase 3a: Performance Lab

   "What if you had traded differently?" page. Interactive sliders
   and checkboxes that re-run a hypothetical-trades simulation
   entirely client-side.
   ==================================================================== */


/* ---- Summary stats: 3 cards across the top ---- */
body[class*="page-id-"] .brl-jnl-pl-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

body[class*="page-id-"] .brl-jnl-pl-stat {
  background: #16181d;
  border: 1px solid rgba(74, 114, 255, 0.30);
  border-radius: 8px;
  padding: 12px 14px;
  min-width: 0;
}

body[class*="page-id-"] .brl-jnl-pl-stat-label {
  font-size: 9px;
  letter-spacing: 1.2px;
  color: #888;
  margin-bottom: 6px;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-pl-stat-orig {
  font-size: 11px;
  color: #888;
  margin-bottom: 3px;
  font-variant-numeric: tabular-nums;
}

body[class*="page-id-"] .brl-jnl-pl-stat-new {
  font-size: 22px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  color: #fff;
}
body[class*="page-id-"] .brl-jnl-pl-stat-new.is-pos { color: #86efac; }
body[class*="page-id-"] .brl-jnl-pl-stat-new.is-neg { color: #fca5a5; }

body[class*="page-id-"] .brl-jnl-pl-stat-delta {
  font-size: 11px;
  margin-top: 3px;
  font-variant-numeric: tabular-nums;
  color: #aaa;
  min-height: 14px;
}
body[class*="page-id-"] .brl-jnl-pl-stat-delta.is-pos { color: #86efac; }
body[class*="page-id-"] .brl-jnl-pl-stat-delta.is-neg { color: #fca5a5; }


/* ---- Equity curve chart ---- */
body[class*="page-id-"] .brl-jnl-pl-chart {
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 16px;
}

body[class*="page-id-"] .brl-jnl-pl-chart-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  gap: 12px;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-pl-chart-label {
  font-size: 10px;
  letter-spacing: 1.2px;
  color: #888;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-pl-chart-legend {
  display: flex;
  gap: 14px;
  font-size: 11px;
  color: #aaa;
}

body[class*="page-id-"] .brl-jnl-pl-legend-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  vertical-align: middle;
  margin-right: 5px;
}


/* ---- Scenario sections ---- */
body[class*="page-id-"] .brl-jnl-pl-section {
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 10px;
}

body[class*="page-id-"] .brl-jnl-pl-section-title {
  font-size: 10px;
  letter-spacing: 1.5px;
  color: #888;
  margin-bottom: 12px;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-pl-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid #1f2229;
}
body[class*="page-id-"] .brl-jnl-pl-row:first-child {
  border-top: none;
  padding-top: 0;
}
body[class*="page-id-"] .brl-jnl-pl-row-tall { align-items: flex-start; }

body[class*="page-id-"] .brl-jnl-pl-check {
  width: 16px;
  height: 16px;
  accent-color: #4a72ff;
  flex-shrink: 0;
  cursor: pointer;
  margin-top: 2px;
}

body[class*="page-id-"] .brl-jnl-pl-label {
  flex: 1;
  font-size: 12.5px;
  color: #ddd;
  cursor: pointer;
  line-height: 1.4;
  min-width: 0;
}

body[class*="page-id-"] .brl-jnl-pl-label strong {
  color: #fff;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

body[class*="page-id-"] .brl-jnl-pl-sublabel {
  display: block;
  font-size: 11px;
  color: #777;
  margin-top: 3px;
  line-height: 1.5;
  font-weight: 400;
}

body[class*="page-id-"] .brl-jnl-pl-control {
  flex: 1.5;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

body[class*="page-id-"] .brl-jnl-pl-control-stack {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}

body[class*="page-id-"] .brl-jnl-pl-slider {
  flex: 1;
  min-width: 0;
  accent-color: #4a72ff;
  cursor: pointer;
}

body[class*="page-id-"] .brl-jnl-pl-input-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

body[class*="page-id-"] .brl-jnl-pl-input-label {
  font-size: 10px;
  color: #888;
  letter-spacing: 0.5px;
  min-width: 48px;
}

body[class*="page-id-"] .brl-jnl-pl-number {
  background: #0c0e13;
  border: 1px solid #1f2229;
  color: #fff;
  padding: 4px 8px;
  border-radius: 5px;
  font-size: 12px;
  font-family: inherit;
  font-variant-numeric: tabular-nums;
  width: 90px;
}
body[class*="page-id-"] .brl-jnl-pl-number:focus {
  outline: none;
  border-color: rgba(74, 114, 255, 0.4);
}


/* ---- Mini pick (checkbox pills for strategies / symbols / days) ---- */
body[class*="page-id-"] .brl-jnl-pl-mini-pick {
  flex: 1.5;
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  min-width: 0;
}

body[class*="page-id-"] .brl-jnl-pl-mini-pick label {
  display: inline-flex;
  align-items: center;
  font-size: 10.5px;
  padding: 3px 9px;
  border: 1px solid #1f2229;
  border-radius: 11px;
  cursor: pointer;
  color: #888;
  user-select: none;
  background: #0c0e13;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

body[class*="page-id-"] .brl-jnl-pl-mini-pick label:hover {
  border-color: #2a2d35;
  color: #ccc;
}

body[class*="page-id-"] .brl-jnl-pl-mini-pick input {
  display: none;
}

body[class*="page-id-"] .brl-jnl-pl-mini-pick label.is-checked {
  background: rgba(74, 114, 255, 0.15);
  border-color: rgba(74, 114, 255, 0.40);
  color: #fff;
}


/* ---- Footer with reset button ---- */
body[class*="page-id-"] .brl-jnl-pl-footer {
  display: flex;
  justify-content: flex-end;
  padding: 10px 0 32px;
}

body[class*="page-id-"] .brl-jnl-pl-reset {
  background: transparent;
  border: 1px solid #1f2229;
  color: #888;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 11.5px;
  cursor: pointer;
  font-family: inherit;
}

body[class*="page-id-"] .brl-jnl-pl-reset:hover {
  background: #1f2229;
  color: #ddd;
}


/* ====================================================================
   Responsive — mobile layout
   ==================================================================== */

@media (max-width: 768px) {
  body[class*="page-id-"] .brl-jnl-pl-summary {
    grid-template-columns: 1fr;
  }
  body[class*="page-id-"] .brl-jnl-pl-row {
    flex-wrap: wrap;
    gap: 8px;
  }
  body[class*="page-id-"] .brl-jnl-pl-label {
    flex: 1 1 calc(100% - 30px);
  }
  body[class*="page-id-"] .brl-jnl-pl-control,
  body[class*="page-id-"] .brl-jnl-pl-mini-pick {
    flex: 1 1 100%;
    margin-left: 28px;
  }
  body[class*="page-id-"] .brl-jnl-pl-chart-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
}

@media (max-width: 480px) {
  body[class*="page-id-"] .brl-jnl-pl-section {
    padding: 12px 12px;
  }
  body[class*="page-id-"] .brl-jnl-pl-control,
  body[class*="page-id-"] .brl-jnl-pl-mini-pick {
    margin-left: 0;
  }
  body[class*="page-id-"] .brl-jnl-pl-mini-pick label {
    font-size: 10px;
    padding: 3px 7px;
  }
}


/* ====================================================================
   v2.5.0 — Phase 3b: Filter Toolbar (Dashboard)

   Lives between the hero and the insights block. A collapsible panel
   with 9 filters, an "active filter" chip strip, a results counter,
   and a Clear-all button. Filter state syncs to URL params.
   ==================================================================== */

body[class*="page-id-"] .brl-jnl-fbar {
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 8px;
  padding: 10px 14px;
  margin: 0 0 14px;
}

body[class*="page-id-"] .brl-jnl-fbar-top {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-fbar-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  border: 1px solid #1f2229;
  color: #aaa;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

body[class*="page-id-"] .brl-jnl-fbar-toggle:hover {
  background: #1f2229;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-fbar-toggle.is-open {
  background: rgba(74, 114, 255, 0.15);
  border-color: rgba(74, 114, 255, 0.4);
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-fbar-count {
  background: rgba(74, 114, 255, 0.30);
  color: #fff;
  font-size: 10px;
  font-weight: 500;
  padding: 1px 6px;
  border-radius: 9px;
  margin-left: 4px;
  font-variant-numeric: tabular-nums;
}

body[class*="page-id-"] .brl-jnl-fbar-chips {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  flex: 1;
  min-width: 0;
}

body[class*="page-id-"] .brl-jnl-fbar-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(74, 114, 255, 0.15);
  border: 1px solid rgba(74, 114, 255, 0.4);
  color: #fff;
  padding: 3px 10px;
  border-radius: 11px;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  cursor: default;
  max-width: 220px;
}

body[class*="page-id-"] .brl-jnl-fbar-chip-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[class*="page-id-"] .brl-jnl-fbar-chip-x {
  cursor: pointer;
  opacity: 0.6;
  font-size: 14px;
  line-height: 1;
  background: none;
  border: none;
  color: inherit;
  padding: 0;
  font-family: inherit;
}

body[class*="page-id-"] .brl-jnl-fbar-chip-x:hover {
  opacity: 1;
}

body[class*="page-id-"] .brl-jnl-fbar-counter {
  font-size: 11px;
  color: #888;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  margin-left: auto;
}

body[class*="page-id-"] .brl-jnl-fbar-counter.is-filtered {
  color: #85b7eb;
}

body[class*="page-id-"] .brl-jnl-fbar-clear {
  background: transparent;
  border: 1px solid #1f2229;
  color: #888;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 11px;
  cursor: pointer;
  font-family: inherit;
}

body[class*="page-id-"] .brl-jnl-fbar-clear:hover {
  background: rgba(239, 68, 68, 0.12);
  border-color: rgba(239, 68, 68, 0.30);
  color: #fca5a5;
}

body[class*="page-id-"] .brl-jnl-fbar-panel[hidden] {
  display: none;
}

body[class*="page-id-"] .brl-jnl-fbar-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 14px 0 4px;
  margin-top: 10px;
  border-top: 1px solid #1f2229;
}

body[class*="page-id-"] .brl-jnl-fbar-grp {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

body[class*="page-id-"] .brl-jnl-fbar-grp-wide {
  grid-column: span 2;
}

body[class*="page-id-"] .brl-jnl-fbar-lbl {
  font-size: 9px;
  letter-spacing: 1px;
  color: #888;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-fbar-input {
  background: #0c0e13;
  border: 1px solid #1f2229;
  color: #fff;
  padding: 6px 10px;
  border-radius: 5px;
  font-size: 12px;
  font-family: inherit;
  font-variant-numeric: tabular-nums;
}

body[class*="page-id-"] .brl-jnl-fbar-input:focus {
  outline: none;
  border-color: rgba(74, 114, 255, 0.4);
}

body[class*="page-id-"] .brl-jnl-fbar-input::placeholder {
  color: #555;
}

body[class*="page-id-"] .brl-jnl-fbar-range {
  display: flex;
  gap: 6px;
}

body[class*="page-id-"] .brl-jnl-fbar-range .brl-jnl-fbar-input {
  flex: 1;
  min-width: 0;
  width: 100%;
}

body[class*="page-id-"] .brl-jnl-fbar-pills {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-fbar-pill {
  background: #0c0e13;
  border: 1px solid #1f2229;
  color: #888;
  padding: 4px 11px;
  border-radius: 11px;
  font-size: 11px;
  cursor: pointer;
  font-family: inherit;
  user-select: none;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

body[class*="page-id-"] .brl-jnl-fbar-pill:hover {
  background: #1f2229;
  color: #ccc;
}

body[class*="page-id-"] .brl-jnl-fbar-pill.is-on {
  background: rgba(74, 114, 255, 0.15);
  border-color: rgba(74, 114, 255, 0.40);
  color: #fff;
}

/* Subtle visual cue that hero numbers are filtered */
body[class*="page-id-"] .brl-jnl-hero.is-filtered .brl-jnl-hero-metric-value {
  border-bottom: 1px dashed rgba(74, 114, 255, 0.40);
  padding-bottom: 2px;
}

/* Trade rows that are filtered out */
body[class*="page-id-"] .brl-jnl-row.is-hidden {
  display: none;
}

/* Filtered-out trade table empty state */
body[class*="page-id-"] .brl-jnl-table-empty-msg {
  text-align: center;
  padding: 24px 16px;
  font-size: 12px;
  color: #888;
  background: #16181d;
  border: 1px dashed #1f2229;
  border-radius: 8px;
  margin: 8px 0;
}


/* Responsive ----------------------------------------------------------- */

@media (max-width: 900px) {
  body[class*="page-id-"] .brl-jnl-fbar-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  body[class*="page-id-"] .brl-jnl-fbar-top {
    gap: 8px;
  }
  body[class*="page-id-"] .brl-jnl-fbar-counter {
    width: 100%;
    margin-left: 0;
    order: 99;
  }
}

@media (max-width: 480px) {
  body[class*="page-id-"] .brl-jnl-fbar-panel {
    grid-template-columns: 1fr;
  }
  body[class*="page-id-"] .brl-jnl-fbar-grp-wide {
    grid-column: span 1;
  }
}


/* ---- Auto-refresh toggle (next to Refresh button) ---- */
body[class*="page-id-"] .brl-jnl-hero-auto {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 11px;
  border-radius: 8px;
  background: transparent;
  color: #aaa;
  border: 1px solid rgba(255, 255, 255, 0.15);
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
  font-family: inherit;
  margin-bottom: 1px;
  margin-right: 6px;
}

body[class*="page-id-"] .brl-jnl-hero-auto:hover {
  background: rgba(255, 255, 255, 0.05);
  color: #ddd;
}

body[class*="page-id-"] .brl-jnl-hero-auto.is-on {
  border-color: rgba(74, 222, 128, 0.30);
  color: #86efac;
}

body[class*="page-id-"] .brl-jnl-hero-auto.is-on:hover {
  background: rgba(74, 222, 128, 0.08);
}

body[class*="page-id-"] .brl-jnl-hero-auto-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #555;
  flex-shrink: 0;
  transition: background 0.12s ease, box-shadow 0.12s ease;
}

body[class*="page-id-"] .brl-jnl-hero-auto.is-on .brl-jnl-hero-auto-dot {
  background: #4ade80;
  box-shadow: 0 0 6px rgba(74, 222, 128, 0.6);
}

body[class*="page-id-"] .brl-jnl-hero-auto.is-on .brl-jnl-hero-auto-dot {
  animation: brl-jnl-auto-pulse 2s ease-in-out infinite;
}

@keyframes brl-jnl-auto-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.55; }
}

@media (max-width: 600px) {
  body[class*="page-id-"] .brl-jnl-hero-auto-label {
    display: none;
  }
  body[class*="page-id-"] .brl-jnl-hero-auto {
    padding: 8px 9px;
  }
}


/* ====================================================================
   v2.6.0 — Phase 5a-1: Prop Firm Tracker

   Lives at /my-journal/prop-firms/. Three tabs (Active / Passed /
   Failed), each rendering a stack of challenge cards. Each card has
   header (name + firm pill + status badge + meta), 3 number boxes
   (current balance / equity high / trades), 4 rule rows with
   progress bars, and action buttons (Edit / Mark passed / Mark
   failed / Delete). Modal editor used for both create and edit.
   ==================================================================== */


/* Tabs ----------------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  border-bottom: 1px solid #1f2229;
  margin: 0 0 14px;
  padding-bottom: 2px;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-pf-tab {
  background: transparent;
  border: none;
  color: #888;
  padding: 7px 12px;
  cursor: pointer;
  font-size: 12px;
  border-radius: 6px 6px 0 0;
  font-family: inherit;
  margin-bottom: -1px;
  border-bottom: 2px solid transparent;
  transition: color 0.12s, border-color 0.12s;
}

body[class*="page-id-"] .brl-jnl-pf-tab:hover {
  color: #ccc;
}

body[class*="page-id-"] .brl-jnl-pf-tab.is-on {
  color: #fff;
  border-bottom-color: #4a72ff;
}

body[class*="page-id-"] .brl-jnl-pf-tab-count {
  display: inline-block;
  background: #1f2229;
  color: #aaa;
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 9px;
  margin-left: 4px;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-pf-tab.is-on .brl-jnl-pf-tab-count {
  background: rgba(74, 114, 255, 0.2);
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-pf-new-btn {
  background: #fff;
  color: #0a0c10;
  border: none;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  margin-left: auto;
  transition: background 0.12s, transform 0.12s;
}

body[class*="page-id-"] .brl-jnl-pf-new-btn:hover {
  background: #f0f0f0;
  transform: translateY(-1px);
}


/* Panels --------------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-panel[hidden] {
  display: none;
}


/* Card ----------------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-card {
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 10px;
  padding: 16px 18px;
  margin-bottom: 12px;
}

body[class*="page-id-"] .brl-jnl-pf-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

body[class*="page-id-"] .brl-jnl-pf-card-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-pf-card-name {
  font-size: 15px;
  font-weight: 500;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-pf-card-firm {
  font-size: 11px;
  color: #aaa;
  padding: 2px 8px;
  border: 1px solid #1f2229;
  border-radius: 9px;
  background: #0c0e13;
}

body[class*="page-id-"] .brl-jnl-pf-card-meta {
  font-size: 11px;
  color: #888;
  margin-left: auto;
  font-variant-numeric: tabular-nums;
}


/* Badges --------------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-badge {
  font-size: 9px;
  letter-spacing: 1px;
  padding: 2px 8px;
  border-radius: 9px;
  font-weight: 500;
  text-transform: uppercase;
}

body[class*="page-id-"] .brl-jnl-pf-badge.is-active {
  background: rgba(74, 222, 128, 0.15);
  color: #86efac;
  border: 1px solid rgba(74, 222, 128, 0.3);
}

body[class*="page-id-"] .brl-jnl-pf-badge.is-warning {
  background: rgba(239, 158, 68, 0.15);
  color: #fcd34d;
  border: 1px solid rgba(239, 158, 68, 0.3);
}

body[class*="page-id-"] .brl-jnl-pf-badge.is-passed {
  background: rgba(74, 222, 128, 0.15);
  color: #86efac;
  border: 1px solid rgba(74, 222, 128, 0.3);
}

body[class*="page-id-"] .brl-jnl-pf-badge.is-failed {
  background: rgba(239, 68, 68, 0.15);
  color: #fca5a5;
  border: 1px solid rgba(239, 68, 68, 0.3);
}


/* Number boxes --------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-nums {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}

body[class*="page-id-"] .brl-jnl-pf-num {
  background: #0c0e13;
  border: 1px solid #1f2229;
  border-radius: 7px;
  padding: 10px 12px;
}

body[class*="page-id-"] .brl-jnl-pf-num-lbl {
  font-size: 9px;
  letter-spacing: 1px;
  color: #888;
  margin-bottom: 4px;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-pf-num-val {
  font-size: 17px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-pf-num-val.is-pos {
  color: #86efac;
}

body[class*="page-id-"] .brl-jnl-pf-num-val.is-neg {
  color: #fca5a5;
}

body[class*="page-id-"] .brl-jnl-pf-num-sub {
  font-size: 10px;
  color: #888;
  margin-top: 2px;
  font-variant-numeric: tabular-nums;
}


/* Rules ---------------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-rules {
  margin-bottom: 4px;
}

body[class*="page-id-"] .brl-jnl-pf-rule {
  padding: 10px 12px;
  border-top: 1px solid #1f2229;
}

body[class*="page-id-"] .brl-jnl-pf-rule:first-of-type {
  border-top: none;
  padding-top: 4px;
}

body[class*="page-id-"] .brl-jnl-pf-rule-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

body[class*="page-id-"] .brl-jnl-pf-rule-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 500;
  flex-shrink: 0;
}

body[class*="page-id-"] .brl-jnl-pf-rule-icon.is-ok {
  background: rgba(74, 222, 128, 0.15);
  color: #86efac;
}

body[class*="page-id-"] .brl-jnl-pf-rule-icon.is-warn {
  background: rgba(239, 158, 68, 0.15);
  color: #fcd34d;
}

body[class*="page-id-"] .brl-jnl-pf-rule-icon.is-bad {
  background: rgba(239, 68, 68, 0.15);
  color: #fca5a5;
}

body[class*="page-id-"] .brl-jnl-pf-rule-icon.is-pending {
  background: #1f2229;
  color: #888;
}

body[class*="page-id-"] .brl-jnl-pf-rule-name {
  font-size: 12px;
  color: #ddd;
  flex: 1;
  min-width: 0;
}

body[class*="page-id-"] .brl-jnl-pf-rule-name strong {
  font-weight: 500;
  color: #fff;
  display: block;
}

body[class*="page-id-"] .brl-jnl-pf-rule-detail {
  display: block;
  font-size: 10.5px;
  color: #888;
  margin-top: 2px;
}

body[class*="page-id-"] .brl-jnl-pf-rule-val {
  font-size: 11.5px;
  color: #aaa;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}


/* Progress bars -------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-bar {
  height: 5px;
  background: #0c0e13;
  border-radius: 3px;
  overflow: hidden;
  margin-top: 6px;
  margin-left: 32px;
}

body[class*="page-id-"] .brl-jnl-pf-bar-fill {
  height: 100%;
  transition: width 0.3s ease;
  border-radius: 3px;
}

body[class*="page-id-"] .brl-jnl-pf-bar-fill.is-ok {
  background: #4ade80;
}

body[class*="page-id-"] .brl-jnl-pf-bar-fill.is-warn {
  background: #ef9e44;
}

body[class*="page-id-"] .brl-jnl-pf-bar-fill.is-bad {
  background: #ef4444;
}

body[class*="page-id-"] .brl-jnl-pf-bar-fill.is-pending {
  background: #555;
}


/* Card actions --------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-card-actions {
  display: flex;
  gap: 6px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #1f2229;
  flex-wrap: wrap;
}

body[class*="page-id-"] .brl-jnl-pf-act {
  background: transparent;
  border: 1px solid #1f2229;
  color: #aaa;
  padding: 4px 10px;
  border-radius: 5px;
  font-size: 11px;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}

body[class*="page-id-"] .brl-jnl-pf-act:hover {
  background: #1f2229;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-pf-act.is-danger:hover {
  background: rgba(239, 68, 68, 0.15);
  color: #fca5a5;
  border-color: rgba(239, 68, 68, 0.3);
}


/* Editor modal --------------------------------------------------------- */

body[class*="page-id-"] .brl-jnl-pf-editor {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

body[class*="page-id-"] .brl-jnl-pf-editor[hidden] {
  display: none;
}

body[class*="page-id-"] .brl-jnl-pf-editor-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

body[class*="page-id-"] .brl-jnl-pf-editor-card {
  position: relative;
  background: #16181d;
  border: 1px solid #1f2229;
  border-radius: 12px;
  width: 540px;
  max-width: 92vw;
  max-height: 92vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

body[class*="page-id-"] .brl-jnl-pf-editor-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #1f2229;
  flex-shrink: 0;
}

body[class*="page-id-"] .brl-jnl-pf-editor-title {
  font-size: 16px;
  font-weight: 500;
  margin: 0;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-pf-editor-close {
  background: transparent;
  border: none;
  color: #888;
  font-size: 22px;
  padding: 0 6px;
  line-height: 1;
  cursor: pointer;
  font-family: inherit;
  transition: color 0.12s;
}

body[class*="page-id-"] .brl-jnl-pf-editor-close:hover {
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-pf-editor-body {
  padding: 16px 20px;
  overflow-y: auto;
  flex: 1;
}

body[class*="page-id-"] .brl-jnl-pf-editor-row {
  margin-bottom: 12px;
}

body[class*="page-id-"] .brl-jnl-pf-editor-lbl {
  display: block;
  font-size: 9px;
  letter-spacing: 1px;
  color: #888;
  margin-bottom: 5px;
  font-weight: 500;
}

body[class*="page-id-"] .brl-jnl-pf-editor-input {
  width: 100%;
  background: #0c0e13;
  border: 1px solid #1f2229;
  color: #fff;
  padding: 7px 11px;
  border-radius: 6px;
  font-size: 13px;
  font-family: inherit;
  font-variant-numeric: tabular-nums;
  box-sizing: border-box;
}

body[class*="page-id-"] .brl-jnl-pf-editor-input:focus {
  outline: none;
  border-color: rgba(74, 114, 255, 0.4);
}

body[class*="page-id-"] .brl-jnl-pf-editor-input::placeholder {
  color: #555;
}

body[class*="page-id-"] select.brl-jnl-pf-editor-input {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none' stroke='%23888' stroke-width='1.5'><path d='M1 1l4 4 4-4'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 28px;
}

body[class*="page-id-"] .brl-jnl-pf-editor-grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

body[class*="page-id-"] .brl-jnl-pf-editor-grid2 .brl-jnl-pf-editor-row {
  margin-bottom: 0;
}

body[class*="page-id-"] .brl-jnl-pf-editor-section {
  font-size: 9px;
  letter-spacing: 1px;
  color: #4a72ff;
  margin: 16px 0 8px;
  border-top: 1px solid #1f2229;
  padding-top: 12px;
  font-weight: 500;
  text-transform: uppercase;
}

body[class*="page-id-"] .brl-jnl-pf-editor-hint {
  font-size: 11px;
  color: #888;
  margin: 8px 0 0;
  line-height: 1.5;
}

body[class*="page-id-"] .brl-jnl-pf-editor-foot {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  align-items: center;
  padding: 12px 20px;
  border-top: 1px solid #1f2229;
  flex-shrink: 0;
}

body[class*="page-id-"] .brl-jnl-pf-editor-status {
  flex: 1;
  font-size: 11px;
  color: #888;
}

body[class*="page-id-"] .brl-jnl-pf-editor-status.is-error {
  color: #fca5a5;
}

body[class*="page-id-"] .brl-jnl-pf-editor-status.is-ok {
  color: #86efac;
}

body[class*="page-id-"] .brl-jnl-pf-editor-cancel {
  background: transparent;
  border: 1px solid #1f2229;
  color: #aaa;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.12s, color 0.12s;
}

body[class*="page-id-"] .brl-jnl-pf-editor-cancel:hover {
  background: #1f2229;
  color: #fff;
}

body[class*="page-id-"] .brl-jnl-pf-editor-save {
  background: #fff;
  color: #0a0c10;
  border: none;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.12s, transform 0.12s;
}

body[class*="page-id-"] .brl-jnl-pf-editor-save:hover {
  background: #f0f0f0;
  transform: translateY(-1px);
}

body[class*="page-id-"] .brl-jnl-pf-editor-save:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}


/* Responsive ----------------------------------------------------------- */

@media (max-width: 768px) {
  body[class*="page-id-"] .brl-jnl-pf-nums {
    grid-template-columns: 1fr;
  }
  body[class*="page-id-"] .brl-jnl-pf-card-meta {
    width: 100%;
    margin-left: 0;
    margin-top: 4px;
  }
  body[class*="page-id-"] .brl-jnl-pf-card-head {
    gap: 6px;
  }
}

@media (max-width: 480px) {
  body[class*="page-id-"] .brl-jnl-pf-editor {
    padding: 0;
  }
  body[class*="page-id-"] .brl-jnl-pf-editor-card {
    width: 100%;
    max-width: 100%;
    max-height: 100vh;
    border-radius: 0;
  }
  body[class*="page-id-"] .brl-jnl-pf-editor-grid2 {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  body[class*="page-id-"] .brl-jnl-pf-tabs {
    overflow-x: auto;
  }
  body[class*="page-id-"] .brl-jnl-pf-new-btn {
    margin-left: 0;
    margin-top: 4px;
    width: 100%;
  }
  body[class*="page-id-"] .brl-jnl-pf-bar {
    margin-left: 0;
  }
  body[class*="page-id-"] .brl-jnl-pf-rule-val {
    font-size: 11px;
  }
}

/* ============================================================
   Phase 5a-2 — Prop Firms toggle row (weekend hold)
   v2.7.0
   ============================================================ */

.brl-jnl-pf-editor-row-toggle {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.brl-jnl-pf-editor-row-toggle .brl-jnl-pf-editor-lbl {
  margin: 0;
  flex: 1;
}

.brl-jnl-pf-editor-toggle {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
  flex-shrink: 0;
  cursor: pointer;
}

.brl-jnl-pf-editor-toggle input {
  opacity: 0;
  width: 0;
  height: 0;
}

.brl-jnl-pf-editor-toggle span {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 999px;
  transition: background .18s ease, border-color .18s ease;
}

.brl-jnl-pf-editor-toggle span::before {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  background: #d4d4d8;
  border-radius: 50%;
  transition: transform .18s ease, background .18s ease;
}

.brl-jnl-pf-editor-toggle input:checked + span {
  background: rgba(110, 168, 254, 0.32);
  border-color: rgba(110, 168, 254, 0.6);
}

.brl-jnl-pf-editor-toggle input:checked + span::before {
  transform: translateX(20px);
  background: #6ea8fe;
}

@media (max-width: 640px) {
  .brl-jnl-pf-editor-row-toggle {
    flex-direction: row;
    align-items: center;
  }
}


/* ===========================================================================
   BLOOMBERG PRO OVERRIDES — v2.8.0
   ---------------------------------------------------------------------------
   Targeted re-skin of the existing UI to a navy + electric-cyan, dense, mono-
   numbers "trading terminal" aesthetic. No HTML changes; every existing class
   continues to work. Remove this block to revert to the original look.
   =========================================================================== */

/* --- Universal: numbers in JetBrains Mono, sharper edges --- */
.brl-jnl-stat-value,
.brl-jnl-hero-metric-value,
.brl-jnl-cal-cell-pnl,
.brl-jnl-cal-cell-date,
.brl-jnl-bd-bar-value,
.brl-jnl-bd-bar-meta,
.brl-jnl-bd-hour-num,
.brl-jnl-pf-num-val,
.brl-jnl-pl-stat-new,
.brl-jnl-pl-stat-orig,
.brl-jnl-pl-stat-delta,
.brl-jnl-sp-stat-value,
.brl-jnl-equity-axis,
.brl-jnl-compare-side-pnl,
.brl-jnl-compare-row-value,
.brl-jnl-fbar-count,
.brl-jnl-fbar-counter,
.brl-jnl-spark,
.brl-jnl-table td,
.brl-jnl-table th {
    font-family: var(--mono) !important;
    font-variant-numeric: tabular-nums !important;
    letter-spacing: 0 !important;
}

/* --- Brand bg: subtle grid pattern under the dark navy --- */
.brl-jnl {
    background:
        linear-gradient(0deg, rgba(0,212,255,0.015) 1px, transparent 1px) 0 0/24px 24px,
        linear-gradient(90deg, rgba(0,212,255,0.015) 1px, transparent 1px) 0 0/24px 24px,
        var(--bg) !important;
}

/* --- Selection color = cyan --- */
.brl-jnl ::selection { background: var(--cyan-glow); color: var(--accent); }

/* --- Pos / Neg / Accent recolor on cards & values --- */
.brl-jnl-stat-value.pos,
.brl-jnl-hero-metric-value.pos,
.brl-jnl-cal-cell-pnl.pos,
.brl-jnl-pf-num-val.is-pos,
.brl-jnl-sp-stat-value.is-pos,
.brl-jnl-pl-stat-new.is-pos,
.brl-jnl-pl-stat-delta.is-pos,
.brl-jnl-bd-bar-fill.is-pos,
.brl-jnl-compare-side-pnl.is-pos,
.brl-jnl-table-cell-pnl.is-pos,
.pos { color: var(--pos) !important; }

.brl-jnl-stat-value.neg,
.brl-jnl-hero-metric-value.neg,
.brl-jnl-cal-cell-pnl.neg,
.brl-jnl-pf-num-val.is-neg,
.brl-jnl-sp-stat-value.is-neg,
.brl-jnl-pl-stat-new.is-neg,
.brl-jnl-pl-stat-delta.is-neg,
.brl-jnl-bd-bar-fill.is-neg,
.brl-jnl-compare-side-pnl.is-neg,
.brl-jnl-table-cell-pnl.is-neg,
.neg { color: var(--neg) !important; }

/* --- Sharp borders, smaller radii, harder shadows --- */
.brl-jnl-stat,
.brl-jnl-equity,
.brl-jnl-equity-empty,
.brl-jnl-filters,
.brl-jnl-bd-panel,
.brl-jnl-bd-table,
.brl-jnl-table-wrap,
.brl-jnl-table,
.brl-jnl-cal-wrap,
.brl-jnl-cal-grid,
.brl-jnl-section,
.brl-jnl-ef-card,
.brl-jnl-sp-card,
.brl-jnl-pf-card,
.brl-jnl-pf-panel,
.brl-jnl-pl-chart,
.brl-jnl-pl-section,
.brl-jnl-pl-summary > *,
.brl-jnl-diary-card,
.brl-jnl-compare-side,
.brl-jnl-compare-grid,
.brl-jnl-modal-card,
.brl-jnl-pf-editor-card,
.brl-jnl-diary-editor-card {
    border-radius: 4px !important;
    border-color: var(--border) !important;
    background: var(--card) !important;
    box-shadow: none !important;
}

/* --- Card stripe accent on the left edge (Bloomberg signature) --- */
.brl-jnl-stat,
.brl-jnl-ef-card,
.brl-jnl-sp-card,
.brl-jnl-pf-card,
.brl-jnl-diary-card,
.brl-jnl-compare-side {
    position: relative;
    overflow: hidden;
}
.brl-jnl-stat::before,
.brl-jnl-sp-card::before,
.brl-jnl-pf-card::before,
.brl-jnl-diary-card::before,
.brl-jnl-compare-side::before {
    content: ""; position: absolute; top: 0; bottom: 0; left: 0;
    width: 3px; background: var(--accent); opacity: 0.55;
    transition: opacity 120ms;
}
.brl-jnl-stat:hover::before,
.brl-jnl-sp-card:hover::before,
.brl-jnl-pf-card:hover::before { opacity: 1; box-shadow: 0 0 6px var(--accent); }

/* --- Hero strip: dense 6-up metric grid feel --- */
.brl-jnl-hero {
    background: linear-gradient(180deg, var(--card-2), var(--card)) !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
    padding: 20px 22px !important;
    box-shadow: none !important;
    position: relative;
}
.brl-jnl-hero::after {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, var(--accent), transparent 60%);
    opacity: 0.5;
}
.brl-jnl-hero-bg { background: none !important; opacity: 0 !important; }
.brl-jnl-hero-title {
    font-family: var(--mono) !important;
    font-size: 22px !important; font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    text-transform: uppercase;
    color: var(--text) !important;
}
.brl-jnl-hero-eyebrow {
    color: var(--accent) !important;
    font-size: 10px !important; font-weight: 700 !important;
    letter-spacing: 0.14em !important; text-transform: uppercase !important;
}
.brl-jnl-hero-tagline {
    color: var(--muted) !important; font-size: 11px !important;
    letter-spacing: 0.04em !important;
}
.brl-jnl-hero-divider { background: var(--border) !important; }
.brl-jnl-hero-metric-label {
    color: var(--muted) !important;
    font-size: 9.5px !important; font-weight: 700 !important;
    letter-spacing: 0.12em !important; text-transform: uppercase !important;
}
.brl-jnl-hero-metric-value { font-weight: 600 !important; }
.brl-jnl-live-dot {
    background: var(--accent) !important;
    box-shadow: 0 0 6px var(--accent) !important;
}

/* --- Hero refresh + auto buttons: cyan outline --- */
.brl-jnl-hero-refresh,
.brl-jnl-hero-auto,
.brl-jnl-btn-export,
.brl-jnl-refresh-btn {
    background: var(--bg) !important;
    border: 1px solid var(--border-strong) !important;
    color: var(--muted) !important;
    border-radius: 3px !important;
    font-size: 11px !important; font-weight: 700 !important;
    letter-spacing: 0.06em !important; text-transform: uppercase !important;
    transition: all 100ms !important;
}
.brl-jnl-hero-refresh:hover,
.brl-jnl-hero-auto:hover,
.brl-jnl-btn-export:hover,
.brl-jnl-refresh-btn:hover {
    color: var(--accent) !important;
    border-color: var(--accent) !important;
    background: var(--cyan-glow) !important;
}
.brl-jnl-hero-auto.is-on { color: var(--accent) !important; border-color: var(--accent) !important; }
.brl-jnl-hero-auto-dot { background: var(--accent) !important; box-shadow: 0 0 4px var(--accent) !important; }

/* --- Stat tiles: dense, sharp --- */
.brl-jnl-stats { gap: 8px !important; }
.brl-jnl-stat { padding: 14px 16px 14px 20px !important; }
.brl-jnl-stat-label {
    font-size: 9.5px !important; font-weight: 700 !important;
    letter-spacing: 0.12em !important;
    color: var(--muted) !important;
}
.brl-jnl-stat-value { font-size: 20px !important; font-weight: 600 !important; }
.brl-jnl-stat-sub { font-size: 10.5px !important; color: var(--muted) !important; }

/* --- Section titles in uppercase mono --- */
.brl-jnl-section-title,
.brl-jnl-pl-section-title,
.brl-jnl-pf-editor-section {
    font-family: var(--mono) !important;
    font-size: 11px !important; font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: var(--text) !important;
    display: inline-flex; align-items: center; gap: 8px;
}
.brl-jnl-section-title::before,
.brl-jnl-pl-section-title::before {
    content: ""; width: 3px; height: 11px; background: var(--accent); border-radius: 1px;
    box-shadow: 0 0 6px var(--accent);
}
.brl-jnl-section { padding: 16px 18px !important; }
.brl-jnl-page-eyebrow {
    color: var(--accent) !important;
    font-size: 10px !important; font-weight: 700 !important;
    letter-spacing: 0.14em !important;
}
.brl-jnl-page-title {
    font-family: var(--mono) !important;
    font-size: 24px !important; font-weight: 700 !important;
    letter-spacing: -0.01em !important;
}

/* --- Equity curve: cyan with glow + harder grid --- */
.brl-jnl-equity-svg .brl-jnl-equity-line,
.brl-jnl-equity-line { stroke: var(--accent) !important; stroke-width: 1.5 !important;
    filter: drop-shadow(0 0 3px var(--cyan-glow)); }
.brl-jnl-equity-svg.pos .brl-jnl-equity-line { stroke: var(--pos) !important;
    filter: drop-shadow(0 0 3px rgba(0,255,156,0.4)); }
.brl-jnl-equity-svg.neg .brl-jnl-equity-line { stroke: var(--neg) !important;
    filter: drop-shadow(0 0 3px rgba(255,71,87,0.4)); }
.brl-jnl-equity-grid { stroke: var(--border) !important; stroke-dasharray: 2 3 !important; }
.brl-jnl-equity-grid.zero { stroke: var(--border-strong) !important; }
.brl-jnl-equity-dot.pos { fill: var(--card) !important; stroke: var(--pos) !important; }
.brl-jnl-equity-dot.neg { fill: var(--card) !important; stroke: var(--neg) !important; }
.brl-jnl-equity-axis { fill: var(--muted) !important; font-size: 9px !important; }
.brl-jnl-spark-line { stroke: var(--accent) !important; }
.brl-jnl-spark-area { fill: var(--accent) !important; opacity: 0.10 !important; }

/* --- Breakdown bars: cyan/green/red diverging --- */
.brl-jnl-bd-head { border-bottom: 1px solid var(--border) !important; background: var(--bg) !important; }
.brl-jnl-bd-tabs { display: flex !important; gap: 0 !important; padding: 0 !important; background: transparent !important; }
.brl-jnl-bd-tab {
    flex: 1 !important;
    background: var(--bg) !important;
    color: var(--muted) !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    padding: 9px 6px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; font-weight: 700 !important;
    letter-spacing: 0.08em !important; text-transform: uppercase !important;
    cursor: pointer; transition: all 100ms !important;
}
.brl-jnl-bd-tab:hover { color: var(--accent) !important; background: var(--cyan-glow) !important; }
.brl-jnl-bd-tab.is-active,
.brl-jnl-bd-tab[aria-selected="true"] {
    color: var(--accent) !important;
    border-bottom-color: var(--accent) !important;
    background: var(--card) !important;
}
.brl-jnl-bd-panel { padding: 10px 12px !important; }
.brl-jnl-bd-bar-fill { box-shadow: 0 0 4px currentColor !important; }
.brl-jnl-bd-bar-fill.is-pos { background: var(--pos) !important; }
.brl-jnl-bd-bar-fill.is-neg { background: var(--neg) !important; }
.brl-jnl-bd-bar-track { background: var(--bg) !important; }
.brl-jnl-bd-bar-label { font-family: 'Inter',sans-serif !important; font-weight: 600 !important; color: var(--text) !important; }

/* --- Trades table --- */
.brl-jnl-table-wrap { overflow-x: auto !important; }
.brl-jnl-table { width: 100% !important; border-collapse: collapse !important; }
.brl-jnl-table th {
    background: var(--bg) !important;
    border-bottom: 1px solid var(--border-strong) !important;
    color: var(--muted) !important;
    font-family: 'Inter',sans-serif !important;
    font-size: 9.5px !important; font-weight: 700 !important;
    letter-spacing: 0.12em !important; text-transform: uppercase !important;
    padding: 8px 12px !important;
}
.brl-jnl-table td {
    padding: 7px 12px !important;
    font-size: 11.5px !important;
    border-bottom: 1px dotted var(--border) !important;
}
.brl-jnl-table tbody tr:hover td { background: var(--bg) !important; }
.brl-jnl-table .brl-jnl-side { font-weight: 700 !important; letter-spacing: 0.04em; }

/* --- Calendar heatmap: cyan-tinted gradient --- */
.brl-jnl-cal-cell { border-radius: 2px !important; transition: all 80ms !important; }
.brl-jnl-cal-cell:hover { outline: 1px solid var(--accent) !important; outline-offset: 1px !important; z-index: 2 !important; }
.brl-jnl-cal-cell-empty { background: var(--card-2) !important; }
.brl-jnl-cal-cell-active { outline: 2px solid var(--accent) !important; }
.brl-jnl-cal-cell-pnl.pos { color: var(--pos) !important; }
.brl-jnl-cal-cell-pnl.neg { color: var(--neg) !important; }
.brl-jnl-cal-header { color: var(--muted) !important; font-family: var(--mono) !important; font-size: 10px !important; }
.brl-jnl-legend-cell.pos { background: var(--pos) !important; }
.brl-jnl-legend-cell.neg { background: var(--neg) !important; }

/* --- Sidebar (sb) — Bloomberg sharp + cyan accent --- */
.brl-jnl-sb {
    background: var(--bg) !important;
    border-right: 1px solid var(--border) !important;
}
.brl-jnl-sb-section-title {
    font-family: 'Inter',sans-serif !important;
    color: var(--muted) !important;
    font-size: 9.5px !important; font-weight: 700 !important;
    letter-spacing: 0.14em !important; text-transform: uppercase !important;
    padding: 14px 14px 6px !important;
}
.brl-jnl-sb-item {
    border-radius: 3px !important;
    border-left: 2px solid transparent !important;
    padding: 7px 10px !important;
    font-size: 12.5px !important; font-weight: 600 !important;
    color: var(--muted) !important;
    transition: background 80ms !important;
}
.brl-jnl-sb-item:hover {
    background: var(--card) !important;
    color: var(--text) !important;
}
.brl-jnl-sb-item.is-active {
    background: var(--card-2) !important;
    color: var(--accent) !important;
    border-left-color: var(--accent) !important;
    box-shadow: inset 0 0 0 1px var(--border) !important;
}
.brl-jnl-sb-icon { color: inherit !important; opacity: 0.85; }
.brl-jnl-sb-badge,
.brl-jnl-sb-badge-new {
    background: var(--cyan-glow) !important;
    color: var(--accent) !important;
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 9px !important; font-weight: 700 !important;
    letter-spacing: 0.06em !important;
    padding: 1px 5px !important;
}
.brl-jnl-sb-badge-p2,
.brl-jnl-sb-badge-p3,
.brl-jnl-sb-badge-p4 {
    background: var(--bg) !important;
    color: var(--muted) !important;
    border: 1px solid var(--border) !important;
}
.brl-jnl-sb-expert {
    background: var(--card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 3px !important;
    padding: 10px 12px !important;
    font-size: 11px !important;
}
.brl-jnl-sb-expert-head { color: var(--pos) !important; font-family: var(--mono) !important;
    font-size: 10.5px !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; }
.brl-jnl-sb-dot { background: var(--pos) !important; box-shadow: 0 0 6px var(--pos) !important; }
.brl-jnl-sb-expert-sub { color: var(--muted) !important; font-size: 10.5px !important; font-family: var(--mono) !important; }

/* --- Insights — vertical severity stripe + dense layout --- */
.brl-jnl-insights {
    background: var(--card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
    overflow: hidden;
}
.brl-jnl-ins-list { display: flex !important; flex-direction: column; }
.brl-jnl-ins-icon {
    background: var(--cyan-glow) !important;
    color: var(--accent) !important;
    border-radius: 2px !important;
    width: 32px !important; height: 32px !important;
}
.brl-jnl-ins-danger .brl-jnl-ins-icon { background: var(--neg-soft) !important; color: var(--neg) !important; }
.brl-jnl-ins-warning .brl-jnl-ins-icon { background: var(--amber-soft) !important; color: var(--amber) !important; }
.brl-jnl-ins-healthy .brl-jnl-ins-icon { background: var(--pos-soft) !important; color: var(--pos) !important; }
.brl-jnl-ins-dot-danger { background: var(--neg) !important; box-shadow: 0 0 4px var(--neg); }
.brl-jnl-ins-dot-warning { background: var(--amber) !important; box-shadow: 0 0 4px var(--amber); }
.brl-jnl-ins-dot-healthy { background: var(--pos) !important; box-shadow: 0 0 4px var(--pos); }
.brl-jnl-ins-title { color: var(--text) !important; font-weight: 600 !important; }
.brl-jnl-ins-sub,
.brl-jnl-ins-body { color: var(--muted) !important; font-size: 11.5px !important; }

/* --- Edge Finder Pro cards --- */
.brl-jnl-ef-card { padding: 14px 16px !important; }
.brl-jnl-ef-tag {
    font-family: var(--mono) !important;
    color: var(--accent) !important;
    font-size: 9.5px !important; font-weight: 700 !important;
    letter-spacing: 0.12em !important;
}
.brl-jnl-ef-title { color: var(--text) !important; font-weight: 600 !important; }
.brl-jnl-ef-text { color: var(--muted) !important; font-size: 12px !important; }
.brl-jnl-ef-card.is-danger { border-left: 3px solid var(--neg) !important; }
.brl-jnl-ef-card.is-warning { border-left: 3px solid var(--amber) !important; }
.brl-jnl-ef-card.is-healthy { border-left: 3px solid var(--pos) !important; }
.brl-jnl-ef-card.is-info { border-left: 3px solid var(--accent) !important; }
.brl-jnl-ef-pill {
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 10px !important; font-weight: 700 !important;
    letter-spacing: 0.08em !important; text-transform: uppercase !important;
    padding: 3px 7px !important;
}
.brl-jnl-ef-pill.is-danger { background: var(--neg-soft) !important; color: var(--neg) !important; }
.brl-jnl-ef-pill.is-warning { background: var(--amber-soft) !important; color: var(--amber) !important; }
.brl-jnl-ef-pill.is-healthy { background: var(--pos-soft) !important; color: var(--pos) !important; }

/* --- Setup Playbook cards --- */
.brl-jnl-sp-grid { gap: 10px !important; }
.brl-jnl-sp-name { font-family: 'Inter',sans-serif !important; font-weight: 700 !important;
    color: var(--text) !important; letter-spacing: -0.01em; }
.brl-jnl-sp-trades { color: var(--muted) !important; font-family: var(--mono) !important; font-size: 10.5px !important; }
.brl-jnl-sp-stat-label { color: var(--muted) !important; font-size: 9.5px !important;
    font-weight: 700 !important; letter-spacing: 0.12em !important; }
.brl-jnl-sp-rules-label { color: var(--accent) !important; font-family: var(--mono) !important;
    font-size: 9.5px !important; letter-spacing: 0.12em !important; }
.brl-jnl-sp-rules-input {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
    font-family: var(--mono) !important;
    font-size: 12px !important;
}
.brl-jnl-sp-rules-input:focus { border-color: var(--accent) !important; outline: none !important; box-shadow: 0 0 0 2px var(--cyan-glow) !important; }
.brl-jnl-sp-rules-save {
    background: var(--cyan-glow) !important;
    color: var(--accent) !important;
    border: 1px solid var(--accent) !important;
    border-radius: 3px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; font-weight: 700 !important;
    letter-spacing: 0.08em !important; text-transform: uppercase !important;
}

/* --- Diary cards & editor --- */
.brl-jnl-diary-card { padding: 14px 16px !important; }
.brl-jnl-diary-card-date-main { color: var(--text) !important; font-family: var(--mono) !important;
    font-size: 16px !important; font-weight: 700 !important; }
.brl-jnl-diary-card-day { color: var(--muted) !important; font-family: var(--mono) !important;
    font-size: 10.5px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; }
.brl-jnl-diary-field-label { color: var(--accent) !important; font-family: var(--mono) !important;
    font-size: 9.5px !important; letter-spacing: 0.12em !important; }
.brl-jnl-diary-field-text { color: var(--text) !important; font-size: 12.5px !important; line-height: 1.55 !important; }
.brl-jnl-diary-trade-pill {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
    color: var(--text) !important;
}
.brl-jnl-diary-trade-pill.is-pos { color: var(--pos) !important; border-color: rgba(0,255,156,0.3) !important; }
.brl-jnl-diary-trade-pill.is-neg { color: var(--neg) !important; border-color: rgba(255,71,87,0.3) !important; }
.brl-jnl-diary-new-btn,
.brl-jnl-strat-new-btn,
.brl-jnl-pf-new-btn,
.brl-jnl-diary-editor-save,
.brl-jnl-pf-editor-save,
.brl-jnl-strat-create {
    background: var(--accent) !important;
    color: var(--bg) !important;
    border: 1px solid var(--accent) !important;
    border-radius: 3px !important;
    font-family: var(--mono) !important;
    font-size: 11px !important; font-weight: 700 !important;
    letter-spacing: 0.08em !important; text-transform: uppercase !important;
    padding: 7px 14px !important;
    box-shadow: 0 0 12px rgba(0,212,255,0.25) !important;
}
.brl-jnl-diary-new-btn:hover,
.brl-jnl-strat-new-btn:hover,
.brl-jnl-pf-new-btn:hover,
.brl-jnl-diary-editor-save:hover,
.brl-jnl-pf-editor-save:hover,
.brl-jnl-strat-create:hover { background: #33dfff !important; }
.brl-jnl-diary-search {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
    font-family: 'Inter',sans-serif !important;
}
.brl-jnl-diary-search:focus { border-color: var(--accent) !important; outline: none !important; box-shadow: 0 0 0 2px var(--cyan-glow) !important; }
.brl-jnl-diary-editor-input,
.brl-jnl-diary-editor-textarea,
.brl-jnl-pf-editor-input {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
    font-family: 'Inter',sans-serif !important;
}
.brl-jnl-diary-editor-input:focus,
.brl-jnl-diary-editor-textarea:focus,
.brl-jnl-pf-editor-input:focus { border-color: var(--accent) !important; outline: none !important; box-shadow: 0 0 0 2px var(--cyan-glow) !important; }

/* --- Compare --- */
.brl-jnl-compare-grid { background: var(--card) !important; }
.brl-jnl-compare-side { padding: 14px 16px !important; }
.brl-jnl-compare-side-name { color: var(--text) !important; font-family: 'Inter',sans-serif !important;
    font-weight: 700 !important; letter-spacing: -0.01em; }
.brl-jnl-compare-side-sub { color: var(--muted) !important; font-size: 11px !important; }
.brl-jnl-compare-side-pnl { font-size: 22px !important; font-weight: 600 !important; }
.brl-jnl-compare-label { color: var(--muted) !important; font-family: var(--mono) !important;
    font-size: 9.5px !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; }
.brl-jnl-compare-select {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
}
.brl-jnl-compare-winner-badge {
    background: var(--cyan-glow) !important;
    color: var(--accent) !important;
    border: 1px solid var(--accent) !important;
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 9.5px !important; font-weight: 700 !important; letter-spacing: 0.08em !important;
}
.brl-jnl-compare-delta {
    background: var(--card-2) !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
    padding: 12px 14px !important;
}
.brl-jnl-compare-delta-eyebrow { color: var(--accent) !important; font-family: var(--mono) !important; }

/* --- Performance Lab --- */
.brl-jnl-pl-section { padding: 14px 16px !important; }
.brl-jnl-pl-summary > * { padding: 14px 16px !important; }
.brl-jnl-pl-stat-label { color: var(--muted) !important; font-size: 9.5px !important;
    font-weight: 700 !important; letter-spacing: 0.12em !important; }
.brl-jnl-pl-stat-orig { color: var(--muted) !important; font-family: var(--mono) !important; font-size: 11px !important; }
.brl-jnl-pl-stat-new { font-size: 22px !important; font-weight: 600 !important; color: var(--text) !important; }
.brl-jnl-pl-stat-delta { font-family: var(--mono) !important; font-size: 11px !important; }
.brl-jnl-pl-chart-label { color: var(--accent) !important; font-family: var(--mono) !important;
    font-size: 9.5px !important; letter-spacing: 0.12em !important; }
.brl-jnl-pl-section-title {
    color: var(--accent) !important;
    border-bottom: 1px solid var(--border) !important;
    padding-bottom: 8px !important;
}
.brl-jnl-pl-label { color: var(--text) !important; font-size: 12.5px !important; }
.brl-jnl-pl-sublabel { color: var(--muted) !important; font-size: 11px !important; }
.brl-jnl-pl-slider { accent-color: var(--accent) !important; }
.brl-jnl-pl-check { accent-color: var(--accent) !important; }
.brl-jnl-pl-number {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
    font-family: var(--mono) !important;
}
.brl-jnl-pl-reset {
    background: transparent !important;
    border: 1px solid var(--border-strong) !important;
    color: var(--muted) !important;
    border-radius: 3px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important;
}
.brl-jnl-pl-reset:hover { color: var(--neg) !important; border-color: var(--neg) !important; }
.brl-jnl-pl-mini-pick label {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
    color: var(--text) !important;
}

/* --- Prop Firms cards --- */
.brl-jnl-pf-tabs { background: var(--card) !important; border: 1px solid var(--border) !important;
    border-radius: 4px !important; padding: 0 !important; gap: 0 !important; }
.brl-jnl-pf-tab {
    background: transparent !important;
    color: var(--muted) !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    font-family: var(--mono) !important;
    font-size: 11px !important; font-weight: 700 !important;
    letter-spacing: 0.08em !important; text-transform: uppercase !important;
    padding: 10px 16px !important;
}
.brl-jnl-pf-tab:hover { color: var(--accent) !important; background: var(--cyan-glow) !important; }
.brl-jnl-pf-tab.is-on {
    color: var(--accent) !important;
    border-bottom-color: var(--accent) !important;
    background: var(--card-2) !important;
}
.brl-jnl-pf-tab-count {
    background: var(--bg) !important;
    color: var(--accent) !important;
    border: 1px solid var(--border) !important;
    border-radius: 2px !important;
    font-size: 10px !important;
    padding: 1px 6px !important;
}
.brl-jnl-pf-card { padding: 16px 18px !important; }
.brl-jnl-pf-card-name { color: var(--text) !important; font-weight: 700 !important;
    font-family: 'Inter',sans-serif !important; letter-spacing: -0.01em; }
.brl-jnl-pf-card-firm { color: var(--muted) !important; font-family: var(--mono) !important; font-size: 11px !important; }
.brl-jnl-pf-card-meta { color: var(--muted) !important; font-family: var(--mono) !important; font-size: 10.5px !important; }
.brl-jnl-pf-badge {
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 9.5px !important; font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    padding: 3px 7px !important;
}
.brl-jnl-pf-badge.is-active { background: var(--cyan-glow) !important; color: var(--accent) !important; }
.brl-jnl-pf-badge.is-warning { background: var(--amber-soft) !important; color: var(--amber) !important; }
.brl-jnl-pf-badge.is-passed { background: var(--pos-soft) !important; color: var(--pos) !important; }
.brl-jnl-pf-badge.is-failed { background: var(--neg-soft) !important; color: var(--neg) !important; }
.brl-jnl-pf-num-lbl { color: var(--muted) !important; font-size: 9.5px !important;
    font-weight: 700 !important; letter-spacing: 0.12em !important; }
.brl-jnl-pf-num-val { font-size: 20px !important; font-weight: 600 !important; }
.brl-jnl-pf-num-sub { color: var(--muted) !important; font-family: var(--mono) !important; font-size: 10.5px !important; }
.brl-jnl-pf-rule-name strong { color: var(--text) !important; font-weight: 600 !important; }
.brl-jnl-pf-rule-detail { color: var(--muted) !important; font-size: 11px !important; }
.brl-jnl-pf-rule-val { font-family: var(--mono) !important; color: var(--text) !important; }
.brl-jnl-pf-rule-icon {
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-weight: 700 !important;
}
.brl-jnl-pf-rule-icon.is-ok { background: var(--pos-soft) !important; color: var(--pos) !important; }
.brl-jnl-pf-rule-icon.is-warn { background: var(--amber-soft) !important; color: var(--amber) !important; }
.brl-jnl-pf-rule-icon.is-bad { background: var(--neg-soft) !important; color: var(--neg) !important; }
.brl-jnl-pf-rule-icon.is-pending { background: var(--bg) !important; color: var(--muted) !important; }
.brl-jnl-pf-bar { background: var(--bg) !important; border: 1px solid var(--border) !important; }
.brl-jnl-pf-bar-fill.is-ok { background: var(--pos) !important; }
.brl-jnl-pf-bar-fill.is-warn { background: var(--amber) !important; }
.brl-jnl-pf-bar-fill.is-bad { background: var(--neg) !important; }
.brl-jnl-pf-act {
    background: transparent !important;
    border: 1px solid var(--border-strong) !important;
    color: var(--muted) !important;
    border-radius: 3px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important;
    padding: 6px 10px !important;
}
.brl-jnl-pf-act:hover { color: var(--accent) !important; border-color: var(--accent) !important; background: var(--cyan-glow) !important; }
.brl-jnl-pf-act.is-danger:hover { color: var(--neg) !important; border-color: var(--neg) !important; background: var(--neg-soft) !important; }

/* --- Modals (trade detail + diary editor + pf editor) --- */
.brl-jnl-modal-backdrop,
.brl-jnl-diary-editor-backdrop,
.brl-jnl-pf-editor-backdrop,
.brl-jnl-lightbox-backdrop {
    background: rgba(2,5,12,0.78) !important;
    backdrop-filter: blur(6px) !important;
}
.brl-jnl-modal-card,
.brl-jnl-diary-editor-card,
.brl-jnl-pf-editor-card {
    border-radius: 4px !important;
    border: 1px solid var(--border-strong) !important;
    box-shadow: 0 24px 60px rgba(0,0,0,0.5), 0 0 0 1px var(--cyan-glow) !important;
}
.brl-jnl-modal-head,
.brl-jnl-diary-editor-head,
.brl-jnl-pf-editor-head {
    border-bottom: 1px solid var(--border) !important;
    background: var(--bg) !important;
}
.brl-jnl-modal-title,
.brl-jnl-diary-editor-title,
.brl-jnl-pf-editor-title {
    font-family: var(--mono) !important;
    font-size: 13px !important; font-weight: 700 !important;
    letter-spacing: 0.08em !important; text-transform: uppercase !important;
    color: var(--text) !important;
}
.brl-jnl-modal-label,
.brl-jnl-diary-editor-label,
.brl-jnl-pf-editor-lbl {
    color: var(--accent) !important;
    font-family: var(--mono) !important;
    font-size: 9.5px !important; font-weight: 700 !important;
    letter-spacing: 0.12em !important;
}
.brl-jnl-modal-value { color: var(--text) !important; font-family: var(--mono) !important; }
.brl-jnl-modal-sub { color: var(--muted) !important; font-family: var(--mono) !important; font-size: 11px !important; }

/* --- Notes / Tags --- */
.brl-jnl-notes-textarea,
.brl-jnl-tag-add-input {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
    font-family: 'Inter',sans-serif !important;
}
.brl-jnl-notes-textarea:focus,
.brl-jnl-tag-add-input:focus { border-color: var(--accent) !important; outline: none !important; box-shadow: 0 0 0 2px var(--cyan-glow) !important; }
.brl-jnl-notes-save,
.brl-jnl-tag-add-btn,
.brl-jnl-strat-save {
    background: var(--cyan-glow) !important;
    color: var(--accent) !important;
    border: 1px solid var(--accent) !important;
    border-radius: 3px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; font-weight: 700 !important;
    letter-spacing: 0.08em !important; text-transform: uppercase !important;
}
.brl-jnl-tag-chip {
    background: var(--bg) !important;
    border: 1px solid var(--border-strong) !important;
    color: var(--text) !important;
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
}
.brl-jnl-mistake-chip {
    background: var(--neg-soft) !important;
    border: 1px solid rgba(255,71,87,0.4) !important;
    color: var(--neg) !important;
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
}
.brl-jnl-strat-pill {
    background: var(--card) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
}
.brl-jnl-strat-pill:hover { border-color: var(--accent) !important; color: var(--accent) !important; }

/* --- Filter bar (fbar) — Bloomberg dense --- */
.brl-jnl-fbar,
.brl-jnl-fbar-panel {
    background: var(--card) !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
}
.brl-jnl-fbar-lbl { color: var(--muted) !important; font-family: var(--mono) !important;
    font-size: 9.5px !important; font-weight: 700 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; }
.brl-jnl-fbar-input,
.brl-jnl-filter-select {
    background: var(--bg) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
    font-family: 'Inter',sans-serif !important;
}
.brl-jnl-fbar-input:focus,
.brl-jnl-filter-select:focus { border-color: var(--accent) !important; outline: none !important; box-shadow: 0 0 0 2px var(--cyan-glow) !important; }
.brl-jnl-fbar-pill,
.brl-jnl-day-pill,
.brl-jnl-fbar-chip {
    background: var(--card-2) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 2px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important;
}
.brl-jnl-fbar-pill.is-on,
.brl-jnl-fbar-pill:hover { border-color: var(--accent) !important; color: var(--accent) !important; background: var(--cyan-glow) !important; }
.brl-jnl-fbar-chip-x { color: var(--muted) !important; }
.brl-jnl-fbar-chip-x:hover { color: var(--neg) !important; }
.brl-jnl-fbar-clear,
.brl-jnl-filter-reset {
    color: var(--muted) !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; letter-spacing: 0.06em !important;
}
.brl-jnl-fbar-clear:hover,
.brl-jnl-filter-reset:hover { color: var(--neg) !important; }

/* --- Misc primitives --- */
.brl-jnl-empty,
.brl-jnl-empty-state {
    background: var(--card) !important;
    border: 1px dashed var(--border-strong) !important;
    border-radius: 4px !important;
    color: var(--muted) !important;
}
.brl-jnl-empty-state-title { color: var(--text) !important; font-family: var(--mono) !important;
    font-size: 12.5px !important; font-weight: 700 !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; }
.brl-jnl-empty-state-sub { color: var(--muted) !important; font-size: 12px !important; }
.brl-jnl-muted { color: var(--muted) !important; }
.brl-jnl-loadmore,
.brl-jnl-sort {
    background: transparent !important;
    color: var(--muted) !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; letter-spacing: 0.06em !important; text-transform: uppercase !important;
}
.brl-jnl-loadmore:hover,
.brl-jnl-sort:hover { color: var(--accent) !important; }
.brl-jnl-tab-btn,
.brl-jnl-tabs-strip button {
    background: transparent !important;
    color: var(--muted) !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important;
}
.brl-jnl-tab-btn.is-active,
.brl-jnl-tabs-strip button.is-active { color: var(--accent) !important; border-bottom-color: var(--accent) !important; }

/* --- Lightbox (chart screenshots) --- */
.brl-jnl-lightbox-stage {
    background: var(--card) !important;
    border: 1px solid var(--cyan-glow) !important;
    border-radius: 4px !important;
    box-shadow: 0 0 60px rgba(0,212,255,0.18) !important;
}
.brl-jnl-lightbox-close {
    background: var(--card) !important;
    border: 1px solid var(--border-strong) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
}

/* --- Screenshot thumbs --- */
.brl-jnl-shot {
    border-radius: 3px !important;
    border: 1px solid var(--border) !important;
}
.brl-jnl-shot-link:hover .brl-jnl-shot { border-color: var(--accent) !important; box-shadow: 0 0 8px var(--cyan-glow) !important; }
.brl-jnl-shot-zoom { color: var(--accent) !important; }

/* --- Toggle (PF editor switch) — cyan when on --- */
.brl-jnl-pf-editor-toggle input:checked + span {
    background: var(--cyan-glow) !important;
    border-color: var(--accent) !important;
}
.brl-jnl-pf-editor-toggle input:checked + span::before { background: var(--accent) !important; }

/* --- Mobile sidebar toggle --- */
.brl-jnl-sb-toggle {
    background: var(--card) !important;
    border: 1px solid var(--border) !important;
    color: var(--text) !important;
    border-radius: 3px !important;
    font-family: var(--mono) !important;
    font-size: 10.5px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important;
}

/* --- Scrollbars (Webkit) — thin cyan --- */
.brl-jnl ::-webkit-scrollbar { width: 8px; height: 8px; }
.brl-jnl ::-webkit-scrollbar-track { background: var(--bg); }
.brl-jnl ::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 2px; }
.brl-jnl ::-webkit-scrollbar-thumb:hover { background: var(--accent); }

/* --- Subtle ambient cyan glow on the hero (decorative) --- */
.brl-jnl-hero-inner::after {
    content: ""; position: absolute; bottom: -20px; right: -20px;
    width: 180px; height: 180px;
    background: radial-gradient(circle, var(--cyan-glow), transparent 70%);
    pointer-events: none; opacity: 0.6;
}

/* === END BLOOMBERG PRO OVERRIDES =========================================== */


/* ===========================================================================
   BLOOMBERG PRO LAYOUT — v2.9.0
   ---------------------------------------------------------------------------
   Structural layout for the new Bloomberg-style dashboard: ticker ribbon,
   2-col shell (sidebar + main), toolbar, 6-up hero, content grid with right
   rail, status bar. Only styles new classes — old classes still cascade.
   =========================================================================== */

/* App shell: stack ticker > shell > status bar */
.brl-jnl-app {
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
}
body.admin-bar .brl-jnl-app { min-height: calc(100vh - 32px) !important; }

/* Strip the original full-bleed/padding from any .brl-jnl wrapper that's
   rendered INSIDE the shell (e.g. the inner wrapper that render_dashboard
   still emits). Without this they would try to span 100vw and break out
   of the sidebar+main grid. */
.brl-jnl-app .brl-jnl-page .brl-jnl {
    width: auto !important;
    left: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    position: static !important;
    border-radius: 0 !important;
}

/* ============ TICKER RIBBON ============ */
.brl-jnl-ticker {
    height: 30px;
    background: #050811;
    border-bottom: 1px solid var(--border);
    display: flex; align-items: center;
    overflow: hidden;
    font-size: 11px;
    flex-shrink: 0;
}
.brl-jnl-ticker-track {
    display: flex; gap: 28px; padding: 0 16px;
    white-space: nowrap;
    animation: brlTicker 90s linear infinite;
}
@keyframes brlTicker {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.brl-jnl-tk { display: inline-flex; gap: 8px; align-items: center; }
.brl-jnl-tk-sym {
    color: var(--muted); font-weight: 700;
    letter-spacing: 0.06em;
    font-family: var(--mono);
    font-size: 10.5px;
}
.brl-jnl-tk-val {
    color: var(--text);
    font-family: var(--mono);
    font-variant-numeric: tabular-nums;
    font-size: 11px;
}
.brl-jnl-tk-pos { color: var(--pos); font-family: var(--mono); font-size: 10.5px; }
.brl-jnl-tk-neg { color: var(--neg); font-family: var(--mono); font-size: 10.5px; }

/* ============ SHELL: sidebar + main (grid) ============ */
.brl-jnl-shell {
    display: grid !important;
    grid-template-columns: 264px 1fr !important;
    flex: 1 !important;
    min-height: 0 !important;
    background: var(--bg);
}
.brl-jnl-shell > .brl-jnl-sb { height: auto !important; }
.brl-jnl-page {
    min-width: 0;
    overflow-x: hidden;
}

/* ============ SIDEBAR (BRAND BLOCK) ============ */
.brl-jnl-sb {
    background: var(--bg-2, var(--bg)) !important;
    border-right: 1px solid var(--border) !important;
    padding: 0 !important;
    display: flex; flex-direction: column;
}
.brl-jnl-sb-brand {
    padding: 14px 16px;
    border-bottom: 1px solid var(--border);
    display: flex; align-items: center; gap: 10px;
}
.brl-jnl-sb-brand-dot {
    width: 8px; height: 8px;
    background: var(--accent);
    border-radius: 50%;
    box-shadow: 0 0 8px var(--accent);
    animation: brlBrandDot 1.4s ease-in-out infinite;
    flex-shrink: 0;
}
@keyframes brlBrandDot { 50% { opacity: 0.35; } }
.brl-jnl-sb-brand-name {
    font-family: var(--mono);
    font-size: 12px; font-weight: 800;
    letter-spacing: 0.12em;
    color: var(--text);
}
.brl-jnl-sb-brand-tag {
    margin-left: auto;
    padding: 2px 6px;
    font-family: var(--mono); font-size: 9px;
    color: var(--text-dim, var(--muted));
    border: 1px solid var(--border-strong);
    border-radius: 3px;
    letter-spacing: 0.08em;
}

/* Sidebar item — keyboard shortcut chip */
.brl-jnl-sb-kbd {
    margin-left: auto;
    padding: 1px 5px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 3px;
    font-family: var(--mono);
    font-size: 9.5px;
    color: var(--muted);
    letter-spacing: 0;
}
.brl-jnl-sb-item.is-active .brl-jnl-sb-kbd {
    border-color: var(--accent);
    color: var(--accent);
}

/* Sidebar nav wrapper inside each section */
.brl-jnl-sb-nav { padding: 0 8px 4px; display: flex; flex-direction: column; gap: 1px; }

/* EA STREAM card — Bloomberg stat-grid style */
.brl-jnl-sb-expert {
    margin: 14px 8px;
    padding: 12px 14px !important;
    border: 1px solid var(--border) !important;
    background: var(--card) !important;
    border-radius: 3px !important;
    font-size: 11px;
}
.brl-jnl-sb-expert-head {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 8px;
}
.brl-jnl-sb-expert-head strong {
    font-family: var(--mono);
    font-size: 10.5px; font-weight: 800;
    letter-spacing: 0.1em;
    color: var(--pos);
}
.brl-jnl-sb-expert-grid {
    display: flex; flex-direction: column; gap: 4px;
}
.brl-jnl-sb-expert-row {
    display: flex; align-items: center; justify-content: space-between;
    font-size: 11px;
    color: var(--muted);
}
.brl-jnl-sb-expert-row b {
    font-family: var(--mono);
    color: var(--text);
    font-weight: 600;
}
.brl-jnl-sb-expert-row b.is-pos { color: var(--pos); }

/* ============ TOOLBAR (top of main column) ============ */
.brl-jnl-toolbar {
    display: grid;
    grid-template-columns: minmax(180px, auto) minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    padding: 10px 18px;
    background: var(--bg-2, var(--bg));
    border-bottom: 1px solid var(--border);
    font-size: 11px;
    position: sticky; top: 0;
    z-index: 5;
}
.brl-jnl-tb-crumb {
    color: var(--text-dim, var(--muted));
    letter-spacing: 0.06em;
    font-family: var(--mono);
    font-size: 10.5px;
    text-transform: uppercase;
}
.brl-jnl-tb-crumb b { color: var(--accent); font-weight: 800; }
.brl-jnl-tb-sep { margin: 0 6px; color: var(--text-dim, var(--muted)); }

.brl-jnl-tb-search {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 12px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 3px;
    max-width: 480px;
    min-width: 0;
    transition: border-color 100ms;
}
.brl-jnl-tb-search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 2px var(--cyan-glow); }
.brl-jnl-tb-search svg { color: var(--muted); flex-shrink: 0; }
.brl-jnl-tb-search input {
    background: transparent; border: 0; outline: 0;
    flex: 1; min-width: 0;
    color: var(--text);
    font-family: 'Inter', sans-serif;
    font-size: 12px;
}
.brl-jnl-tb-search input::placeholder { color: var(--text-dim, var(--muted)); }
.brl-jnl-tb-search kbd {
    font-family: var(--mono); font-size: 10px;
    padding: 1px 5px;
    border: 1px solid var(--border-strong);
    border-radius: 3px;
    color: var(--text-dim, var(--muted));
    background: var(--bg);
    flex-shrink: 0;
}

.brl-jnl-tb-actions {
    display: flex; align-items: center; gap: 6px;
    justify-self: end;
}
.brl-jnl-tb-btn {
    padding: 5px 10px;
    font-size: 10.5px; font-weight: 700;
    background: var(--card);
    border: 1px solid var(--border);
    color: var(--muted);
    border-radius: 3px;
    cursor: pointer;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-family: var(--mono);
    transition: all 100ms;
}
.brl-jnl-tb-btn:hover {
    color: var(--accent);
    border-color: var(--accent);
    background: var(--cyan-glow);
}
.brl-jnl-tb-status {
    display: flex; align-items: center; gap: 6px;
    padding: 5px 10px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 3px;
    font-family: var(--mono);
    font-size: 10.5px;
    color: var(--pos);
    letter-spacing: 0.06em;
}
.brl-jnl-tb-pulse {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--pos);
    box-shadow: 0 0 4px var(--pos);
    animation: brlBrandDot 1.4s infinite;
}
.brl-jnl-tb-last { color: var(--text); }

/* ============ 6-UP BLOOMBERG HERO ============ */
.brl-jnl-bb-hero {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr);
    background: var(--card);
    border-bottom: 1px solid var(--border);
}
.brl-jnl-bb-hero-cell {
    padding: 14px 18px;
    border-right: 1px solid var(--border);
    display: flex; flex-direction: column; gap: 4px;
    position: relative;
    min-width: 0;
}
.brl-jnl-bb-hero-cell:last-child { border-right: 0; }
.brl-jnl-bb-hero-lbl {
    font-family: var(--mono);
    font-size: 9.5px; color: var(--muted);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 700;
}
.brl-jnl-bb-hero-val,
.brl-jnl-bb-hero-cell .brl-jnl-hero-metric-value {
    font-family: var(--mono);
    font-variant-numeric: tabular-nums;
    font-size: 22px; font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--text);
    line-height: 1.1;
}
.brl-jnl-bb-hero-val.pos,
.brl-jnl-bb-hero-cell .brl-jnl-hero-metric-value.pos { color: var(--pos); }
.brl-jnl-bb-hero-val.neg,
.brl-jnl-bb-hero-cell .brl-jnl-hero-metric-value.neg { color: var(--neg); }
.brl-jnl-bb-hero-sub {
    font-size: 11px; color: var(--muted);
    display: flex; align-items: center; gap: 6px;
    font-family: var(--mono);
    letter-spacing: 0.02em;
}
.brl-jnl-bb-delta-pos { color: var(--pos); }
.brl-jnl-bb-delta-neg { color: var(--neg); }
.brl-jnl-bb-sep { color: var(--text-dim, var(--muted)); margin: 0 2px; }
.brl-jnl-bb-hero-spark {
    position: absolute; bottom: 8px; right: 12px;
    width: 60px; height: 22px; opacity: 0.65;
    pointer-events: none;
}
.brl-jnl-bb-hero-spark svg { width: 100% !important; height: 100% !important; }
.brl-jnl-bb-jshelpers { display: none !important; }

/* ============ CONTENT GRID: main column + right rail ============ */
.brl-jnl-content-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 14px;
    padding: 14px 18px;
    align-items: start;
}
.brl-jnl-col-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.brl-jnl-col-rail { display: flex; flex-direction: column; gap: 14px; min-width: 0; position: sticky; top: 56px; }

/* ============ PANEL system ============ */
.brl-jnl-panel {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 3px;
    display: flex; flex-direction: column;
}
.brl-jnl-panel-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 8px 12px;
    background: var(--bg-2, var(--bg));
    border-bottom: 1px solid var(--border);
    font-size: 11px;
    gap: 12px;
    min-height: 32px;
}
.brl-jnl-panel-title {
    font-family: var(--mono);
    font-weight: 700; font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text);
    display: flex; align-items: center; gap: 8px;
}
.brl-jnl-panel-title::before {
    content: "";
    width: 3px; height: 11px;
    background: var(--accent);
    border-radius: 1px;
    box-shadow: 0 0 6px var(--accent);
}
.brl-jnl-panel-meta {
    color: var(--text-dim, var(--muted));
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.04em;
    text-transform: lowercase;
    white-space: nowrap;
}
.brl-jnl-panel-body { padding: 12px; }

/* Panels contain other elements directly — override their margins so they
   don't push past panel edges. */
.brl-jnl-panel .brl-jnl-section { padding: 0 !important; background: transparent !important; border: 0 !important; }
.brl-jnl-panel > .brl-jnl-bd-head { padding: 0 !important; background: var(--bg) !important; }
.brl-jnl-panel > .brl-jnl-bd-panel { padding: 10px 12px !important; }
.brl-jnl-panel > .brl-jnl-table-wrap { padding: 0; }
.brl-jnl-panel .brl-jnl-table { border: 0 !important; }
.brl-jnl-panel .brl-jnl-equity { padding: 0 !important; background: transparent !important; border: 0 !important; }
.brl-jnl-panel .brl-jnl-insights { border: 0 !important; background: transparent !important; }
.brl-jnl-panel .brl-jnl-ins-list { display: flex !important; flex-direction: column; }

/* ============ KEY STATISTICS TABLE (right rail) ============ */
.brl-jnl-bb-stats {
    width: 100%;
    border-collapse: collapse;
}
.brl-jnl-bb-stats td {
    padding: 7px 12px;
    font-size: 11.5px;
    border-bottom: 1px dotted var(--border);
}
.brl-jnl-bb-stats tr:last-child td { border-bottom: 0; }
.brl-jnl-bb-stats .lbl {
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 10px;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
}
.brl-jnl-bb-stats .val {
    text-align: right;
    font-family: var(--mono);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--text);
}
.brl-jnl-bb-stats .val.pos { color: var(--pos); }
.brl-jnl-bb-stats .val.neg { color: var(--neg); }

/* Compact heatmap (right rail) */
.brl-jnl-col-rail .brl-jnl-cal-grid,
.brl-jnl-col-rail .brl-jnl-cal-headers { gap: 2px !important; }
.brl-jnl-col-rail .brl-jnl-cal-cell {
    aspect-ratio: 1 !important;
    border-radius: 2px !important;
    font-size: 9px !important;
    font-family: var(--mono) !important;
}
.brl-jnl-col-rail .brl-jnl-cal-cell-pnl { font-size: 9px !important; }
.brl-jnl-col-rail .brl-jnl-cal-cell-date { display: none !important; }
.brl-jnl-bb-legend {
    margin-top: 10px;
    font-size: 10px !important;
    color: var(--muted) !important;
    gap: 12px !important;
}

/* ============ EA ACTIVITY LOG (right rail) ============ */
.brl-jnl-bb-ea-log {
    padding: 4px 12px !important;
    font-family: var(--mono);
    font-size: 10.5px;
    line-height: 1.7;
    color: var(--muted);
    max-height: 320px;
    overflow-y: auto;
}
.brl-jnl-bb-ea-log-row {
    display: flex; gap: 8px; align-items: center;
    padding: 4px 0;
    border-bottom: 1px dotted var(--border);
}
.brl-jnl-bb-ea-log-row:last-child { border-bottom: 0; }
.brl-jnl-bb-ea-time { color: var(--text-dim, var(--muted)); flex-shrink: 0; }
.brl-jnl-bb-ea-tag {
    padding: 1px 5px;
    border-radius: 2px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.06em;
    flex-shrink: 0;
}
.brl-jnl-bb-ea-tag.pos { background: var(--pos-soft); color: var(--pos); }
.brl-jnl-bb-ea-tag.neg { background: var(--neg-soft); color: var(--neg); }
.brl-jnl-bb-ea-msg { color: var(--text); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brl-jnl-bb-ea-msg .pos { color: var(--pos); font-weight: 600; }
.brl-jnl-bb-ea-msg .neg { color: var(--neg); font-weight: 600; }
.brl-jnl-bb-ea-log-empty {
    padding: 20px 12px;
    text-align: center;
    color: var(--muted);
    font-size: 11px;
}

/* ============ STATUS BAR (bottom) ============ */
.brl-jnl-status-bar {
    height: 26px;
    background: var(--bg-2, #050811);
    border-top: 1px solid var(--border);
    display: flex; align-items: center;
    padding: 0 16px; gap: 18px;
    font-family: var(--mono);
    font-size: 10px;
    color: var(--text-dim, var(--muted));
    letter-spacing: 0.04em;
    flex-shrink: 0;
}
.brl-jnl-sbar-item {
    display: inline-flex; align-items: center; gap: 6px;
    white-space: nowrap;
}
.brl-jnl-sbar-item.is-ok { color: var(--pos); }
.brl-jnl-sbar-item.is-muted { color: var(--text-dim, var(--muted)); opacity: 0.7; }
.brl-jnl-sbar-dot {
    width: 5px; height: 5px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 4px currentColor;
}
.brl-jnl-sbar-spacer { flex: 1; }

/* ============ Responsive — collapse right rail under 1180px ============ */
@media (max-width: 1180px) {
    .brl-jnl-content-grid {
        grid-template-columns: 1fr;
    }
    .brl-jnl-col-rail { position: static; }
    .brl-jnl-bb-hero {
        grid-template-columns: repeat(3, 1fr);
    }
    .brl-jnl-bb-hero-cell:nth-child(3) { border-right: 0; }
    .brl-jnl-bb-hero-cell:nth-child(-n+3) { border-bottom: 1px solid var(--border); }
}
@media (max-width: 760px) {
    .brl-jnl-shell { grid-template-columns: 1fr !important; }
    .brl-jnl-sb { display: none; }
    .brl-jnl-toolbar { grid-template-columns: 1fr !important; gap: 8px !important; }
    .brl-jnl-tb-actions { justify-self: stretch; flex-wrap: wrap; }
    .brl-jnl-bb-hero { grid-template-columns: repeat(2, 1fr); }
    .brl-jnl-bb-hero-cell { border-right: 0 !important; border-bottom: 1px solid var(--border); }
    .brl-jnl-bb-hero-cell:nth-child(odd) { border-right: 1px solid var(--border) !important; }
    .brl-jnl-ticker-track { animation-duration: 60s; }
    .brl-jnl-status-bar { font-size: 9px; gap: 10px; padding: 0 10px; flex-wrap: wrap; height: auto; padding-block: 4px; }
}

/* === END BLOOMBERG PRO LAYOUT ============================================== */


/* ===========================================================================
   BLOOMBERG PRO — FULLSCREEN BODY MODE  (v2.9.1)
   ---------------------------------------------------------------------------
   When the journal shortcode is present on a page, PHP adds the body class
   `brl-journal-fullscreen`. These rules hide the BrokerSift global shell
   header/footer + theme page-title and force the page body to render as a
   full-bleed dark canvas so the Bloomberg-Pro UI is the entire viewport
   (everything except the wp-admin bar).
   =========================================================================== */

body.brl-journal-fullscreen {
    padding: 0 !important;
    margin: 0 !important;
    background: #0a0e1a !important;
    color: #e6ebf5 !important;
    overflow-x: hidden !important;
}

/* Kill the inline padding-top that brokersift's chx_global_shell_hide adds. */
body.brl-journal-fullscreen.chx-global-shell-enabled { padding-top: 0 !important; padding-bottom: 0 !important; }

/* Preserve the WP admin bar offset for logged-in users. */
body.brl-journal-fullscreen.admin-bar { padding-top: 32px !important; }
@media screen and (max-width: 782px) {
    body.brl-journal-fullscreen.admin-bar { padding-top: 46px !important; }
}

/* Hide the brokersift global chrome CHILDREN — but NOT .chx-shell itself
   because it is the wrapper that contains all page content (including the
   journal shortcode output). Hiding .chx-shell hides the journal too. */
body.brl-journal-fullscreen .ch-topbar,
body.brl-journal-fullscreen .ch-footer,
body.brl-journal-fullscreen .ch-bottomBar,
body.brl-journal-fullscreen .ch-drawer,
body.brl-journal-fullscreen .ch-modal,
body.brl-journal-fullscreen .ch-bg { display: none !important; }

/* Strip the .chx-shell wrapper so it does nothing visually — no max-width,
   no padding, no top offset for the (now-hidden) topbar. */
body.brl-journal-fullscreen .chx-shell {
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
    width: 100% !important;
    background: transparent !important;
    min-height: 0 !important;
}

/* Hide theme page-title / entry-header / site-title / site-tagline / theme
   header so the journal hero starts right at the top. Targeted ONLY at
   header/title elements — we deliberately avoid grouped wrappers like
   `.header-footer-group` or `.wp-site-blocks` because some themes
   wrap the main content area inside those too, which would hide the
   journal itself. */
body.brl-journal-fullscreen .entry-header,
body.brl-journal-fullscreen .entry-title,
body.brl-journal-fullscreen .page-header,
body.brl-journal-fullscreen .page-title,
body.brl-journal-fullscreen .single-page-title,
body.brl-journal-fullscreen .wp-block-post-title,
body.brl-journal-fullscreen .breadcrumb,
body.brl-journal-fullscreen .breadcrumbs,
body.brl-journal-fullscreen .rank-math-breadcrumb,
body.brl-journal-fullscreen .ast-archive-description,
body.brl-journal-fullscreen .site-header,
body.brl-journal-fullscreen header.site-header,
body.brl-journal-fullscreen #masthead,
body.brl-journal-fullscreen .site-branding,
body.brl-journal-fullscreen .site-title,
body.brl-journal-fullscreen .site-description,
body.brl-journal-fullscreen .site-tagline,
body.brl-journal-fullscreen .wp-block-site-title,
body.brl-journal-fullscreen .wp-block-site-tagline,
body.brl-journal-fullscreen .wp-block-site-logo,
body.brl-journal-fullscreen .custom-logo-link,
body.brl-journal-fullscreen .elementor-location-header,
body.brl-journal-fullscreen footer.site-footer,
body.brl-journal-fullscreen #colophon,
body.brl-journal-fullscreen .ast-primary-header-bar,
body.brl-journal-fullscreen .ast-header-break-point { display: none !important; }

/* Strip width / padding from the standard WP content wrappers so the
   journal can extend edge-to-edge. */
body.brl-journal-fullscreen .entry-content,
body.brl-journal-fullscreen .site-content,
body.brl-journal-fullscreen .site-main,
body.brl-journal-fullscreen .content-area,
body.brl-journal-fullscreen main,
body.brl-journal-fullscreen #primary,
body.brl-journal-fullscreen #content,
body.brl-journal-fullscreen #main,
body.brl-journal-fullscreen #page,
body.brl-journal-fullscreen article.page,
body.brl-journal-fullscreen .post,
body.brl-journal-fullscreen .ast-container,
body.brl-journal-fullscreen .elementor,
body.brl-journal-fullscreen .elementor-section,
body.brl-journal-fullscreen .elementor-container,
body.brl-journal-fullscreen .elementor-column-wrap {
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
    width: 100% !important;
    background: transparent !important;
}

/* Hide theme sidebars on this page. */
body.brl-journal-fullscreen .sidebar,
body.brl-journal-fullscreen #sidebar,
body.brl-journal-fullscreen #secondary,
body.brl-journal-fullscreen .widget-area { display: none !important; }

/* The journal app itself: full viewport, behind the wp-admin bar. */
body.brl-journal-fullscreen .brl-jnl-app {
    width: 100vw !important;
    margin: 0 !important;
    left: auto !important;
    position: relative !important;
}

/* === END FULLSCREEN BODY MODE ============================================== */


