/* =====================================================================
   unify.css  -  loaded LAST.
   One idea: things that belong together are physically attached.
   1. Sign in / Create account is ONE box (tabs, fields, buttons are
      rows of the same box, separated by hairlines, not floating pieces).
   2. Leaderboard is ONE box per board (header, rows, footer are
      attached; rows are divided by hairlines instead of being 10
      separate cards).
   Uses the existing glass tokens so every theme keeps working.
   ===================================================================== */

:root{
  --u-edge:var(--gl-edge,rgba(255,255,255,.14));
  --u-rule:var(--gl-edge-2,rgba(255,255,255,.08));
  --u-fill:var(--gl-fill,rgba(8,8,10,.55));
  --u-hi:var(--tm-hi,255,255,255);
}

/* ---------------------------------------------------------------------
   1. SIGN IN / CREATE ACCOUNT
   --------------------------------------------------------------------- */
#auth .au-card{
  max-width:400px;padding:0!important;overflow:hidden;border-radius:18px!important;
  background-color:#0b0d0c!important;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.7),inset 0 0 0 1px var(--u-edge)!important}

/* header: no logo, just the name and one line */
#auth .au-brand{display:block;margin:0;padding:24px 56px 20px 22px;font-size:inherit}
#auth .au-brand .pl-mark,#auth .au-brand .pl-lockup{display:none!important}
#auth .au-brand .pl-word{display:block;font-size:13px;font-weight:700;letter-spacing:-.01em;color:var(--txt-3)!important}
#auth .au-sub{margin:6px 0 0;font-size:21px;line-height:1.25;font-weight:700;letter-spacing:-.025em;color:var(--txt)}
#auth .au-x{top:12px;right:12px;width:32px;height:32px;padding:0;display:grid;place-items:center;
  border-radius:9px;font-size:22px;color:var(--txt-3)}
#auth .au-x:hover{background:rgba(var(--u-hi),.08)}

/* tabs: a flush two-cell row across the card */
#auth .au-tabs{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:0;padding:0;border-radius:0;
  background:none!important;border-top:1px solid var(--u-rule);border-bottom:1px solid var(--u-rule);
  -webkit-backdrop-filter:none;backdrop-filter:none}
#auth .au-tabs button{border-radius:0;padding:14px 8px;font-size:14px;color:var(--txt-3);background:none;position:relative}
#auth .au-tabs button+button{border-left:1px solid var(--u-rule)}
#auth .au-tabs button.sel{background:rgba(var(--u-hi),.05);color:var(--txt)}
#auth .au-tabs button.sel::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--up,#2ee07f)}

/* fields: rows of the same box, label small, input borderless */
#auth .au-f{margin:0;padding:11px 22px 12px;border-bottom:1px solid var(--u-rule);transition:background .12s}
#auth .au-f:focus-within{background:rgba(var(--u-hi),.04)}
#auth .au-f>span{margin:0 0 3px;font-size:12px;font-weight:600;color:var(--txt-3)}
#auth .au-f input,#auth .au-pw input{
  display:block;width:100%;padding:4px 0!important;border:0!important;border-radius:0;outline:none;
  background:transparent!important;box-shadow:none;font:500 16px var(--ui);color:var(--txt)!important}
#auth .au-f input:focus,#auth .au-pw input:focus{border:0!important}
#auth .au-f input::placeholder{color:rgba(var(--u-hi),.28)}
#auth .au-pw input{padding-right:56px!important}
#auth .au-pw button{right:-8px;font-size:12.5px;color:var(--txt-3);border-radius:8px}
#auth .au-pw button:hover{color:var(--txt)}
#auth .au-hint{margin-top:4px}

/* message only takes space when there is one */
#auth .au-msg{min-height:0;margin:0;padding:10px 22px;border-bottom:1px solid var(--u-rule);font-size:13px;line-height:1.4}
#auth .au-msg:empty{display:none}
#auth .au-msg:not(.ok){background:rgba(255,85,51,.07)}
#auth .au-msg.ok{background:rgba(31,213,97,.07)}

