/* BlindTrade (/s/) — the same site as ChartIQ in the palette of the BlindTrade logo: electric purple and hot orange on ink black.
   Loaded after base.css, landing.css and play.css, so it only swaps tokens and the few hard-coded mint/red spots.
   Dark is the default, light is the opt-in toggle (the logo sits on its own dark sticker in the nav and footer, so it reads on both).
   Profit is orange, loss is purple: the same two colours as the logo's candles. */
:root[data-brand="blindtrade"] { --f-pixel: "Kanit", "Geist", system-ui, sans-serif; }
:root[data-brand="blindtrade"][data-theme="light"] {
  color-scheme: light;
  --bg: #f6f2ff; --bg-2: #ede6ff; --surface: #ffffff; --surface-2: #fbf9ff;
  --line: rgba(60, 30, 140, .14); --line-2: rgba(60, 30, 140, .28);
  --text: #140c2b; --text-2: #4a3f6e; --text-3: #6c6190;
  --brand: #ff9d1c; --brand-hi: #ffb84d; --brand-lo: #e07b00; --brand-ink: #a85600; --on-brand: #1a0d00;
  --info: #6d3df0; --info-lo: #4c27c4;
  --ok: #a85600; --warn: #a15c00; --risk: #d6244f; --unk: #6c6190;
  --up: #f28600; --down: #7c4dff;
  --brand-rgb: 255, 157, 28; --info-rgb: 109, 61, 240; --risk-rgb: 214, 36, 79;
  --ov-1: rgba(60, 30, 140, .03); --ov-2: rgba(60, 30, 140, .055); --ov-3: rgba(60, 30, 140, .09);
  --nav-bg: rgba(246, 242, 255, .86); --nav-bg-solid: rgba(246, 242, 255, .98);
  --title-a: #140c2b; --title-b: #5b2bd6;
  --err-text: #a3132c; --glow-o: .55; --card-shadow: 0 1px 0 rgba(60, 30, 140, .04), 0 14px 30px -18px rgba(60, 30, 140, .25);
  --pop: 5px 5px 0 #2a1a5e; --pop-brand: 4px 4px 0 #7c4dff;
  --chart-bg: #ffffff; --chart-grid: rgba(60, 30, 140, .07); --chart-text: #6c6190;
}
:root[data-brand="blindtrade"][data-theme="dark"] {
  color-scheme: dark;
  --bg: #07050f; --bg-2: #0c0819; --surface: #110c21; --surface-2: #17102c;
  --line: rgba(150, 110, 255, .16); --line-2: rgba(150, 110, 255, .34);
  --text: #f5f1ff; --text-2: #b7abd8; --text-3: #8a7fae;
  --brand: #ff9d1c; --brand-hi: #ffb84d; --brand-lo: #e07b00; --brand-ink: #ffa930; --on-brand: #1a0d00;
  --info: #b18cff; --info-lo: #7c4dff;
  --ok: #ffa930; --warn: #ffd166; --risk: #ff5d8a; --unk: #8f84b4;
  --up: #ff9d1c; --down: #a77bff;
  --brand-rgb: 255, 157, 28; --info-rgb: 177, 140, 255; --risk-rgb: 255, 93, 138;
  --ov-1: rgba(255, 255, 255, .03); --ov-2: rgba(255, 255, 255, .055); --ov-3: rgba(255, 255, 255, .09);
  --nav-bg: rgba(7, 5, 15, .8); --nav-bg-solid: rgba(7, 5, 15, .97);
  --title-a: #ffffff; --title-b: #ffc47a;
  --err-text: #ffb3c8; --glow-o: 1; --card-shadow: none;
  --pop: 5px 5px 0 rgba(124, 77, 255, .6); --pop-brand: 4px 4px 0 rgba(124, 77, 255, .55);
  --chart-bg: #0a0716; --chart-grid: rgba(150, 110, 255, .09); --chart-text: #8a7fae;
}
:root[data-brand="blindtrade"] .skip { background: var(--brand); color: var(--on-brand); }
:root[data-brand="blindtrade"] ::selection { background: rgba(124, 77, 255, .5); }
:root[data-brand="blindtrade"] { scrollbar-color: rgba(124, 77, 255, .7) transparent; }
:root[data-brand="blindtrade"] ::-webkit-scrollbar-thumb { background: rgba(124, 77, 255, .65); }

/* the logo font is a heavy italic: use it for every loud small thing the pixel font did on ChartIQ */
:root[data-brand="blindtrade"] :is(.brand__name, .kicker, .badge, .st, .rule__n, .step__n, .rk, .lvl, .dbadge, .eyebrow, .pstat b, .big, .grade b, .scard b, .mystery, .btn--buy, .btn--sell, .demo__btn, .ticker span, .toast, .bubble, .acct__user i, .gr b) {
  font-style: italic; font-weight: 700;
}
:root[data-brand="blindtrade"] .kicker { letter-spacing: .08em; }
:root[data-brand="blindtrade"] .eyebrow { font-weight: 600; letter-spacing: .02em; }
:root[data-brand="blindtrade"] .ticker span { letter-spacing: .1em; }

