/* TraderZone v10 — Black × Orange Premium SaaS */
:root{
  --bg:#030303;--bg2:#080808;--bg3:#0e0e0e;--bg4:#141414;--bg5:#1a1a1a;--bg6:#222;--bg7:#2c2c2c;
  --b1:rgba(255,255,255,.04);--b2:rgba(255,255,255,.07);--b3:rgba(255,255,255,.12);
  --ora:#ff7a00;--oraL:#ff8c1a;--oraD:#cc5f00;
  --oraG:rgba(255,122,0,.09);--oraM:rgba(255,122,0,.15);
  --blu:#ff7a00;--bluL:#ff8c1a;--bluG:rgba(255,122,0,.09);
  --tp:#10b981;--tpL:#34d399;--tpB:rgba(16,185,129,.1);--tpR:rgba(16,185,129,.22);
  --sl:#f43f5e;--slL:#fb7185;--slB:rgba(244,63,94,.1);--slR:rgba(244,63,94,.22);
  --be:#f59e0b;--beL:#fbbf24;--beB:rgba(245,158,11,.1);--beR:rgba(245,158,11,.22);
  --t1:#eeeeee;--t2:#5a5a5a;--t3:#333;--t4:#1e1e1e;
  --ui:'Plus Jakarta Sans',system-ui,sans-serif;
  --mono:'Inter',system-ui,sans-serif;
  --r8:8px;--r10:10px;--r12:12px;--r16:16px;--r20:20px;--r24:24px;
  --sbW:262px;--sbCW:70px;
  --sh:0 24px 64px rgba(0,0,0,.9);
  --shOra:0 6px 24px rgba(255,122,0,.28);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px;scroll-behavior:smooth}
body{font-family:var(--ui);background:var(--bg);color:var(--t1);min-height:100vh;overflow:hidden;-webkit-font-smoothing:antialiased;letter-spacing:.006em}
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bg6);border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:var(--bg7)}
.hidden{display:none!important}.pos{color:var(--tp)!important}.neg{color:var(--sl)!important}.mono{font-family:var(--mono)}

/* ── LOGIN ────────────────────────────────────────────────── */
.login-view{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:1000;background:var(--bg)}
.login-canvas{position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.03) 1px,transparent 0);background-size:44px 44px;animation:canvasDrift 40s linear infinite}
@keyframes canvasDrift{to{background-position:44px 44px}}
.login-orb{position:absolute;border-radius:50%;pointer-events:none}
.orb-1{width:800px;height:800px;background:radial-gradient(circle,rgba(255,122,0,.09),transparent 65%);top:-320px;left:-180px;animation:orbF1 14s ease-in-out infinite}
.orb-2{width:600px;height:600px;background:radial-gradient(circle,rgba(255,122,0,.06),transparent 65%);bottom:-240px;right:-140px;animation:orbF2 18s ease-in-out infinite}
.orb-3{width:400px;height:400px;background:radial-gradient(circle,rgba(255,122,0,.04),transparent 65%);top:55%;left:30%;animation:orbF1 11s ease-in-out infinite reverse}
@keyframes orbF1{0%,100%{transform:translate(0,0)}50%{transform:translate(24px,16px)}}
@keyframes orbF2{0%,100%{transform:translate(0,0)}50%{transform:translate(-20px,-22px)}}
.login-card{position:relative;z-index:2;background:rgba(10,10,10,.96);backdrop-filter:blur(20px);border:1px solid var(--b2);border-radius:var(--r24);padding:52px 48px;width:100%;max-width:470px;box-shadow:var(--sh),0 0 100px rgba(255,122,0,.07),inset 0 1px 0 rgba(255,255,255,.04);animation:cardRise .65s cubic-bezier(.16,1,.3,1) both}
@keyframes cardRise{from{opacity:0;transform:translateY(28px) scale(.96)}to{opacity:1;transform:none}}
.login-brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:28px}
.login-logo-img{height:38px;width:auto;max-width:230px;object-fit:cover;object-position:left center;display:block;-webkit-mask-image:linear-gradient(90deg,#000 50%,transparent 88%);mask-image:linear-gradient(90deg,#000 50%,transparent 88%)}
.brand-icon{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--oraD),var(--oraL));display:flex;align-items:center;justify-content:center;box-shadow:var(--shOra)}
.brand-icon svg{stroke:#fff}
.brand-name{font-size:18px;font-weight:800;letter-spacing:-.02em}
.login-headline{margin-bottom:28px}
.login-headline h1{font-size:28px;font-weight:800;line-height:1.18;letter-spacing:-.03em;margin-bottom:10px}
.h1-gradient{background:linear-gradient(135deg,var(--oraL),#ffbe6a);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.login-headline p{font-size:13.5px;color:var(--t2);line-height:1.65}
.input-lbl{display:block;font-size:10px;font-weight:700;letter-spacing:.14em;color:var(--t3);margin-bottom:8px;text-transform:uppercase}
.text-input{width:100%;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r10);color:var(--t1);font-family:var(--ui);font-size:15px;padding:14px 16px;outline:none;margin-bottom:12px;transition:border-color .2s,box-shadow .2s}
.text-input::placeholder{color:var(--t4)}
.text-input:focus{border-color:var(--ora);box-shadow:0 0 0 3px var(--oraG)}
.btn-cta{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(135deg,var(--oraD),var(--oraL));border:none;border-radius:var(--r10);color:#fff;font-family:var(--ui);font-size:15px;font-weight:700;padding:15px;cursor:pointer;transition:all .22s;box-shadow:var(--shOra),inset 0 1px 0 rgba(255,255,255,.1);letter-spacing:.005em;margin-bottom:20px}
.btn-cta:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(255,122,0,.45),inset 0 1px 0 rgba(255,255,255,.1)}
.btn-cta:active{transform:none}
.login-pills{display:flex;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.lf-pill{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--t3)}
.lf-pill svg{stroke:var(--tp);flex-shrink:0}
.login-secure{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--t4)}

/* ── GLOBAL BUTTONS ───────────────────────────────────────── */
.btn-ghost-sm{background:transparent;border:1px solid var(--b2);border-radius:var(--r8);color:var(--t2);font-family:var(--ui);font-size:12px;font-weight:500;padding:6px 13px;cursor:pointer;transition:all .16s}
.btn-ghost-sm:hover{border-color:var(--b3);color:var(--t1);background:var(--bg5)}
.btn-tb-action{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.03);border:1px solid var(--b2);color:var(--t2);font-family:var(--ui);font-size:12px;font-weight:500;padding:6px 13px;border-radius:var(--r8);cursor:pointer;transition:all .16s}
.btn-tb-action:hover{border-color:var(--b3);color:var(--t1)}
.btn-mt5-import{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.03);border:1px solid var(--b2);color:var(--t2);font-family:var(--ui);font-size:12px;font-weight:500;padding:6px 13px;border-radius:var(--r8);cursor:pointer;transition:all .18s}
.btn-mt5-import:hover{border-color:var(--ora);color:var(--oraL);background:var(--oraG)}
.btn-blue{background:var(--ora);border:none;border-radius:var(--r8);color:#fff;font-family:var(--ui);font-size:12px;font-weight:600;flex:1;padding:9px;cursor:pointer;transition:all .16s}
.btn-blue:hover{background:var(--oraL)}
.btn-today{background:transparent;border:1px solid rgba(255,122,0,.3);color:var(--oraL);padding:6px 14px;border-radius:var(--r8);font-family:var(--ui);font-size:10px;font-weight:700;letter-spacing:.12em;cursor:pointer;transition:all .18s;text-transform:uppercase}
.btn-today:hover{background:var(--oraG);border-color:var(--oraL)}
.btn-logout{background:transparent;border:1px solid var(--b2);color:var(--t3);width:28px;height:28px;border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .16s}
.btn-logout:hover{border-color:var(--slR);color:var(--sl);background:var(--slB)}
.btn-cancel{background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:var(--r8);color:var(--t2);font-family:var(--ui);font-size:13px;padding:10px 18px;cursor:pointer;transition:all .16s}
.btn-cancel:hover{border-color:var(--b3);color:var(--t1)}
.btn-save-primary{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(135deg,var(--oraD),var(--oraL));border:none;border-radius:var(--r8);color:#fff;font-family:var(--ui);font-size:13px;font-weight:700;padding:10px 22px;cursor:pointer;transition:all .2s;box-shadow:var(--shOra)}
.btn-save-primary:hover{transform:translateY(-1px);box-shadow:0 10px 30px rgba(255,122,0,.42)}
.btn-danger{background:var(--slB);border:1px solid var(--slR);border-radius:var(--r8);color:var(--sl);font-family:var(--ui);font-size:13px;font-weight:600;padding:10px 18px;cursor:pointer;transition:all .16s}
.btn-danger:hover{background:var(--sl);color:#fff}
.btn-add-trade{display:flex;align-items:center;justify-content:center;gap:7px;width:calc(100% - 40px);margin:10px 20px 18px;padding:12px;background:transparent;border:1.5px dashed var(--b2);border-radius:var(--r12);color:var(--t3);font-family:var(--ui);font-size:13px;cursor:pointer;transition:all .2s}
.btn-add-trade:hover{border-color:rgba(255,122,0,.3);color:var(--oraL);background:var(--oraG)}
.sound-btn{background:rgba(255,255,255,.03);border:1px solid var(--b2);color:var(--t3);width:32px;height:32px;border-radius:var(--r8);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s}
.sound-btn:hover{border-color:var(--b3);color:var(--t1)}
.sound-btn.active{border-color:rgba(255,122,0,.3);color:var(--oraL);background:var(--oraG)}

/* ── APP SHELL ────────────────────────────────────────────── */
.app-shell{display:flex;height:100vh;overflow:hidden}

/* ── SIDEBAR ──────────────────────────────────────────────── */
.sidebar{width:var(--sbW);height:100vh;background:#040404;border-right:1px solid rgba(255,255,255,.05);display:flex;flex-direction:column;flex-shrink:0;z-index:200;transition:width .3s cubic-bezier(.4,0,.2,1);overflow:hidden;position:relative}
.sidebar::before{content:'';position:absolute;top:0;left:0;right:0;height:220px;background:radial-gradient(ellipse at 50% -30%,rgba(255,122,0,.08),transparent 70%);pointer-events:none;z-index:0}
.app-shell.collapsed .sidebar{width:var(--sbCW)}
.sb-top{display:flex;align-items:center;justify-content:space-between;padding:22px 16px 20px;border-bottom:1px solid var(--b1);min-height:84px;gap:10px;flex-shrink:0;position:relative;z-index:1}
.sb-top::after{content:'';position:absolute;bottom:0;left:16px;right:16px;height:1px;background:linear-gradient(90deg,rgba(255,122,0,.4),rgba(255,122,0,.08),transparent)}
.sb-logo-wrap{flex:1;min-width:0;cursor:pointer;display:flex;align-items:center;border-radius:var(--r10);padding:8px 6px 8px 4px;transition:background .22s;position:relative;overflow:hidden;animation:logoEntrance .8s cubic-bezier(.16,1,.3,1) both;animation-delay:.1s}
@keyframes logoEntrance{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:none}}
.sb-logo-wrap:hover{background:rgba(255,122,0,.06)}
.sb-logo-wrap:hover .sb-logo-real{filter:brightness(1.12) drop-shadow(0 0 10px rgba(255,122,0,.3));transform:translateX(2px)}
.sb-logo-wrap:active .sb-logo-real{transform:scale(.97);transition-duration:.08s}
.sb-logo-img{width:196px;height:46px;object-fit:cover;object-position:left center;display:block;flex-shrink:0;transition:transform .3s cubic-bezier(.34,1.4,.64,1),filter .3s;-webkit-mask-image:linear-gradient(90deg,#000 60%,transparent 100%);mask-image:linear-gradient(90deg,#000 60%,transparent 100%)}
.app-shell.collapsed .sb-logo-img{display:none}
.sb-logo-icon{width:44px;height:44px;object-fit:cover;object-position:4% center;border-radius:8px;display:none;transition:transform .3s cubic-bezier(.34,1.4,.64,1),filter .3s}
.app-shell.collapsed .sb-logo-icon{display:block}
.app-shell.collapsed .sb-logo-wrap{padding:7px;justify-content:center}
.sb-collapse-btn{background:transparent;border:1px solid var(--b2);color:var(--t3);width:24px;height:24px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .18s;position:relative;z-index:1}
.sb-collapse-btn:hover{border-color:rgba(255,122,0,.3);color:var(--oraL);background:var(--oraG)}
.app-shell.collapsed .sb-collapse-btn svg{transform:rotate(180deg)}
.sb-acc-wrap{padding:14px 12px 12px;border-bottom:1px solid var(--b1);position:relative;z-index:1;flex-shrink:0}
.sb-acc-lbl{font-size:8px;font-weight:800;letter-spacing:.18em;color:var(--t4);margin-bottom:8px;white-space:nowrap;overflow:hidden;transition:opacity .22s;text-transform:uppercase}
.app-shell.collapsed .sb-acc-lbl{opacity:0}
.sb-acc-btn{display:flex;align-items:center;gap:9px;width:100%;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r10);padding:10px 12px;cursor:pointer;transition:all .2s;overflow:hidden}
.sb-acc-btn:hover{border-color:rgba(255,122,0,.22);background:rgba(255,122,0,.05)}
.sb-acc-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;box-shadow:0 0 8px rgba(255,122,0,.4)}
.sb-acc-name{font-size:13px;font-weight:600;color:var(--t1);flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .22s}
.sb-acc-chevron{flex-shrink:0;transition:opacity .22s,transform .22s;color:var(--t3)}
.sb-acc-btn[aria-expanded="true"] .sb-acc-chevron{transform:rotate(180deg)}
.app-shell.collapsed .sb-acc-name,.app-shell.collapsed .sb-acc-chevron{opacity:0}
.sb-acc-drop{
  position:fixed;
  left:12px;
  width:238px;
  background:#0c0c0c;
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r12);
  z-index:99999;
  box-shadow:0 8px 40px rgba(0,0,0,.98),0 2px 8px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.8);
  overflow:hidden;
  animation:none;
}
.acc-drop-item{display:flex;align-items:center;gap:10px;padding:13px 16px;cursor:pointer;transition:background .14s;border-bottom:1px solid rgba(255,255,255,.06)}
.acc-drop-item:last-child{border-bottom:none}
.acc-drop-item:hover{background:#161616}
.acc-drop-item.acc-active{background:#181818;border-left:2.5px solid var(--ora)}
.acc-drop-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.acc-drop-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.acc-drop-name{font-size:13.5px;font-weight:700;color:#f0f0f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acc-drop-firm{font-size:11px;color:#4a4a4a;font-weight:500}
.acc-drop-bal{font-size:12px;font-family:var(--mono);font-weight:700;flex-shrink:0}
.acc-drop-new{display:flex;align-items:center;gap:8px;padding:13px 16px;font-size:13px;color:var(--oraL);font-weight:600;cursor:pointer;transition:background .14s;border-top:1px solid rgba(255,255,255,.06)}
.acc-drop-new:hover{background:#161616}
.sb-nav{flex:1;padding:14px 10px;display:flex;flex-direction:column;gap:3px;overflow-y:auto;overflow-x:hidden;position:relative;z-index:1}
.sb-nav::-webkit-scrollbar{width:0}
.sb-nav-lbl{font-size:8px;font-weight:800;letter-spacing:.18em;color:var(--t4);padding:4px 10px 10px;white-space:nowrap;transition:opacity .22s;text-transform:uppercase;flex-shrink:0}
.app-shell.collapsed .sb-nav-lbl{opacity:0}
.sb-nav-div{height:1px;background:linear-gradient(90deg,transparent,var(--b2) 30%,var(--b2) 70%,transparent);margin:6px 10px;flex-shrink:0}
.nav-item{display:flex;align-items:center;gap:12px;padding:11px 12px;background:transparent;border:1px solid transparent;border-radius:var(--r10);color:rgba(255,255,255,.28);font-family:var(--ui);font-size:13.5px;font-weight:500;cursor:pointer;width:100%;text-align:left;transition:all .2s;white-space:nowrap;overflow:hidden;letter-spacing:-.005em;position:relative;flex-shrink:0}
.nav-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:18px;height:18px}
.nav-lbl{transition:opacity .22s;flex:1}
.app-shell.collapsed .nav-lbl{opacity:0}
.nav-badge{background:var(--ora);color:#fff;font-size:9px;font-weight:700;border-radius:99px;padding:2px 7px;flex-shrink:0;box-shadow:0 2px 8px rgba(255,122,0,.4)}
.nav-item:hover{background:rgba(255,255,255,.04);color:var(--t1);border-color:var(--b2)}
.nav-item.active{background:rgba(255,122,0,.1);border-color:rgba(255,122,0,.2);color:var(--oraL)}
.nav-item.active::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:62%;background:linear-gradient(180deg,var(--oraL),var(--oraD));border-radius:0 3px 3px 0;box-shadow:0 0 10px rgba(255,122,0,.5)}
.nav-item.active .nav-icon svg{stroke:var(--oraL)}
.sb-foot{padding:14px 10px 16px;border-top:1px solid var(--b1);display:flex;align-items:center;gap:9px;flex-shrink:0;position:relative;z-index:1}
.sb-user-row{display:flex;align-items:center;gap:11px;flex:1;overflow:hidden}
.user-av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--oraD),var(--oraL));color:#fff;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 10px rgba(255,122,0,.3)}
.user-meta{overflow:hidden;transition:opacity .22s}
.app-shell.collapsed .user-meta{opacity:0}
.user-nm{display:block;font-size:13.5px;font-weight:700;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em}
.user-plan{font-size:10px;color:var(--t4);letter-spacing:.04em;margin-top:1px}
.sb-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:150;backdrop-filter:blur(8px)}

/* ── MAIN WRAP ────────────────────────────────────────────── */
.main-wrap{flex:1;display:flex;flex-direction:column;overflow:hidden}
.topbar{height:54px;background:rgba(4,4,4,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between;padding:0 24px;flex-shrink:0;z-index:100}
.tb-left,.tb-right{display:flex;align-items:center;gap:10px}
.menu-btn{background:rgba(255,255,255,.04);border:1px solid var(--b2);color:rgba(255,255,255,.3);width:32px;height:32px;border-radius:var(--r8);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s}
.menu-btn:hover{border-color:var(--b3);color:var(--t1)}
.tb-bc{display:flex;align-items:center;gap:6px;font-size:13px}
.bc-root{color:var(--t4);font-weight:600}
.tb-bc svg{stroke:var(--t4);flex-shrink:0}
.bc-page{color:var(--t1);font-weight:700;letter-spacing:-.005em}
.tb-date{background:rgba(255,255,255,.03);border:1px solid var(--b1);border-radius:99px;padding:4px 14px;font-size:11px;color:var(--t3);font-family:var(--mono);letter-spacing:.02em}
.tb-hi{font-size:13px;font-weight:600;color:var(--t2)}
.alerts-bar{background:rgba(245,158,11,.07);border-bottom:1px solid var(--beR);padding:8px 24px;display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0}
.alert-pill{display:inline-flex;align-items:center;gap:7px;background:var(--beB);border:1px solid var(--beR);border-radius:99px;padding:4px 12px;font-size:11px;font-weight:600;color:var(--be)}
.alert-pill.alert-red{background:var(--slB);border-color:var(--slR);color:var(--sl)}
.view{display:none;flex:1;overflow-y:auto}
.view.active{display:block;animation:viewSlide .32s cubic-bezier(.16,1,.3,1) both}
@keyframes viewSlide{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.vi{padding:32px 28px 60px;max-width:1320px}

/* ── DASHBOARD ────────────────────────────────────────────── */
.dash-vi{max-width:880px;margin:0 auto}
.dash-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:26px;gap:16px}
.dash-greet-label{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--t4);margin-bottom:5px;text-transform:uppercase}
.dash-title{font-size:30px;font-weight:800;color:var(--t1);letter-spacing:-.03em;line-height:1.15}
.dash-header-right{display:flex;align-items:center;gap:10px;flex-shrink:0;padding-top:4px}
.date-pill{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:99px;padding:6px 14px;font-size:11.5px;color:var(--t2);font-weight:500;white-space:nowrap}
.live-dot{width:6px;height:6px;border-radius:50%;background:var(--tp);box-shadow:0 0 8px var(--tp);animation:blink 2s ease-in-out infinite;flex-shrink:0}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}
.btn-manage-accs{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:var(--r8);color:rgba(255,255,255,.3);font-family:var(--ui);font-size:12px;font-weight:600;padding:6px 13px;cursor:pointer;transition:all .18s}
.btn-manage-accs:hover{border-color:rgba(255,122,0,.25);color:var(--oraL);background:var(--oraG)}

/* Account Hero Card */
.acc-hero-card{display:grid;grid-template-columns:1fr 1fr;background:rgba(255,255,255,.025);backdrop-filter:blur(12px);border:1px solid var(--b2);border-radius:var(--r20);padding:28px;margin-bottom:20px;position:relative;overflow:hidden;transition:border-color .25s,box-shadow .25s}
.acc-hero-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--ora),rgba(255,122,0,.3),transparent 70%)}
.acc-hero-card:hover{border-color:rgba(255,122,0,.18);box-shadow:0 8px 40px rgba(0,0,0,.5)}
.ahc-left{display:flex;flex-direction:column;gap:4px;padding-right:28px;border-right:1px solid var(--b1)}
.ahc-account-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.ahc-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.ahc-name{font-size:15px;font-weight:700;color:var(--t1);letter-spacing:-.01em}
.ahc-firm{font-size:11px;font-weight:600;color:var(--t3);background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:99px;padding:2px 9px}
.ahc-edit-btn{background:transparent;border:1px solid var(--b2);border-radius:6px;color:var(--t3);width:26px;height:26px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .14s;margin-left:auto}
.ahc-edit-btn:hover{border-color:rgba(255,122,0,.25);color:var(--oraL)}
.ahc-equity-label{font-size:9px;font-weight:700;letter-spacing:.14em;color:var(--t4);text-transform:uppercase}
.ahc-equity{font-size:36px;font-weight:800;font-family:var(--mono);color:var(--t1);letter-spacing:-.02em;line-height:1.15;margin:4px 0}
.ahc-equity-sub{display:flex;align-items:center;gap:6px;font-size:12px;font-family:var(--mono);color:var(--t3);flex-wrap:wrap}
.ahc-pnl{font-weight:700}
.ahc-sep-sm{color:var(--t4)}
.ahc-dd-lbl{color:var(--t4)}
.ahc-right{display:flex;flex-direction:column;gap:8px;padding-left:28px}
.ahc-chart-label{font-size:9px;font-weight:700;letter-spacing:.14em;color:var(--t4);text-transform:uppercase}
.ahc-chart-wrap{position:relative;flex:1;min-height:90px}
.ahc-chart-wrap canvas{width:100%!important;height:100%!important}
.eq-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--t4)}
.eq-empty.hidden{display:none}