/* actions: full-width rows attached to the bottom of the fields */
#auth .au-go{display:block;width:100%;margin:0;border-radius:0;padding:15px;font-size:15px}
#auth .au-prov{display:block;margin:0}
#auth .au-oauth,#auth .au-guest{
  display:block;width:100%;margin:0;border:0!important;border-top:1px solid var(--u-rule)!important;border-radius:0!important;
  background:transparent!important;color:var(--txt-2)!important;padding:14px;font:600 14px var(--ui)}
#auth .au-oauth:hover,#auth .au-guest:hover{background:rgba(var(--u-hi),.05)!important;color:var(--txt)!important}

/* footer lives inside the same box */
#auth .au-foot{border-top:1px solid var(--u-rule);padding:14px 22px 18px;text-align:center}
#auth .au-links{margin:0 0 10px}
#auth .au-links a{color:var(--txt-2);font-weight:600}
#auth .au-links a:hover{color:var(--txt)}
#auth .au-fine{margin:0;font-size:11.5px;line-height:1.5;color:var(--txt-3)}

@media(max-width:420px){
  #auth{padding:12px}
  #auth .au-brand{padding:20px 52px 16px 18px}
  #auth .au-f,#auth .au-msg,#auth .au-foot{padding-left:18px;padding-right:18px}
}

/* ---------------------------------------------------------------------
   2. LEADERBOARD  -  one attached box per board
   --------------------------------------------------------------------- */
#s-calls{--lb-gut:12px}
@media(min-width:900px){#s-calls{--lb-gut:24px}}

/* centered column on wide screens, no more 2-up grid of separate cards */
/* search, tabs and boards share ONE column so every edge lines up */
#s-calls #l-list,#s-calls .searchbox,#s-calls .hd>.seg{
  box-sizing:border-box;width:calc(100% - 2*var(--lb-gut))!important;max-width:760px!important;
  margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
#s-calls .searchbox{margin-top:12px!important;margin-bottom:6px!important}
#s-calls .qin{border-radius:14px;padding:14px 16px;font-size:15px}

/* tabs: flat underlined row, not a capsule */
#s-calls .hd>.seg{margin-top:4px!important;margin-bottom:0!important;border-bottom:1px solid var(--u-rule);background:none!important;border-radius:0;box-shadow:none}
#s-calls .seg .pill{display:none}
#s-calls .seg button{flex:1;padding:14px 4px!important;font-size:15px!important;font-weight:650;letter-spacing:-.01em;
  background:none!important;border-radius:0!important;box-shadow:none!important;color:var(--txt-3)!important}
#s-calls .seg button[aria-selected="true"]{color:var(--txt)!important;background:none!important;border-radius:0!important;box-shadow:inset 0 -2px 0 var(--up,#2ee07f)!important}

/* box header: "Real traders" / "Demo traders" */
#s-calls .sb-sec{
  display:flex!important;width:auto!important;box-sizing:border-box;margin:22px 0 0!important;padding:13px 16px;gap:0;
  font:700 14px/1 var(--ui,inherit);letter-spacing:-.01em;color:var(--txt);
  background-color:var(--u-fill);border:1px solid var(--u-edge);border-bottom:1px solid var(--u-rule);
  border-radius:16px 16px 0 0;box-shadow:none}
#s-calls .sb-sec::before{display:none}
#s-calls #l-list>.sb-sec:first-child{margin-top:12px!important}

/* box body: the thing right after the header */
#s-calls .sb-sec+.sb,
#s-calls .sb-sec+[data-wk]:not([data-wk="bw"]){
  margin:0!important;overflow:hidden;
  background-color:var(--u-fill);border:1px solid var(--u-edge);border-top:0;border-radius:0 0 16px 16px}
#s-calls .sb-sec+[data-wk]:empty{display:none}

/* the list itself: no padding, no gaps, no grid */
#s-calls .lb-list,#s-calls .sb .lb-list,#s-copy .lb-list,#s-copy .sb .lb-list{
  display:block!important;grid-template-columns:none!important;gap:0!important;padding:0!important}
/* a list that is not inside a board box gets its own box (copy search results etc.) */
#s-copy .lb-list{overflow:hidden;background-color:var(--u-fill);border:1px solid var(--u-edge);border-radius:16px}

