/* Investor tournaments — builds on create.css (.ct-*). App palette: capital in gold, trader profit in green, limits in red. */
.it { --r: #F03D3D; --b: #3290FF; }
.it .g { color: var(--g); } .it .r { color: var(--r); } .it .y { color: var(--y); }
.it a { -webkit-tap-highlight-color: transparent; }

/* hero */
.it-hero::before { background: radial-gradient(34% 42% at 78% 40%, rgba(245,204,59,.13), transparent 70%), radial-gradient(30% 40% at 88% 70%, rgba(48,191,115,.12), transparent 70%), radial-gradient(28% 36% at 6% 14%, rgba(39,103,229,.14), transparent 70%); }
.it-hero-grid { display: grid; gap: 44px; align-items: start; }
@media (min-width: 1060px) { .it-hero-grid { grid-template-columns: minmax(0, 1fr) 440px; gap: 48px; align-items: center; } }
.it-copy { gap: 22px; }
.it-eyebrow { color: #FBE7A1; background: rgba(245,204,59,.08); border-color: rgba(245,204,59,.32); }
.it-eyebrow i { background: var(--y); box-shadow: 0 0 10px var(--y); }
.it h1 { font-size: clamp(2.2rem, 4.6vw, 3.6rem); }

/* two doors */
.it-doors { display: grid; gap: 14px; width: 100%; margin-top: 4px; }
@media (min-width: 640px) { .it-doors { grid-template-columns: 1fr 1fr; } }
.it-door { position: relative; min-width: 0; display: grid; gap: 12px; align-content: start; padding: 18px 18px 16px; border-radius: 22px; background: linear-gradient(180deg, #121620, #0D1017); border: 1px solid var(--line); overflow: hidden; transition: border-color .3s, transform .3s; }
.it-door::before { content: ''; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, var(--dc), transparent 80%); opacity: .9; }
.it-door.inv { --dc: #F5CC3B; } .it-door.trd { --dc: #30BF73; }
.it-door:hover { border-color: color-mix(in srgb, var(--dc) 45%, transparent); transform: translateY(-2px); }
.it-door-who { display: inline-flex; align-items: center; gap: 8px; font: 700 12.5px/1 Inter, sans-serif; color: var(--dc); }
.it-door-who::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--dc); box-shadow: 0 0 10px var(--dc); }
.it-door-h { font: 800 19px/1.25 Inter, sans-serif; letter-spacing: -.01em; color: #fff; text-wrap: balance; }
.it-door-frag { display: grid; gap: 7px; padding: 11px 12px; border-radius: 14px; background: #0A0D13; border: 1px solid #1A1F2C; font-size: 12.5px; color: var(--t2); }
.it-door-frag div { display: flex; justify-content: space-between; gap: 10px; }
.it-door-frag b { color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.it-door-frag .hl { padding-top: 7px; border-top: 1px dashed #232A3B; }
.it-door.inv .hl b { color: var(--y); }
.it-door-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 2px; }
.it-door-cta .btn { font-size: 14px; white-space: normal; text-align: center; max-width: 100%; line-height: 1.3; }
.it-door-cta .ct-link { font-size: 14px; }

/* live strip */
.it-live { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 16px; border-radius: 16px; background: rgba(255,255,255,.02); border: 1px solid var(--line); }
.it-live-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #7D8599; }
.it-live.on .it-live-dot { background: var(--g); box-shadow: 0 0 0 0 rgba(48,191,115,.6); animation: itPulse 2s infinite; }
@keyframes itPulse { 0% { box-shadow: 0 0 0 0 rgba(48,191,115,.55); } 70% { box-shadow: 0 0 0 8px rgba(48,191,115,0); } 100% { box-shadow: 0 0 0 0 rgba(48,191,115,0); } }
.it-live-fb { margin: 0; font-size: 13.5px; line-height: 1.45; color: var(--t2); }
.it-live-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; flex: 1; }
.it-live-stats b { display: block; font: 800 18px/1.1 Inter, sans-serif; color: #fff; font-variant-numeric: tabular-nums; }
.it-live-stats span { display: block; margin-top: 3px; font-size: 12px; color: var(--t3); }

/* hero visual: Invest cabinet window */
.it-cab { margin: 0; position: relative; justify-self: center; width: min(440px, 100%); display: grid; gap: 10px; }
.it-cab::after { content: ''; position: absolute; inset: 10% -20% 0; z-index: -1; border-radius: 50%; background: radial-gradient(closest-side, rgba(245,204,59,.16), transparent 70%); filter: blur(30px); }
.it-cab figcaption { text-align: center; font-size: 12px; color: var(--t3); }
.it-win { border-radius: 22px; background: #0A0C11; border: 1px solid #2A3245; box-shadow: 0 0 0 1px rgba(255,255,255,.03) inset, 0 50px 100px -40px rgba(245,204,59,.28), 0 40px 80px -30px rgba(0,0,0,.9); overflow: hidden; }
.it-win-bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid #1A1F2C; background: #0D1016; }
.it-win-bar i { width: 9px; height: 9px; border-radius: 50%; background: #2A3245; }
.it-win-bar span { margin-left: 10px; flex: 1; min-width: 0; padding: 5px 10px; border-radius: 8px; background: #151924; font: 500 11px/1 Inter, sans-serif; color: #7D8599; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.it-win-body { padding: 14px; display: grid; gap: 12px; background: #11141B; }
.it-cab-head { display: flex; justify-content: space-between; align-items: center; }
.it-cab-head > b { font: 800 18px/1 Inter, sans-serif; color: #fff; }
.it-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; border-radius: 8px; font: 600 11px/1 Inter, sans-serif; color: var(--g); background: rgba(48,191,115,.14); border: .8px solid rgba(48,191,115,.35); }
.it-pill i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: itPulse 2s infinite; }
.it-cap { padding: 12px 14px; border-radius: 16px; background: #151924; border: 1px solid var(--line); }
.it-cap > span { font-size: 11.5px; color: var(--t3); }
.it-cap > b { display: block; margin-top: 4px; font: 900 26px/1.05 Inter, sans-serif; letter-spacing: -.02em; color: #fff; font-variant-numeric: tabular-nums; }
.it-cap > b u { text-decoration: none; font-size: 13px; font-weight: 700; color: var(--t3); }
.it-cap-row { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; font-size: 11.5px; color: var(--t3); }
.it-cap-row em { font-style: normal; color: #E9ECF3; font-weight: 600; font-variant-numeric: tabular-nums; }
.it-pct .lb { display: flex; justify-content: space-between; font-size: 12px; color: var(--t2); }
.it-pct .lb b { color: var(--y); font-weight: 800; }
.it-track { position: relative; margin-top: 8px; height: 6px; border-radius: 6px; background: #1F2535; }
.it-track i { position: absolute; inset: 0 auto 0 0; width: var(--w); border-radius: 6px; background: linear-gradient(90deg, #C9961A, var(--y)); }
.it-track u { position: absolute; top: 50%; left: var(--x); width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(245,204,59,.25); }
.it-tc { border-radius: 18px; background: #151924; border: 1px solid var(--line); padding: 12px; display: grid; gap: 10px; }
.it-tc-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.it-tc-top .tags { display: flex; gap: 4px; }
.it-tc-top .tags em { font: 800 9.5px/1 Inter, sans-serif; font-style: normal; color: #fff; padding: 4px 6px; border-radius: 5px; background: rgba(255,255,255,.1); }
.it-tc-top .tags em:first-child { background: #2767E5; }
.it-tc-top .tier { font: 600 11px/1 Inter, sans-serif; color: #FBE7A1; padding: 4px 7px; border-radius: 6px; background: rgba(245,204,59,.1); border: .8px solid rgba(245,204,59,.3); white-space: nowrap; }
.it-tc-fund { display: flex; justify-content: space-between; gap: 10px; }
.it-tc-fund > div > span { display: block; font-size: 10.5px; color: var(--t3); }
.it-tc-fund b { display: block; margin-top: 3px; font: 800 16px/1.1 Inter, sans-serif; color: var(--y); font-variant-numeric: tabular-nums; }
.it-tc-fund .r { text-align: right; } .it-tc-fund .r b.g { color: var(--g); }
.it-spark { display: block; width: 100%; height: 54px; }
.it-rows { display: grid; gap: 6px; }
.it-row { position: relative; display: grid; grid-template-columns: 26px minmax(0, 1fr) 64px 54px; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 10px; background: #11141B; font-size: 12px; }
.it-row .av, .it-acc-head .av { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; font: 800 11px/1 Inter, sans-serif; color: #0B0E15; background: var(--c); }
.it-row .nm { min-width: 0; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.it-row .nm small { display: block; margin-top: 2px; font-weight: 500; font-size: 10px; color: var(--t3); overflow: hidden; text-overflow: ellipsis; }
.it-row .wt { display: grid; gap: 3px; font-size: 10.5px; color: var(--t2); font-variant-numeric: tabular-nums; }
.it-row .wt i { height: 4px; border-radius: 4px; background: #1F2535; position: relative; overflow: hidden; }
.it-row .wt i::after { content: ''; position: absolute; inset: 0 auto 0 0; width: calc(var(--w) * 3.3); max-width: 100%; border-radius: 4px; background: linear-gradient(90deg, #C9961A, var(--y)); }
.it-row > b { text-align: right; font-weight: 800; font-variant-numeric: tabular-nums; transition: color .3s; }
.it-row.off { opacity: .72; } .it-row.off .nm small { color: var(--r); } .it-row.off .wt i::after { background: #3A4152; }
.it-mine { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; border-radius: 16px; background: linear-gradient(135deg, rgba(245,204,59,.14), rgba(245,204,59,.03)); border: 1px solid rgba(245,204,59,.32); }
.it-mine > span { font-size: 12px; color: #FBE7A1; line-height: 1.35; }
.it-mine > span small { display: block; color: var(--t3); font-size: 10.5px; }
.it-mine b { font: 900 22px/1 Inter, sans-serif; color: var(--y); font-variant-numeric: tabular-nums; }
.it-bump { animation: ctBump .6s ease; }

/* section kicker accents */
.it-k-gold { --acc: #F5CC3B; } .it-k-red { --acc: #FF7A7A; }

/* steps: weights fragment */
@media (min-width: 900px) { .it-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } .it-steps .ct-step h3 { font-size: 17.5px; } }
.it-steps .ct-step:first-child .n, .it-steps .ct-step:nth-child(2) .n { border-color: var(--y); box-shadow: 0 0 0 4px rgba(245,204,59,.1); }
.it-wfrag div { display: grid !important; grid-template-columns: 74px minmax(0, 1fr) 32px; align-items: center; }
.it-wfrag span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.it-wfrag i { height: 5px; border-radius: 5px; background: linear-gradient(90deg, #C9961A, var(--y)); width: var(--w); }
.it-wfrag b { text-align: right; }

/* deposit: the cabinet's USDC address card next to the network rule */
.it-dep { margin-top: 18px; display: grid; gap: 18px; padding: 18px; border-radius: 22px; background: linear-gradient(180deg, #121620, #0E1118); border: 1px solid var(--line); }
@media (min-width: 900px) { .it-dep { grid-template-columns: 380px minmax(0, 1fr); gap: 28px; align-items: center; padding: 20px 24px 20px 20px; } }
.it-dep-card { min-width: 0; display: grid; gap: 14px; padding: 16px; border-radius: 18px; background: #0B0E15; border: 1px solid #1A1F2C; }
.it-dep-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.it-dep-head b { font: 800 15px/1 Inter, sans-serif; color: #fff; }
.it-dep-head .it-pill { color: #7DB3FF; background: rgba(50,144,255,.12); border-color: rgba(50,144,255,.35); }
.it-dep-head .it-pill i { background: #3290FF; }
.it-dep-addr { padding: 11px 12px; border-radius: 12px; background: #151924; border: 1px solid var(--line); }
.it-dep-addr span, .it-dep-addr small { display: block; font-size: 11.5px; color: var(--t3); }
.it-dep-addr code { display: block; margin: 6px 0; font: 600 15px/1.2 'JetBrains Mono', ui-monospace, monospace; color: #fff; letter-spacing: .02em; direction: ltr; text-align: start; }
.it-dep .it-coins em.ok { color: var(--g); border-color: rgba(48,191,115,.35); background: rgba(48,191,115,.1); }
.it-dep-text { min-width: 0; }
.it-dep-text h3 { margin: 0; font: 800 19px/1.25 Inter, sans-serif; color: #fff; letter-spacing: -.01em; }
.it-dep-text p { margin: 8px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--t2); }
.it-dep-text p + p { color: var(--t3); font-size: 13.5px; }

/* trust: level ladder drawn like the progression track in the app */
.it-trust { margin-top: 32px; display: grid; gap: 18px; }
@media (min-width: 960px) { .it-trust { grid-template-columns: 360px minmax(0, 1fr); align-items: stretch; } }
.it-ladder { position: relative; padding: 22px 22px 22px 52px; border-radius: 22px; background: linear-gradient(180deg, #121620, #0E1118); border: 1px solid var(--line); display: grid; gap: 22px; align-content: center; }
.it-ladder::before { content: ''; position: absolute; left: 31px; top: 34px; bottom: 34px; width: 2px; border-radius: 2px; background: linear-gradient(180deg, #2A3245 0 45%, var(--y) 55%, var(--g)); }
.it-lv { position: relative; display: grid; gap: 3px; }
.it-lv .dot { position: absolute; left: -27px; top: 3px; width: 12px; height: 12px; border-radius: 50%; background: #11141B; border: 2px solid #3A4152; }
.it-lv b { font: 700 16px/1.2 Inter, sans-serif; color: #C9CFDB; }
.it-lv small { font-size: 12.5px; color: var(--t3); }
.it-lv em { justify-self: start; margin-top: 6px; font-style: normal; font: 700 11.5px/1 Inter, sans-serif; padding: 6px 8px; border-radius: 8px; }
.it-lv.on b { color: #fff; }
.it-lv.t1 .dot { border-color: var(--y); box-shadow: 0 0 0 4px rgba(245,204,59,.14); }
.it-lv.t1 em { color: #FBE7A1; background: rgba(245,204,59,.1); border: .8px solid rgba(245,204,59,.32); }
.it-lv.t2 .dot { border-color: var(--g); background: var(--g); box-shadow: 0 0 0 4px rgba(48,191,115,.16); }
.it-lv.t2 em { color: #BDEFD3; background: rgba(48,191,115,.12); border: .8px solid rgba(48,191,115,.35); }
.it-trust-rules { margin-top: 0; }
.it-trust-rules a { color: #7FB2FF; white-space: nowrap; }

/* risk rules: trader account card + timeline + breach sequence */
.it-rules { margin-top: 32px; display: grid; gap: 18px; }
@media (min-width: 960px) { .it-rules { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.it-acc { min-width: 0; padding: 20px; border-radius: 22px; background: linear-gradient(180deg, #121620, #0E1118); border: 1px solid var(--line); display: grid; gap: 16px; align-content: start; }
.it-acc-head { display: flex; align-items: center; gap: 10px; }
.it-acc-head .av { width: 34px; height: 34px; font-size: 13px; flex: none; }
.it-acc-head > div { min-width: 0; flex: 1; }
.it-acc-head b { display: block; font: 700 15px/1.2 Inter, sans-serif; color: #fff; }
.it-acc-head small { display: block; margin-top: 2px; font-size: 12px; color: var(--t3); }
.it-meter .lb, .it-lev .lb { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--t2); }
.it-meter .lb b, .it-lev .lb b { color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.it-meter .bar { position: relative; margin-top: 8px; height: 8px; border-radius: 8px; background: #1F2535; overflow: hidden; }
.it-meter .bar i { position: absolute; inset: 0 auto 0 0; width: var(--u); border-radius: 8px; background: linear-gradient(90deg, #F5CC3B, #F46E42); }
.it-meter .bar::after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 3px; background: var(--r); }
.it-meter small, .it-key small { display: block; margin-top: 6px; font-size: 12px; line-height: 1.45; color: var(--t3); }
.it-lev .seg { margin-top: 8px; display: grid; grid-template-columns: repeat(10, 1fr); gap: 4px; }
.it-lev .seg i { height: 8px; border-radius: 3px; background: #1F2535; }
.it-lev .seg i.on { background: var(--b); }
.it-coins, .it-key, .it-idle { font-size: 13px; color: var(--t2); }
.it-idle .lb { display: flex; justify-content: space-between; gap: 10px; }
.it-idle .lb b { color: #fff; font-weight: 700; white-space: nowrap; }
.it-idle small { display: block; margin-top: 6px; font-size: 12px; line-height: 1.45; color: var(--t3); }
.it-coins > div, .it-key > div { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.it-coins em, .it-key em { font-style: normal; font: 700 12px/1 Inter, sans-serif; padding: 7px 9px; border-radius: 8px; color: #fff; background: #151924; border: 1px solid var(--line); }
.it-coins em.x, .it-key em.x { color: #6B7385; text-decoration: line-through; text-decoration-color: rgba(240,61,61,.7); }
.it-key em.ok { color: var(--g); border-color: rgba(48,191,115,.35); background: rgba(48,191,115,.1); }
.it-rules-side { min-width: 0; display: grid; gap: 18px; align-content: start; }
.it-time, .it-breach { padding: 20px; border-radius: 22px; background: #0E1118; border: 1px solid var(--line); }
.it-time .lb, .it-breach .lb { font: 700 15px/1.3 Inter, sans-serif; color: #fff; }
.it-time p, .it-breach p { margin: 12px 0 0; font-size: 14px; line-height: 1.55; color: var(--t2); }
.it-tl { position: relative; margin-top: 16px; height: 10px; border-radius: 10px; display: flex; overflow: visible; }
.it-tl .run { flex: 1; border-radius: 10px 0 0 10px; background: linear-gradient(90deg, rgba(50,144,255,.35), rgba(50,144,255,.8)); }
.it-tl .co { width: 16%; border-radius: 0 10px 10px 0; background: repeating-linear-gradient(135deg, rgba(245,204,59,.85) 0 5px, rgba(245,204,59,.35) 5px 10px); }
.it-tl .now { position: absolute; top: -5px; left: var(--x); width: 2px; height: 20px; background: #fff; border-radius: 2px; box-shadow: 0 0 10px rgba(255,255,255,.6); animation: itNow 9s linear infinite; }
@keyframes itNow { from { left: 4%; } to { left: 98%; } }
.it-tl-cap { margin-top: 10px; display: flex; justify-content: space-between; gap: 8px; font-size: 11.5px; color: var(--t3); }
.it-tl-cap .co { color: #FBE7A1; text-align: center; }
.it-tl-cap span:last-child { color: #FF9C9C; text-align: right; }
.it-breach ol { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.it-breach li { position: relative; display: grid; gap: 8px; justify-items: start; padding: 10px; border-radius: 12px; background: rgba(240,61,61,.07); border: 1px solid rgba(240,61,61,.22); font-size: 12.5px; line-height: 1.3; color: #F2C3C3; min-width: 0; }
.it-breach li b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font: 800 11px/1 Inter, sans-serif; color: #fff; background: rgba(240,61,61,.45); }
.it-breach li.g { background: rgba(48,191,115,.09); border-color: rgba(48,191,115,.3); color: #BDEFD3; }
.it-breach li.g b { background: rgba(48,191,115,.55); }
@media (max-width: 560px) { .it-breach ol { grid-template-columns: 1fr 1fr; } }
.it-honest { margin: 0; padding: 14px 16px; border-radius: 14px; border-left: 3px solid var(--r); background: rgba(240,61,61,.05); font-size: 14px; line-height: 1.55; color: #E6C9C9; }

/* worked example */
.it-ex { margin-top: 30px; }
.it-seg { display: inline-flex; padding: 4px; border-radius: 14px; background: #10141D; border: 1px solid var(--line); }
.it-seg button { padding: 10px 16px; border-radius: 10px; font: 700 14px/1 Inter, sans-serif; color: var(--t2); background: transparent; border: 0; cursor: pointer; transition: background .2s, color .2s; }
.it-seg button[aria-selected="true"] { color: #0B0E15; background: var(--y); }
.it-ex[data-it-ex="bad"] .it-seg button[aria-selected="true"] { color: #fff; background: #C53434; }
.it-ex-grid { margin-top: 16px; display: grid; gap: 16px; }
@media (min-width: 1000px) { .it-ex-grid { grid-template-columns: minmax(0, 1fr) 320px; align-items: start; } }
.it-tablewrap { min-width: 0; overflow-x: auto; border-radius: 22px; border: 1px solid var(--line); background: #0E1118; -webkit-overflow-scrolling: touch; }
.it-table { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.it-table th { padding: 14px 14px 12px; text-align: right; font: 600 12px/1.3 Inter, sans-serif; color: var(--t3); border-bottom: 1px solid var(--line); white-space: nowrap; }
.it-table th:first-child, .it-table td:first-child { text-align: left; }
.it-table td { padding: 13px 14px; text-align: right; color: #C9CFDB; border-bottom: 1px solid #171C28; white-space: nowrap; }
.it-table td b { color: #fff; }
.it-table td:first-child b { display: block; }
.it-table .st { display: inline-block; margin-top: 4px; font: 600 11px/1 Inter, sans-serif; color: var(--t3); }
.it-table .st.g { color: var(--g); } .it-table .st.r { color: #FF8A8A; }
.it-table tfoot td { border-bottom: 0; font-weight: 700; color: #fff; background: #10141D; }
.it-table tfoot td b { font-size: 16px; }
.it-sum { min-width: 0; padding: 20px; border-radius: 22px; background: linear-gradient(180deg, #121620, #0E1118); border: 1px solid var(--line); display: grid; gap: 12px; }
.it-sum .row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid #1A1F2C; font-size: 14px; color: var(--t2); }
.it-sum .row b { color: #fff; font: 800 16px/1 Inter, sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; }
.it-net { padding: 16px; border-radius: 16px; display: flex; justify-content: space-between; align-items: center; gap: 12px; background: linear-gradient(135deg, rgba(48,191,115,.16), rgba(48,191,115,.03)); border: 1px solid rgba(48,191,115,.35); }
.it-net.bad { background: linear-gradient(135deg, rgba(240,61,61,.16), rgba(240,61,61,.03)); border-color: rgba(240,61,61,.38); }
.it-net > span { font: 600 14px/1.35 Inter, sans-serif; color: #fff; }
.it-net > span small { display: block; font-weight: 500; font-size: 12px; color: var(--t3); }
.it-net b { font: 900 32px/1 Inter, sans-serif; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.it-sum .ct-note { margin: 0; }
.it-ex-foot { margin-top: 14px; max-width: 900px; }
[hidden] { display: none !important; }

/* traders */
.it-tiers { margin-top: 30px; display: grid; gap: 18px; }
@media (min-width: 1060px) { .it-tiers { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; } }
.it-tier-table td, .it-tier-table th { white-space: normal; text-align: left !important; vertical-align: top; }
.it-tier-table td:first-child { color: var(--t3); font-size: 13px; width: 26%; }
.it-tier-table th { color: #fff; font-size: 15px; }
.it-tier-table th .tn { display: block; font: 600 11.5px/1 Inter, sans-serif; color: var(--t3); margin-bottom: 6px; }
.it-tier-table th:nth-child(2) b { color: #FBE7A1; } .it-tier-table th:nth-child(3) b { color: #BDEFD3; }
.it-tier-table tr.acc td, .it-tier-table tr.fee td { background: #10141D; }
.it-tier-table tr.acc b { color: var(--y); }
.it-trd-side { min-width: 0; display: grid; gap: 16px; }
.it-calc { padding: 20px; }
.it-calc-out { margin-top: 18px; display: grid; gap: 12px; }
.it-calc-out .row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 14px; color: var(--t2); padding-bottom: 12px; border-bottom: 1px solid #1A1F2C; }
.it-calc-out .row b { font: 800 18px/1 Inter, sans-serif; color: #fff; font-variant-numeric: tabular-nums; }
.it-calc-out .row b.r { color: var(--r); }
.it-calc .ct-you { padding: 14px 16px; }
.it-calc .ct-you b { font-size: 30px; white-space: nowrap; }
.it-calc .ct-you b u, .it-door-frag b u { text-decoration: none; font-size: .5em; font-weight: 700; color: inherit; opacity: .75; margin-left: .2em; }
.it-calc .ct-you.zero { background: #10141D; border-color: var(--line); } .it-calc .ct-you.zero b { color: var(--t3); }
.it-calc .ct-chips button { padding: 9px 12px; font-size: 13.5px; }
.it-elig { padding: 18px; border-radius: 22px; background: #0E1118; border: 1px solid var(--line); display: grid; gap: 10px; }
.it-elig-h { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.it-elig-h b { font: 700 14.5px/1.3 Inter, sans-serif; color: #fff; }
.it-elig-h span { font-size: 11.5px; color: var(--t3); }
.it-el { display: grid; grid-template-columns: minmax(0, 1fr) 70px auto; align-items: center; gap: 10px; font-size: 12.5px; color: var(--t2); }
.it-el i { height: 5px; border-radius: 5px; background: #1F2535; position: relative; overflow: hidden; }
.it-el i::after { content: ''; position: absolute; inset: 0 auto 0 0; width: var(--u); border-radius: 5px; background: var(--g); }
.it-el b { min-width: 74px; text-align: right; color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.it-el.wait i::after { background: var(--y); } .it-el.wait b { color: var(--y); }
.it-trd-cta { margin-top: 26px; }
.it-trd-note { margin-top: 12px; max-width: 640px; }

/* transparency */
.it-results { margin-top: 28px; display: grid; gap: 10px; }
.it-empty { display: grid; justify-items: center; gap: 8px; padding: 34px 24px; border-radius: 22px; text-align: center; background: #0E1118; border: 1px dashed #2A3245; }
.it-empty b { font: 700 16px/1.3 Inter, sans-serif; color: #fff; }
.it-empty span { max-width: 52ch; font-size: 14px; line-height: 1.55; color: var(--t2); }
.it-ghost { display: grid; gap: 6px; width: min(360px, 100%); margin-bottom: 8px; }
.it-ghost i { height: 12px; border-radius: 6px; background: linear-gradient(90deg, #151924, #1C2130, #151924); background-size: 200% 100%; animation: itGhost 2.4s ease-in-out infinite; }
.it-ghost i:nth-child(2) { width: 80%; } .it-ghost i:nth-child(3) { width: 60%; }
@keyframes itGhost { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }
.it-res { display: grid; gap: 12px; padding: 16px 18px; border-radius: 18px; background: #0E1118; border: 1px solid var(--line); }
@media (min-width: 860px) { .it-res { grid-template-columns: 240px 130px 110px minmax(0, 1fr); align-items: center; } }
.it-res .t b { display: block; font: 700 15px/1.3 Inter, sans-serif; color: #fff; }
.it-res .t small { display: block; margin-top: 3px; font-size: 12px; color: var(--t3); }
.it-res .v span { display: block; font-size: 11px; color: var(--t3); }
.it-res .v b { font: 800 16px/1.2 Inter, sans-serif; color: #fff; font-variant-numeric: tabular-nums; }
.it-res .tr { display: flex; flex-wrap: wrap; gap: 6px; }
.it-res .tr span { padding: 6px 8px; border-radius: 8px; font-size: 12px; color: #C9CFDB; background: #151924; border: 1px solid var(--line); font-variant-numeric: tabular-nums; }
.it-res .tr span b { margin-left: 4px; }

/* fees + risks */
.it-fr { display: grid; gap: 40px; }
@media (min-width: 1000px) { .it-fr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; } }
.it-fees, .it-risks { min-width: 0; }
.it-fee-list { margin-top: 26px; border-radius: 22px; overflow: hidden; border: 1px solid var(--line); background: #0E1118; }
.it-fee-list > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 14px; padding: 15px 18px; border-bottom: 1px solid #171C28; font-size: 14px; }
.it-fee-list > div:last-child { border-bottom: 0; }
.it-fee-list > div > span { color: var(--t2); }
.it-fee-list b { color: #fff; font-weight: 600; line-height: 1.45; }
.it-defaults { margin-top: 10px; max-width: 640px; }
.it-fee-list + .it-defaults { margin-top: 12px; }
.it-risk-list { margin-top: 26px; display: grid; gap: 1px; border-radius: 22px; overflow: hidden; background: var(--line); border: 1px solid var(--line); }
.it-risk-list > div { padding: 15px 18px; background: #0E1118; }
.it-risk-list b { display: flex; gap: 10px; align-items: baseline; font: 700 15px/1.35 Inter, sans-serif; color: #fff; }
.it-risk-list b::before { content: ''; flex: none; width: 8px; height: 8px; border-radius: 2px; background: var(--r); transform: translateY(-1px) rotate(45deg); }
.it-risk-list span { display: block; margin: 6px 0 0 18px; font-size: 13.5px; line-height: 1.5; color: var(--t2); }
@media (max-width: 520px) { .it-fee-list > div { grid-template-columns: 1fr; gap: 4px; } }

/* faq: two columns on wide screens */
@media (min-width: 1000px) { .it-faq { max-width: none; grid-template-columns: 1fr 1fr; align-items: start; } }

/* closing band */
.it-band { background: radial-gradient(50% 120% at 20% 0%, rgba(245,204,59,.16), transparent 70%), radial-gradient(50% 120% at 85% 100%, rgba(48,191,115,.16), transparent 70%), #0E1118; }
.it-band-risk { margin-top: 18px !important; font-size: 12.5px !important; color: var(--t3) !important; }

@media (max-width: 640px) {
  /* long translations: buttons and the passport link wrap instead of running past their box */
  .it .ct-cta .btn, .it .it-door-cta .btn { white-space: normal; text-align: center; max-width: 100%; line-height: 1.3; }
  .it-trust-rules a { white-space: normal; }
  /* requirements: the row name goes above its two values, the two tiers stay side by side under their headers */
  .it-tier-table, .it-tier-table thead, .it-tier-table tbody { display: block; font-size: 13px; }
  .it-tier-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 14px; padding: 11px 14px; border-bottom: 1px solid #171C28; }
  .it-tier-table tbody tr:last-child { border-bottom: 0; }
  .it-tier-table th, .it-tier-table td { display: block; min-width: 0; width: auto !important; padding: 0; border: 0; overflow-wrap: anywhere; hyphens: auto; -webkit-hyphens: auto; }
  .it-tier-table thead tr { padding-top: 14px; padding-bottom: 12px; border-bottom-color: var(--line); }
  .it-tier-table thead th:first-child { display: none; }
  .it-tier-table th { font-size: 13.5px; }
  .it-tier-table td:first-child { grid-column: 1 / -1; margin-bottom: 6px; font-size: 12px; }
  .it-tier-table tr.acc, .it-tier-table tr.fee { background: #10141D; }
  .it-tier-table tr.acc td, .it-tier-table tr.fee td { background: transparent; }
  .it-ex .it-tablewrap { overflow: visible; border: 0; background: transparent; border-radius: 0; }
  .it-ex .it-table thead { display: none; }
  .it-ex .it-table tr { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; margin-bottom: 10px; padding: 14px 16px; border-radius: 18px; background: #0E1118; border: 1px solid var(--line); }
  .it-ex .it-table td { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 0; border: 0; font-size: 13.5px; background: transparent; }
  .it-ex .it-table td::before { content: attr(data-label); font-size: 11.5px; font-weight: 500; color: var(--t3); white-space: normal; text-align: left; }
  .it-ex .it-table td:first-child { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; padding-bottom: 8px; margin-bottom: 2px; border-bottom: 1px solid #1A1F2C; }
  .it-ex .it-table td:first-child::before { display: none; }
  .it-ex .it-table td:first-child b { display: inline; }
  .it-ex .it-table td:first-child .st { margin-top: 0; }
  .it-ex .it-table td:last-child { grid-column: 1 / -1; }
  .it-ex .it-table tfoot tr { background: #10141D; border-color: #2A3245; }
  .it-ex .it-table tfoot td { background: transparent; }
}
@media (max-width: 480px) {
  .it-row { grid-template-columns: 24px minmax(0, 1fr) 46px 50px; gap: 6px; }
  .it-cap > b { font-size: 23px; }
  .it-live-stats b { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) { .it-live.on .it-live-dot, .it-pill i, .it-tl .now, .it-ghost i { animation: none; } }

/* right-to-left languages (ar, ur) */
[dir="rtl"] .it-ladder { padding: 22px 52px 22px 22px; }
[dir="rtl"] .it-ladder::before { left: auto; right: 31px; }
[dir="rtl"] .it-lv .dot { left: auto; right: -27px; }
[dir="rtl"] .it-honest { border-left: 0; border-right: 3px solid var(--r); }
[dir="rtl"] .it-risk-list span, [dir="rtl"] .it-trust-rules span { margin: 6px 18px 0 0; }
[dir="rtl"] .it-table th, [dir="rtl"] .it-table td { text-align: left; }
[dir="rtl"] .it-table th:first-child, [dir="rtl"] .it-table td:first-child, [dir="rtl"] .it-tier-table td, [dir="rtl"] .it-tier-table th { text-align: right !important; }
[dir="rtl"] .it-row > b, [dir="rtl"] .it-el b { text-align: left; }
[dir="rtl"] .it-door-frag b, [dir="rtl"] .it-tc-fund b, [dir="rtl"] .it-cap > b, [dir="rtl"] .it-sum b, [dir="rtl"] .it-meter b { direction: ltr; unicode-bidi: isolate; }
@media (min-width: 900px) { [dir="rtl"] .it-steps .ct-step:not(:last-child)::after { right: auto; left: -18px; background: linear-gradient(270deg, var(--g), transparent); } }