/* KPI Strip */
.dash-kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
.dash-kpi{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:14px;padding:18px 16px;display:flex;align-items:center;gap:14px;transition:border-color .2s,transform .22s,box-shadow .22s}
.dash-kpi:hover{border-color:rgba(255,122,0,.2);transform:translateY(-2px);box-shadow:0 6px 28px rgba(0,0,0,.4)}
.dkpi-ico{width:38px;height:38px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.dkpi-green{background:rgba(16,185,129,.12);color:var(--tp);border:1px solid rgba(16,185,129,.2)}
.dkpi-ora{background:rgba(255,122,0,.1);color:var(--oraL);border:1px solid rgba(255,122,0,.18)}
.dkpi-blue{background:rgba(255,122,0,.08);color:var(--oraL);border:1px solid rgba(255,122,0,.14)}
.dkpi-fire{background:rgba(245,158,11,.1);color:var(--be);border:1px solid rgba(245,158,11,.18)}
.dkpi-data{display:flex;flex-direction:column;gap:3px;min-width:0}
.dkpi-val{font-size:20px;font-weight:800;font-family:var(--mono);color:var(--t1);letter-spacing:-.01em;line-height:1.1}
.dkpi-lbl{font-size:10px;font-weight:600;letter-spacing:.06em;color:var(--t3);text-transform:uppercase}

/* Today snapshot */
.dash-today-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:22px}
.dts-card{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r12);padding:16px 18px;display:flex;flex-direction:column;gap:5px;transition:border-color .2s,transform .2s}
.dts-card:hover{border-color:rgba(255,122,0,.16);transform:translateY(-1px)}
.dts-lbl{font-size:9px;font-weight:700;letter-spacing:.14em;color:var(--t4);text-transform:uppercase}
.dts-val{font-size:24px;font-weight:800;color:var(--t1);font-family:var(--mono);letter-spacing:-.01em;line-height:1.2}
.dts-sub{font-size:11.5px;color:var(--t3);line-height:1.5}

/* Nav cards */
.dash-nav-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}
.dnc{display:flex;align-items:flex-start;gap:18px;background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r20);padding:26px 22px;cursor:pointer;position:relative;overflow:hidden;transition:border-color .25s,box-shadow .28s,transform .25s}
.dnc::before{content:'';position:absolute;inset:0;border-radius:var(--r20);background:linear-gradient(135deg,rgba(255,255,255,.025),transparent 55%);pointer-events:none}
.dnc:not(.dnc-tip):hover{border-color:rgba(255,122,0,.22);box-shadow:0 10px 40px rgba(0,0,0,.6),0 0 0 1px rgba(255,122,0,.06);transform:translateY(-4px)}
.dnc-tip{cursor:default}
.dnc-icon{width:48px;height:48px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border:1px solid var(--b2);background:rgba(255,255,255,.04)}
.dnc-icon-ora{background:rgba(255,122,0,.1);border-color:rgba(255,122,0,.18);color:var(--oraL)}
.dnc-icon-blue{background:rgba(255,122,0,.08);border-color:rgba(255,122,0,.14);color:var(--oraL)}
.dnc-icon-grn{background:rgba(16,185,129,.1);border-color:rgba(16,185,129,.18);color:var(--tp)}
.dnc-icon-ppl{background:rgba(255,122,0,.07);border-color:rgba(255,122,0,.12);color:var(--oraL)}
.dnc-body{flex:1;min-width:0}
.dnc-title{font-size:16px;font-weight:700;color:var(--t1);margin-bottom:6px;letter-spacing:-.015em}
.dnc-desc{font-size:13px;color:rgba(255,255,255,.3);line-height:1.6;margin-bottom:10px}
.dnc-quote{font-size:13px;color:rgba(255,255,255,.28);line-height:1.8;font-style:italic;margin:0}
.dnc-meta{font-size:11px;color:var(--t4);font-family:var(--mono)}
.dnc-ck-bar{height:3px;background:var(--b2);border-radius:99px;margin-bottom:6px;overflow:hidden}
.dnc-ck-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--ora),var(--oraL));transition:width .6s ease}
.dnc-arrow{color:var(--t4);flex-shrink:0;margin-top:3px;transition:color .2s,transform .2s}
.dnc:hover .dnc-arrow{color:var(--oraL);transform:translateX(4px)}
.insights-section{margin-top:4px}
.insights-header{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--t4);text-transform:uppercase;margin-bottom:12px}
.insights-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.insight-card{background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r12);padding:14px 16px;display:flex;gap:12px;align-items:flex-start;transition:border-color .18s}
.insight-card:hover{border-color:rgba(255,122,0,.12)}
.insight-card.positive{border-color:rgba(16,185,129,.12)}
.insight-card.warning{border-color:rgba(245,158,11,.12)}
.insight-ico{font-size:17px;flex-shrink:0;margin-top:1px}
.insight-txt{font-size:12.5px;color:var(--t2);line-height:1.6}

/* ── JOURNAL ──────────────────────────────────────────────── */
.jvi{padding:18px 24px 52px;max-width:none}
.stat-strip{display:flex;align-items:center;background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r12);padding:0 8px;margin-bottom:16px;overflow-x:auto;flex-shrink:0}
.ss-item{display:flex;flex-direction:column;gap:3px;padding:14px 18px;flex-shrink:0}
.ss-lbl{font-size:8px;font-weight:700;letter-spacing:.14em;color:var(--t4);text-transform:uppercase}
.ss-val{font-size:17px;font-weight:700;color:var(--t1);font-family:var(--mono)}
.ss-sep{width:1px;height:32px;background:var(--b2);flex-shrink:0}
.j-controls{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.month-nav{display:flex;align-items:center;gap:15px}
.arrow-btn{background:rgba(255,255,255,.04);border:1px solid var(--b2);color:rgba(255,255,255,.3);width:34px;height:34px;border-radius:var(--r8);font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .18s}
.arrow-btn:hover{border-color:rgba(255,122,0,.3);color:var(--oraL);background:var(--oraG)}
.month-title{font-size:20px;font-weight:800;min-width:180px;text-align:center;letter-spacing:-.02em}
.j-controls-right{display:flex;align-items:center;gap:12px}
.eq-inline{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r8);padding:5px 11px}
.eq-label{font-size:8px;font-weight:700;letter-spacing:.14em;color:var(--t4);text-transform:uppercase}
#inlineEqChart{width:100px;display:block}
.wday-row{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:4px}
.wday-row span{text-align:center;font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--t4);padding:6px 0;text-transform:uppercase}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.day-cell{background:rgba(255,255,255,.025);border:1.5px solid var(--b2);border-radius:var(--r12);padding:13px 14px;min-height:118px;cursor:pointer;display:flex;flex-direction:column;gap:5px;overflow:hidden;position:relative;transition:transform .22s cubic-bezier(.34,1.56,.64,1),box-shadow .22s,border-color .2s;will-change:transform}
.day-cell:not(.empty):hover{transform:translateY(-4px) scale(1.015);border-color:rgba(255,122,0,.22);z-index:2;box-shadow:0 12px 40px rgba(0,0,0,.7),0 0 0 1px rgba(255,122,0,.08)}
.day-cell.empty{background:rgba(255,255,255,.01);border-color:transparent;cursor:default;opacity:.12}
.day-cell.empty:hover{transform:none;box-shadow:none}
.day-cell.today{border-color:rgba(255,122,0,.4)}
.day-cell.today::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--ora),var(--oraL));border-radius:var(--r12) var(--r12) 0 0}
.day-cell.tp-day{background:linear-gradient(155deg,rgba(255,255,255,.025) 40%,rgba(16,185,129,.07));border-color:var(--tpR)}
.day-cell.sl-day{background:linear-gradient(155deg,rgba(255,255,255,.025) 40%,rgba(244,63,94,.07));border-color:var(--slR)}
.day-cell.be-day{background:linear-gradient(155deg,rgba(255,255,255,.025) 40%,rgba(245,158,11,.07));border-color:var(--beR)}
.day-cell.tp-day:not(.empty):hover{box-shadow:0 12px 40px rgba(0,0,0,.7),0 0 30px rgba(16,185,129,.18)}
.day-cell.sl-day:not(.empty):hover{box-shadow:0 12px 40px rgba(0,0,0,.7),0 0 30px rgba(244,63,94,.18)}
.day-cell.be-day:not(.empty):hover{box-shadow:0 12px 40px rgba(0,0,0,.7),0 0 30px rgba(245,158,11,.18)}
.day-num-row{display:flex;align-items:center;justify-content:space-between}
.day-num{font-size:16px;font-weight:800;color:rgba(255,255,255,.18);line-height:1;letter-spacing:-.01em}
.day-cell.today .day-num{color:var(--oraL)}
.day-cnt{font-size:9px;font-weight:700;color:rgba(255,255,255,.2);background:rgba(255,255,255,.06);border:1px solid var(--b2);padding:1px 5px;border-radius:99px}
.day-dots{display:flex;gap:3px;flex-wrap:wrap}
.day-dot{width:6px;height:6px;border-radius:50%}
.day-dot.tp{background:var(--tp);box-shadow:0 0 6px rgba(16,185,129,.55)}
.day-dot.sl{background:var(--sl);box-shadow:0 0 6px rgba(244,63,94,.55)}
.day-dot.be{background:var(--be);box-shadow:0 0 6px rgba(245,158,11,.5)}
.day-dot.win{background:var(--tp)}.day-dot.loss{background:var(--sl)}
.day-pnl{font-size:12px;font-weight:700;font-family:var(--mono);margin-top:auto}
.day-pnl.pos{color:var(--tp)}.day-pnl.neg{color:var(--sl)}.day-pnl.be{color:var(--be)!important}
.day-pct{font-size:10px;font-family:var(--mono)}
.day-pct.pos{color:rgba(16,185,129,.55)}.day-pct.neg{color:rgba(244,63,94,.55)}.day-pct.be{color:var(--beL)!important}

/* ── CHECKLIST ────────────────────────────────────────────── */
.ckvi{padding:22px 24px 52px;max-width:none}
.tabs-bar{display:flex;gap:2px;border-bottom:1px solid var(--b2);margin-bottom:20px}
.tab{display:flex;align-items:center;gap:6px;padding:10px 16px;background:transparent;border:none;color:rgba(255,255,255,.25);font-family:var(--ui);font-size:13px;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .16s}
.tab:hover{color:var(--t1)}
.tab.active{color:var(--oraL);border-bottom-color:var(--oraL)}
.tab-panel{display:none}.tab-panel.active{display:block;animation:viewSlide .26s ease both}
.ck-layout{display:grid;grid-template-columns:310px 1fr;gap:16px;align-items:start}
.ck-config-panel,.ck-live-panel{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r16);padding:22px}
.panel-head{margin-bottom:18px}
.panel-title{font-size:16px;font-weight:700;color:var(--t1);margin-bottom:4px;letter-spacing:-.01em}
.panel-sub{font-size:12px;color:var(--t4);line-height:1.5}
.ck-conf-list{display:flex;flex-direction:column;gap:4px;margin-bottom:14px;min-height:36px}
.ck-conf-item{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r8);padding:9px 11px;transition:border-color .15s;animation:itemSlide .18s ease both}
@keyframes itemSlide{from{opacity:0;transform:translateX(-5px)}to{opacity:1;transform:none}}
.ck-conf-item:hover{border-color:var(--b3)}
.ck-conf-drag{color:var(--t4);font-size:14px;cursor:grab;flex-shrink:0}
.ck-conf-txt{flex:1;font-size:13px;color:var(--t1);line-height:1.4;word-break:break-word}
.ck-conf-del{background:transparent;border:none;color:var(--t4);width:20px;height:20px;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .14s;flex-shrink:0}
.ck-conf-del:hover{color:var(--sl);background:var(--slB)}
.ck-add-row{display:flex;gap:8px;margin-bottom:14px}
.ck-add-input{flex:1;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r8);color:var(--t1);font-family:var(--ui);font-size:13px;padding:10px 12px;outline:none;transition:border-color .16s,box-shadow .16s}
.ck-add-input::placeholder{color:var(--t4)}
.ck-add-input:focus{border-color:var(--ora);box-shadow:0 0 0 3px var(--oraG)}
.ck-add-btn{background:var(--ora);border:none;border-radius:var(--r8);color:#fff;width:38px;height:38px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all .18s}
.ck-add-btn:hover{background:var(--oraL);transform:translateY(-1px)}
.ck-actions{display:flex;gap:8px}
.ck-live-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.ck-date-title{font-size:16px;font-weight:700;color:var(--t1);margin-bottom:2px;letter-spacing:-.01em}
.ck-date-sub{font-size:11px;color:var(--t4)}
.live-badge{display:flex;align-items:center;gap:5px;font-size:9px;font-weight:700;letter-spacing:.11em;color:var(--tp);background:var(--tpB);border:1px solid var(--tpR);border-radius:99px;padding:3px 10px}
.gauge-card{display:flex;align-items:center;gap:22px;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r12);padding:18px 20px;margin-bottom:18px}
.gauge-wrap{position:relative;width:104px;height:104px;flex-shrink:0}
.gauge-svg{width:104px;height:104px}
.gauge-track{fill:none;stroke:var(--b2);stroke-width:9}
.gauge-arc{fill:none;stroke:var(--oraL);stroke-width:9;stroke-linecap:round;transition:stroke-dashoffset .55s cubic-bezier(.34,1.2,.64,1),stroke .4s}
.gauge-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.gauge-pct{font-size:21px;font-weight:800;font-family:var(--mono);color:var(--t1);line-height:1}
.gauge-count{font-size:10px;color:var(--t3);font-family:var(--mono)}
.gauge-info{flex:1;min-width:0}
.prob-badge{display:inline-block;font-size:9px;font-weight:700;letter-spacing:.1em;padding:2px 10px;border-radius:99px;background:rgba(255,255,255,.04);border:1px solid var(--b2);color:var(--t3);margin-bottom:8px;transition:all .3s;text-transform:uppercase}
.prob-msg{font-size:13px;color:var(--t2);line-height:1.65;margin-bottom:12px}
.prob-segs{display:flex;gap:4px;margin-bottom:4px}
.pseg{flex:1;height:4px;border-radius:99px;background:var(--b2);border:1px solid var(--b2);transition:background .3s,border-color .3s}
.pseg.seg-low{background:var(--sl);border-color:rgba(244,63,94,.4)}
.pseg.seg-med{background:var(--be);border-color:rgba(245,158,11,.4)}
.pseg.seg-blue{background:var(--oraL);border-color:rgba(255,122,0,.4)}
.pseg.seg-full{background:var(--tp);border-color:rgba(16,185,129,.4)}
.prob-seg-labels{display:flex;justify-content:space-between;font-size:9px;color:var(--t4)}
.gauge-card.p-none .gauge-arc{stroke:var(--b3)}
.gauge-card.p-low .gauge-arc{stroke:var(--sl)}.gauge-card.p-low .prob-badge{background:var(--slB);border-color:var(--slR);color:var(--sl)}
.gauge-card.p-med .gauge-arc{stroke:var(--be)}.gauge-card.p-med .prob-badge{background:var(--beB);border-color:var(--beR);color:var(--be)}
.gauge-card.p-good .gauge-arc{stroke:var(--oraL)}.gauge-card.p-good .prob-badge{background:var(--oraG);border-color:rgba(255,122,0,.22);color:var(--oraL)}
.gauge-card.p-full .gauge-arc{stroke:var(--tp)}.gauge-card.p-full .prob-badge{background:var(--tpB);border-color:var(--tpR);color:var(--tp)}
.ck-live-list{display:flex;flex-direction:column;gap:5px;margin-bottom:16px}
.ck-empty-msg{font-size:13px;color:var(--t4);text-align:center;padding:22px;line-height:1.65}
.ck-live-item{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r10);padding:13px 15px;cursor:pointer;transition:all .2s;user-select:none;animation:itemSlide .2s ease both}
.ck-live-item:hover{border-color:var(--b3);transform:translateX(2px);background:rgba(255,255,255,.04)}
.ck-live-item.ck-checked{background:rgba(255,122,0,.06);border-color:rgba(255,122,0,.2)}
.ck-checkbox{width:19px;height:19px;border-radius:5px;border:2px solid var(--b3);background:transparent;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s cubic-bezier(.34,1.56,.64,1)}
.ck-live-item.ck-checked .ck-checkbox{background:var(--ora);border-color:var(--oraD);box-shadow:0 0 12px rgba(255,122,0,.35)}
.ck-checkbox svg{display:none}.ck-live-item.ck-checked .ck-checkbox svg{display:block}
.ck-item-txt{font-size:13.5px;color:rgba(255,255,255,.3);flex:1;line-height:1.4;transition:color .18s}
.ck-live-item.ck-checked .ck-item-txt{color:var(--t1)}
.ck-item-num{font-size:10px;font-family:var(--mono);color:var(--t4);flex-shrink:0}
.ck-live-item.ck-checked .ck-item-num{color:var(--oraL)}
.ck-obs-section{margin-bottom:16px}
.ck-obs-label{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:700;letter-spacing:.11em;color:var(--t4);margin-bottom:8px;text-transform:uppercase}
.ck-obs-area{width:100%;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r8);color:var(--t1);font-family:var(--ui);font-size:13px;padding:11px 13px;outline:none;resize:vertical;min-height:72px;line-height:1.6;transition:border-color .16s,box-shadow .16s}
.ck-obs-area::placeholder{color:var(--t4)}
.ck-obs-area:focus{border-color:var(--ora);box-shadow:0 0 0 3px var(--oraG)}
.ck-result-row{display:flex;align-items:center;justify-content:space-between;padding-top:16px;border-top:1px solid var(--b2);flex-wrap:wrap;gap:10px}
.ck-result-lbl{font-size:12px;font-weight:600;color:var(--t3)}
.ck-pills{display:flex;gap:6px;flex-wrap:wrap}
.ck-pill{background:rgba(255,255,255,.04);border:1.5px solid var(--b2);border-radius:99px;color:rgba(255,255,255,.2);font-family:var(--ui);font-size:11px;font-weight:600;padding:5px 14px;cursor:pointer;transition:all .16s}
.ck-pill:hover{border-color:var(--b3);color:var(--t1)}
.ck-pill.p-win{background:var(--tpB);border-color:var(--tpR);color:var(--tp)}
.ck-pill.p-be{background:var(--beB);border-color:var(--beR);color:var(--be)}
.ck-pill.p-loss{background:var(--slB);border-color:var(--slR);color:var(--sl)}
.ck-pill.p-skip{background:rgba(255,255,255,.06);border-color:var(--b3);color:var(--t1)}
.ck-hist-ctrl{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.ck-hist-month{font-size:18px;font-weight:800;min-width:175px;text-align:center;letter-spacing:-.01em}
.ck-legend{display:flex;gap:14px;margin-bottom:14px;flex-wrap:wrap}
.cl-i{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--t3);font-weight:500}
.cl-dot{width:8px;height:8px;border-radius:50%}
.ld-full{background:var(--tp);box-shadow:0 0 6px rgba(16,185,129,.5)}
.ld-high{background:var(--oraL);box-shadow:0 0 6px rgba(255,122,0,.5)}
.ld-med{background:var(--be);box-shadow:0 0 6px rgba(245,158,11,.4)}
.ld-low{background:var(--sl);box-shadow:0 0 6px rgba(244,63,94,.4)}
.ld-none{background:var(--b3)}
.ck-hist-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;max-width:880px;margin:0 auto}
.ck-hist-cell{background:rgba(255,255,255,.025);border:1.5px solid var(--b2);border-radius:var(--r12);padding:10px 11px;min-height:80px;cursor:pointer;transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s,border-color .18s;display:flex;flex-direction:column;gap:3px}
.ck-hist-cell:not(.ck-empty):hover{transform:translateY(-2px) scale(1.01);box-shadow:0 6px 24px rgba(0,0,0,.6);border-color:rgba(255,122,0,.2)}
.ck-hist-cell.ck-empty{background:rgba(255,255,255,.01);border-color:transparent;cursor:default;opacity:.1}
.ck-hist-cell.today-ck{border-color:rgba(255,122,0,.32)}
.ck-hist-dn{font-size:13px;font-weight:700;color:rgba(255,255,255,.18)}
.ck-hist-cell.today-ck .ck-hist-dn{color:var(--oraL)}
.ck-hist-pct{display:none}
.ck-hist-count{font-size:11px;font-weight:700;color:rgba(255,255,255,.3);margin-top:2px}
.ck-hist-summary{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.ck-hs-tp{font-size:9px;font-weight:700;padding:1px 5px;border-radius:99px;background:var(--tpB);color:var(--tp);border:1px solid var(--tpR)}
.ck-hs-sl{font-size:9px;font-weight:700;padding:1px 5px;border-radius:99px;background:var(--slB);color:var(--sl);border:1px solid var(--slR)}
.ck-hs-be{font-size:9px;font-weight:700;padding:1px 5px;border-radius:99px;background:var(--beB);color:var(--be);border:1px solid var(--beR)}
.ck-hfull{background:linear-gradient(155deg,rgba(255,255,255,.025) 45%,rgba(16,185,129,.07));border-color:var(--tpR)}
.ck-hhigh{background:linear-gradient(155deg,rgba(255,255,255,.025) 45%,rgba(255,122,0,.07));border-color:rgba(255,122,0,.18)}
.ck-hmed{background:linear-gradient(155deg,rgba(255,255,255,.025) 45%,rgba(245,158,11,.07));border-color:rgba(245,158,11,.18)}
.ck-hlow{background:linear-gradient(155deg,rgba(255,255,255,.025) 45%,rgba(244,63,94,.06));border-color:var(--slR)}

/* ── STATS ────────────────────────────────────────────────── */
.big-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-bottom:20px}
.bk{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r12);padding:20px;display:flex;flex-direction:column;gap:6px;transition:border-color .2s,transform .22s,box-shadow .22s}
.bk:hover{border-color:rgba(255,122,0,.18);transform:translateY(-2px);box-shadow:0 6px 24px rgba(0,0,0,.4)}
.bk-lbl{font-size:9px;font-weight:700;letter-spacing:.12em;color:var(--t4);text-transform:uppercase}
.bk-val{font-size:24px;font-weight:800;font-family:var(--mono);color:var(--t1);letter-spacing:-.01em}
.stats-2col{display:grid;grid-template-columns:1.7fr 1fr;gap:13px}
.s-card{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r16);padding:22px;position:relative;overflow:hidden}
.s-card-head{margin-bottom:13px}
.s-card-title{font-size:10px;font-weight:700;letter-spacing:.09em;color:var(--t3);text-transform:uppercase}
.s-rows{display:flex;flex-direction:column}
.s-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--b1);font-size:13px;color:rgba(255,255,255,.3)}
.s-row:last-child{border-bottom:none}
.s-row .mono{font-size:13px;font-weight:700;color:var(--t1)}
.tbl-wrap{overflow-x:auto}
.data-tbl{width:100%;border-collapse:collapse;font-size:12px}
.data-tbl th{font-size:9px;font-weight:700;letter-spacing:.12em;color:var(--t4);text-align:left;padding:8px 13px;border-bottom:1px solid var(--b2);text-transform:uppercase}
.data-tbl td{padding:10px 13px;color:rgba(255,255,255,.3);border-bottom:1px solid var(--b1);font-family:var(--mono);font-size:12px}
.data-tbl td:first-child{font-family:var(--ui);font-weight:600;color:var(--t1)}
.data-tbl tr:last-child td{border-bottom:none}
.data-tbl tr:hover td{background:rgba(255,255,255,.02)}
.tbl-empty{text-align:center;padding:26px;font-size:13px;color:var(--t4);line-height:1.6}
.insight-box{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r12);padding:16px 18px;margin-bottom:16px;font-size:13.5px;color:rgba(255,255,255,.3);line-height:1.7}
.psych-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:11px;margin-bottom:14px}
.emo-card{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r12);padding:16px;transition:border-color .16s,transform .2s}
.emo-card:hover{border-color:rgba(255,122,0,.16);transform:translateY(-1px)}
.emo-name{font-size:14px;font-weight:700;color:var(--t1);margin-bottom:10px;text-transform:capitalize;letter-spacing:-.01em}
.emo-stat{display:flex;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.3);padding:5px 0;border-bottom:1px solid var(--b1)}
.emo-stat:last-child{border-bottom:none}
.emo-stat span:last-child{font-family:var(--mono);font-weight:700;color:var(--t1)}
.streak-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;margin-bottom:14px}
.streak-card{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r12);padding:20px}
.sk-lbl{font-size:10px;font-weight:700;letter-spacing:.11em;color:var(--t4);margin-bottom:7px;text-transform:uppercase}
.sk-val{font-size:30px;font-weight:800;font-family:var(--mono);color:var(--t1);letter-spacing:-.02em}
.sk-sub{font-size:12px;color:var(--t3);margin-top:5px}
.hist-controls{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.hist-search-wrap{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r8);padding:9px 13px;flex:1;min-width:200px}
.hist-search-wrap svg{color:var(--t4);flex-shrink:0}
.hist-search{background:transparent;border:none;color:var(--t1);font-family:var(--ui);font-size:13px;outline:none;flex:1}
.hist-search::placeholder{color:var(--t4)}
.hist-filters{display:flex;gap:8px;flex-wrap:wrap}
.hist-filters select{background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r8);color:rgba(255,255,255,.3);font-family:var(--ui);font-size:12px;padding:8px 28px 8px 12px;outline:none;cursor:pointer;transition:border-color .16s;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23444'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.hist-filters select:focus{border-color:rgba(255,122,0,.3)}
.hist-table-wrap{overflow-x:auto;background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r12)}
.hist-tbl{min-width:900px}
.hist-tbl td{font-size:12px;padding:10px 13px;vertical-align:middle}
.hist-tbl td:first-child{font-family:var(--mono);font-size:11px;color:var(--t3)}
.hist-result-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:700;padding:2px 8px;border-radius:99px}
.hist-tp{background:var(--tpB);color:var(--tp);border:1px solid var(--tpR)}
.hist-sl{background:var(--slB);color:var(--sl);border:1px solid var(--slR)}
.hist-be{background:var(--beB);color:var(--be);border:1px solid var(--beR)}
.hist-none{background:rgba(255,255,255,.04);color:var(--t3);border:1px solid var(--b2)}
.hist-session-badge{display:inline-block;font-size:10px;font-weight:600;padding:2px 7px;background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:5px;color:var(--t3)}
.hist-tags{display:flex;flex-wrap:wrap;gap:3px}
.hist-tag{font-size:9px;font-weight:600;padding:1px 6px;background:rgba(255,122,0,.08);border:1px solid rgba(255,122,0,.16);border-radius:99px;color:var(--oraL)}
.hist-count{font-size:11px;color:var(--t4);padding:10px 0}
.hist-date-range{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:8px;padding:6px 12px}
.hist-date-range svg{color:var(--t4);flex-shrink:0}
.hist-date-input{background:transparent;border:none;color:var(--t1);font-family:var(--mono);font-size:12px;outline:none;cursor:pointer;padding:0}
.hist-date-input::-webkit-calendar-picker-indicator{filter:invert(.2);cursor:pointer}
.hist-date-sep{font-size:11px;color:var(--t4);flex-shrink:0}
.hist-clear-dates{background:transparent;border:none;color:var(--t4);cursor:pointer;font-size:11px;padding:0 2px;transition:color .14s;flex-shrink:0}
.hist-clear-dates:hover{color:var(--sl)}