/* "Your rank" is the first row of the box */
#s-calls .lb-me{
  margin:0!important;padding:12px 16px!important;border-radius:0!important;display:flex;align-items:baseline;gap:8px;
  background:rgba(var(--u-hi),.035)!important;box-shadow:none!important;border-bottom:1px solid var(--u-rule);
  font-size:13px;font-weight:600;color:var(--txt-2)}
#s-calls .lb-me b{font-size:20px;font-weight:800;color:var(--up,#2ee07f)!important;letter-spacing:-.03em}
#s-calls .lb-me .of{margin-left:0;color:var(--txt-3)}

/* rows: flat, divided by hairlines */
#s-calls .lb-row,#s-calls .lb-row.me,#s-calls .lb-row.t1,#s-calls .lb-row.t2,#s-calls .lb-row.t3,
#s-copy .lb-row,#s-copy .lb-row.me,#s-copy .lb-row.t1,#s-copy .lb-row.t2,#s-copy .lb-row.t3{
  position:relative;width:100%;gap:12px;padding:12px 16px!important;border-radius:0!important;
  background:transparent!important;background-color:transparent!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  box-shadow:none!important;border:0;border-bottom:1px solid var(--u-rule);overflow:visible}
#s-calls .lb-row::after,#s-copy .lb-row::after{display:none!important}
#s-calls .lb-list>.lb-row:last-child,#s-copy .lb-list>.lb-row:last-child{border-bottom:0}
@media(hover:hover){
  #s-calls .lb-row:hover,#s-copy .lb-row:hover{background:rgba(var(--u-hi),.04)!important;box-shadow:none!important}
}
#s-calls .lb-row:active,#s-copy .lb-row:active{background:rgba(var(--u-hi),.07)!important}

/* you: a quiet green wash and a bar on the edge, nothing more */
#s-calls .lb-row.me,#s-copy .lb-row.me{background:rgba(46,230,107,.07)!important}
#s-calls .lb-row.me::before,#s-copy .lb-row.me::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:0;background:var(--up,#2ee07f);box-shadow:none}

/* rank: plain number, podium is colour only */
#s-calls .lb-row .n,#s-calls .lb-row.t1 .n,#s-calls .lb-row.t2 .n,#s-calls .lb-row.t3 .n,
#s-copy .lb-row .n,#s-copy .lb-row.t1 .n,#s-copy .lb-row.t2 .n,#s-copy .lb-row.t3 .n{
  flex:none;display:block;width:22px;height:auto;border-radius:0;background:none!important;box-shadow:none!important;
  text-align:center;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--txt-3)!important}
#s-calls .lb-row.t1 .n,#s-copy .lb-row.t1 .n{color:#f0b82a!important;font-size:16px;font-weight:800}
#s-calls .lb-row.t2 .n,#s-copy .lb-row.t2 .n{color:#b4b9c6!important;font-size:16px;font-weight:800}
#s-calls .lb-row.t3 .n,#s-copy .lb-row.t3 .n{color:#d98c4f!important;font-size:16px;font-weight:800}

/* avatar: no ring */
#s-calls .lb-av,#s-copy .lb-av{width:40px!important;height:40px!important;font-size:14px!important;box-shadow:none!important}
#s-calls .lb-row.t1 .lb-av,#s-calls .lb-row.t2 .lb-av,#s-calls .lb-row.t3 .lb-av,
#s-copy .lb-row.t1 .lb-av,#s-copy .lb-row.t2 .lb-av,#s-copy .lb-row.t3 .lb-av{box-shadow:none!important}

/* name + sub line */
#s-calls .lb-row .mid b,#s-copy .lb-row .mid b{font-size:15px;font-weight:650;letter-spacing:-.015em}
#s-calls .lb-row .mid small,#s-copy .lb-row .mid small{margin-top:2px;font-size:12px;font-weight:500;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
#s-calls .lb-meter,#s-copy .lb-meter{display:none}

/* PnL: coloured number, no pill */
#s-calls .lb-row .pill,#s-calls .lb-row .pill.up,#s-calls .lb-row .pill.down,
#s-calls .lb-row .fg b,#s-calls .lb-row .fg b.up,#s-calls .lb-row .fg b.down{
  padding:0!important;border-radius:0!important;background:none!important;
  font-size:15px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
