*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu;min-height:100vh;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#2c3e50}
.container{max-width:1200px;margin:0 auto;padding:20px}
.lock-screen{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:20px}
.lock-container{background:rgba(255,255,255,.95);backdrop-filter:blur(16px);border-radius:20px;padding:36px 28px;box-shadow:0 20px 60px rgba(0,0,0,.25);width:100%;max-width:440px;border:1px solid rgba(255,255,255,.25)}
.lock-logo{font-size:48px;margin-bottom:8px}
.lock-title{margin:0;font-size:28px;font-weight:700}
.lock-subtitle{margin:6px 0 20px;color:#6b7280}
.lock-input{width:100%;padding:14px 16px;border:2px solid #e5e7eb;border-radius:12px;margin-bottom:12px;font-size:16px}
.lock-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 4px rgba(102,126,234,.15)}
.lock-input-group{position:relative}
.lock-input-icon{position:absolute;right:8px;top:6px;height:36px;border:none;background:#f3f4f6;border-radius:8px;padding:0 10px;cursor:pointer}
.unlock-btn{width:100%;padding:14px 16px;border:none;border-radius:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-weight:600;cursor:pointer}
.error-message{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;padding:10px 12px;border-radius:10px;margin-top:12px;font-size:14px}
.tabs{display:flex;gap:8px;margin-bottom:12px}
.tab{flex:1;padding:10px;border-radius:10px;border:1px solid #e5e7eb;background:#fff;cursor:pointer}
.tab.active{background:#eef2ff;border-color:#c7d2fe}
.main-app{display:none}
.main-app.unlocked{display:block}
.header{background:rgba(255,255,255,.95);backdrop-filter:blur(10px);padding:18px;border-radius:15px;margin:20px 0;box-shadow:0 8px 32px rgba(0,0,0,.12)}
.header-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.header h1{margin:0;font-size:24px;font-weight:700;display:flex;align-items:center;gap:10px}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:#f3f4f6;color:#374151;font-size:14px}
.muted{color:#6b7280}
.header-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.strategy-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.form-control{width:100%;padding:12px 14px;border:2px solid #e5e7eb;border-radius:10px;font-size:15px;background:#fff}
.btn{padding:10px 14px;border:none;border-radius:10px;font-weight:600;cursor:pointer}
.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}
.btn-warning{background:linear-gradient(135deg,#f39c12,#e67e22);color:#fff}
.btn-info{background:linear-gradient(135deg,#3498db,#2980b9);color:#fff}
.btn-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff}
.lock-journal-btn{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff}
.main-content{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.card{background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border-radius:15px;padding:18px;box-shadow:0 8px 32px rgba(0,0,0,.1)}
.card-title{margin:0 0 12px;font-size:18px;font-weight:700}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.stats-grid.mini{grid-template-columns:repeat(4,minmax(0,1fr))}
.stat-card{background:rgba(255,255,255,.95);border:1px solid rgba(255,255,255,.4);border-radius:12px;padding:14px;text-align:center}
.stat-card .label{font-size:12px;color:#6b7280}
.stat-card .value{font-size:20px;font-weight:700}
.table-container{background:rgba(255,255,255,.95);border-radius:15px;padding:18px;box-shadow:0 8px 32px rgba(0,0,0,.1);margin:20px 0}
.table-header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.search-filter{display:flex;gap:8px;flex-wrap:wrap}
table{width:100%;border-collapse:collapse;margin-top:10px}
th,td{padding:10px;border-bottom:1px solid #e5e7eb;text-align:left;font-size:14px}
th{background:#f9fafb}
.side-badge{margin-left:8px;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:600;display:inline-block}
.side-buy{background:rgba(16,185,129,.12);color:#10b981;border:1px solid rgba(16,185,129,.15)}
.side-sell{background:rgba(239,68,68,.12);color:#ef4444;border:1px solid rgba(239,68,68,.15)}
.side-be{background:rgba(59,130,246,.12);color:#3b82f6;border:1px solid rgba(59,130,246,.15)}
.hidden{display:none}
.calendar-container{background:rgba(255,255,255,.95);border-radius:15px;padding:18px;box-shadow:0 8px 32px rgba(0,0,0,.1)}
.calendar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;background:#e5e7eb;border-radius:10px;padding:2px}
.calendar-day-header{background:#f8f9fa;padding:8px;text-align:center;font-weight:600}
.calendar-day{background:#fff;min-height:72px;padding:6px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer}
.calendar-day.other-month{background:#f8f9fa;color:#9ca3af}
.calendar-day.today{outline:2px solid #667eea;box-shadow:0 0 0 2px rgba(102,126,234,.2)}
.day-number{font-weight:700}
.day-pnl{font-size:14px;font-weight:600;text-align:center}
.day-pnl.positive{color:#10b981}.day-pnl.negative{color:#ef4444}
.trade-count{font-size:12px;color:#6b7280;text-align:center}
.week-total{margin-top:6px;font-size:14px;font-weight:700;display:inline-block;padding:3px 8px;border-radius:8px;opacity:.95}
.week-total.positive{background:rgba(16,185,129,.10);border:1px solid rgba(16,185,129,.18);color:#10b981}
.week-total.negative{background:rgba(239,68,68,.10);border:1px solid rgba(239,68,68,.18);color:#ef4444}
.week-total.neutral{background:rgba(107,114,128,.12);border:1px solid rgba(107,114,128,.18);color:#6b7280}
@media (max-width:900px){.main-content{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}}

/* === Journal v2 Style Match – Overrides === */
:root{
  --radius: 14px;
  --pad-card: 22px;
  --gap: 16px;
  --text-muted: #6b7280;
  --ok: #10b981;
  --bad: #ef4444;
}

/* container + header spacing/typography */
.container{max-width:1100px;padding:24px}
.header{padding:24px;border-radius:18px}
.header h1{font-size:26px;font-weight:800;letter-spacing:.1px}
#scopeHint{margin-top:8px;font-size:14px;color:var(--text-muted)}

/* buttons slightly tighter */
.btn{padding:9px 14px;border-radius:12px}

/* cards + grids */
.card{padding:var(--pad-card);border-radius:18px}
.main-content{gap:var(--gap)}
.stats-grid{gap:var(--gap)}
.stats-grid .stat-card{padding:18px;border-radius:14px}

/* stat labels + values (match older look) */
.stat-card .label{font-size:12px;color:var(--text-muted);font-weight:600}
.stat-card .value{font-size:26px;font-weight:800;line-height:1.1}
.stat-card .value.pos{color:var(--ok)}
.stat-card .value.neg{color:var(--bad)}

/* table polish */
.table-container{padding:20px;border-radius:18px}
th,td{padding:12px 12px;font-size:15px}
th{letter-spacing:.2px}
.side-badge{padding:3px 10px;border-radius:999px}

/* calendar sizing + colors like the old one */
.calendar-container{padding:20px;border-radius:18px}
.calendar-header{margin-bottom:12px}
.calendar-grid{gap:3px;padding:3px;border-radius:12px}
.calendar-day{min-height:86px;border-radius:10px}
.calendar-day.pos-day{background:#ecfdf5;border:1px solid rgba(16,185,129,.25)}
.calendar-day.neg-day{background:#fef2f2;border:1px solid rgba(239,68,68,.25)}
.calendar-day .day-number{font-weight:700;opacity:.9}
.day-pnl{font-size:16px;font-weight:800;text-align:center}
.trade-count{font-size:12px;color:var(--text-muted)}
.week-total{font-size:14px;font-weight:800;border-radius:10px;padding:4px 10px}
/* --- Fix: spacing below the stats row so it's not covered --- */
.stats-grid {
  margin-bottom: 18px;   /* create breathing room under the stat tiles */
}

.main-content {
  margin-top: 6px;       /* tiny nudge down for the next card row */
}

/* (Optional) make the stat tiles keep their rounded corners neatly */
.stats-grid .stat-card {
  overflow: hidden;
}
/* --- Button alignment & consistent styling --- */
.header-actions,
.header .strategy-bar,
.header .right-controls { display:flex; align-items:center; gap:10px; }

/* Common button look */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:10px 14px; border:none; border-radius:12px;
  font-weight:700; line-height:1; min-height:42px;
  box-shadow:0 4px 14px rgba(0,0,0,.12);
  vertical-align:middle; cursor:pointer;
}
.btn:focus{ outline:none; box-shadow:0 0 0 3px rgba(102,126,234,.25); }
.btn-primary, .btn-warning, .btn-info, .lock-journal-btn{ color:#fff; }

/* Keep existing color schemes */
.btn-primary{ background:linear-gradient(135deg,#667eea,#764ba2); }
.btn-warning{ background:linear-gradient(135deg,#f39c12,#e67e22); }
.btn-info{    background:linear-gradient(135deg,#3498db,#2980b9); }

/* Logout button uses same base, no UA border */
.lock-journal-btn{
  background:linear-gradient(135deg,#e74c3c,#c0392b);
  border:none;               /* kills the black UA border */
}

/* Make the strategy dropdown match button height */
.strategy-select{
  height:42px; padding:8px 12px; border-radius:12px;
}

/* Optional: nudge the pill so it lines up visually with buttons */
.pill{ height:42px; display:inline-flex; align-items:center; }
#shareBtn { display: none !important; }