/* ── MODALS ───────────────────────────────────────────────── */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.82);backdrop-filter:blur(16px);z-index:500;display:none;align-items:center;justify-content:center;padding:18px}
.overlay.open{display:flex}
.modal{background:rgba(10,10,10,.97);backdrop-filter:blur(20px);border:1px solid var(--b2);border-radius:var(--r24);width:100%;max-width:560px;max-height:92vh;overflow-y:auto;box-shadow:var(--sh);animation:modalRise .3s cubic-bezier(.16,1,.3,1) both}
.modal-wide{max-width:720px}
@keyframes modalRise{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:20px 22px 15px;border-bottom:1px solid var(--b2);position:sticky;top:0;background:rgba(10,10,10,.97);backdrop-filter:blur(20px);z-index:5}
.modal-head-left{display:flex;align-items:center;gap:13px}
.modal-day-ico{width:38px;height:38px;border-radius:10px;background:rgba(255,122,0,.1);border:1px solid rgba(255,122,0,.18);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--oraL)}
.modal-title{font-size:16px;font-weight:700;color:var(--t1);margin-bottom:2px;letter-spacing:-.01em}
.modal-sub{font-size:12px;color:var(--t3);display:block}
.modal-sub.pos{color:var(--tp)}.modal-sub.neg{color:var(--sl)}.modal-sub.be{color:var(--be)!important}
.modal-close{background:rgba(255,255,255,.04);border:1px solid var(--b2);color:rgba(255,255,255,.2);width:30px;height:30px;border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .14s;flex-shrink:0}
.modal-close:hover{border-color:var(--slR);color:var(--sl);background:var(--slB)}
.trade-item{background:rgba(255,255,255,.025);border:1.5px solid var(--b2);border-radius:var(--r12);padding:15px;margin:7px 20px;position:relative;transition:border-color .16s;animation:itemSlide .2s ease both}
.trade-item:hover{border-color:var(--b3)}
.trade-item.t-tp{border-left:3px solid var(--tp)}.trade-item.t-sl{border-left:3px solid var(--sl)}.trade-item.t-be{border-left:3px solid var(--be)}.trade-item.t-win{border-left:3px solid var(--tp)}.trade-item.t-loss{border-left:3px solid var(--sl)}
.ti-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:8px;flex-wrap:wrap}
.ti-pair{font-size:15px;font-weight:700;color:var(--t1);letter-spacing:-.01em}
.ti-badges{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.ti-dir{font-size:9px;font-weight:700;letter-spacing:.09em;padding:3px 8px;border-radius:5px;text-transform:uppercase}
.ti-dir.compra,.ti-dir.long{background:var(--tpB);color:var(--tp);border:1px solid var(--tpR)}
.ti-dir.venta,.ti-dir.short{background:var(--slB);color:var(--sl);border:1px solid var(--slR)}
.ti-res{font-size:9px;font-weight:700;padding:3px 8px;border-radius:5px}
.ti-res-tp{background:var(--tpB);color:var(--tp);border:1px solid var(--tpR)}
.ti-res-sl{background:var(--slB);color:var(--sl);border:1px solid var(--slR)}
.ti-res-be{background:var(--beB);color:var(--be);border:1px solid var(--beR)}
.ti-session{font-size:9px;font-weight:600;padding:3px 8px;border-radius:5px;background:rgba(255,255,255,.04);color:var(--t3);border:1px solid var(--b2)}
.ti-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:8px}
.ti-m{display:flex;flex-direction:column;gap:2px}
.ti-ml{font-size:8px;font-weight:700;letter-spacing:.12em;color:var(--t4);text-transform:uppercase}
.ti-mv{font-size:14px;font-weight:700;font-family:var(--mono);color:var(--t1)}
.ti-mv.pos{color:var(--tp)}.ti-mv.neg{color:var(--sl)}.ti-mv.be{color:var(--be)}
.ti-section-label{font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--t4);text-transform:uppercase;margin-bottom:5px;margin-top:10px;display:flex;align-items:center;gap:5px}
.ti-notes-box{font-size:13px;color:rgba(255,255,255,.3);line-height:1.65;padding:10px 12px;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r8);word-break:break-word}
.ti-confs-list{display:flex;flex-direction:column;gap:4px;padding:9px 12px;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r8)}
.ti-conf-row{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.3)}
.ti-conf-dot{width:5px;height:5px;border-radius:50%;background:var(--tp);flex-shrink:0}
.ti-psycho-row{display:flex;gap:12px;flex-wrap:wrap;padding:8px 12px;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r8);font-size:12px;color:rgba(255,255,255,.3)}
.ti-psy-item{display:flex;flex-direction:column;gap:2px}
.ti-psy-lbl{font-size:9px;font-weight:700;letter-spacing:.1em;color:var(--t4);text-transform:uppercase}
.ti-psy-val{font-size:13px;font-weight:600;color:var(--t1);text-transform:capitalize}
.ti-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.ti-tag{font-size:10px;font-weight:600;padding:2px 8px;background:rgba(255,122,0,.08);border:1px solid rgba(255,122,0,.16);border-radius:99px;color:var(--oraL)}
.ti-acts{position:absolute;top:11px;right:12px;display:flex;gap:4px;opacity:0;transition:opacity .14s}
.trade-item:hover .ti-acts{opacity:1}
.ti-btn{background:rgba(255,255,255,.04);border:1px solid var(--b2);color:rgba(255,255,255,.2);width:26px;height:26px;border-radius:5px;font-size:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .14s}
.ti-btn:hover{border-color:rgba(255,122,0,.3);color:var(--oraL)}
.ti-btn.del:hover{border-color:var(--slR);color:var(--sl)}
.trade-empty{text-align:center;padding:24px;font-size:13px;color:var(--t4);line-height:1.7}

/* ── TRADE FORM ───────────────────────────────────────────── */
.trade-form{padding:18px 22px;border-top:1px solid var(--b2);animation:viewSlide .22s ease both}
.trade-form.hidden{display:none}
.tf-header{padding:20px 24px 16px;border-bottom:1px solid var(--b2);background:linear-gradient(180deg,rgba(255,255,255,.025) 0%,transparent 100%)}
.tf-header-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;color:var(--t1);letter-spacing:-.01em;margin-bottom:3px}
.tf-header-meta{font-size:11px;color:var(--t4);letter-spacing:.03em}
.tf-section{padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.05)}
.tf-section:last-of-type{border-bottom:none}
.tf-section-label{font-size:9px;font-weight:800;letter-spacing:.16em;color:var(--t4);text-transform:uppercase;margin-bottom:14px}
.tf-section-media{background:rgba(255,255,255,.01)}
.tf-core-grid{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:end}
.tf-numbers-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:12px}
.tf-media-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tf-label{display:block;font-size:10px;font-weight:700;letter-spacing:.06em;color:var(--t3);margin-bottom:7px;text-transform:uppercase}
.tf-input-wrap{position:relative;display:flex;align-items:center}
.tf-input-wrap.tf-input-icon-left svg{position:absolute;left:13px;pointer-events:none;color:var(--t3);flex-shrink:0}
.tf-input{width:100%;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:10px;color:var(--t1);font-family:var(--ui);font-size:14px;font-weight:500;padding:12px 14px;outline:none;transition:border-color .18s,box-shadow .18s,background .18s;appearance:none;-webkit-appearance:none}
.tf-input-wrap.tf-input-icon-left .tf-input{padding-left:38px}
.tf-input::placeholder{color:var(--t4);font-weight:400}
.tf-input:hover{border-color:var(--b3);background:rgba(255,255,255,.04)}
.tf-input:focus{border-color:var(--ora);box-shadow:0 0 0 3px var(--oraG);background:rgba(255,122,0,.02)}
.tf-input[type="number"]{font-family:var(--mono);font-size:15px;font-weight:600}
select.tf-input{cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23444'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
select.tf-input option{background:#111}
.dir-toggle{display:flex;border:1.5px solid var(--b2);border-radius:10px;overflow:hidden;min-width:180px}
.dir-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;background:transparent;border:none;color:rgba(255,255,255,.2);font-family:var(--ui);font-size:13px;font-weight:700;padding:12px 10px;cursor:pointer;transition:all .2s}
.dir-btn:first-child{border-right:1px solid var(--b2)}
.dir-btn:hover:not(.dir-active){background:rgba(255,255,255,.04);color:var(--t1)}
.dir-active[data-dir="compra"]{background:rgba(16,185,129,.12);color:var(--tp)}
.dir-active[data-dir="venta"]{background:rgba(244,63,94,.12);color:var(--sl)}
.result-toggle{display:flex;border:1.5px solid var(--b2);border-radius:10px;overflow:hidden;min-width:160px}
.res-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;background:transparent;border:none;color:rgba(255,255,255,.2);font-family:var(--ui);font-size:12px;font-weight:800;padding:12px 6px;cursor:pointer;transition:all .2s;border-right:1px solid var(--b2);letter-spacing:.04em}
.res-btn:last-child{border-right:none}
.res-btn:hover:not(.res-active-tp):not(.res-active-sl):not(.res-active-be){background:rgba(255,255,255,.04);color:var(--t1)}
.res-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.res-tp-dot{background:var(--tp);box-shadow:0 0 8px rgba(16,185,129,.6)}
.res-be-dot{background:var(--be);box-shadow:0 0 8px rgba(245,158,11,.5)}
.res-sl-dot{background:var(--sl);box-shadow:0 0 8px rgba(244,63,94,.6)}
.res-btn.res-active-tp{background:rgba(16,185,129,.14);color:var(--tp)}
.res-btn.res-active-be{background:rgba(245,158,11,.14);color:var(--be)}
.res-btn.res-active-sl{background:rgba(244,63,94,.14);color:var(--sl)}
.tf-psych-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.tf-emo-group{display:flex;flex-wrap:wrap;gap:6px}
.tf-emo-btn{background:rgba(255,255,255,.04);border:1.5px solid var(--b2);border-radius:99px;color:rgba(255,255,255,.3);font-family:var(--ui);font-size:12px;font-weight:500;padding:6px 13px;cursor:pointer;transition:all .18s}
.tf-emo-btn:hover{border-color:var(--b3);color:var(--t1)}
.tf-emo-btn.emo-active{background:rgba(255,122,0,.1);border-color:rgba(255,122,0,.28);color:var(--oraL);font-weight:700}
.tf-confidence-field{margin-top:0}
.tf-conf-wrap{display:flex;align-items:center;gap:12px;margin-top:6px}
.tf-conf-label{font-size:10px;font-weight:600;color:var(--t3);letter-spacing:.05em;flex-shrink:0}
.tf-conf-low{color:var(--sl)}.tf-conf-high{color:var(--tp)}
.tf-conf-display{font-family:var(--mono);font-size:15px;font-weight:800;color:var(--oraL);background:rgba(255,122,0,.1);border:1px solid rgba(255,122,0,.2);border-radius:6px;padding:0 8px;margin-left:6px}
.tf-conf-max{font-size:11px;color:var(--t4);margin-left:2px}
.conf-slider{flex:1;-webkit-appearance:none;appearance:none;height:4px;border-radius:99px;background:var(--b3);outline:none}
.conf-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--oraL);cursor:pointer;border:2px solid var(--oraD);box-shadow:0 0 10px rgba(255,122,0,.45)}
.tf-tags-wrap{display:flex;flex-direction:column;gap:8px}
.tf-tags-display{display:flex;flex-wrap:wrap;gap:5px;min-height:28px}
.tf-tag-chip{display:inline-flex;align-items:center;gap:5px;background:rgba(255,122,0,.1);border:1px solid rgba(255,122,0,.2);border-radius:99px;padding:3px 10px;font-size:11px;font-weight:600;color:var(--oraL);animation:tagPop .18s cubic-bezier(.34,1.56,.64,1) both}
@keyframes tagPop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
.tf-tag-remove{background:transparent;border:none;color:rgba(255,122,0,.45);cursor:pointer;width:14px;height:14px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;transition:all .14s;padding:0}
.tf-tag-remove:hover{background:rgba(244,63,94,.2);color:var(--sl)}
.tf-tags-input-row{display:flex;gap:8px}
.tf-tags-input-row .tf-input{flex:1;font-size:13px;padding:10px 13px}
.tf-tag-add-btn{background:var(--ora);border:none;border-radius:9px;color:#fff;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all .18s}
.tf-tag-add-btn:hover{background:var(--oraL);transform:translateY(-1px)}
.tf-textarea{width:100%;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:10px;color:var(--t1);font-family:var(--ui);font-size:14px;padding:13px 15px;outline:none;resize:vertical;min-height:88px;line-height:1.65;transition:border-color .18s,box-shadow .18s}
.tf-textarea::placeholder{color:var(--t4)}
.tf-textarea:hover{border-color:var(--b3);background:rgba(255,255,255,.04)}
.tf-textarea:focus{border-color:var(--ora);box-shadow:0 0 0 3px var(--oraG);background:rgba(255,122,0,.02)}
.img-drop-zone{position:relative;min-height:120px;background:rgba(255,255,255,.02);border:1.5px dashed var(--b2);border-radius:var(--r12);cursor:pointer;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:border-color .18s,background .18s}
.img-drop-zone:hover,.img-drop-zone.drag-over{border-color:rgba(255,122,0,.3);background:rgba(255,122,0,.04)}
.img-drop-zone.has-image{border-style:solid;border-color:var(--b2);cursor:default}
.img-drop-placeholder{display:flex;flex-direction:column;align-items:center;gap:8px;color:rgba(255,255,255,.15);font-size:12px;font-weight:500;padding:16px;text-align:center;pointer-events:none}
.img-drop-icon{margin-bottom:4px;color:rgba(255,255,255,.12)}
.img-drop-text{font-size:13px;font-weight:600;color:rgba(255,255,255,.25)}
.img-drop-hint{font-size:11px;color:rgba(255,255,255,.14)}
.img-preview-wrap{position:relative;width:100%;min-height:120px}
.img-preview{width:100%;display:block;object-fit:cover;max-height:120px;border-radius:calc(var(--r12) - 2px)}
.img-remove-btn{position:absolute;top:7px;right:7px;width:28px;height:28px;border-radius:7px;background:rgba(0,0,0,.75);border:1px solid rgba(255,255,255,.1);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s}
.img-remove-btn:hover{background:var(--sl);border-color:var(--sl)}
.img-error-msg{position:absolute;bottom:8px;left:0;right:0;text-align:center;font-size:11px;font-weight:600;color:var(--sl);background:rgba(0,0,0,.7);padding:5px 10px}
.form-link-group{display:flex;flex-direction:column}
#fLink{background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r8);color:var(--t1);font-family:var(--ui);font-size:12px;padding:10px 13px;outline:none;transition:border-color .16s,box-shadow .16s;margin-bottom:7px;width:100%}
#fLink::placeholder{color:var(--t4);font-size:11px}
#fLink:focus{border-color:var(--ora);box-shadow:0 0 0 3px var(--oraG)}
.link-preview-row{display:flex;align-items:center;gap:6px;padding:7px 11px;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r8);font-size:11px;overflow:hidden}
.link-preview-row svg{stroke:var(--oraL);flex-shrink:0}
.link-preview-text{overflow:hidden;text-overflow:ellipsis;color:var(--oraL);font-weight:600;white-space:nowrap}
.form-ck-snap{background:rgba(255,255,255,.02);border:1.5px solid var(--b2);border-radius:var(--r8);padding:12px 14px}
.fck-label{display:flex;align-items:center;gap:6px;font-size:9px;font-weight:700;letter-spacing:.13em;color:var(--t3);text-transform:uppercase;margin-bottom:9px}
.fck-label svg{stroke:var(--oraL)}
.fck-list{display:flex;flex-direction:column;gap:5px}
.fck-item{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.3)}
.fck-dot{width:5px;height:5px;border-radius:50%;background:var(--tp);flex-shrink:0}
.tf-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:18px 24px 22px;border-top:1px solid var(--b2)}
.btn-save-trade-premium{display:inline-flex;align-items:center;gap:9px;background:linear-gradient(135deg,var(--oraD),var(--oraL));border:none;border-radius:10px;color:#fff;font-family:var(--ui);font-size:14px;font-weight:700;padding:13px 28px;cursor:pointer;transition:all .22s;box-shadow:var(--shOra),inset 0 1px 0 rgba(255,255,255,.1);letter-spacing:.005em}
.btn-save-trade-premium:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(255,122,0,.45),inset 0 1px 0 rgba(255,255,255,.1)}
.btn-save-trade-premium:active{transform:none}
.ti-image-wrap{margin-top:10px;border-radius:var(--r12);overflow:hidden;position:relative;cursor:zoom-in;border:1px solid var(--b2);max-height:260px;transition:box-shadow .2s,transform .2s}
.ti-image-wrap:hover{box-shadow:0 8px 32px rgba(0,0,0,.7);transform:scale(1.005)}
.ti-image-wrap img{width:100%;display:block;object-fit:cover;max-height:260px;border-radius:var(--r12)}
.ti-image-wrap::after{content:'';position:absolute;inset:0;border-radius:var(--r12);background:linear-gradient(to bottom,transparent 60%,rgba(0,0,0,.4));pointer-events:none;opacity:0;transition:opacity .2s}
.ti-image-wrap:hover::after{opacity:1}
.ti-link-btn{display:inline-flex;align-items:center;gap:7px;margin-top:10px;padding:8px 16px;border-radius:var(--r8);background:rgba(255,122,0,.1);border:1px solid rgba(255,122,0,.2);color:var(--oraL);font-family:var(--ui);font-size:12px;font-weight:600;cursor:pointer;text-decoration:none;transition:all .18s}
.ti-link-btn:hover{background:var(--ora);color:#fff;border-color:var(--ora);box-shadow:0 4px 16px rgba(255,122,0,.38)}

/* ── ACCOUNT MODAL ────────────────────────────────────────── */
.acc-body{padding:0 22px 22px}
.acc-list{display:flex;flex-direction:column;gap:8px;margin:16px 0}
.acc-list-item{display:flex;align-items:stretch;background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r12);overflow:hidden;transition:border-color .16s}
.acc-list-item:hover{border-color:rgba(255,122,0,.18)}
.acc-list-active{border-color:rgba(255,122,0,.22);background:rgba(255,122,0,.03)}
.acc-li-color{width:4px;flex-shrink:0}
.acc-li-info{flex:1;min-width:0;padding:14px 16px}
.acc-li-name{font-size:14px;font-weight:700;color:var(--t1);margin-bottom:2px;letter-spacing:-.01em}
.acc-li-subtitle{font-size:11px;color:var(--t3);font-weight:500;margin-bottom:4px}
.acc-li-bal{font-size:12px;color:var(--t3);font-family:var(--mono);display:flex;align-items:center;gap:4px}
.acc-li-sep{color:var(--t4)}
.acc-li-acts{display:flex;gap:6px;flex-shrink:0;padding:12px 14px;align-items:center}
.acc-li-btn{background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:7px;color:rgba(255,255,255,.2);font-size:11px;padding:4px 11px;cursor:pointer;transition:all .14s;font-family:var(--ui);font-weight:500}
.acc-li-btn:hover{border-color:var(--b3);color:var(--t1)}
.acc-li-btn.is-del:hover{border-color:var(--slR);color:var(--sl);background:var(--slB)}
.acc-active-badge{background:rgba(255,122,0,.1);border:1px solid rgba(255,122,0,.2);border-radius:99px;padding:3px 10px;font-size:10px;font-weight:700;color:var(--oraL)}
.acc-new{border-top:1px solid var(--b2);padding-top:18px}
.form-section-title{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--oraL);letter-spacing:.05em;margin-bottom:18px;text-transform:uppercase}
.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:11px}
.fg{display:flex;flex-direction:column;gap:6px}
.fg label{font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--t3);text-transform:uppercase}
.fg input,.fg select,.fg textarea{background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r8);color:var(--t1);font-family:var(--ui);font-size:13px;padding:10px 13px;width:100%;outline:none;transition:border-color .18s,box-shadow .18s;appearance:none;-webkit-appearance:none}
.fg input:focus,.fg select:focus{border-color:var(--ora);box-shadow:0 0 0 3px var(--oraG)}
.fg select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23444'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px;cursor:pointer}
.fg select option{background:#111}
.form-actions{display:flex;gap:9px;justify-content:flex-end;margin-top:16px;padding-top:16px;border-top:1px solid var(--b2)}
.color-picker{display:flex;gap:9px;flex-wrap:wrap;margin-top:6px}
.cp-dot{width:26px;height:26px;border-radius:50%;cursor:pointer;transition:transform .16s,box-shadow .16s;border:2px solid transparent}
.cp-dot:hover{transform:scale(1.18)}
.cp-dot.active{border-color:rgba(255,255,255,.8);box-shadow:0 0 0 3px rgba(0,0,0,.4)}
.confirm-overlay{align-items:center;justify-content:center}
.confirm-box{background:rgba(10,10,10,.98);backdrop-filter:blur(20px);border:1px solid var(--b2);border-radius:var(--r24);padding:32px;text-align:center;box-shadow:var(--sh);animation:modalRise .22s ease both;max-width:320px;width:90%}
.confirm-icon{width:48px;height:48px;border-radius:50%;background:var(--slB);border:1px solid var(--slR);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:var(--sl)}
.confirm-msg{font-size:16px;font-weight:700;color:var(--t1);margin-bottom:6px;letter-spacing:-.01em}
.confirm-sub{font-size:13px;color:var(--t3);margin-bottom:22px;line-height:1.5}
.modal-mt5{max-width:620px}
.mt5-body{padding:0 22px 22px}
.mt5-steps{display:flex;flex-direction:column;gap:9px;margin:18px 0}
.mt5-step{display:flex;align-items:flex-start;gap:11px;font-size:13.5px;color:rgba(255,255,255,.25);line-height:1.5}
.mt5-step-n{width:24px;height:24px;border-radius:50%;flex-shrink:0;background:rgba(255,255,255,.04);border:1px solid var(--b2);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--t3)}
.mt5-drop-zone{position:relative;background:rgba(255,255,255,.02);border:1.5px dashed var(--b2);border-radius:var(--r12);min-height:140px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .18s,background .18s;overflow:hidden;margin-bottom:14px}
.mt5-drop-zone:hover,.mt5-drop-zone.drag-over{border-color:rgba(255,122,0,.3);background:rgba(255,122,0,.04)}
.mt5-drop-inner{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px;text-align:center;color:rgba(255,255,255,.12)}
.mt5-drop-text{font-size:15px;font-weight:600;color:rgba(255,255,255,.25);margin:0}
.mt5-drop-sub{font-size:12px;color:rgba(255,255,255,.14);margin:0}
.btn-mt5-choose{background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:var(--r8);color:rgba(255,255,255,.25);font-family:var(--ui);font-size:12px;font-weight:600;padding:8px 18px;cursor:pointer;transition:all .16s;margin-top:6px}
.btn-mt5-choose:hover{border-color:var(--b3);color:var(--t1)}
.mt5-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;background:rgba(5,5,5,.95);font-size:13px;color:rgba(255,255,255,.25);font-weight:500}
.mt5-spinner{width:30px;height:30px;border-radius:50%;border:2px solid var(--b2);border-top-color:var(--oraL);animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.mt5-result{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;background:rgba(5,5,5,.95);text-align:center;padding:22px}
.mt5-result-icon{width:52px;height:52px;border-radius:50%;background:var(--tpB);border:1px solid var(--tpR);display:flex;align-items:center;justify-content:center;color:var(--tp)}
.mt5-result-icon.error{background:var(--slB);border-color:var(--slR);color:var(--sl)}
.mt5-result-title{font-size:16px;font-weight:700;color:var(--t1);margin:0}
.mt5-result-sub{font-size:12px;color:var(--t3);margin:0}
.mt5-preview{background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r12);overflow:hidden}
.mt5-preview-head{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--b2);flex-wrap:wrap;gap:10px}
.mt5-preview-head>span{font-size:13px;font-weight:700;color:var(--t1)}
.mt5-preview-actions{display:flex;gap:8px}
.mt5-tbl td{font-size:11px;padding:8px 13px}
.mt5-tbl td.mt5-pos{color:var(--tp)}.mt5-tbl td.mt5-neg{color:var(--sl)}
.mt5-errors{padding:11px 15px;background:var(--slB);border-top:1px solid var(--slR);font-size:11px;color:var(--sl);line-height:1.6}
.lightbox-overlay{position:fixed;inset:0;z-index:900;background:rgba(0,0,0,.95);backdrop-filter:blur(16px);display:none;align-items:center;justify-content:center;padding:22px;animation:lbFadeIn .22s ease}
.lightbox-overlay.open{display:flex}
@keyframes lbFadeIn{from{opacity:0}to{opacity:1}}
.lightbox-img{max-width:100%;max-height:90vh;border-radius:var(--r16);box-shadow:0 28px 88px rgba(0,0,0,.95);cursor:default;animation:lbZoom .26s cubic-bezier(.16,1,.3,1)}
@keyframes lbZoom{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
.lightbox-close{position:absolute;top:20px;right:20px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid var(--b2);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s}
.lightbox-close:hover{background:rgba(255,255,255,.14)}
.lightbox-caption{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.75);border:1px solid var(--b2);color:rgba(255,255,255,.45);font-size:11px;font-weight:500;padding:5px 16px;border-radius:99px;white-space:nowrap}
.eq-wrap{position:relative;height:155px;margin-top:8px}
#dashEqChart,#statsEqChart{width:100%;height:100%;display:block}