#s-calls .lb-row .pill.up,#s-calls .lb-row .fg b.up{color:#2ee07f!important}
#s-calls .lb-row .pill.down,#s-calls .lb-row .fg b.down{color:#ff7a5c!important}
#s-calls .lb-row .cp-r{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:12px;flex:none}

/* copy / edit / stop: small outlined buttons */
#s-calls .cp-r .cp-btn,#s-copy .cp-r .cp-btn{
  padding:6px 14px;border-radius:8px;font-size:12.5px;font-weight:700;color:var(--txt)!important;
  background:transparent!important;box-shadow:inset 0 0 0 1px var(--u-edge)!important}
@media(hover:hover){#s-calls .cp-r .cp-btn:hover,#s-copy .cp-r .cp-btn:hover{background:rgba(var(--u-hi),.08)!important;filter:none}}
#s-calls .cp-pair,#s-copy .cp-pair{display:flex;align-items:center;gap:6px}
#s-calls .cp-pair .cp-size,#s-copy .cp-pair .cp-size{grid-column:auto;margin-right:2px;color:var(--txt-3)}
#s-calls .cp-pair button,#s-copy .cp-pair button{padding:5px 10px;border-radius:8px;font-size:12px;font-weight:700}

/* "View more" is the footer row of the box */
#s-calls .sb-more,#s-copy .sb-more{
  display:block;width:100%;margin:0!important;padding:13px;border:0;border-top:1px solid var(--u-rule);border-radius:0;
  background:transparent!important;box-shadow:none!important;color:var(--txt-2);font-size:13px;font-weight:650}
#s-calls .sb-more:hover{background:rgba(var(--u-hi),.04)!important;color:var(--txt)}

/* empty states attach to their header too */
#s-calls .sb-sec+.sb-none{
  margin:0!important;padding:22px 16px;border-radius:0 0 16px 16px;text-align:center;
  background-color:var(--u-fill)!important;border:1px solid var(--u-edge);border-top:0;box-shadow:none}
#s-calls [data-wk] .none{margin:0!important;padding:22px 16px!important;border:0;border-radius:0;background:none!important;box-shadow:none!important}

/* biggest-win card keeps its gutter, sits under the boards */
#s-calls [data-wk="bw"] .bigwin-card{margin:14px 0 90px!important}

/* Calls tab: recent calls attach into one list too */
#s-calls #l-list>.item{
  margin:0!important;border-radius:0!important;box-shadow:none!important;
  background-color:var(--u-fill)!important;border:1px solid var(--u-edge);border-bottom:0}
#s-calls #l-list>.item:first-child{margin-top:12px!important;border-radius:16px 16px 0 0!important}
#s-calls #l-list>.item:last-child{border-bottom:1px solid var(--u-edge);border-radius:0 0 16px 16px!important;margin-bottom:90px!important}
#s-calls #l-list>.item:only-child{border-radius:16px!important}
#s-calls #l-list>.item+.item{border-top:1px solid var(--u-rule)}

@media(max-width:1023px){
  /* keep the cheap-render rules from glass.css happy: fills stay, blur stays off */
  #s-calls .sb-sec,#s-calls .sb,#s-calls [data-wk],#s-copy .lb-list{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
}

@media(max-width:560px){
  /* narrow screens: PnL over Copy, so the name gets the room */
  #s-calls .lb-row,#s-calls .lb-row.me,#s-calls .lb-row.t1,#s-calls .lb-row.t2,#s-calls .lb-row.t3{gap:10px;padding:12px 14px!important}
  #s-calls .lb-row .mid{flex:1 1 0;min-width:0}
  #s-calls .lb-row .cp-r{flex-direction:column;align-items:flex-end;gap:5px}
  #s-calls .lb-row .fg{flex:none}
  #s-calls .lb-me,#s-calls .sb-sec{padding-left:12px!important;padding-right:12px!important}
  #s-calls .lb-row .pill,#s-calls .lb-row .fg b{font-size:14px}
  #s-calls .cp-r .cp-btn{padding:5px 12px}
  #s-calls .cp-pair{flex-wrap:wrap;justify-content:flex-end}
}