/* Watchlist + export controls. Reads each page's own tokens. */

.symrow{display:flex;gap:9px;align-items:stretch}
.symrow select{flex:1;min-width:0}

.star{flex:0 0 auto;width:44px;background:var(--surface2,#152238);border:1px solid var(--line2,#2c4160);
  border-radius:10px;color:var(--muted,#6d7b96);font-size:19px;line-height:1;cursor:pointer;
  transition:.15s;font-family:inherit;display:grid;place-items:center}
.star:hover{border-color:var(--brass,#f0ad3f);color:var(--brass,#f0ad3f)}
.star.on{color:var(--brass,#f0ad3f);border-color:var(--brass,#f0ad3f);background:rgba(240,173,63,.1)}
.star:disabled{opacity:.45;cursor:not-allowed}
.star:disabled:hover{border-color:var(--line2,#2c4160);color:var(--muted,#6d7b96)}

.watchrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:13px}
.watchrow:empty{display:none}
.watchrow .wl{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--muted,#6d7b96);margin-right:2px}
.wchip{display:inline-flex;align-items:center;gap:7px;background:var(--surface2,#152238);
  border:1px solid var(--line,#213249);border-radius:20px;padding:5px 8px 5px 12px;font-size:12.5px;
  color:var(--ink2,#aeb9cf);cursor:pointer;transition:.15s}
.wchip:hover{border-color:var(--brass,#f0ad3f);color:var(--ink,#f4f7fc)}
.wchip.cur{border-color:var(--brass,#f0ad3f);color:var(--ink,#f4f7fc);background:rgba(240,173,63,.08)}
.wchip b{font-weight:600}
.wchip .v{font-variant-numeric:tabular-nums;font-family:ui-monospace,Menlo,monospace;font-size:11.5px}
.wchip .v.up{color:var(--up,#3fc9dd)} .wchip .v.dn{color:var(--down,#f0725a)}
.wchip .x{border:0;background:none;color:var(--muted,#6d7b96);cursor:pointer;font-size:14px;
  line-height:1;padding:0 2px;font-family:inherit}
.wchip .x:hover{color:var(--down,#f0725a)}

/* export button sits in a card header, so it must not stretch the row */
.exp{margin-left:auto;position:relative;border-radius:10px}
.btn.sm{padding:7px 12px;font-size:12px;border-radius:9px}
.exp .pi-lock{border-radius:10px}
.exp .pi-lock-in{max-width:none}
.exp .pi-lock-i,.exp .pi-lock-s{display:none}
.exp .pi-lock-t{font-size:11.5px;margin:0}
.exp .pi-lock-b{padding:5px 10px;font-size:11px;margin-top:5px}

@media(max-width:560px){
  .exp{margin-left:0;width:100%}
  .exp .btn.sm{width:100%}
  .star{width:40px;font-size:17px}
}