/* ── CHECKLIST DAY MODAL ──────────────────────────────────── */
.ck-day-body{padding:16px 22px 22px}
.ck-ticket{background:rgba(255,255,255,.025);border:1.5px solid var(--b2);border-radius:var(--r12);padding:16px 18px;margin-bottom:12px;transition:border-color .16s;animation:itemSlide .2s ease both}
.ck-ticket:last-child{margin-bottom:0}
.ck-ticket:hover{border-color:var(--b3)}
.ck-ticket-tp{border-left:3px solid var(--tp);background:linear-gradient(150deg,rgba(255,255,255,.025) 60%,rgba(16,185,129,.04))}
.ck-ticket-sl{border-left:3px solid var(--sl);background:linear-gradient(150deg,rgba(255,255,255,.025) 60%,rgba(244,63,94,.04))}
.ck-ticket-be{border-left:3px solid var(--be);background:linear-gradient(150deg,rgba(255,255,255,.025) 60%,rgba(245,158,11,.04))}
.ck-ticket-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.ck-ticket-num{font-size:13px;font-weight:700;color:var(--t1)}
.ck-ticket-time{font-size:11px;font-weight:400;color:var(--t3);font-family:var(--mono);margin-left:5px}
.ck-day-prob{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--b2);margin-bottom:10px}
.ck-day-prob-lbl{font-size:12px;color:rgba(255,255,255,.3)}
.ck-day-prob-val{font-size:16px;font-weight:800;font-family:var(--mono)}
.ck-day-items{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.ck-day-item{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.28);padding:6px 0;border-bottom:1px solid var(--b1)}
.ck-day-item:last-child{border-bottom:none}
.ck-day-check{width:16px;height:16px;border-radius:4px;border:2px solid var(--b3);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.ck-day-check.done{background:var(--ora);border-color:var(--oraD)}
.ck-day-obs-box{font-size:13px;color:rgba(255,255,255,.25);line-height:1.65;padding:10px 12px;background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:var(--r8);margin-bottom:12px;font-style:italic}
.ck-day-result{font-size:13px;color:rgba(255,255,255,.28);display:flex;justify-content:space-between;align-items:center;padding-top:10px;border-top:1px solid var(--b2)}
.res-badge{font-size:11px;font-weight:600;padding:2px 10px;border-radius:99px}
.res-win{background:var(--tpB);color:var(--tp);border:1px solid var(--tpR)}
.res-be{background:var(--beB);color:var(--be);border:1px solid var(--beR)}
.res-loss{background:var(--slB);color:var(--sl);border:1px solid var(--slR)}
.res-skip{background:rgba(255,255,255,.04);color:rgba(255,255,255,.2);border:1px solid var(--b2)}

/* ── TRADES VIEW ──────────────────────────────────────────── */
.trades-vi{max-width:1180px}
.tv-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.tv-title{font-size:26px;font-weight:800;color:var(--t1);letter-spacing:-.025em;margin-bottom:4px}
.tv-sub{font-size:13px;color:var(--t3)}
.tv-head-right{display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.tv-search-wrap{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r8);padding:9px 13px;min-width:260px}
.tv-search-wrap svg{color:var(--t4);flex-shrink:0}
.tv-search{background:transparent;border:none;color:var(--t1);font-family:var(--ui);font-size:13px;outline:none;flex:1}
.tv-search::placeholder{color:var(--t4)}
.tv-filters{display:flex;gap:8px;flex-wrap:wrap}
.tv-filters select{background:rgba(255,255,255,.03);border:1.5px solid var(--b2);border-radius:var(--r8);color:rgba(255,255,255,.3);font-family:var(--ui);font-size:12px;padding:8px 28px 8px 12px;outline:none;cursor:pointer;transition:border-color .16s;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23444'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.tv-filters select:focus{border-color:rgba(255,122,0,.3)}
.tv-kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-bottom:20px}
.tv-kpi{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r12);padding:16px 18px;transition:border-color .2s}
.tv-kpi:hover{border-color:rgba(255,122,0,.14)}
.tv-kpi-lbl{font-size:9px;font-weight:700;letter-spacing:.12em;color:var(--t4);text-transform:uppercase;margin-bottom:5px}
.tv-kpi-val{font-size:22px;font-weight:800;font-family:var(--mono);color:var(--t1);letter-spacing:-.01em}
.tv-list{display:flex;flex-direction:column;gap:6px}
.tv-empty{text-align:center;padding:48px 24px;font-size:14px;color:var(--t4);line-height:1.7}
.tv-empty-premium{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:64px 24px}
.tvep-icon{font-size:40px}
.tv-empty-premium h3{font-size:20px;font-weight:700;color:rgba(255,255,255,.1);letter-spacing:-.01em}
.tv-empty-premium p{font-size:13.5px;color:var(--t4);line-height:1.65;max-width:280px}
.btn-go-journal{background:linear-gradient(135deg,var(--oraD),var(--oraL));border:none;border-radius:var(--r8);color:#fff;font-family:var(--ui);font-size:13px;font-weight:700;padding:11px 22px;cursor:pointer;transition:all .2s;box-shadow:var(--shOra);margin-top:4px}
.btn-go-journal:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(255,122,0,.44)}
.tv-card{background:rgba(255,255,255,.025);border:1.5px solid var(--b2);border-radius:var(--r16);padding:18px 22px;display:flex;align-items:flex-start;gap:20px;cursor:pointer;transition:border-color .22s,background .22s,transform .22s,box-shadow .22s;animation:itemSlide .22s ease both}
.tv-card:hover{border-color:rgba(255,122,0,.22);background:rgba(255,255,255,.035);transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.5)}
.tv-card.tc-tp{border-left:3px solid var(--tp)}.tv-card.tc-sl{border-left:3px solid var(--sl)}.tv-card.tc-be{border-left:3px solid var(--be)}
.tv-card-left{display:flex;flex-direction:column;gap:4px;min-width:82px;flex-shrink:0}
.tv-card-center{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.tv-card-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}
.tv-card-date{font-size:11px;font-family:var(--mono);color:var(--t3)}
.tv-card-pair{font-size:17px;font-weight:800;color:var(--t1);letter-spacing:-.01em}
.tv-card-meta{display:flex;gap:6px;align-items:center}
.tv-card-badges{display:flex;gap:5px;flex-wrap:wrap;align-items:center}
.tv-card-dir{font-size:9px;font-weight:700;letter-spacing:.09em;padding:3px 8px;border-radius:5px;text-transform:uppercase}
.tv-card-dir.compra{background:var(--tpB);color:var(--tp);border:1px solid var(--tpR)}
.tv-card-dir.venta{background:var(--slB);color:var(--sl);border:1px solid var(--slR)}
.tv-card-result{font-size:10px;font-weight:700;padding:2px 8px;border-radius:99px}
.tv-res-tp{background:var(--tpB);color:var(--tp);border:1px solid var(--tpR)}
.tv-res-sl{background:var(--slB);color:var(--sl);border:1px solid var(--slR)}
.tv-res-be{background:var(--beB);color:var(--be);border:1px solid var(--beR)}
.tv-res-none{background:rgba(255,255,255,.04);color:var(--t3);border:1px solid var(--b2)}
.tv-card-notes{font-size:11.5px;color:var(--t3);line-height:1.4;font-style:italic}
.tv-card-acc{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--t4)}
.tv-acc-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.tv-sess-badge{font-size:9px;font-weight:600;padding:2px 7px;background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:5px;color:var(--t3)}
.tv-tags{display:flex;flex-wrap:wrap;gap:4px}
.tv-tag{font-size:9px;font-weight:600;padding:1px 6px;background:rgba(255,122,0,.08);border:1px solid rgba(255,122,0,.16);border-radius:99px;color:var(--oraL)}
.tv-has-img{font-size:11px;opacity:.5}
.tv-card-pnl{font-size:17px;font-weight:800;font-family:var(--mono);white-space:nowrap}
.tv-card-pnl.pos{color:var(--tp)}.tv-card-pnl.neg{color:var(--sl)}.tv-card-pnl.be{color:var(--be)!important}
.tv-card-rr{font-size:11px;font-family:var(--mono);color:var(--t3);white-space:nowrap}
.tv-count{font-size:11px;color:var(--t4);padding:10px 0}