/* nav and footer sticker: the wordmark is wider than ChartIQ's, the head is not square */
:root[data-brand="blindtrade"] .brand img:first-child, :root[data-brand="blindtrade"] .foot__brand img:first-child { inline-size: auto; block-size: 34px; border-radius: 0; }
:root[data-brand="blindtrade"] .foot__brand img:first-child { block-size: 30px; }
:root[data-brand="blindtrade"] .brand { background: #0a0716; border-color: rgba(124, 77, 255, .6); box-shadow: 3px 3px 0 rgba(124, 77, 255, .55); }
:root[data-brand="blindtrade"] .foot__brand { background: #0a0716; box-shadow: 3px 3px 0 rgba(124, 77, 255, .55); }
:root[data-brand="blindtrade"] .brand img.brand__word { block-size: 20px; margin-inline-end: 4px; }
:root[data-brand="blindtrade"] .foot__brand .brand__word { block-size: 17px; }
:root[data-brand="blindtrade"] .foot::after { background-image: url("../s/assets/head.png"); }
:root[data-brand="blindtrade"] .mystery img { inline-size: auto; block-size: 18px; }

/* buttons */
:root[data-brand="blindtrade"] .btn--brand { background: linear-gradient(180deg, #ffb23d, #ff9d1c 55%, #f28600); color: var(--on-brand); border-color: #1a0d00; box-shadow: 0 4px 0 #7c4dff, 0 12px 30px -12px rgba(var(--brand-rgb), .6); }
:root[data-brand="blindtrade"] .btn--brand:active { box-shadow: 0 1px 0 #7c4dff; }
@media (hover: hover) and (pointer: fine) { :root[data-brand="blindtrade"] .btn--brand:hover { box-shadow: 0 6px 0 #7c4dff, 0 16px 34px -12px rgba(var(--brand-rgb), .7); } }
:root[data-brand="blindtrade"] .btn--ghost:hover { border-color: rgba(var(--info-rgb), .6); }
:root[data-brand="blindtrade"] .btn--buy { background: #ff9d1c; color: #1a0d00; border-color: #1a0d00; box-shadow: 0 4px 0 #b85f00, 0 12px 26px -12px rgba(255, 157, 28, .6); }
:root[data-brand="blindtrade"] .btn--sell { background: #7c4dff; color: #fff; border-color: #1a0d00; box-shadow: 0 4px 0 #4c27c4, 0 12px 26px -12px rgba(124, 77, 255, .7); }
:root[data-brand="blindtrade"] .btn--buy:active, :root[data-brand="blindtrade"] .btn--sell:active { box-shadow: 0 1px 0 #1a0d00; }
:root[data-brand="blindtrade"] .demo__btn--buy { background: #ff9d1c; color: #1a0d00; }
:root[data-brand="blindtrade"] .demo__btn--sell { background: #7c4dff; color: #fff; }

/* surfaces that were mint-tinted */
:root[data-brand="blindtrade"] .hero__bg .grid { background-image: linear-gradient(rgba(124, 77, 255, .16) 1px, transparent 1px), linear-gradient(90deg, rgba(124, 77, 255, .16) 1px, transparent 1px); }
:root[data-brand="blindtrade"] .glow--a { background: radial-gradient(closest-side, rgba(255, 157, 28, .26), transparent); }
:root[data-brand="blindtrade"] .glow--b { background: radial-gradient(closest-side, rgba(124, 77, 255, .36), transparent); }
:root[data-brand="blindtrade"] .dot { animation-name: ping-bt; }
@keyframes ping-bt { 0% { box-shadow: 0 0 0 0 rgba(255, 157, 28, .55); } 80%, 100% { box-shadow: 0 0 0 9px rgba(255, 157, 28, 0); } }
:root[data-brand="blindtrade"] .demo { border-color: rgba(124, 77, 255, .6); box-shadow: var(--pop), 0 40px 80px -40px rgba(124, 77, 255, .6); }
:root[data-brand="blindtrade"] .sticker { filter: drop-shadow(0 10px 28px rgba(124, 77, 255, .45)); }
@media (min-width: 921px) { :root[data-brand="blindtrade"] .sticker { inline-size: clamp(190px, 19vw, 230px); inset-block-start: -128px; } }
@media (max-width: 920px) { :root[data-brand="blindtrade"] .hero__art { margin-block-start: 90px; } :root[data-brand="blindtrade"] .sticker { inset-block-start: -92px; } }
:root[data-brand="blindtrade"] .bubble { background: #ff9d1c; color: #1a0d00; border-color: #1a0d00; }
:root[data-brand="blindtrade"] .bubble::after { background: #ff9d1c; border-color: #1a0d00; }
:root[data-brand="blindtrade"] .ticker { background: linear-gradient(90deg, #6d3df0, #8a5cff 50%, #6d3df0); color: #fff; border-color: rgba(177, 140, 255, .6); }
:root[data-brand="blindtrade"] .scale__bar { background: linear-gradient(90deg, #7c4dff, #c68cff 45%, #ff9d1c); }
:root[data-brand="blindtrade"] .gr--S { --g1: #ffc83d; --g2: #ff8a00; } :root[data-brand="blindtrade"] .gr--A { --g1: #ffb04d; --g2: #f27a00; }
:root[data-brand="blindtrade"] .gr--B { --g1: #c9a8ff; --g2: #8a5cff; } :root[data-brand="blindtrade"] .gr--C { --g1: #a77bff; --g2: #6d3df0; }
:root[data-brand="blindtrade"] .gr--D { --g1: #8a6bd8; --g2: #53309f; } :root[data-brand="blindtrade"] .gr--F { --g1: #6e5aa6; --g2: #35255f; }
:root[data-brand="blindtrade"] .cta-band__in { background: linear-gradient(135deg, #ff9d1c, #ffb23d 60%, #ff8a00); border-color: #1a0d00; box-shadow: 6px 6px 0 rgba(124, 77, 255, .75); color: #1a0d00; }
:root[data-brand="blindtrade"] .cta-band p { color: rgba(26, 13, 0, .78); }
:root[data-brand="blindtrade"] .cta-band .btn--brand { background: #0a0716; color: #ffa930; border-color: #0a0716; box-shadow: 0 4px 0 rgba(0, 0, 0, .5); }
:root[data-brand="blindtrade"] .toast { border-color: rgba(124, 77, 255, .7); box-shadow: 4px 4px 0 rgba(124, 77, 255, .6); background: #0a0716; }
:root[data-brand="blindtrade"] .grade { border-color: #1a0d00; box-shadow: 4px 4px 0 #1a0d00; }
:root[data-brand="blindtrade"] .sheet__in { border-color: rgba(124, 77, 255, .6); }
:root[data-brand="blindtrade"] .plchip.down { background: rgba(124, 77, 255, .18); }
:root[data-brand="blindtrade"] .tick circle { stroke: rgba(var(--brand-rgb), .5); fill: rgba(var(--brand-rgb), .14); }

/* light theme */
:root[data-brand="blindtrade"][data-theme="light"] .hero__bg .grid { background-image: linear-gradient(rgba(60, 30, 140, .1) 1px, transparent 1px), linear-gradient(90deg, rgba(60, 30, 140, .1) 1px, transparent 1px); }
:root[data-brand="blindtrade"][data-theme="light"] .glow--a { background: radial-gradient(closest-side, rgba(255, 157, 28, .4), transparent); }
:root[data-brand="blindtrade"][data-theme="light"] .glow--b { background: radial-gradient(closest-side, rgba(124, 77, 255, .28), transparent); }
:root[data-brand="blindtrade"][data-theme="light"] .demo { border-color: #2a1a5e; box-shadow: var(--pop), 0 40px 80px -40px rgba(124, 77, 255, .45); }
:root[data-brand="blindtrade"][data-theme="light"] .sheet__in { border-color: #2a1a5e; }
:root[data-brand="blindtrade"][data-theme="light"] .modal__card { box-shadow: var(--pop), 0 40px 90px -30px rgba(40, 20, 100, .4); }
:root[data-brand="blindtrade"][data-theme="light"] .cta-band__in { box-shadow: 6px 6px 0 #2a1a5e; }
:root[data-brand="blindtrade"][data-theme="light"] .plchip.down { background: rgba(124, 77, 255, .14); }
:root[data-brand="blindtrade"][data-theme="light"] .btn--ghost:hover { border-color: rgba(var(--info-rgb), .5); }

/* phones: the theme toggle joins the nav, so the sticker and the buttons give up a little room */
:root[data-brand="blindtrade"] .brand { flex-shrink: 0; }
@media (max-width: 480px) {
  :root[data-brand="blindtrade"] .brand img.brand__word { block-size: 16px; }
  :root[data-brand="blindtrade"] .nav__end { gap: 6px; }
  :root[data-brand="blindtrade"] .nav__end .btn--sm { padding-inline: 12px; }
  :root[data-brand="blindtrade"] .acct .btn, :root[data-brand="blindtrade"] .acct button { padding-inline: 10px; }
}