/* ── HABITS ───────────────────────────────────────────────── */
.habits-vi{max-width:920px}
.hv-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:28px;flex-wrap:wrap}
.hv-title{font-size:26px;font-weight:800;color:var(--t1);letter-spacing:-.025em;margin-bottom:4px}
.hv-sub{font-size:13px;color:var(--t3)}
.btn-add-habit{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(135deg,var(--oraD),var(--oraL));border:none;border-radius:var(--r8);color:#fff;font-family:var(--ui);font-size:13px;font-weight:700;padding:10px 20px;cursor:pointer;transition:all .2s;box-shadow:var(--shOra);white-space:nowrap}
.btn-add-habit:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(255,122,0,.44)}
.hv-section{margin-bottom:28px}
.hv-section-lbl{font-size:9px;font-weight:800;letter-spacing:.18em;color:var(--t4);text-transform:uppercase;margin-bottom:14px}
.hv-empty,.hv-empty-premium{font-size:14px;color:var(--t4);padding:36px 0;line-height:1.7}
.hv-empty-premium{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;background:rgba(255,255,255,.02);border:1.5px dashed var(--b2);border-radius:var(--r20);padding:52px 24px}
.hvep-icon{font-size:40px}
.hv-empty-premium h3{font-size:19px;font-weight:700;color:rgba(255,255,255,.12);letter-spacing:-.01em}
.hv-empty-premium p{font-size:13.5px;color:var(--t4);line-height:1.65;max-width:280px}
.hv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:14px}
.habit-card{background:rgba(255,255,255,.025);border:1.5px solid var(--b2);border-radius:var(--r20);padding:22px;display:flex;flex-direction:column;gap:14px;transition:border-color .22s,box-shadow .25s,transform .22s;position:relative;overflow:hidden}
.habit-card::before{content:'';position:absolute;inset:0;border-radius:var(--r20);background:linear-gradient(135deg,rgba(255,255,255,.018),transparent 55%);pointer-events:none}
.habit-card:hover{border-color:rgba(255,122,0,.2);transform:translateY(-3px);box-shadow:0 10px 40px rgba(0,0,0,.5)}
.habit-card.hc-done{border-color:rgba(255,122,0,.22);background:linear-gradient(155deg,rgba(255,255,255,.025) 55%,rgba(255,122,0,.04))}
.hc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.hc-emoji{font-size:28px;line-height:1;flex-shrink:0}
.hc-acts{display:flex;gap:5px}
.hc-act-btn{background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:6px;color:rgba(255,255,255,.18);width:26px;height:26px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .14s;font-size:11px}
.hc-act-btn:hover{border-color:rgba(255,122,0,.25);color:var(--oraL)}
.hc-act-btn.del:hover{border-color:var(--slR);color:var(--sl)}
.hc-name{font-size:16px;font-weight:700;color:var(--t1);letter-spacing:-.01em}
.hc-desc{font-size:12.5px;color:rgba(255,255,255,.25);line-height:1.55}
.hc-check-row{display:flex;align-items:center;gap:12px}
.hc-checkbox{width:26px;height:26px;border-radius:7px;border:2px solid var(--b3);cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .22s cubic-bezier(.34,1.56,.64,1)}
.hc-checkbox.checked{background:var(--ora);border-color:var(--oraD);box-shadow:0 0 16px rgba(255,122,0,.35);animation:checkBounce .35s cubic-bezier(.34,1.56,.64,1)}
@keyframes checkBounce{0%{transform:scale(.8)}50%{transform:scale(1.15)}100%{transform:scale(1)}}
.hc-check-lbl{font-size:13px;font-weight:600;color:rgba(255,255,255,.28);cursor:pointer;transition:color .18s}
.hc-checkbox.checked~.hc-check-lbl,.habit-card.hc-done .hc-check-lbl{color:var(--oraL)}
.hc-streak-row{display:flex;align-items:center;justify-content:space-between}
.hc-streak{display:flex;align-items:center;gap:6px;font-size:12px;font-family:var(--mono)}
.hc-streak-fire{font-size:15px}
.hc-streak-n{font-size:18px;font-weight:800;color:var(--oraL)}
.hc-streak-lbl{font-size:10px;color:var(--t3);font-family:var(--ui)}
.hc-pct-badge{font-size:11px;font-weight:700;font-family:var(--mono);color:var(--t3)}
.hc-week{display:flex;gap:5px}
.hc-wday{display:flex;flex-direction:column;align-items:center;gap:4px}
.hc-wday-lbl{font-size:8px;font-weight:700;letter-spacing:.06em;color:var(--t4);text-transform:uppercase}
.hc-wday-dot{width:20px;height:20px;border-radius:6px;background:rgba(255,255,255,.04);border:1px solid var(--b2);transition:all .2s}
.hc-wday-dot.wd-done{background:rgba(255,122,0,.25);border-color:rgba(255,122,0,.35);box-shadow:0 0 8px rgba(255,122,0,.25)}
.hc-wday-dot.wd-today{border-color:rgba(255,122,0,.28)}
.hc-progress-wrap{display:flex;flex-direction:column;gap:5px}
.hc-progress-bar{height:4px;background:var(--b2);border-radius:99px;overflow:hidden}
.hc-progress-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--ora),var(--oraL));transition:width .5s ease}
.hc-progress-lbl{font-size:10px;color:var(--t4);font-family:var(--mono)}
.hv-weekly{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.hv-week-col{display:flex;flex-direction:column;gap:6px;align-items:center}
.hv-week-day{font-size:9px;font-weight:700;letter-spacing:.08em;color:var(--t4);text-transform:uppercase}
.hv-week-cell{width:36px;height:36px;border-radius:9px;background:rgba(255,255,255,.025);border:1px solid var(--b2);display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .2s}
.hv-week-cell.wc-done{background:rgba(255,122,0,.12);border-color:rgba(255,122,0,.2)}
.hv-week-cell.wc-today{border-color:rgba(255,122,0,.3)}
.habit-emoji-picker{display:flex;flex-wrap:wrap;gap:7px}
.hep-btn{background:rgba(255,255,255,.04);border:1.5px solid var(--b2);border-radius:9px;font-size:20px;width:42px;height:42px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .16s}
.hep-btn:hover{border-color:rgba(255,122,0,.28);background:rgba(255,122,0,.06)}
.hep-btn.active{border-color:var(--oraL);background:rgba(255,122,0,.12);box-shadow:0 0 0 1px rgba(255,122,0,.12)}
.modal-habit{max-width:480px}

/* ── SETTINGS ─────────────────────────────────────────────── */
.settings-vi{max-width:680px}
.set-head{margin-bottom:28px}
.set-title{font-size:26px;font-weight:800;color:var(--t1);letter-spacing:-.025em;margin-bottom:4px}
.set-sub{font-size:13px;color:var(--t3)}
.set-grid{display:flex;flex-direction:column;gap:10px}
.set-card{background:rgba(255,255,255,.025);border:1px solid var(--b2);border-radius:var(--r16);padding:20px 22px;display:flex;align-items:center;gap:16px;transition:border-color .18s}
.set-card:hover{border-color:rgba(255,122,0,.14)}
.set-card-icon{width:44px;height:44px;background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--oraL);flex-shrink:0}
.set-card-body{flex:1;min-width:0}
.set-card-title{font-size:15px;font-weight:700;color:var(--t1);margin-bottom:3px;letter-spacing:-.01em}
.set-card-desc{font-size:12px;color:var(--t3);line-height:1.5}
.set-card-btn{background:rgba(255,255,255,.04);border:1px solid var(--b2);border-radius:var(--r8);color:rgba(255,255,255,.25);font-family:var(--ui);font-size:12px;font-weight:600;padding:8px 16px;cursor:pointer;transition:all .16s;white-space:nowrap}
.set-card-btn:hover{border-color:rgba(255,122,0,.25);color:var(--oraL);background:rgba(255,122,0,.06)}
.set-card-btn-danger:hover{border-color:var(--slR);color:var(--sl);background:var(--slB)}
.set-version-badge{background:rgba(255,255,255,.03);border:1px solid var(--b2);border-radius:99px;padding:4px 12px;font-size:11px;font-family:var(--mono);color:var(--t4);white-space:nowrap}

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media(max-width:1100px){
  .big-kpis,.dash-kpi-row{grid-template-columns:repeat(2,1fr)}
  .stats-2col{grid-template-columns:1fr}
  .tv-kpi-row{grid-template-columns:repeat(2,1fr)}
  .tf-core-grid{grid-template-columns:1fr 1fr}
  .tf-numbers-grid{grid-template-columns:1fr 1fr}
  .acc-hero-card{grid-template-columns:1fr}
  .ahc-left{padding-right:0;border-right:none;padding-bottom:20px;border-bottom:1px solid var(--b1)}
  .ahc-right{padding-left:0;padding-top:16px}
}
@media(max-width:800px){
  body{overflow:auto}
  .sidebar{position:fixed;top:0;left:0;height:100vh;z-index:300;transform:translateX(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);width:var(--sbW)!important}
  .app-shell.sidebar-open .sidebar{transform:translateX(0)}
  .app-shell.sidebar-open .sb-overlay{display:block}
  .main-wrap{width:100%}
  .vi,.jvi,.ckvi{padding:14px 14px 44px}
  .topbar{padding:0 14px}
  .sb-collapse-btn{display:none}
  .ck-layout{grid-template-columns:1fr}
  .streak-grid{grid-template-columns:1fr}
  .hist-controls{flex-direction:column}
  .tf-core-grid,.tf-numbers-grid,.tf-psych-grid,.tf-media-grid,.form-grid-2{grid-template-columns:1fr}
  .ck-result-row{flex-direction:column;align-items:flex-start}
  .dash-nav-grid,.insights-grid,.dash-today-row,.dash-kpi-row{grid-template-columns:1fr}
  .big-kpis{grid-template-columns:1fr 1fr}
  .tv-card{flex-wrap:wrap}
  .hv-grid{grid-template-columns:1fr}
  .dash-header{flex-direction:column;gap:12px}
  .acc-hero-card{grid-template-columns:1fr}
}
@media(max-width:480px){
  .login-card{padding:30px 20px}
  .login-headline h1{font-size:25px}
  .big-kpis{grid-template-columns:1fr 1fr}
  .day-cell{min-height:84px;padding:9px 10px}
  .dash-kpi-row{grid-template-columns:1fr 1fr}
}

/* ═══════════════════════════════════════════════════════════════
   FIXES v10.1 — BE Colors · Account Dropdown · Dashboard Layout
   ═══════════════════════════════════════════════════════════════ */

/* ── BE / Amber color class ─────────────────────────────────── */
.be { color: var(--be) !important; }
.tv-card-pnl.be { color: var(--be) !important; }

/* ── Trade item BE — full amber treatment ───────────────────── */
.trade-item.t-be {
  border-left: 3px solid var(--be);
  background: linear-gradient(150deg, rgba(255,255,255,.025) 60%, rgba(245,158,11,.04));
}
.trade-item.t-be:hover { border-color: rgba(245,158,11,.25); }

/* ── Trades view BE card ────────────────────────────────────── */
.tv-card.tc-be { border-left: 3px solid var(--be); }
.tv-card.tc-be:hover { border-color: rgba(245,158,11,.25); }

/* ── Calendar BE day enhanced ───────────────────────────────── */
.day-cell.be-day {
  background: linear-gradient(155deg, rgba(255,255,255,.025) 40%, rgba(245,158,11,.09));
  border-color: rgba(245,158,11,.3);
}
.day-cell.be-day:not(.empty):hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.7), 0 0 30px rgba(245,158,11,.22);
}

/* ── History table BE enhanced ──────────────────────────────── */
.hist-be { background: var(--beB); color: var(--be); border: 1px solid var(--beR); }

/* ── ACCOUNT DROPDOWN — solid premium background ────────────── */
.sb-acc-drop {
  background: #0f0f0f !important;            /* solid, no translucency */
  backdrop-filter: none !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.95), 0 0 0 1px rgba(0,0,0,.5) !important;
}
.acc-drop-item {
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  padding: 13px 16px !important;
}
.acc-drop-item:hover { background: rgba(255,122,0,.08) !important; }
.acc-drop-item.acc-active {
  background: rgba(255,122,0,.12) !important;
  border-left: 2.5px solid var(--ora) !important;
}
.acc-drop-name { font-size: 13.5px !important; font-weight: 700 !important; color: #f0f0f0 !important; }
.acc-drop-firm { font-size: 11px !important; color: #5a5a5a !important; }
.acc-drop-bal  { font-size: 12px !important; font-weight: 700 !important; }
.acc-drop-new {
  border-top: 1px solid rgba(255,255,255,.06) !important;
  padding: 12px 16px !important;
  font-size: 13px !important; font-weight: 600 !important;
}

/* ── DASHBOARD — wide layout, remove 880px cap ──────────────── */
.dash-vi {
  max-width: 1360px !important;
  margin: 0 auto;
  /* 2-col grid: hero on left, today stats on right */
  display: grid;
  grid-template-columns: 1.45fr 1fr;
  grid-template-rows: auto auto auto auto auto;
  column-gap: 18px;
  row-gap: 0;
}

.dash-header   { grid-column: 1 / -1; margin-bottom: 22px; }
.acc-hero-card { grid-column: 1; grid-row: 2; margin-bottom: 18px; }
.dash-today-row {
  grid-column: 2; grid-row: 2;
  /* Stack the 3 cards vertically in the right panel */
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-bottom: 18px;
}
.dts-card {
  flex: 1;
  min-height: 0;
}
.dash-kpi-row    { grid-column: 1 / -1; grid-row: 3; }
.dash-nav-grid   { grid-column: 1 / -1; grid-row: 4; margin-top: 18px; }
.insights-section{ grid-column: 1 / -1; grid-row: 5; }
/* Hidden compat items at bottom */
.dash-vi > span[style*="display:none"],
.dash-vi > canvas[style*="display:none"] { grid-column: 1 / -1; height: 0; }

/* Hero card — make it fill its column height */
.acc-hero-card { height: 100%; }
.ahc-chart-wrap { flex: 1; min-height: 100px; }

/* ── PREMIUM TYPOGRAPHY ─────────────────────────────────────── */

/* Tabular numbers for all monetary/statistical values */
.mono, [style*="font-family:var(--mono)"],
.ahc-equity, .dkpi-val, .bk-val, .sk-val,
.ss-val, .ti-mv, .tv-card-pnl, .aocCur, .asb-val {
  font-feature-settings: 'tnum' 1, 'kern' 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
}

/* Bigger, more impactful equity number */
.ahc-equity {
  font-size: 40px !important;
  font-weight: 900 !important;
  letter-spacing: -.03em !important;
  line-height: 1.1 !important;
}

/* KPI values more impact */
.dkpi-val {
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
}

/* Stats big KPIs */
.bk-val {
  font-size: 28px !important;
  font-weight: 900 !important;
  letter-spacing: -.025em !important;
}

/* Today snapshot vals */
.dts-val {
  font-size: 28px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
}

/* Trade item metrics more readable */
.ti-mv {
  font-size: 15px !important;
  font-weight: 700 !important;
}

/* Nav card meta */
.dnc-meta {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,.25) !important;
}

/* Account snap bar values */
.ahc-equity-sub {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
}

/* ── Reduce excessive glow / saturación visual ───────────────── */
/* Subtler day cell glows */
.day-cell.tp-day { border-color: rgba(16,185,129,.18) !important; }
.day-cell.sl-day { border-color: rgba(244,63,94,.18) !important; }

/* Less intense trade item BE glow */
.trade-item.t-be { box-shadow: none; }

/* Cleaner nav section spacing */
.dash-nav-grid .dnc { padding: 22px 20px; }
.dnc-icon { width: 42px !important; height: 42px !important; }

/* ── DASHBOARD RESPONSIVE ───────────────────────────────────── */
@media (max-width: 1100px) {
  .dash-vi {
    grid-template-columns: 1fr !important;
  }
  .acc-hero-card { grid-column: 1; grid-row: 2; }
  .dash-today-row {
    grid-column: 1; grid-row: 3;
    flex-direction: row !important;
    flex-wrap: wrap;
  }
  .dts-card { flex: 1; min-width: 180px; }
  .dash-kpi-row  { grid-row: 4; }
  .dash-nav-grid { grid-row: 5; }
  .insights-section { grid-row: 6; }
}

@media (max-width: 720px) {
  .dash-today-row { flex-direction: column !important; }
  .dts-card { min-width: unset; }
}

/* ═══════════════════════════════════════════════════════════════
   TYPOGRAPHY v10.2 — Inter Premium Numeric System
   ═══════════════════════════════════════════════════════════════ */

/* Base numeric rule — Inter + tabular nums on everything money-related */
.mono,
.ahc-equity,
.dkpi-val,
.dts-val,
.bk-val,
.sk-val,
.ss-val,
.ti-mv,
.ti-mv.pos,.ti-mv.neg,.ti-mv.be,
.tv-card-pnl,
.tv-kpi-val,
.day-pnl,
.day-pct,
.hist-tbl td,
.gauge-pct,
.hist-count,
.ck-day-prob-val,
[style*="font-family:var(--mono)"] {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-feature-settings: 'tnum' 1, 'ss01' 1;
  font-variant-numeric: tabular-nums;
}

/* Equity hero — largest number, maximum premium feel */
.ahc-equity {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 42px !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.05 !important;
  font-feature-settings: 'tnum' 1, 'ss01' 1 !important;
  font-variant-numeric: tabular-nums !important;
}

/* Account drop balance */
.acc-drop-bal {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-feature-settings: 'tnum' 1 !important;
  font-variant-numeric: tabular-nums !important;
}

/* Dashboard KPI values */
.dkpi-val {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 23px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  font-feature-settings: 'tnum' 1 !important;
}

/* Today snapshot */
.dts-val {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 30px !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
}

/* Stats big numbers */
.bk-val {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  letter-spacing: -0.04em !important;
}
.sk-val {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 34px !important;
  font-weight: 900 !important;
  letter-spacing: -0.04em !important;
}

/* Journal stats strip */
.ss-val {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
}

/* Trade item metrics */
.ti-mv {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

/* Calendar day PnL/pct */
.day-pnl {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}
.day-pct {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}

/* Trades view card PnL */
.tv-card-pnl {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
}

/* Checklist probability */
.gauge-pct {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
}

/* History table monetary values */
.hist-tbl td:nth-child(6) {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-feature-settings: 'tnum' 1 !important;
  font-variant-numeric: tabular-nums !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

/* Equity chart label in topbar */
.eq-label {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}

/* ── COMPLETE BE AMBER OVERRIDE ─────────────────────────────── */

/* Any element with class .be gets amber, regardless of other classes */
.be { color: var(--be) !important; }
.ti-mv.be { color: var(--be) !important; }
.tv-card-pnl.be { color: var(--be) !important; }
.day-pnl.be { color: var(--be) !important; }
.modal-sub.be { color: var(--be) !important; }

/* Trade item BE — full amber card treatment */
.trade-item.t-be {
  border-left: 3px solid var(--be) !important;
  background: linear-gradient(150deg, rgba(255,255,255,.022) 55%, rgba(245,158,11,.05)) !important;
}

/* Trades view BE card */
.tv-card.tc-be {
  border-left: 3px solid var(--be) !important;
}

/* Calendar BE — amber glow on hover */
.day-cell.be-day {
  background: linear-gradient(155deg, rgba(255,255,255,.025) 40%, rgba(245,158,11,.08)) !important;
  border-color: rgba(245,158,11,.28) !important;
}
.day-cell.be-day:not(.empty):hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.7), 0 0 28px rgba(245,158,11,.2) !important;
}

/* Sidebar dropdown final override — completely solid */
.sb-acc-drop {
  background: #0c0c0c !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.acc-drop-item:hover { background: #1a1a1a !important; }
.acc-drop-item.acc-active { background: #161616 !important; border-left: 2.5px solid var(--ora) !important; }
.acc-drop-name { color: #f0f0f0 !important; font-size: 13.5px !important; font-weight: 700 !important; }
.acc-drop-firm { color: #4a4a4a !important; }

/* ═══════════════════════════════════════════════════════════════
   BETA GATE + ONBOARDING + FEEDBACK — v1.0
   ═══════════════════════════════════════════════════════════════ */

/* Beta badge */
.beta-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,122,0,.1); border: 1px solid rgba(255,122,0,.22);
  border-radius: 99px; padding: 5px 14px;
  font-size: 11px; font-weight: 700; letter-spacing: .1em;
  color: var(--oraL); margin-bottom: 22px;
}

/* Onboarding card variant */
.ob-card { max-width: 560px !important; animation: cardRise .55s cubic-bezier(.16,1,.3,1) both; }

/* Step indicator */
.ob-step-indicator { display: flex; gap: 6px; margin-bottom: 24px; }
.ob-step { width: 28px; height: 3px; border-radius: 99px; background: rgba(255,255,255,.1); transition: all .3s; }
.ob-step.active { background: var(--oraL); width: 52px; }
.ob-step.done { background: rgba(255,122,0,.4); }

/* Hero icon */
.ob-hero-icon { font-size: 42px; margin-bottom: 14px; display: block; text-align: center; }
.ob-title { font-size: 26px; font-weight: 800; color: var(--t1); letter-spacing: -.025em; line-height: 1.2; margin-bottom: 10px; text-align: center; }
.ob-title-sm { font-size: 22px; font-weight: 800; color: var(--t1); letter-spacing: -.02em; line-height: 1.2; margin-bottom: 14px; }
.ob-subtitle { font-size: 14px; color: var(--t2); line-height: 1.65; margin-bottom: 22px; text-align: center; }
.ob-subtitle-sm { font-size: 13px; color: var(--t2); line-height: 1.6; margin-bottom: 18px; }
.ob-section-lbl { font-size: 10px; font-weight: 700; letter-spacing: .16em; color: var(--oraL); text-transform: uppercase; margin-bottom: 8px; }

/* Feature list in step 1 */
.ob-features { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
.ob-feat { display: flex; align-items: flex-start; gap: 14px; padding: 14px 16px; background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.07); border-radius: var(--r12); }
.ob-feat-ico { font-size: 22px; flex-shrink: 0; }
.ob-feat b { display: block; font-size: 14px; font-weight: 700; color: var(--t1); margin-bottom: 2px; letter-spacing: -.01em; }
.ob-feat p { font-size: 12.5px; color: var(--t2); line-height: 1.5; margin: 0; }

/* Question groups */
.ob-q-group { margin-bottom: 18px; }
.ob-q-label { display: block; font-size: 13px; font-weight: 600; color: rgba(255,255,255,.7); margin-bottom: 10px; line-height: 1.4; }
.ob-pills-row { display: flex; gap: 7px; flex-wrap: wrap; }
.ob-pill {
  background: rgba(255,255,255,.04); border: 1.5px solid rgba(255,255,255,.08);
  border-radius: 99px; color: rgba(255,255,255,.4); font-family: var(--ui);
  font-size: 13px; font-weight: 600; padding: 7px 16px;
  cursor: pointer; transition: all .18s;
}
.ob-pill:hover { border-color: rgba(255,122,0,.28); color: var(--t1); }
.ob-pill.active {
  background: rgba(255,122,0,.14); border-color: rgba(255,122,0,.4);
  color: var(--oraL); box-shadow: 0 0 0 1px rgba(255,122,0,.12);
}

/* Habit emoji picker in step 4 */
.ob-habit-emojis { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.ob-emoji-btn {
  width: 44px; height: 44px; font-size: 22px; background: rgba(255,255,255,.04);
  border: 1.5px solid rgba(255,255,255,.08); border-radius: var(--r10); cursor: pointer;
  display: flex; align-items: center; justify-content: center; transition: all .18s;
}
.ob-emoji-btn:hover { border-color: rgba(255,122,0,.28); }
.ob-emoji-btn.active { background: rgba(255,122,0,.12); border-color: rgba(255,122,0,.4); box-shadow: 0 0 0 1px rgba(255,122,0,.1); }

/* ── FEEDBACK WIDGET ──────────────────────────────────────── */
.fb-btn {
  position: fixed; bottom: 24px; right: 24px; z-index: 400;
  display: flex; align-items: center; gap: 8px;
  background: rgba(10,10,10,.96); backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.1); border-radius: 99px;
  color: rgba(255,255,255,.6); font-family: var(--ui);
  font-size: 13px; font-weight: 600; padding: 10px 18px;
  cursor: pointer; transition: all .22s;
  box-shadow: 0 4px 20px rgba(0,0,0,.5);
}
.fb-btn:hover { border-color: rgba(255,122,0,.3); color: var(--oraL); transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,.6); }
.fb-btn svg { flex-shrink: 0; }

.fb-type-btn {
  flex: 1; background: rgba(255,255,255,.04); border: 1.5px solid rgba(255,255,255,.08);
  border-radius: var(--r8); color: rgba(255,255,255,.4); font-family: var(--ui);
  font-size: 13px; font-weight: 600; padding: 9px 12px; cursor: pointer;
  transition: all .18s; white-space: nowrap;
}
.fb-type-btn:hover { border-color: rgba(255,255,255,.14); color: var(--t1); }
.fb-type-btn.active { background: rgba(255,122,0,.12); border-color: rgba(255,122,0,.35); color: var(--oraL); }

/* Hide feedback button on login screen */
.login-view ~ * .fb-btn { display: none; }
#loginView:not(.hidden) + * + * + .fb-btn { display: none; }

/* ═══════════════════════════════════════════════════════════════
   SUPABASE AUTH UI — v10.1
   ═══════════════════════════════════════════════════════════════ */

/* Auth card container */
.auth-card { max-width: 440px !important; }

/* Tabs */
.auth-tabs {
  display: flex; gap: 2px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: var(--r10); padding: 4px;
  margin-bottom: 24px;
}
.auth-tab {
  flex: 1; background: transparent; border: none;
  border-radius: 7px;
  color: rgba(255,255,255,.35); font-family: var(--ui);
  font-size: 13.5px; font-weight: 600;
  padding: 9px; cursor: pointer; transition: all .18s;
}
.auth-tab:hover { color: var(--t1); }
.auth-tab.active {
  background: rgba(255,255,255,.08);
  color: var(--t1);
  box-shadow: 0 1px 4px rgba(0,0,0,.4);
}

/* Panel title */
.auth-panel-title {
  font-size: 20px; font-weight: 800; color: var(--t1);
  letter-spacing: -.02em; margin-bottom: 18px; line-height: 1.2;
}

/* Password input wrapper */
.pw-wrap { position: relative; display: flex; align-items: center; }
.pw-input { padding-right: 42px !important; }
.pw-toggle {
  position: absolute; right: 12px;
  background: transparent; border: none; cursor: pointer;
  color: rgba(255,255,255,.25); display: flex; align-items: center;
  transition: color .16s; padding: 0; flex-shrink: 0;
}
.pw-toggle:hover { color: var(--t1); }

/* Error / success states */
.auth-error {
  background: rgba(244,63,94,.1); border: 1px solid rgba(244,63,94,.22);
  border-radius: var(--r8); padding: 9px 13px;
  font-size: 12.5px; font-weight: 600; color: var(--sl);
  margin-bottom: 10px; line-height: 1.5;
}
.auth-success {
  background: rgba(16,185,129,.1); border: 1px solid rgba(16,185,129,.22);
  border-radius: var(--r8); padding: 9px 13px;
  font-size: 12.5px; font-weight: 600; color: var(--tp);
  margin-bottom: 10px;
}

/* Spinner */
.auth-spinner {
  width: 16px; height: 16px;
  border: 2px solid rgba(255,255,255,.3);
  border-top-color: #fff; border-radius: 50%;
  animation: spin .7s linear infinite; display: inline-block;
  flex-shrink: 0;
}

/* Forgot link */
.auth-forgot {
  background: transparent; border: none;
  color: var(--oraL); font-family: var(--ui);
  font-size: 12px; font-weight: 600; cursor: pointer;
  text-align: right; width: 100%; margin-bottom: 4px;
  padding: 0; transition: opacity .16s;
}
.auth-forgot:hover { opacity: .75; }

/* ── ADMIN DASHBOARD (admin.html) ─────────────────────────── */
.admin-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.admin-table th {
  text-align: left; padding: 10px 14px;
  font-size: 10px; font-weight: 700; letter-spacing: .1em;
  color: rgba(255,255,255,.25); text-transform: uppercase;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.admin-table td {
  padding: 11px 14px; color: rgba(255,255,255,.6);
  border-bottom: 1px solid rgba(255,255,255,.05);
  font-family: 'Inter', sans-serif;
}
.admin-table tr:hover td { background: rgba(255,255,255,.025); }
.admin-table td:first-child { color: var(--t1); font-weight: 600; font-family: var(--ui); }
.status-pill {
  display: inline-block; padding: 2px 10px; border-radius: 99px;
  font-size: 11px; font-weight: 700;
}
.status-pending  { background: var(--beB); color: var(--be); border: 1px solid var(--beR); }
.status-approved { background: var(--tpB); color: var(--tp); border: 1px solid var(--tpR); }
.status-rejected { background: var(--slB); color: var(--sl); border: 1px solid var(--slR); }
.admin-action-btn {
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  border-radius: 6px; color: rgba(255,255,255,.5);
  font-size: 11px; font-weight: 600; padding: 4px 10px;
  cursor: pointer; transition: all .16s;
}
.admin-action-btn:hover { border-color: var(--oraL); color: var(--oraL); }
.admin-action-btn.approve:hover { border-color: var(--tp); color: var(--tp); }
.admin-action-btn.reject:hover  { border-color: var(--sl); color: var(--sl); }

/* ═══════════════════════════════════════════════════════════════
   LOGO — Official TraderZone Branding
   ═══════════════════════════════════════════════════════════════ */

/* Login screen logo */
.login-logo-real {
  display: block;
  width: auto;
  max-width: 220px;
  max-height: 60px;
  object-fit: contain;
  margin: 0 auto 24px;
  image-rendering: -webkit-optimize-contrast;
}

/* Sidebar logo */
.sb-logo-real {
  display: block;
  width: auto;
  max-height: 32px;
  max-width: 160px;
  object-fit: contain;
  flex-shrink: 0;
  image-rendering: -webkit-optimize-contrast;
  transition: max-width .3s cubic-bezier(.4,0,.2,1), opacity .3s;
}
.app-shell.collapsed .sb-logo-real {
  max-width: 32px;
  /* Show only the icon portion when collapsed */
  object-position: left center;
}

/* ═══════════════════════════════════════════════════════════════
   PROFILE MODAL
   ═══════════════════════════════════════════════════════════════ */

/* Avatar */
.profile-avatar-lg, .profile-avatar-xl {
  border-radius: 50%; background: linear-gradient(135deg, var(--oraD), var(--oraL));
  color: #fff; font-family: var(--ui); font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; user-select: none;
}
.profile-avatar-lg { width: 42px; height: 42px; font-size: 17px; }

.profile-avatar-wrap {
  display: flex; align-items: center; gap: 18px;
  margin-bottom: 22px; padding: 14px 16px;
  background: rgba(255,255,255,.025); border-radius: var(--r12);
  border: 1px solid rgba(255,255,255,.07);
}
.profile-avatar-xl { width: 60px; height: 60px; font-size: 26px; flex-shrink: 0; }

/* Emoji picker */
.profile-emoji-row { display: flex; gap: 6px; flex-wrap: wrap; }
.pem-btn {
  width: 36px; height: 36px; font-size: 20px;
  background: rgba(255,255,255,.04); border: 1.5px solid rgba(255,255,255,.08);
  border-radius: var(--r8); cursor: pointer; display: flex;
  align-items: center; justify-content: center; transition: all .16s;
}
.pem-btn:hover { border-color: rgba(255,122,0,.28); }
.pem-btn.active { background: rgba(255,122,0,.12); border-color: rgba(255,122,0,.35); }

/* Profile tabs */
.profile-tabs {
  display: flex; border-bottom: 1px solid rgba(255,255,255,.07);
  padding: 0 22px; gap: 0;
}
.profile-tab {
  background: transparent; border: none;
  color: rgba(255,255,255,.3); font-family: var(--ui);
  font-size: 13.5px; font-weight: 600; padding: 12px 18px;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  cursor: pointer; transition: all .16s;
}
.profile-tab:hover { color: var(--t1); }
.profile-tab.active { color: var(--oraL); border-bottom-color: var(--oraL); }

/* Section label */
.profile-section-lbl {
  font-size: 9px; font-weight: 700; letter-spacing: .16em;
  color: var(--t3); text-transform: uppercase; margin-bottom: 12px;
}

/* Logout button in profile */
.btn-logout-profile {
  width: 100%; background: rgba(244,63,94,.08);
  border: 1.5px solid rgba(244,63,94,.2); border-radius: var(--r10);
  color: var(--sl); font-family: var(--ui);
  font-size: 14px; font-weight: 600; padding: 12px;
  cursor: pointer; transition: all .2s;
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.btn-logout-profile:hover { background: rgba(244,63,94,.14); border-color: rgba(244,63,94,.35); }

/* Sidebar user row clickable feedback */
.sb-user-row:hover { background: rgba(255,255,255,.03); border-radius: var(--r8); }

/* ═══════════════════════════════════════════════════════════════
   TOPBAR AVATAR BUTTON — profile trigger
   ═══════════════════════════════════════════════════════════════ */
.tb-user-btn {
  display: flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.04);
  border: 1.5px solid rgba(255,255,255,.08);
  border-radius: 99px;
  padding: 4px 12px 4px 5px;
  cursor: pointer; transition: all .2s;
  max-width: 180px;
}
.tb-user-btn:hover {
  border-color: rgba(255,122,0,.3);
  background: rgba(255,122,0,.06);
}
.tb-user-av {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, var(--oraD), var(--oraL));
  color: #fff; font-family: var(--ui); font-size: 13px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; user-select: none;
}
.tb-hi {
  font-size: 13px; font-weight: 600; color: var(--t1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 110px;
}

/* ═══════════════════════════════════════════════════════════════
   READABILITY v2 — Full contrast upgrade
   Improves ALL text without touching the dark aesthetic.
   Uses CSS overrides so nothing breaks.
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. Core color variables — the root fix ───────────────── */
:root {
  /* OLD: --t2:#5a5a5a → barely readable (3.5:1 on #030303)  */
  /* NEW: --t2:#9e9e9e → clearly readable (7.5:1 on #030303) */
  --t2: #9e9e9e !important;

  /* OLD: --t3:#333333 → nearly invisible (2:1 on #030303)   */
  /* NEW: --t3:#686868 → comfortable to read (5:1 on #030303)*/
  --t3: #686868 !important;

  /* OLD: --t4:#1e1e1e → invisible against black             */
  /* NEW: --t4:#4a4a4a → subtle but readable                 */
  --t4: #4a4a4a !important;
}

/* ── 2. Input labels (were 10px #333 — invisible) ─────────── */
.input-lbl {
  font-size: 11px !important;
  color: #808080 !important;
  letter-spacing: .12em !important;
}

/* ── 3. Form placeholders ────────────────────────────────── */
.text-input::placeholder,
.tf-input::placeholder,
.tf-textarea::placeholder,
input::placeholder,
textarea::placeholder {
  color: #5a5a5a !important;
  opacity: 1 !important;
}
.text-input:focus::placeholder,
.tf-input:focus::placeholder {
  color: #404040 !important;
}

/* ── 4. Topbar date badge ────────────────────────────────── */
.tb-date {
  color: #787878 !important;
  font-size: 11.5px !important;
}

/* ── 5. Breadcrumb root ──────────────────────────────────── */
.bc-root { color: #787878 !important; font-size: 13px !important; }

/* ── 6. User plan label in sidebar footer ────────────────── */
.user-plan { color: #606060 !important; font-size: 10.5px !important; }

/* ── 7. Sidebar nav items (inactive) ────────────────────── */
.nav-item {
  color: #848484 !important;
  font-size: 13.5px !important;
}
.nav-item.active { color: var(--t1) !important; }

/* ── 8. Section labels & badge text (were 9–10px) ───────── */
.sb-acc-lbl,
.set-card-desc,
.modal-sub,
.ob-q-label,
.ob-subtitle,
.ob-subtitle-sm,
.profile-section-lbl,
.feat-desc,
.soon-desc {
  font-size: 13px !important;
  color: #909090 !important;
  line-height: 1.7 !important;
}

/* Section uppercase labels */
.sec-lbl, .section-lbl, .ob-section-lbl,
.set-card-title + .set-card-desc,
[class*="-lbl"]:not(.input-lbl):not(.nav-lbl) {
  color: #787878 !important;
}

/* ── 9. Account dropdown firm + balance ──────────────────── */
.acc-drop-firm { color: #686868 !important; font-size: 11.5px !important; }
.acc-drop-bal  { color: #9e9e9e !important; font-size: 12.5px !important; }

/* ── 10. Sidebar collapse button ────────────────────────── */
.sb-collapse-btn { color: #686868 !important; }

/* ── 11. Calendar ────────────────────────────────────────── */
.cal-day-name {
  font-size: 11px !important;
  color: #787878 !important;
  font-weight: 600 !important;
}
.cal-day-num {
  font-size: 12px !important;
  color: #9e9e9e !important;
}
.day-cell .day-num { color: #a0a0a0 !important; }
.day-pnl.pos { color: #34d399 !important; }
.day-pnl.neg { color: #fb7185 !important; }
.day-pnl.be  { color: #fbbf24 !important; }
.day-pct     { opacity: .85 !important; }

/* ── 12. Journal trade items ─────────────────────────────── */
.ti-pair   { color: #d4d4d4 !important; font-size: 14px !important; }
.ti-session,
.ti-date,
.ti-label  { color: #848484 !important; font-size: 12px !important; }
.ti-mv     { font-size: 14.5px !important; }

/* ── 13. Stats & KPI values ──────────────────────────────── */
.dkpi-lbl  { color: #848484 !important; font-size: 11.5px !important; font-weight:600 !important; }
.stat-lbl,
.sk-lbl,
.bk-lbl,
.ss-lbl    { color: #848484 !important; font-size: 12px !important; }
.dts-lbl   { color: #848484 !important; font-size: 12px !important; }

/* ── 14. Modal titles & subtitles ────────────────────────── */
.modal-title  { color: #eeeeee !important; font-size: 16px !important; }
.modal-sub    { font-size: 13px !important; }

/* ── 15. Settings cards ──────────────────────────────────── */
.set-card-title { color: #d8d8d8 !important; font-size: 14.5px !important; }
.set-card-desc  { color: #909090 !important; font-size: 13px !important; }

/* ── 16. History table ───────────────────────────────────── */
.hist-tbl th {
  color: #808080 !important;
  font-size: 10.5px !important;
  letter-spacing: .1em !important;
}
.hist-tbl td {
  color: #c8c8c8 !important;
  font-size: 13px !important;
}

/* ── 17. Checklist ───────────────────────────────────────── */
.ck-conf-text  { color: #c8c8c8 !important; font-size: 14px !important; }
.ck-conf-label { color: #848484 !important; font-size: 12px !important; }
.gauge-lbl     { color: #848484 !important; font-size: 12px !important; }

/* ── 18. Habit tracker ───────────────────────────────────── */
.habit-name   { color: #d8d8d8 !important; font-size: 14px !important; }
.habit-desc   { color: #909090 !important; font-size: 13px !important; }
.streak-label { color: #848484 !important; font-size: 12px !important; }

/* ── 19. Empty states & helper text ─────────────────────── */
.empty-title { color: #d0d0d0 !important; font-size: 16px !important; }
.empty-sub   { color: #808080 !important; font-size: 13.5px !important; }
.empty-hint  { color: #686868 !important; font-size: 12.5px !important; }

/* ── 20. Onboarding pills and labels ─────────────────────── */
.ob-pill       { color: #909090 !important; font-size: 13px !important; }
.ob-pill.active{ color: var(--oraL) !important; }
.ob-q-label    { color: #b0b0b0 !important; font-weight: 600 !important; }

/* ── 21. Dashboard insight text ──────────────────────────── */
.insight-text,
.insight-desc { color: #989898 !important; font-size: 13px !important; }

/* ── 22. Trades view ────────────────────────────────────── */
.tv-card-pair { color: #d8d8d8 !important; font-size: 14.5px !important; }
.tv-card-meta { color: #888888 !important; font-size: 12.5px !important; }
.tv-kpi-lbl   { color: #848484 !important; font-size: 11.5px !important; }
.tv-kpi-val   { color: #e0e0e0 !important; }

/* ── 23. Nav badges ──────────────────────────────────────── */
.nav-badge { font-size: 10px !important; }

/* ── 24. Button & control text ───────────────────────────── */
.btn-cancel    { color: #a0a0a0 !important; font-size: 13.5px !important; }
.btn-ghost-sm  { color: #909090 !important; font-size: 13px !important; }
.btn-tb-action { color: #909090 !important; font-size: 12.5px !important; }
.btn-add-trade { color: #787878 !important; font-size: 13.5px !important; }
.btn-logout    { color: #686868 !important; }

/* ── 25. Topbar hi text ──────────────────────────────────── */
.tb-hi { color: #d8d8d8 !important; font-size: 13.5px !important; }

/* ── 26. Account hero card ───────────────────────────────── */
.ahc-firm   { color: #909090 !important; font-size: 12px !important; }
.ahc-sub    { color: #848484 !important; font-size: 12.5px !important; }
.ahc-lbl    { color: #787878 !important; font-size: 11px !important; letter-spacing:.1em !important; }

/* ── 27. Select/dropdown inputs ──────────────────────────── */
select.tf-input, select {
  color: #c8c8c8 !important;
  font-size: 13.5px !important;
}

/* ── 28. General small text upgrade ──────────────────────── */
/* Any remaining 10px text → 11.5px minimum */
small, .small { font-size: 12px !important; color: #848484 !important; }

/* ── 29. Line height for body copy ───────────────────────── */
body { line-height: 1.6 !important; }

/* ── 30. Focus rings more visible ────────────────────────── */
.text-input:focus,
.tf-input:focus,
.tf-textarea:focus {
  border-color: rgba(255,122,0,.6) !important;
  box-shadow: 0 0 0 3px rgba(255,122,0,.12) !important;
  color: #eeeeee !important;
}

/* ═══════════════════════════════════════════════════════════════
   READABILITY v3 — Targeted high-contrast overrides
   Fixes specifically: KPI labels, calendar day names,
   dashboard today strip, and all small uppercase labels.
   ═══════════════════════════════════════════════════════════════ */

/* ── Dashboard KPI labels: Win Rate, Profit Factor, etc. ─── */
.dkpi-lbl {
  color: #b0b0b0 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}
.dkpi-val {
  color: #f0f0f0 !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  opacity: 1 !important;
}

/* ── Calendar weekday headers: DOM, LUN, MAR … ──────────── */
.wday-row span,
.wday-row {
  color: #b8b8b8 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  opacity: 1 !important;
}

/* ── Today snapshot labels: TRADES HOY, HÁBITOS, CHECKLIST */
.dts-lbl {
  color: #a8a8a8 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  opacity: 1 !important;
}
.dts-val  { color: #f2f2f2 !important; opacity: 1 !important; }
.dts-sub  { color: #888888 !important; font-size: 11px !important; opacity: 1 !important; }

/* ── Stats view labels: sk-lbl, bk-lbl, s-card-title ────── */
.sk-lbl, .bk-lbl {
  color: #a8a8a8 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  opacity: 1 !important;
}
.sk-sub, .bk-sub {
  color: #787878 !important;
  font-size: 12px !important;
  opacity: 1 !important;
}
.s-card-title {
  color: #d8d8d8 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}

/* ── Stats table headers ─────────────────────────────────── */
.data-tbl th {
  color: #989898 !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  opacity: 1 !important;
}
.data-tbl td {
  color: #d0d0d0 !important;
  font-size: 13px !important;
  opacity: 1 !important;
}

/* ── Journal stats strip ─────────────────────────────────── */
.ss-lbl {
  color: #a0a0a0 !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  opacity: 1 !important;
}
.ss-val { opacity: 1 !important; }

/* ── Trade item meta labels: PnL, Riesgo, R:R ───────────── */
.ti-ml {
  color: #a0a0a0 !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  opacity: 1 !important;
}

/* ── Day number in calendar ──────────────────────────────── */
.day-num {
  color: #c8c8c8 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}
.day-cnt {
  color: #888888 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}

/* ── Nav card meta text ──────────────────────────────────── */
.dnc-meta { color: #909090 !important; font-size: 12.5px !important; opacity: 1 !important; }

/* ── Sidebar account section label ──────────────────────── */
.sb-acc-lbl {
  color: #787878 !important;
  font-size: 9.5px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  opacity: 1 !important;
}

/* ── Section header labels (uppercase badges) ────────────── */
.vi-title   { color: #f0f0f0 !important; opacity: 1 !important; }
.vi-sub     { color: #909090 !important; opacity: 1 !important; font-size: 13.5px !important; }

/* ── Global: kill low-opacity on text ───────────────────── */
/* Some elements have opacity:.6 or .7 which combined with grey = invisible */
.nav-item,
.dkpi-data *,
.wday-row *,
.dts-card *,
.sk-lbl, .bk-lbl,
.ti-ml, .ti-pair,
.day-num, .day-pnl, .day-pct {
  opacity: 1 !important;
}

/* ── Weekly summary card (new feature) ──────────────────── */
.week-summary-row {
  grid-column: 1 / -1;
  margin: 4px 0 8px;
}
.week-summary-card {
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(255,255,255,.07);
  border-left: 3px solid rgba(255,122,0,.35);
  border-radius: 10px;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  transition: border-color .18s, background .18s;
}
.week-summary-card:hover {
  background: rgba(255,122,0,.04);
  border-color: rgba(255,122,0,.2);
  border-left-color: rgba(255,122,0,.5);
}
.wsc-title {
  font-size: 11px;
  font-weight: 700;
  color: #a0a0a0;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.wsc-metrics {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
}
.wsc-m {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
}
.wsc-v {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -.02em;
  color: #f0f0f0;
}
.wsc-v.pos { color: #34d399 !important; }
.wsc-v.neg { color: #fb7185 !important; }
.wsc-v.be  { color: #fbbf24 !important; }
.wsc-l {
  font-size: 9.5px;
  font-weight: 700;
  color: #686868;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.wsc-badge {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 99px;
  background: rgba(255,122,0,.1);
  border: 1px solid rgba(255,122,0,.2);
  color: #ff8c1a;
  white-space: nowrap;
}

/* ── Probability badge on trade items ────────────────────── */
.ti-prob-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(255,122,0,.08);
  border: 1px solid rgba(255,122,0,.2);
  border-radius: 99px;
  padding: 3px 10px;
  font-size: 11.5px;
  font-weight: 700;
  color: #ff8c1a;
  letter-spacing: .02em;
  margin-top: 6px;
  width: fit-content;
}
.ti-prob-badge svg { flex-shrink: 0; }

/* ═══════════════════════════════════════════════════════════════
   JOURNAL TWO-COLUMN LAYOUT — Weekly summary right column
   ═══════════════════════════════════════════════════════════════ */

/* ── Two-column wrapper ───────────────────────────────────── */
.j-layout {
  display: grid;
  grid-template-columns: 1fr 176px;
  gap: 14px;
  align-items: start;
}

/* ── Calendar column (left) ──────────────────────────────── */
.j-cal-col { min-width: 0; }

/* ── Weekly summary column (right) ──────────────────────── */
.j-week-col {
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: sticky;
  top: 0;
}

/* ── Column header ────────────────────────────────────────── */
.wsc-col-header {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #686868;
  padding: 0 4px 6px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  margin-bottom: 2px;
}

/* ── Week card base ───────────────────────────────────────── */
.wsc-card {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-left: 2.5px solid rgba(255,255,255,.1);
  border-radius: 10px;
  padding: 10px 11px;
  transition: all .2s;
  cursor: default;
}
.wsc-card:hover {
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.12);
}

/* ── Positive week ────────────────────────────────────────── */
.wsc-pos {
  border-left-color: rgba(16,185,129,.5) !important;
  background: rgba(16,185,129,.03) !important;
}
.wsc-pos:hover { background: rgba(16,185,129,.06) !important; }

/* ── Negative week ────────────────────────────────────────── */
.wsc-neg {
  border-left-color: rgba(244,63,94,.4) !important;
  background: rgba(244,63,94,.03) !important;
}
.wsc-neg:hover { background: rgba(244,63,94,.05) !important; }

/* ── Break-even week ──────────────────────────────────────── */
.wsc-be {
  border-left-color: rgba(245,158,11,.4) !important;
  background: rgba(245,158,11,.03) !important;
}

/* ── Empty week ───────────────────────────────────────────── */
.wsc-empty {
  opacity: .45;
  border-left-color: rgba(255,255,255,.08) !important;
}

/* ── Week label (S1, S2…) ─────────────────────────────────── */
.wsc-week-lbl {
  font-size: 10px;
  font-weight: 800;
  color: #a0a0a0;
  letter-spacing: .06em;
  margin-bottom: 5px;
  display: flex;
  align-items: baseline;
  gap: 4px;
}
.wsc-range {
  font-size: 9px;
  font-weight: 600;
  color: #606060;
  letter-spacing: 0;
}

/* ── PnL value ────────────────────────────────────────────── */
.wsc-pnl {
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.1;
  margin-bottom: 1px;
}
.wsc-pnl.pos { color: #34d399; }
.wsc-pnl.neg { color: #fb7185; }
.wsc-pnl.be  { color: #fbbf24; }

/* ── Percentage ───────────────────────────────────────────── */
.wsc-pct {
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  opacity: .75;
  margin-bottom: 6px;
}
.wsc-pct.pos { color: #34d399; }
.wsc-pct.neg { color: #fb7185; }
.wsc-pct.be  { color: #fbbf24; }

/* ── Stats row (trades + WR) ──────────────────────────────── */
.wsc-stats-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.wsc-stat {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.wsc-stat-v {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #d0d0d0;
  line-height: 1.2;
}
.wsc-stat-l {
  font-size: 9px;
  font-weight: 600;
  color: #606060;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* ── "Sin trades" placeholder ─────────────────────────────── */
.wsc-no-trades {
  font-size: 10.5px;
  color: #484848;
  font-style: italic;
}

/* ── Responsive: hide column on small screens ─────────────── */
@media (max-width: 720px) {
  .j-layout { grid-template-columns: 1fr; }
  .j-week-col { display: none; }
}
@media (min-width: 721px) and (max-width: 900px) {
  .j-layout { grid-template-columns: 1fr 150px; }
}

/* ═══════════════════════════════════════════════════════════════
   WEEKLY COLUMN v2 — Fixed design
   ═══════════════════════════════════════════════════════════════ */

/* Two-column override */
.j-layout {
  display: grid !important;
  grid-template-columns: 1fr 168px !important;
  gap: 12px !important;
  align-items: start !important;
}
.j-cal-col { min-width: 0; }
.j-week-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  padding-top: 30px; /* align with first calendar row (below wday-row) */
}

/* Column header */
.wsc-col-header {
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  color: #606060 !important;
  padding: 0 6px 8px !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  margin-bottom: 2px !important;
  display: block !important;
}

/* Base card */
.wsc-card {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-left: 2.5px solid rgba(255,255,255,.1) !important;
  border-radius: 9px !important;
  padding: 9px 10px !important;
  transition: all .18s !important;
  min-height: 64px !important;
}
.wsc-card:hover { background: rgba(255,255,255,.05) !important; }
.wsc-pos { border-left-color: rgba(16,185,129,.55) !important; background: rgba(16,185,129,.03) !important; }
.wsc-neg { border-left-color: rgba(244,63,94,.45) !important; background: rgba(244,63,94,.025) !important; }
.wsc-be  { border-left-color: rgba(245,158,11,.45) !important; background: rgba(245,158,11,.025) !important; }
.wsc-empty { opacity: .4 !important; }

/* Row 1: "S1  1–7" */
.wsc-row1 { display: flex; align-items: baseline; gap: 5px; margin-bottom: 4px; }
.wsc-num  { font-size: 10px; font-weight: 800; color: #c0c0c0; letter-spacing: .04em; }
.wsc-dates{ font-size: 9px; font-weight: 600; color: #585858; }

/* Row 2: PnL + % */
.wsc-row2 { display: flex; align-items: baseline; gap: 5px; margin-bottom: 5px; }
.wsc-big-pnl {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1;
}
.wsc-big-pnl.pos { color: #34d399 !important; }
.wsc-big-pnl.neg { color: #fb7185 !important; }
.wsc-big-pnl.be  { color: #fbbf24 !important; }
.wsc-big-pct {
  font-size: 10px;
  font-weight: 700;
  opacity: .7;
}
.wsc-big-pct.pos { color: #34d399 !important; }
.wsc-big-pct.neg { color: #fb7185 !important; }
.wsc-big-pct.be  { color: #fbbf24 !important; }

/* Row 3: pills */
.wsc-row3 { display: flex; gap: 4px; flex-wrap: wrap; }
.wsc-pill {
  font-size: 9.5px;
  font-weight: 700;
  color: #747474;
  background: rgba(255,255,255,.05);
  border-radius: 99px;
  padding: 2px 7px;
  border: 1px solid rgba(255,255,255,.07);
}

.wsc-empty-txt {
  font-size: 10.5px;
  color: #3a3a3a;
  font-style: italic;
  margin-top: 4px;
}

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 700px) {
  .j-layout { grid-template-columns: 1fr !important; }
  .j-week-col { display: none !important; }
}

/* ── PDF Range buttons ─────────────────────────────────────── */
.pdf-range-btn {
  background: rgba(255,255,255,.04);
  border: 1.5px solid rgba(255,255,255,.08);
  border-radius: var(--r8);
  color: #909090;
  font-family: var(--ui);
  font-size: 13px;
  font-weight: 600;
  padding: 10px 14px;
  cursor: pointer;
  transition: all .18s;
  text-align: center;
}
.pdf-range-btn:hover { border-color: rgba(255,122,0,.25); color: var(--oraL); }
.pdf-range-btn.active {
  background: rgba(255,122,0,.1);
  border-color: rgba(255,122,0,.35);
  color: var(--oraL);
}

/* ═══════════════════════════════════════════════════════════════
   CALENDAR 8-COLUMN GRID — Week cards inline (perfect alignment)
   ═══════════════════════════════════════════════════════════════ */

/* Calendar grid: 7 day columns + 1 week summary column */
.cal-grid {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) 155px !important;
  gap: 4px !important;
}

/* Weekday header row: 7 day names + "Sem." */
.wday-row {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) 155px !important;
  gap: 4px !important;
  margin-bottom: 4px !important;
}
.wday-sem {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: #686868 !important;
  text-align: center !important;
  padding: 4px 0 !important;
}

/* ── Inline week summary card (8th column, auto-aligns per row) */
.wsc-inline {
  border-radius: 8px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-left: 2.5px solid rgba(255,255,255,.1) !important;
  background: rgba(255,255,255,.025) !important;
  padding: 8px 9px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 3px !important;
  min-height: 0 !important;
  transition: background .2s !important;
}
.wsc-inline:hover { background: rgba(255,255,255,.04) !important; }

/* Positive / Negative / BE / Empty variants */
.wsc-inline-pos {
  border-left-color: rgba(16,185,129,.55) !important;
  background: rgba(16,185,129,.04) !important;
}
.wsc-inline-neg {
  border-left-color: rgba(244,63,94,.45) !important;
  background: rgba(244,63,94,.03) !important;
}
.wsc-inline-be {
  border-left-color: rgba(245,158,11,.45) !important;
  background: rgba(245,158,11,.03) !important;
}
.wsc-inline-empty {
  opacity: .35 !important;
}

/* ── Week card typography (much more readable) ─────────────── */
.wi-num {
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: #b0b0b0 !important;
  margin-bottom: 1px !important;
}
.wi-empty {
  font-size: 13px !important;
  color: #444 !important;
  text-align: center !important;
}
.wi-pnl {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  line-height: 1.1 !important;
}
.wi-pnl.pos { color: #34d399 !important; }
.wi-pnl.neg { color: #fb7185 !important; }
.wi-pnl.be  { color: #fbbf24 !important; }
.wi-pct {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  opacity: .8 !important;
}
.wi-pct.pos { color: #34d399 !important; }
.wi-pct.neg { color: #fb7185 !important; }
.wi-pct.be  { color: #fbbf24 !important; }
.wi-meta {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  color: #787878 !important;
  margin-top: 1px !important;
}

/* ── Responsive: hide week column on mobile ────────────────── */
@media (max-width: 680px) {
  .cal-grid  { grid-template-columns: repeat(7, 1fr) !important; }
  .wday-row  { grid-template-columns: repeat(7, 1fr) !important; }
  .wsc-inline { display: none !important; }
  .wday-sem  { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════
   READABILITY v4 — Journal & week cards final pass
   Higher contrast, larger fonts, heavier weights
   ═══════════════════════════════════════════════════════════════ */

/* Journal stats strip */
.ss-val    { font-size: 16px !important; font-weight: 800 !important; opacity: 1 !important; }
.ss-lbl    { font-size: 11px !important; font-weight: 700 !important; color: #a0a0a0 !important; opacity: 1 !important; }

/* Calendar day number */
.day-num   { font-size: 13px !important; font-weight: 700 !important; color: #d0d0d0 !important; opacity: 1 !important; }
.day-cnt   { font-size: 10px !important; font-weight: 700 !important; color: #909090 !important; opacity: 1 !important; }
.day-pnl   { font-size: 11px !important; font-weight: 700 !important; opacity: 1 !important; }
.day-pct   { font-size: 10px !important; font-weight: 600 !important; opacity: .85 !important; }

/* Trade item pair name and labels */
.ti-pair   { font-size: 15px !important; font-weight: 800 !important; color: #f0f0f0 !important; }
.ti-ml     { font-size: 10px !important; font-weight: 700 !important; color: #a8a8a8 !important; letter-spacing: .08em !important; opacity: 1 !important; }
.ti-mv     { font-size: 14px !important; font-weight: 800 !important; opacity: 1 !important; }

/* Dashboard KPI strip */
.dkpi-val  { font-size: 26px !important; font-weight: 800 !important; opacity: 1 !important; }
.dkpi-lbl  { font-size: 11px !important; font-weight: 700 !important; color: #b0b0b0 !important; opacity: 1 !important; }

/* Stats section labels */
.sk-val    { font-size: 22px !important; font-weight: 800 !important; opacity: 1 !important; }
.sk-lbl    { font-size: 11px !important; font-weight: 700 !important; color: #a8a8a8 !important; opacity: 1 !important; }
.bk-val    { font-size: 20px !important; font-weight: 800 !important; opacity: 1 !important; }
.bk-lbl    { font-size: 10.5px !important; font-weight: 700 !important; color: #a0a0a0 !important; opacity: 1 !important; }

/* Eliminate ALL residual opacity issues */
.dkpi-data *,
.ss-row *,
.day-cell *,
.wsc-inline *,
.ti-grid * {
  opacity: 1 !important;
}

/* ═══════════════════════════════════════════════════════════════
   BACKUP MODAL STYLES
   ═══════════════════════════════════════════════════════════════ */

/* ── Dropzone ─────────────────────────────────────────────── */
.bk-dropzone {
  border: 2px dashed rgba(255,255,255,.1);
  border-radius: var(--r16);
  padding: 36px 24px;
  text-align: center;
  cursor: pointer;
  transition: all .2s;
  background: rgba(255,255,255,.02);
}
.bk-dropzone:hover, .bk-dz-active {
  border-color: rgba(255,122,0,.4) !important;
  background: rgba(255,122,0,.04) !important;
}
.bk-dz-ico   { font-size: 32px; margin-bottom: 12px; }
.bk-dz-title { font-size: 15px; font-weight: 700; color: var(--t1); margin-bottom: 6px; }
.bk-dz-sub   { font-size: 13px; color: var(--t2); }

/* ── Preview card ─────────────────────────────────────────── */
.bk-preview {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--r12);
  padding: 14px 16px;
  margin-bottom: 4px;
}
.bk-preview-row {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px;
  color: var(--t2); font-size: 13px;
}
.bk-prev-file {
  font-weight: 600; color: var(--t1);
  word-break: break-all; font-size: 13px;
}
.bk-preview-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.bk-prev-stat {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  background: rgba(255,255,255,.03);
  border-radius: var(--r8); padding: 8px 4px;
}
.bk-prev-val { font-size: 15px; font-weight: 800; color: var(--t1); }
.bk-prev-lbl { font-size: 9.5px; font-weight: 700; color: var(--t3); letter-spacing: .08em; text-transform: uppercase; }

/* ── Mode options ─────────────────────────────────────────── */
.bk-mode-opt {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 16px; border-radius: var(--r12);
  border: 1.5px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.025);
  cursor: pointer; transition: all .18s;
}
.bk-mode-selected {
  border-color: rgba(255,122,0,.3) !important;
  background: rgba(255,122,0,.06) !important;
}
.bk-mode-radio {
  width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0;
  border: 2px solid rgba(255,255,255,.2);
  margin-top: 2px; transition: all .18s;
}
.bk-radio-on {
  border-color: var(--oraL) !important;
  background: var(--oraL) !important;
  box-shadow: 0 0 0 3px rgba(255,122,0,.15) !important;
}
.bk-mode-title { font-size: 14px; font-weight: 700; color: var(--t1); margin-bottom: 3px; }
.bk-mode-desc  { font-size: 12.5px; color: var(--t2); line-height: 1.55; }

/* ═══════════════════════════════════════════════════════════════
   EMERGENCY LAYOUT FIX — Journal calendar restoration
   Overrides all conflicting j-layout / cal-grid rules above.
   ═══════════════════════════════════════════════════════════════ */

/* j-layout is now a plain block — the 8-col cal-grid handles layout itself.
   Previously had grid-template-columns:1fr 168px which put cal-grid in a
   168px column, compressing all 8 day+week columns into a tiny space. */
.j-layout,
.j-layout.j-layout {
  display:  block !important;
  grid-template-columns: none !important;
  gap: 0 !important;
}

/* wday-row: 7 day headers + 1 "Sem." header
   minmax(0,1fr) instead of 1fr so columns can shrink correctly */
.wday-row {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) 130px !important;
  gap: 4px !important;
  margin-bottom: 4px !important;
  width: 100% !important;
}

/* cal-grid: same 8-column layout, full width */
.cal-grid {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) 130px !important;
  gap: 4px !important;
  width: 100% !important;
}

/* Day cells must not shrink below a usable size */
.day-cell {
  min-width: 0 !important;
  overflow: hidden !important;
}

/* Week summary cards fill their grid cell height automatically */
.wsc-inline {
  height: 100% !important;
  box-sizing: border-box !important;
}

/* Hide week column on small screens */
@media (max-width: 680px) {
  .wday-row { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
  .cal-grid  { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
  .wsc-inline, .wday-sem { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════
   TRADE ITEM — button overlap fix + improved spacing
   ═══════════════════════════════════════════════════════════════ */

/* Give each trade card enough right padding so absolute buttons never overlap */
.trade-item {
  padding: 14px 14px 14px 14px !important;
  padding-right: 72px !important;   /* reserve space for 2 buttons (26px × 2 + gaps) */
}

/* Buttons: always in top-right corner, never overlap content */
.ti-acts {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  display: flex !important;
  gap: 5px !important;
  opacity: 0 !important;
  transition: opacity .14s !important;
  z-index: 2 !important;
}
.trade-item:hover .ti-acts { opacity: 1 !important; }

/* Slightly larger touch target on mobile */
.ti-btn {
  width: 28px !important;
  height: 28px !important;
  border-radius: 7px !important;
  font-size: 11px !important;
  flex-shrink: 0 !important;
}

/* Top row: pair + badges — leave room on right for buttons */
.ti-top {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-bottom: 10px !important;
  padding-right: 0 !important;  /* padding already on .trade-item */
}

/* ═══════════════════════════════════════════════════════════════
   PROFILE PHOTO
   ═══════════════════════════════════════════════════════════════ */
.profile-photo-wrap {
  position: relative;
  width: 72px;
  height: 72px;
  flex-shrink: 0;
}
.profile-photo-img {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid rgba(255,122,0,.35);
  display: block;
}
.profile-photo-overlay {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  cursor: pointer;
  transition: opacity .18s;
  font-size: 18px;
}
.profile-photo-wrap:hover .profile-photo-overlay { opacity: 1; }

/* Photo upload button (shown when no photo) */
.profile-photo-upload-btn {
  font-size: 11px;
  font-weight: 700;
  color: var(--oraL);
  background: rgba(255,122,0,.08);
  border: 1px solid rgba(255,122,0,.2);
  border-radius: var(--r8);
  padding: 5px 12px;
  cursor: pointer;
  transition: all .18s;
  white-space: nowrap;
}
.profile-photo-upload-btn:hover { background: rgba(255,122,0,.14); }

/* Sidebar & topbar: show photo instead of emoji when available */
.sb-avatar-img, .tb-avatar-img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  border: 1.5px solid rgba(255,122,0,.3);
}

/* ═══════════════════════════════════════════════════════════════
   GLOBAL PROFILE PHOTO — sidebar + topbar circular avatars
   ═══════════════════════════════════════════════════════════════ */

/* Sidebar avatar (#userAv) */
.user-av {
  border-radius: 50% !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center !important;
  flex-shrink: 0 !important;
  transition: opacity .2s !important;
}

/* Topbar avatar (#topbarAv) */
.tb-user-av {
  border-radius: 50% !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center !important;
  flex-shrink: 0 !important;
  transition: opacity .2s !important;
}

/* Topbar name greeting */
.tb-hi { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ═══════════════════════════════════════════════════════════════
   SETTINGS TABS
   ═══════════════════════════════════════════════════════════════ */
.set-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  margin-bottom: 24px;
  padding-bottom: 0;
}
.set-tab {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,.38);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: color .15s;
  margin-bottom: -1px;
  letter-spacing: .01em;
}
.set-tab:hover { color: rgba(255,255,255,.65); }
.set-tab.active {
  color: #ff7a00;
  border-bottom-color: #ff7a00;
}
.set-tab-panel { display: block; }
.set-tab-panel.hidden { display: none !important; }

/* ═══════════════════════════════════════════════════════════════
   SUBSCRIPTION PANEL
   ═══════════════════════════════════════════════════════════════ */
.sub-panel { display: flex; flex-direction: column; gap: 20px; max-width: 680px; }

.sub-status-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(135deg, rgba(255,122,0,.07) 0%, rgba(255,122,0,.02) 100%);
  border: 1px solid rgba(255,122,0,.18);
  border-radius: 16px;
  padding: 24px 28px;
  gap: 16px;
}
.sub-plan-badge {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  background: rgba(255,122,0,.15);
  color: #ff8c2a;
  border: 1px solid rgba(255,122,0,.25);
  border-radius: 99px;
  padding: 3px 10px;
  margin-bottom: 8px;
}
.sub-plan-name {
  font-size: 20px;
  font-weight: 800;
  color: var(--t1, #f0f0f0);
  letter-spacing: -.02em;
  margin-bottom: 4px;
}
.sub-plan-meta { font-size: 13px; color: var(--t2, #888); }
.sub-days-wrap { text-align: center; }
.sub-days-num {
  font-size: 40px;
  font-weight: 900;
  color: #ff8c2a;
  letter-spacing: -.04em;
  line-height: 1;
}
.sub-days-lbl { font-size: 11px; color: var(--t3, #555); margin-top: 4px; font-weight: 600; }

.sub-details-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(255,255,255,.06);
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.06);
}
.sub-detail-item {
  background: rgba(255,255,255,.02);
  padding: 16px 20px;
}
.sub-detail-lbl {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--t3, #555);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.sub-detail-val { font-size: 14px; font-weight: 600; color: var(--t1, #f0f0f0); }

.sub-includes {
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 20px;
}
.sub-includes-title {
  font-size: 11px;
  font-weight: 700;
  color: var(--t3, #555);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.sub-includes-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.sub-include-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--t2, #888);
}
.sub-include-item svg { color: #34d399; flex-shrink: 0; }

.sub-cancel-wrap { padding-top: 4px; }
.sub-cancel-btn {
  font-size: 13px;
  font-weight: 600;
  color: rgba(248,113,113,.7);
  background: rgba(248,113,113,.06);
  border: 1px solid rgba(248,113,113,.15);
  border-radius: 10px;
  padding: 10px 20px;
  cursor: pointer;
  transition: all .18s;
  margin-bottom: 10px;
}
.sub-cancel-btn:hover {
  background: rgba(248,113,113,.1);
  color: #f87171;
}
.sub-cancel-note {
  font-size: 12px;
  color: var(--t3, #555);
  line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════════════
   DASHBOARD QUICK NAV TABS
   ═══════════════════════════════════════════════════════════════ */
.dash-quick-nav {
  display: flex;
  align-items: center;
  gap: 2px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  margin-bottom: 24px;
  margin-top: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}
.dash-quick-nav::-webkit-scrollbar { display: none; }

.dqn-tab {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,.35);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: color .15s;
  margin-bottom: -1px;
  letter-spacing: .01em;
}
.dqn-tab svg { opacity: .6; }
.dqn-tab:hover { color: rgba(255,255,255,.65); }
.dqn-tab:hover svg { opacity: .8; }
.dqn-tab.active {
  color: var(--t1, #f0f0f0);
  border-bottom-color: #ff7a00;
}
.dqn-tab.active svg { opacity: 1; color: #ff7a00; }

/* Account drop styling kept minimal to not conflict with JS positioning */
.dash-equity-wrap {
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 18px;
  padding: 18px 20px 14px;
  margin-bottom: 20px;
}

.dash-equity-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.dash-equity-title {
  font-size: 12px;
  font-weight: 700;
  color: rgba(255,255,255,.35);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dash-equity-pnl {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -.02em;
}

#dashEqChart {
  display: block !important;
  width: 100% !important;
  height: 80px !important;
  border-radius: 8px;
}





/* ═══════════════════════════════════════════════════════════════
   ACCOUNT SELECTOR — Premium SaaS 2026 redesign
   Inspired by Linear, Stripe, Vercel, Arc
   VISUAL ONLY — no logic touched
   ═══════════════════════════════════════════════════════════════ */

/* ── Sidebar wrapper ──────────────────────────────────────────── */
.sb-acc-wrap {
  padding: 16px 14px 14px !important;
  border-bottom: 1px solid rgba(255,255,255,.04) !important;
}

.sb-acc-lbl {
  font-size: 9px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  color: rgba(255,255,255,.2) !important;
  margin-bottom: 7px !important;
  text-transform: uppercase !important;
}

/* ── Active account button ────────────────────────────────────── */
.sb-acc-btn {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  cursor: pointer !important;
  transition: background .15s, border-color .15s !important;
}

.sb-acc-btn:hover {
  background: rgba(255,255,255,.055) !important;
  border-color: rgba(255,255,255,.1) !important;
}

.sb-acc-btn[aria-expanded="true"] {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.1) !important;
}

/* Dot — smaller, cleaner glow */
.sb-acc-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  box-shadow: none !important;
  opacity: .85 !important;
}

/* Account name */
.sb-acc-name {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.82) !important;
  flex: 1 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  letter-spacing: -.01em !important;
}

/* Chevron */
.sb-acc-chevron {
  color: rgba(255,255,255,.25) !important;
  flex-shrink: 0 !important;
  transition: transform .2s !important;
}

.sb-acc-btn[aria-expanded="true"] .sb-acc-chevron {
  transform: rotate(180deg) !important;
  color: rgba(255,255,255,.4) !important;
}

/* ── Dropdown container ───────────────────────────────────────── */
.sb-acc-drop {
  background: #0d0d0f !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 12px !important;
  box-shadow:
    0 4px 6px rgba(0,0,0,.3),
    0 12px 40px rgba(0,0,0,.5),
    0 0 0 1px rgba(255,255,255,.03) !important;
  overflow: hidden !important;
  animation: none !important;
  padding: 4px !important;
}

/* ── Dropdown rows ────────────────────────────────────────────── */
.acc-drop-item {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  padding: 10px 12px !important;
  cursor: pointer !important;
  border-radius: 8px !important;
  border-bottom: none !important;
  transition: background .12s !important;
  margin: 1px 0 !important;
}

.acc-drop-item:hover {
  background: rgba(255,255,255,.05) !important;
}

.acc-drop-item.acc-active {
  background: rgba(255,255,255,.06) !important;
  border-left: none !important;
}

/* Dot in dropdown */
.acc-drop-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  opacity: .8 !important;
}

/* Account name in dropdown */
.acc-drop-name {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.85) !important;
  letter-spacing: -.01em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.acc-drop-item.acc-active .acc-drop-name {
  color: #fff !important;
  font-weight: 600 !important;
}

/* Firm / subtitle */
.acc-drop-firm {
  font-size: 11px !important;
  color: rgba(255,255,255,.28) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

/* Balance */
.acc-drop-bal {
  font-size: 12px !important;
  font-family: var(--mono) !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.4) !important;
  flex-shrink: 0 !important;
  margin-left: auto !important;
}

.acc-drop-item.acc-active .acc-drop-bal {
  color: rgba(255,255,255,.65) !important;
}

/* Active indicator — subtle right dot instead of left border */
.acc-drop-item.acc-active::after {
  content: '' !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.35) !important;
  flex-shrink: 0 !important;
}

/* ── Add account row ──────────────────────────────────────────── */
.acc-drop-new {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.35) !important;
  cursor: pointer !important;
  border-radius: 8px !important;
  border-top: 1px solid rgba(255,255,255,.05) !important;
  margin-top: 3px !important;
  transition: background .12s, color .12s !important;
  letter-spacing: 0 !important;
}

.acc-drop-new:hover {
  background: rgba(255,255,255,.04) !important;
  color: rgba(255,255,255,.55) !important;
}

/* ═══════════════════════════════════════════════════════════════
   TRADERZONE — Premium Visual Redesign 2026
   Reference: Arc, Linear, Stripe, Vercel, fintech SaaS
   VISUAL ONLY — zero structural changes
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. CSS variable overrides ─────────────────────────────── */
:root {
  /* Borders: near-invisible layered surfaces */
  --b1: rgba(255,255,255,.035);
  --b2: rgba(255,255,255,.055);
  --b3: rgba(255,255,255,.09);

  /* Surfaces: warm near-black with depth */
  --bg:  #020202;
  --bg2: #060608;
  --bg3: #0b0b0e;
  --bg4: #111114;
  --bg5: #18181c;
  --bg6: #202026;

  /* Accent: orange kept only for primary CTAs, muted everywhere else */
  --ora:  #f97316;
  --oraL: #fb923c;
  --oraD: #c2410c;
  --oraG: rgba(249,115,22,.07);
  --oraM: rgba(249,115,22,.12);

  /* Depth shadows */
  --sh-sm: 0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);
  --sh-md: 0 4px 12px rgba(0,0,0,.5), 0 2px 4px rgba(0,0,0,.3);
  --sh-lg: 0 12px 40px rgba(0,0,0,.6), 0 4px 12px rgba(0,0,0,.4);
  --sh-xl: 0 24px 64px rgba(0,0,0,.7), 0 8px 24px rgba(0,0,0,.5);
}

/* ── 2. App shell & sidebar ────────────────────────────────── */
.app-shell {
  background: var(--bg) !important;
}

.sidebar {
  background: #030305 !important;
  border-right: 1px solid rgba(255,255,255,.04) !important;
  box-shadow: 1px 0 0 rgba(255,255,255,.02) !important;
}

.sidebar::before {
  background: radial-gradient(ellipse at 40% -10%, rgba(249,115,22,.05) 0%, transparent 65%) !important;
}

.main {
  background: var(--bg) !important;
}

/* ── 3. Navigation items ───────────────────────────────────── */
.nav-item {
  border-color: transparent !important;
  color: rgba(255,255,255,.38) !important;
}

.nav-item:hover {
  background: rgba(255,255,255,.04) !important;
  border-color: transparent !important;
  color: rgba(255,255,255,.65) !important;
}

.nav-item.active {
  background: rgba(255,255,255,.06) !important;
  border-color: transparent !important;
  color: rgba(255,255,255,.9) !important;
}

.nav-item.active::before {
  background: rgba(255,255,255,.5) !important;
  width: 2px !important;
  box-shadow: none !important;
}

/* ── 4. Dashboard KPI cards ────────────────────────────────── */
.dash-kpi {
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 14px !important;
  box-shadow: var(--sh-sm) !important;
  transition: box-shadow .2s, border-color .2s !important;
}

.dash-kpi:hover {
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: var(--sh-md) !important;
}

/* KPI icon badges — remove orange borders, use depth */
.dkpi-ora, .dkpi-blue, .dkpi-grn, .dkpi-red {
  border: none !important;
  box-shadow: none !important;
}

.dkpi-ora  { background: rgba(249,115,22,.08) !important; color: #fb923c !important; }
.dkpi-blue { background: rgba(249,115,22,.06) !important; color: #fb923c !important; }
.dkpi-grn  { background: rgba(16,185,129,.08)  !important; color: #34d399 !important; }
.dkpi-red  { background: rgba(244,63,94,.08)   !important; color: #fb7185 !important; }

/* ── 5. Dashboard nav cards (Journal, Stats, etc) ──────────── */
.dnc {
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  box-shadow: var(--sh-sm) !important;
  transition: box-shadow .2s, border-color .2s, background .2s !important;
}

.dnc:hover {
  background: rgba(255,255,255,.035) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: var(--sh-md) !important;
}

/* Nav card icon badges */
.dnc-icon-ora, .dnc-icon-blue, .dnc-icon-grn, .dnc-icon-ppl {
  border: none !important;
  box-shadow: none !important;
}

.dnc-icon-ora  { background: rgba(249,115,22,.08) !important; color: #fb923c !important; }
.dnc-icon-blue { background: rgba(249,115,22,.06) !important; color: #fb923c !important; }
.dnc-icon-grn  { background: rgba(16,185,129,.08)  !important; color: #34d399 !important; }
.dnc-icon-ppl  { background: rgba(139,92,246,.07)  !important; color: #a78bfa !important; }

/* ── 6. Account hero card ──────────────────────────────────── */
.ahc {
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  box-shadow: var(--sh-md) !important;
}

.ahc-left {
  border-right-color: rgba(255,255,255,.04) !important;
}

/* ── 7. Settings cards ─────────────────────────────────────── */
.set-card {
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  box-shadow: var(--sh-sm) !important;
  transition: box-shadow .2s, border-color .2s !important;
}

.set-card:hover {
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: var(--sh-md) !important;
  background: rgba(255,255,255,.03) !important;
}

/* Remove orange border on set-card hover */
.set-card:hover { border-color: rgba(255,255,255,.08) !important; }

/* ── 8. Input fields ───────────────────────────────────────── */
.text-input,
input[type="text"], input[type="email"], input[type="password"], input[type="number"],
textarea, select {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  color: rgba(255,255,255,.85) !important;
  transition: border-color .15s, box-shadow .15s !important;
}

.text-input:focus,
input:focus, textarea:focus, select:focus {
  border-color: rgba(255,255,255,.18) !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.04) !important;
  outline: none !important;
}

/* ── 9. Calendar ───────────────────────────────────────────── */
.cal-head {
  border-bottom-color: rgba(255,255,255,.04) !important;
}

.day-cell {
  border-color: rgba(255,255,255,.04) !important;
  background: rgba(255,255,255,.01) !important;
  transition: background .12s !important;
}

.day-cell:hover {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.07) !important;
}

.day-cell.today::before {
  background: rgba(249,115,22,.6) !important;
  height: 1px !important;
}

.day-cell.has-trades {
  background: rgba(16,185,129,.06) !important;
  border-color: rgba(16,185,129,.12) !important;
}

.day-cell.has-losses {
  background: rgba(244,63,94,.05) !important;
  border-color: rgba(244,63,94,.1) !important;
}

/* ── 10. Tabs ──────────────────────────────────────────────── */
.tab {
  color: rgba(255,255,255,.35) !important;
  border-bottom-color: transparent !important;
}

.tab:hover {
  color: rgba(255,255,255,.6) !important;
}

.tab.active {
  color: rgba(255,255,255,.9) !important;
  border-bottom-color: rgba(255,255,255,.4) !important;
}

.set-tab.active {
  color: rgba(255,255,255,.85) !important;
  border-bottom-color: rgba(255,255,255,.35) !important;
}

/* ── 11. Buttons — remove aggressive orange borders ─────────── */
.btn-add-trade,
.btn-mt5-import,
.arrow-btn,
.btn-manage-accs,
.ahc-edit-btn,
.sb-collapse-btn {
  border-color: rgba(255,255,255,.07) !important;
  color: rgba(255,255,255,.45) !important;
  background: transparent !important;
}

.btn-add-trade:hover,
.btn-mt5-import:hover,
.arrow-btn:hover,
.btn-manage-accs:hover,
.ahc-edit-btn:hover,
.sb-collapse-btn:hover {
  border-color: rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.75) !important;
  background: rgba(255,255,255,.04) !important;
}

/* Primary CTA keeps orange gradient */
.btn-cta, .btn-save-primary {
  background: linear-gradient(135deg, #f97316, #ea580c) !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(249,115,22,.22) !important;
}

.btn-today {
  border-color: rgba(255,255,255,.1) !important;
  color: rgba(255,255,255,.5) !important;
  background: transparent !important;
}

.btn-today:hover {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.15) !important;
  color: rgba(255,255,255,.75) !important;
}

/* ── 12. Modals & overlays ─────────────────────────────────── */
.modal-card,
.modal-overlay > div,
.ob-card {
  background: #0c0c0f !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  box-shadow: var(--sh-xl) !important;
}

/* ── 13. Login card ────────────────────────────────────────── */
.auth-card {
  background: #0b0b0e !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: var(--sh-xl) !important;
}

/* ── 14. Stats section cards ───────────────────────────────── */
.stats-card,
.sv-card,
.sv-section {
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  box-shadow: var(--sh-sm) !important;
}

/* ── 15. Trade rows ────────────────────────────────────────── */
.trade-item,
.trade-row {
  border-bottom-color: rgba(255,255,255,.04) !important;
  transition: background .1s !important;
}

.trade-item:hover,
.trade-row:hover {
  background: rgba(255,255,255,.025) !important;
}

/* ── 16. View backgrounds ──────────────────────────────────── */
.vi {
  background: transparent !important;
}

/* ── 17. Subscription panel ────────────────────────────────── */
.sub-status-card {
  background: rgba(249,115,22,.04) !important;
  border-color: rgba(249,115,22,.1) !important;
}

/* ── 18. Scrollbar refinement ──────────────────────────────── */
::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.06) !important;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,.1) !important;
}

/* ── 19. Subtle glow on active nav items ───────────────────── */
.nav-item.active {
  box-shadow: inset 0 0 20px rgba(255,255,255,.015) !important;
}

/* ── 20. Sound/voice buttons ───────────────────────────────── */
.sound-btn.active {
  border-color: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.6) !important;
  background: rgba(255,255,255,.05) !important;
}

/* ═══════════════════════════════════════════════════════════════
   DASHBOARD LAYOUT REDESIGN
   4 filas: equity full · datos+KPIs · journal+plan · stats+tip
   ═══════════════════════════════════════════════════════════════ */

/* ── Shared spacing ─────────────────────────────────────────── */
.dash-vi { display:flex; flex-direction:column; gap:16px; padding-bottom:32px; }

/* ── FILA 1: Equity card — ancho completo ───────────────────── */
.db-eq-card {
  background: var(--bg2, #0a0a0d);
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,.4);
}

.db-eq-topbar {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 18px 24px 14px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  flex-wrap: wrap;
}

.db-eq-account {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.db-eq-summary {
  display: flex;
  align-items: center;
  gap: 0;
  flex: 1;
  flex-wrap: wrap;
}

.db-eq-val {
  display: flex;
  flex-direction: column;
  padding: 0 20px;
  gap: 3px;
}

.db-eq-val:first-child { padding-left: 0; }

.db-eq-sep {
  width: 1px;
  height: 32px;
  background: rgba(255,255,255,.06);
  flex-shrink: 0;
}

.db-eq-label {
  font-size: 10px;
  font-weight: 600;
  color: rgba(255,255,255,.3);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.db-eq-num {
  font-size: 15px;
  font-weight: 700;
  color: rgba(255,255,255,.85);
  letter-spacing: -.01em;
  font-family: var(--mono);
}

.db-eq-chart {
  position: relative;
  padding: 0 4px 4px;
  height: 180px;
}

.db-eq-chart canvas {
  width: 100%;
  height: 100%;
  display: block;
}

/* ── FILA 2: Datos cuenta + 3 KPIs ─────────────────────────── */
.db-row2 {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 12px;
  align-items: stretch;
}

/* Account data card */
.db-account-card {
  background: var(--bg2, #0a0a0d);
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 16px;
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0 2px 12px rgba(0,0,0,.3);
}

.db-card-lbl {
  font-size: 10px;
  font-weight: 600;
  color: rgba(255,255,255,.25);
  letter-spacing: .09em;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.db-ac-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.db-ac-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}

.db-ac-name {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255,255,255,.85);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.db-ac-firm {
  font-size: 11px;
  color: rgba(255,255,255,.28);
  margin-bottom: 4px;
}

.db-ac-divider {
  height: 1px;
  background: rgba(255,255,255,.05);
  margin: 4px 0;
}

.db-ac-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.db-ac-key {
  font-size: 12px;
  color: rgba(255,255,255,.32);
  font-weight: 500;
}

.db-ac-val {
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(255,255,255,.75);
  font-family: var(--mono);
  text-align: right;
}

/* KPI cards */
.db-kpi-card {
  background: var(--bg2, #0a0a0d);
  border: 1px solid rgba(255,255,255,.05);
  border-radius: 16px;
  padding: 22px 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  box-shadow: 0 2px 12px rgba(0,0,0,.3);
  min-height: 0;
}

.db-kpi-big {
  font-size: 30px;
  font-weight: 800;
  color: rgba(255,255,255,.88);
  letter-spacing: -.03em;
  line-height: 1;
  font-family: var(--mono);
}

.db-kpi-sub {
  font-size: 11.5px;
  color: rgba(255,255,255,.28);
  font-weight: 500;
  line-height: 1.4;
}

/* ── FILAS 3 y 4: Nav cards en 2 columnas ───────────────────── */
.db-nav-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* ── Responsive: stack on small screens ─────────────────────── */
@media (max-width: 900px) {
  .db-row2 { grid-template-columns: 1fr 1fr; }
  .db-eq-summary { gap: 12px; }
}

@media (max-width: 600px) {
  .db-row2 { grid-template-columns: 1fr; }
  .db-nav-row { grid-template-columns: 1fr; }
  .db-eq-topbar { flex-direction: column; align-items: flex-start; }
}

/* ═══════════════════════════════════════════════════════════════
   DASHBOARD VISUAL UPGRADE — Premium, energía, jerarquía
   ═══════════════════════════════════════════════════════════════ */

/* ── Equity chart — fix height and give it real presence ─────── */
.db-eq-chart {
  height: 240px !important;
  padding: 0 !important;
  position: relative;
}
.db-eq-chart canvas {
  width: 100%;
  height: 100%;
  display: block;
}
.db-eq-chart .eq-empty {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: rgba(255,255,255,.2);
}

/* ── Equity topbar — bigger metrics ─────────────────────────── */
.db-eq-num {
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
}
.db-eq-label {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,.28) !important;
  letter-spacing: .1em !important;
}
.db-eq-topbar {
  padding: 20px 28px 16px !important;
  gap: 20px !important;
}
.db-eq-val { padding: 0 22px !important; gap: 5px !important; }

/* ── KPI cards — icon header ─────────────────────────────────── */
.db-kpi-header {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
}

.db-kpi-icon {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.db-icon-green { background: rgba(52,211,153,.1);  color: #34d399; }
.db-icon-blue  { background: rgba(99,179,237,.1);  color: #63b3ed; }
.db-icon-ora   { background: rgba(249,115,22,.1);  color: #fb923c; }
.db-icon-ppl   { background: rgba(167,139,250,.1); color: #a78bfa; }

/* ── KPI big numbers — MUCH bigger ──────────────────────────── */
.db-kpi-big {
  font-size: 42px !important;
  font-weight: 900 !important;
  letter-spacing: -.04em !important;
  line-height: 1 !important;
  color: rgba(255,255,255,.92) !important;
}

.db-kpi-pair {
  font-size: 30px !important;
  letter-spacing: -.02em !important;
}

/* ── KPI sub text ────────────────────────────────────────────── */
.db-kpi-sub {
  font-size: 12px !important;
  color: rgba(255,255,255,.3) !important;
  margin-top: 8px !important;
  line-height: 1.4 !important;
}

/* ── KPI chip (count badge) ──────────────────────────────────── */
.db-kpi-chip {
  font-size: 11px;
  color: rgba(255,255,255,.2);
  margin-top: 6px;
}

/* ── Time ago ────────────────────────────────────────────────── */
.db-kpi-time {
  font-size: 11px;
  color: rgba(255,255,255,.2);
  margin-top: 4px;
}

/* ── Ver trade button ────────────────────────────────────────── */
.db-kpi-btn {
  margin-top: 14px;
  width: 100%;
  padding: 9px 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  color: rgba(255,255,255,.5);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
  font-family: inherit;
  letter-spacing: .01em;
}
.db-kpi-btn:hover {
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.14);
  color: rgba(255,255,255,.75);
}

/* ── Card accents — top border per type ─────────────────────── */
.db-kpi-winrate  { border-top: 1.5px solid rgba(52,211,153,.25) !important; }
.db-kpi-lasttrade{ border-top: 1.5px solid rgba(99,179,237,.2)  !important; }
.db-kpi-streak   { border-top: 1.5px solid rgba(249,115,22,.25) !important; }
.db-account-card { border-top: 1.5px solid rgba(249,115,22,.2)  !important; }

/* ── Card shadows — more depth ───────────────────────────────── */
.db-kpi-card,
.db-account-card {
  box-shadow:
    0 1px 0 rgba(255,255,255,.04) inset,
    0 8px 32px rgba(0,0,0,.45),
    0 2px 8px rgba(0,0,0,.3) !important;
}

/* ── Account card — bigger name ──────────────────────────────── */
.db-ac-name {
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
}
.db-card-lbl {
  font-size: 10px !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,.28) !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
}
.db-ac-key {
  font-size: 11.5px !important;
  color: rgba(255,255,255,.28) !important;
}
.db-ac-val {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,.8) !important;
}

/* ── Row spacing ─────────────────────────────────────────────── */
.db-row2   { gap: 14px !important; }
.db-nav-row { gap: 14px !important; }
.dash-vi   { gap: 20px !important; }

/* ── KPI card internal layout ────────────────────────────────── */
.db-kpi-card {
  padding: 20px 22px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 0 !important;
}

/* ── Today cell — strong, clear highlight ───────────────────── */
.day-cell.today {
  border-color: rgba(255,122,0,.55) !important;
  background: rgba(255,122,0,.06) !important;
  box-shadow: 0 0 0 1px rgba(255,122,0,.2), inset 0 0 12px rgba(255,122,0,.04) !important;
}
.day-cell.today::before {
  height: 3px !important;
  background: linear-gradient(90deg, #ff7a00, #ff4500) !important;
}
.day-cell.today .day-num {
  color: #ff8c2a !important;
  font-weight: 800 !important;
}

/* ── MULTI-IMAGE UPLOAD ─────────────────────────────────────── */
.multi-img-zone {
  border: 1.5px dashed rgba(255,255,255,.1);
  border-radius: 12px;
  padding: 10px;
  background: rgba(255,255,255,.02);
  transition: border-color .2s;
  min-height: 80px;
}
.multi-img-zone.drag-over { border-color: rgba(255,122,0,.4); background: rgba(255,122,0,.04); }

.multi-img-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
  gap: 8px;
  margin-bottom: 8px;
}
.multi-img-thumb {
  position: relative;
  aspect-ratio: 1;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  cursor: pointer;
}
.multi-img-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity .2s;
}
.multi-img-thumb:hover img { opacity: .8; }
.multi-img-remove {
  position: absolute; top: 4px; right: 4px;
  width: 20px; height: 20px;
  background: rgba(0,0,0,.75);
  border: none; border-radius: 50%;
  color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .15s;
}
.multi-img-thumb:hover .multi-img-remove { opacity: 1; }

.multi-img-add {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 4px; padding: 14px 10px;
  color: rgba(255,255,255,.3);
  cursor: pointer;
  border-radius: 8px;
  transition: background .15s, color .15s;
  font-size: 12px;
}
.multi-img-add:hover { background: rgba(255,255,255,.04); color: rgba(255,255,255,.6); }
.multi-img-hint { font-size: 10.5px; color: rgba(255,255,255,.2); }

.ti-image-wrap + .ti-image-wrap { margin-top: 8px; }