/* Precision Light: opt-in presentation layer. No chart or transaction logic. */
/* Roboto (SIL Open Font License 1.1, static/fonts/ROBOTO-LICENSE.txt), self-hosted. Owner 2026-10-17: Roboto for the whole
   site, chosen after a survey of 22 exchanges' fonts. Natural weights, no stepping:
   100-400 Regular, 500 Medium, 600 SemiBold, 700-900 Bold. Each weight is split into the latin and latin-ext subsets;
   unicode-range means a page downloads latin-ext only when it shows such a character. ?v= is each file's sha256 prefix,
   so /fonts/* can be immutable. Regular, Medium and SemiBold latin are preloaded from index.html. The Figtree and Inter
   files stay in static/fonts for shells still holding an older stylesheet; nothing here references them. */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100 400;
  font-display: swap;
  src: url('/fonts/Roboto-Regular-latin-ext.woff2?v=5725eacc') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100 400;
  font-display: swap;
  src: url('/fonts/Roboto-Regular-latin.woff2?v=425c0713') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/Roboto-Medium-latin-ext.woff2?v=1e597a6e') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/Roboto-Medium-latin.woff2?v=5bcc3aa1') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/Roboto-SemiBold-latin-ext.woff2?v=82ea2dcb') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/Roboto-SemiBold-latin.woff2?v=3eac5e2f') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
  src: url('/fonts/Roboto-Bold-latin-ext.woff2?v=7673803a') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
  src: url('/fonts/Roboto-Bold-latin.woff2?v=b9d66d17') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* 'Source Sans Pro' is an alias for the same Roboto files (same URLs, so no extra download). The chart canvas, the
   wallet-kit modal and legacy SCSS still name that family in protected code; with no face behind it they fell back to Helvetica/Arial. */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 100 400;
  font-display: swap;
  src: url('/fonts/Roboto-Regular-latin-ext.woff2?v=5725eacc') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 100 400;
  font-display: swap;
  src: url('/fonts/Roboto-Regular-latin.woff2?v=425c0713') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/Roboto-Medium-latin-ext.woff2?v=1e597a6e') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/Roboto-Medium-latin.woff2?v=5bcc3aa1') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/Roboto-SemiBold-latin-ext.woff2?v=82ea2dcb') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/Roboto-SemiBold-latin.woff2?v=3eac5e2f') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
  src: url('/fonts/Roboto-Bold-latin-ext.woff2?v=7673803a') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
  src: url('/fonts/Roboto-Bold-latin.woff2?v=b9d66d17') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
html.RudraNext {
  min-width: 0;
  margin-right: 0;
  /* Neutral light palette, owner 2026-10-16. Grey page, flat white panels, neutral lines,
     black ink, one grey for secondary and tertiary text; no blue or green tint anywhere. Rudra keeps its dark teal
     header, its teal for primary buttons, links, active indicators and focus, and no yellow.
     Contrast on #fff / #f5f5f5 / #ededed / #e6e6e6: ink 21 / 19.3 / 17.9 / 16.8; ink-2 5.74 / 5.27 / 4.90 / 4.60;
     up and down (a clear green and red that pass AA on all four) 5.64 / 5.17 / 4.82 / 4.52,
     white text on them 5.64; up-strong and down-strong 5.87 / 5.39 / 5.02 / 4.71 (use them on tinted pills and flashes). */
  --bn-bg: #f5f5f5;
  --bn-panel: #fff;
  --bn-line: #ededed;
  --bn-line-strong: #ddd;
  --bn-hover: #f5f5f5;
  --bn-chip: #ededed;
  --bn-selected: #e6e6e6;
  --bn-ink: #000;
  --bn-ink-2: #666;
  --bn-up: #017744;
  --bn-down: #cc123e;
  --bn-up-strong: #017441;
  --bn-down-strong: #c7113d;
  --bn-up-bg: rgba(1, 119, 68, .08);
  --bn-down-bg: rgba(204, 18, 62, .08);
  --bn-disabled-bg: #e6e6e6;
  --bn-shadow-pop: 0 4px 24px rgba(0, 0, 0, .1);
  --bn-scrim: rgba(0, 0, 0, .5);
  /* Rudra brand (unchanged): teal for primary buttons (white text 5.96:1), active indicators and focus; link teal 4.97:1
     on white and 4.56:1 on #f5f5f5 (links stay off the #ededed/#e6e6e6 chips, or use --rn-teal there). */
  --rn-teal: #176d7e;
  --rn-teal-fill: #28798f;
  --rn-focus-ring: rgba(23, 109, 126, .16);
  --rn-cyan: #68e8ef;
  /* The older token families now resolve to the neutral palette, so every page that uses them follows. */
  --rn-ink: var(--bn-ink);
  --rn-secondary: var(--bn-ink-2);
  --rn-muted: var(--bn-ink-2);
  --rn-deep: var(--bn-ink);
  --rn-line: var(--bn-line);
  --rn-paper: var(--bn-panel);
  --rn-bg: var(--bn-bg);
  /* Panels are flat (no resting shadow); popovers and dialogs use --bn-shadow-pop. */
  --rn-shadow: none;
  /* Type system (Roboto only). 12px is the floor. */
  --rx-font: 'Roboto', ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --rx-font-mono: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace;
  --rx-fs-1: 12px;
  --rx-fs-2: 14px;
  --rx-fs-3: 16px;
  --rx-fs-4: 20px;
  --rx-fs-5: 28px;
  --rx-fs-heading: 24px;
  --rx-lh-tight: 1.2;
  --rx-lh: 1.4;
  --rx-lh-copy: 1.55;
  /* Weights (natural):
     regular  - data rows, prices, amounts, body copy, labels, captions, column headers;
     medium   - token and pair names, section titles, tabs, nav items, card titles;
     semibold - buttons and CTAs, page headings;
     bold     - rare emphasis only. */
  --rx-fw-regular: 400;
  --rx-fw-medium: 500;
  --rx-fw-semibold: 600;
  --rx-fw-bold: 700;
  --rx-ls-caps: .04em;
  --rx-ls-title: -.01em;
  --rx-ink: var(--bn-ink);
  --rx-ink-2: var(--bn-ink-2);
  --rx-ink-3: var(--bn-ink-2);
  /* --rx-teal is only ever a text colour, so it is the link/active-text teal: 5.09:1 on the #ededed chips and 4.77:1 on
     #e6e6e6, where #28798f was 4.25 / 3.99. Fills use --rn-teal-fill. */
  --rx-teal: var(--rn-teal);
  --rx-teal-strong: var(--rn-teal);
  --rx-up: var(--bn-up);
  --rx-down: var(--bn-down);
  --rx-up-strong: var(--bn-up-strong);
  --rx-down-strong: var(--bn-down-strong);
  --rx-line: var(--bn-line);
  --rx-line-strong: var(--bn-line-strong);
  --rx-bg: var(--bn-bg);
  --rx-surface: var(--bn-panel);
  --rx-hover: var(--bn-hover);
  --rx-chip: var(--bn-chip);
  --rx-skel: var(--bn-chip);
  --rx-focus: #247e90;
  /* Motion: 1 colour/background hovers, 2 border/shadow/opacity, 3 panels, sheets, modals. */
  --rx-dur-1: 120ms;
  --rx-dur-2: 180ms;
  --rx-dur-3: 240ms;
  --rx-ease: cubic-bezier(.2, 0, 0, 1);
  --rx-ease-exit: cubic-bezier(.4, 0, 1, 1);
  color-scheme: light;
  scroll-padding-top: 110px;
}

html.RudraNext body {
  min-width: 0;
  background: var(--rn-bg);
  color: var(--rn-ink);
  font-family: var(--rx-font);
  /* Tabular figures (tnum) keep prices and the order book from jittering. */
  font-variant-numeric: tabular-nums;
  font-kerning: normal;
}
/* Grayscale (antialiased) smoothing everywhere: crisp, light strokes on white. One rule here
   instead of editing the component files that set their own; !important only for this property. */
html.RudraNext, html.RudraNext * { -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; }
/* Defaults for unstyled emphasis and page headings: the browser's bold (700) becomes semibold, per the weight rules.
   Two element selectors (0,0,2) so they beat the normalize rule in main.css; any component rule with a class wins. */
:where(html.RudraNext) body :is(b, strong) { font-weight: var(--rx-fw-semibold); }
:where(html.RudraNext) body h1 { font-weight: var(--rx-fw-semibold); }
html.RudraNext :is(input, button, select, textarea) { font-family: inherit; font-variant-numeric: inherit; }
/* Keyboard focus on every focusable thing, including role=button/tab/option and tabindex elements (the pair picker, asset
   badges, order-book rows, scroll regions): the #247e90 ring is 4.71 / 4.32 / 4.02 / 3.77:1 on #fff / #f5f5f5 / #ededed / #e6e6e6. */
html.RudraNext :is(input, button, select, a):focus-visible,
html.RudraNext :where(textarea, [role=button], [role=tab], [role=option], [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 3px solid var(--rx-focus);
  outline-offset: 3px;
}
/* Inside containers that clip their overflow the outside ring is cut, so these draw it inset. */
html.RudraNext :is(.Swap_quoteSummary, .Swap_pickerRow, .RudraScreener__tabs > button, .subNav__nav__item, .LegalDoc__railLinks a,
  .RudraBalances__tableHeader button):focus-visible { outline-offset: -3px; }
/* The #247e90 ring is 1.6-3.0:1 on the dark header gradient and the dark login rail; the header's own cyan is 5-9.7:1 there. */
html.RudraNext #rudra_header :is(a, button):focus-visible,
html.RudraNext .RudraAccountLogin__rail :is(a, button):focus-visible { outline-color: var(--rn-cyan); }
html.RudraNext :is(button, a, input, select) { -webkit-tap-highlight-color: transparent; }
html.RudraNext :is(button:disabled, [aria-disabled='true']) { cursor: not-allowed; }
/* Placeholder: the secondary grey, 5.74:1 on white and 5.27:1 on #f5f5f5. */
html.RudraNext :is(input, select, textarea)::placeholder { color: var(--bn-ink-2); opacity: 1; }
html.RudraNext :is(input, textarea) { caret-color: var(--rn-teal); }
html.RudraNext :is(.ExchangePro, .ExplorerPage--claude, .MarketsPage--claude, .RudraBalances, .RudraAccountLogin) {
  color: var(--rn-ink);
  background: var(--rn-bg);
  --explorer-bg: var(--rn-bg);
  --explorer-card: var(--bn-panel);
  --explorer-heading: var(--rn-ink);
  --explorer-text: var(--rn-ink);
  --explorer-secondary: var(--rn-secondary);
  --explorer-muted: var(--rn-muted);
  --explorer-pale: var(--rn-muted);
  --explorer-primary: var(--rn-teal);
  --explorer-primary-hover: var(--rn-teal);
  --explorer-border: var(--rn-line);
  --explorer-divider: var(--bn-line);
  --explorer-positive: var(--bn-up);
  --explorer-negative: var(--bn-down);
  --markets-bg: var(--rn-bg);
  --markets-card: var(--bn-panel);
  --markets-heading: var(--rn-ink);
  --markets-text: var(--rn-ink);
  --markets-secondary: var(--rn-secondary);
  --markets-muted: var(--rn-muted);
  --markets-pale: var(--rn-muted);
  --markets-primary: var(--rn-teal);
  --markets-primary-hover: var(--rn-teal);
  --markets-border: var(--rn-line);
  --markets-divider: var(--bn-line);
  --markets-up: var(--bn-up);
  --markets-down: var(--bn-down);
}
/* The page-level token families defined in the area stylesheets resolve to the same neutral palette. These rules
   outrank the definitions (one more class), so a page follows even where its own file still holds the old value.
   Teal tokens stay teal. Up/down that sit on a tinted pill take the strong pair; plain text takes --bn-up/--bn-down. */
html.RudraNext .RudraScreener {
  --scr-ink: var(--bn-ink);
  --scr-muted: var(--bn-ink-2);
  --scr-faint: var(--bn-ink-2);
  --scr-teal-tint: var(--bn-chip);
  --scr-line: var(--bn-line);
  --scr-line-soft: var(--bn-line);
  --scr-card-line: var(--bn-line);
  --scr-card-shadow: none;
  --scr-surface: var(--bn-panel);
  --scr-hover: var(--bn-hover);
  --scr-up: var(--bn-up-strong);
  --scr-up-bg: var(--bn-up-bg);
  --scr-down: var(--bn-down-strong);
  --scr-down-bg: var(--bn-down-bg);
  --scr-green: var(--bn-up);
}
/* Sparklines are chart strokes (owner: chart colours unchanged): they keep the pre-2026-10-16 up/down. */
html.RudraNext .RudraScreener__spark { --scr-up: #0f7d5e; --scr-down: #c73e4c; }
html.RudraNext .ExchangeTerminal {
  --term-teal-tint: var(--bn-chip);
  --term-line: var(--bn-line);
  --term-ink: var(--bn-ink);
  --term-muted: var(--bn-ink-2);
  --term-body: var(--bn-ink);
  /* Buy/sell tab fills under white text: 5.64:1. */
  --term-buy: var(--bn-up);
  --term-sell: var(--bn-down);
}
@media (min-width: 1101px) {
  html.RudraNext .ExchangePro {
    --exchange-border-strong: var(--bn-line);
    --exchange-divider: var(--bn-line);
    --exchange-muted: var(--bn-ink-2);
  }
}
html.RudraNext .RudraMarketOverview {
  --overview-ink: var(--bn-ink);
  --overview-muted: var(--bn-ink-2);
}
html.RudraNext .AdminAnalyticsPage {
  --aa-ink: var(--bn-ink);
  --aa-text: var(--bn-ink);
  --aa-muted: var(--bn-ink-2);
  --aa-faint: var(--bn-ink-2);
  --aa-line: var(--bn-line);
  --aa-line-strong: var(--bn-line-strong);
  --aa-surface: var(--bn-panel);
  --aa-canvas: var(--bn-bg);
  --aa-wash: var(--bn-bg);
  --aa-up: var(--bn-up-strong);
  --aa-up-bg: var(--bn-up-bg);
  --aa-down: var(--bn-down-strong);
  --aa-down-bg: var(--bn-down-bg);
  --aa-shadow: none;
}
/* One page background on every route: these shells painted #f5f7fa, so twin pages (Login/Signup) and sibling account
   tabs switched grey when you moved between them. */
html.RudraNext :is(.Tokenomics, .Whitepaper, .Roadmap, .Security, .LegalDoc, .RudraSignup, .RudraSend,
  .RudraActivityPage, .RudraAcceptAssets) {
  background: var(--rn-bg);
}

/* Navigation is dark teal; trading surfaces stay bright and quiet. */
html.RudraNext .Header_main { box-shadow: 0 8px 30px -22px #0d344b80; }
html.RudraNext .Header_main .Header_background {
  background: linear-gradient(110deg, #0c2f38, #165261 78%, #175e6a);
  border-bottom: 1px solid #4eabb46b;
}
html.RudraNext .Header_main .Header_background .Header { padding-top: 14px; padding-bottom: 14px; }
html.RudraNext .Header_main .Header_nav .Nav_link {
  padding: 10px 16px;
  margin-right: 6px;
  color: #d8e9eb;
  font-weight: var(--rx-fw-medium);
  font-size: var(--rx-fs-2);
  border-radius: 8px;
  position: relative;
}
html.RudraNext .Header_main .Header_nav .Nav_link.is-current {
  background: #ffffff12;
  color: #fff;
  box-shadow: inset 0 -2px var(--rn-cyan);
}
html.RudraNext .Header_main .Header_nav .Nav_link:hover { background: #ffffff18; color: #fff; }
html.RudraNext .Header_login-button {
  color: #fff;
  border: 1px solid #8dc7ce6b;
  border-radius: 8px;
  padding: 11px 17px;
  background: #ffffff0b;
}
html.RudraNext .Header_login-button:hover { background: #ffffff1c; }
html.RudraNext .Header_account-logout { border-color: #8dc7ce80; }

/* A thin one-pass laser sits on selected panel edges, never over market data. */
html.RudraNext :is(.Swap_container, .ExplorerSearch, .ExchangePairPickerSection > .island, .RudraHomeHero__market, .RudraAccountLogin__card) {
  position: relative;
}
html.RudraNext :is(.Swap_container, .ExplorerSearch, .ExchangePairPickerSection > .island, .RudraHomeHero__market, .RudraAccountLogin__card)::before {
  content: '';
  position: absolute;
  pointer-events: none;
  top: -1px;
  left: 12%;
  width: 40%;
  height: 2px;
  z-index: 1;
  border-radius: 100%;
  background: linear-gradient(90deg, transparent, #30b7cf, #c9ffff, #30b7cf, transparent);
  box-shadow: 0 1px 8px #46cbd355;
  transform-origin: left;
  animation: rudraBeamArrival 1.8s ease-out both;
}
@keyframes rudraBeamArrival {
  from { opacity: 0; transform: translateX(-20%) scaleX(.3); }
  45% { opacity: 1; }
  to { opacity: .9; transform: translateX(85%) scaleX(1); }
}

/* One component vocabulary across markets, documents, accounts and dialogs. */
html.RudraNext :is(.ExplorerCard, .ExplorerAssetCard, .ExplorerSpotlight, .MarketsPage--claude .MarketsCard,
  .ExchangePro .island, .RudraBalances__card, .RudraAccountLogin__card, .Swap_container,
  .RudraBalances__pending, .RudraSend__card, .RudraAcceptAssets__card, .RudraActivityPage__panel,
  .Whitepaper__document, .Security__document, .LegalDoc__document,
  .GlobalModal, .AccountLoginModal) {
  border: 1px solid var(--rn-line);
  border-radius: 14px;
  box-shadow: var(--rn-shadow);
}
html.RudraNext :is(.ExplorerCard, .MarketsCard, .RudraBalances__card, .ExchangePro .island, .Swap_container,
  .RudraBalances__pending, .RudraSend__card, .RudraAcceptAssets__card, .RudraActivityPage__panel) {
  background-color: var(--rn-paper);
}
html.RudraNext :is(.ExplorerAssetCard, .ExplorerSpotlight) { background: var(--bn-panel); }
html.RudraNext :is(.ExplorerAssetCard:hover, .ExplorerSpotlight:hover) {
  border-color: var(--bn-line-strong);
  box-shadow: 0 6px 16px -10px rgba(0, 0, 0, .18);
  transform: translateY(-2px);
}
/* The Balances filter wrapper is not in this list: its input already draws the field and its focus ring. */
html.RudraNext :is(.ExplorerSearch__field, .MarketsSearch__field) {
  border: 1px solid var(--bn-line-strong);
  border-radius: 8px;
  background: var(--bn-panel);
}
html.RudraNext :is(.ExplorerSearch__field, .MarketsSearch__field):focus-within {
  border-color: var(--rn-teal);
  background: var(--bn-panel);
  box-shadow: 0 0 0 3px #2f9caf14;
}

/* Explorer and discovery: stronger identity, sober data, no chart fabrication. */
html.RudraNext .ExplorerPage__content { gap: 20px; }
html.RudraNext .ExplorerHero h1 { font-size: clamp(32px, 3vw, 42px); letter-spacing: -.035em; font-weight: var(--rx-fw-semibold); }
html.RudraNext .ExplorerHero > p { color: var(--rn-secondary); font-size: 16px; max-width: 720px; }
html.RudraNext .ExplorerHero__stats { margin-top: 18px; }
html.RudraNext .ExplorerHero__stats > span { border-color: var(--bn-line-strong); color: var(--bn-ink-2); background: var(--bn-panel); }
html.RudraNext .ExplorerSearch { padding: 22px 24px; }
html.RudraNext .ExplorerSearch__field { min-height: 50px; margin-top: 12px; }
html.RudraNext .ExplorerSearch input { font-size: 16px; }
html.RudraNext .ExplorerSearch .ExplorerSearch__field input {
  border: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
}
html.RudraNext .ExplorerTape { box-shadow: none; background: var(--bn-panel); }
html.RudraNext .ExplorerSpotlight { padding: 18px 20px; min-height: 98px; }
html.RudraNext .ExplorerSpotlight > span:first-child { color: var(--bn-ink-2); letter-spacing: .09em; }
html.RudraNext .ExplorerDirectoryCopy > strong { color: var(--rn-ink); font-size: 20px; }
html.RudraNext .ExplorerAssetGrid { gap: 14px; }
html.RudraNext .ExplorerAssetCard { min-height: 92px; padding: 17px 16px; border-radius: 11px; }
html.RudraNext .ExplorerAssetCard__identity strong { font-size: 15px; letter-spacing: -.01em; font-weight: var(--rx-fw-medium); }
html.RudraNext .ExplorerAssetCard__identity > span { color: var(--bn-ink-2); font-size: 12px; }
html.RudraNext .ExplorerAssetCard__market > strong { font-size: 15px; font-variant-numeric: tabular-nums; }
html.RudraNext :is(.ExplorerAssetTable__head, .MarketsTable__head) { background: var(--bn-bg); color: var(--bn-ink-2); }
html.RudraNext .ExplorerAssetTable__row { min-height: 76px; }
html.RudraNext .ExplorerAssetTable__row:hover { background: var(--bn-hover); }
html.RudraNext .ExplorerChartEmpty { color: var(--bn-ink-2); }
html.RudraNext .ExplorerTokenOverview__identity h1 { font-size: 34px; letter-spacing: -.025em; }
html.RudraNext .ExplorerTokenPrice__top strong { font-variant-numeric: tabular-nums; }
html.RudraNext :is(.ExplorerTimeTabs, .ExplorerViewToggle, .ExplorerSort) { background: var(--bn-chip); border-color: var(--bn-line); }
html.RudraNext .ExplorerSectionTitle h2 { font-size: 21px; letter-spacing: -.02em; }
html.RudraNext :is(.ExplorerTokenStats, .ExplorerKeyFacts) { gap: 12px; }

/* Trading: preserve chart internals; clarify its surrounding controls. */
html.RudraNext .ExchangePro { padding-top: 24px; }
html.RudraNext .ExchangePro__workspace { gap: 20px; }
html.RudraNext .ExchangePro .ExchangePairPickerSection .island {
  border-top: 1px solid var(--rn-line);
  padding: 20px 24px;
  background: var(--bn-panel);
}
html.RudraNext .PairPicker_pairCopy strong { color: var(--rn-ink); font-size: 20px; font-weight: var(--rx-fw-medium); letter-spacing: -.02em; }
html.RudraNext .PairPicker_pairCopy > span { color: var(--bn-ink-2); font-size: 12px; }
html.RudraNext .ExchangePro__chartToolbar {
  padding: 14px 16px;
  background: var(--bn-panel);
  border-bottom: 1px solid var(--bn-line);
  border-radius: 14px 14px 0 0;
}
/* Contain the old canvas while its existing debounced resize catches up. */
html.RudraNext .ExchangePro .ChartChunk { overflow: hidden; }
/* Wrapped controls must not clip the original chart's time axis. */
html.RudraNext .ExchangePro .ExchangeChartSection:not(.fullScreenChart) .ChartChunk { height: auto; }
/* Flat text toggles, no raised pills and no boxes: the track and every resting button are transparent (the border stays
   1px wide, transparent, so nothing moves); the active one is a flat #ededed chip with teal text (5.09:1), like the
   screener chips; inactive text is the secondary grey. One rule set for chart types, MA, scale modes, timeframes,
   Orderbook | Depth and Limit | Market. */
html.RudraNext .ExchangePro__segmented { background: transparent; border-color: transparent; padding: 3px; border-radius: 8px; }
html.RudraNext .ExchangePro__segmented button { color: var(--bn-ink-2); font-weight: var(--rx-fw-medium); }
html.RudraNext .ExchangePro__segmented button.active { background: var(--bn-chip); color: var(--rn-teal); box-shadow: none; }
html.RudraNext .ExchangePro__timeframes button { background: none; border-color: transparent; border-radius: 6px; color: var(--bn-ink-2); font-weight: var(--rx-fw-medium); }
html.RudraNext .ExchangePro__timeframes button.active { background: var(--bn-chip); border-color: transparent; color: var(--rn-teal); }
html.RudraNext .ExchangePro__sectionHeader { min-height: 48px; background: var(--bn-panel); border-bottom-color: var(--bn-line); border-radius: 14px 14px 0 0; }
/* Desktop terminal: the trade and Open-offers cards have square tops under their tab strips, so their headers do too. */
@media (min-width: 1101px) {
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__trade .ExchangePro__sectionHeader,
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__activity .ExchangePro__sectionHeader { border-radius: 0; }
}
html.RudraNext .ExchangePro__sectionTitle { color: var(--rn-ink); font-size: 14px; font-weight: var(--rx-fw-medium); letter-spacing: .015em; }
html.RudraNext .ExchangePro__activeOffers { color: var(--bn-ink-2); }
/* The Orderbook | Depth switch is a floating control, not a card header: same track as the chart-type segmented control. */
html.RudraNext .ExchangePro__bookTabs { background: transparent; border-color: transparent; border-radius: 8px; }
html.RudraNext .ExchangePro__bookTabs button { border-radius: 6px; font-weight: var(--rx-fw-medium); color: var(--bn-ink-2); }
html.RudraNext .ExchangePro__bookTabs button.active { color: var(--rn-teal); background: var(--bn-chip); box-shadow: none; }
html.RudraNext .ExchangePro .OfferMakers { align-items: stretch; }
html.RudraNext .ExchangePro .OfferMakers_maker { padding: 18px 20px 20px; }
/* Owner 2026-10-03: the title stub is gone, so the "Create new offer" title starts where its form does. */
html.RudraNext .ExchangePro .ExchangeOfferMakerSection .ExchangePro__sectionHeader { padding-left: 20px; padding-right: 20px; }
html.RudraNext .ExchangePro .OfferMaker_title h3 { font-size: var(--rx-fs-4); color: var(--rn-ink); font-weight: var(--rx-fw-medium); letter-spacing: -.02em; }
html.RudraNext .ExchangePro .OfferMaker_table input {
  min-height: 40px;
  color: var(--rn-ink);
  background: var(--bn-panel);
  border-color: var(--bn-line-strong);
  border-radius: 8px;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
html.RudraNext .ExchangePro .OfferMaker_table input:focus { background: var(--bn-panel); border-color: var(--rn-teal); box-shadow: 0 0 0 3px var(--rn-focus-ring); }
/* Owner 2026-09-20: the order card carries two radii and no more — 8px on anything that is its own
   box, 6px on anything sitting inside one. This layer loads last, so the 7px here was quietly
   outranking the 8px the stylesheet already asks for. */
html.RudraNext .ExchangePro .OfferMaker_orderType { background: transparent; border-color: transparent; border-radius: 8px; }
html.RudraNext .ExchangePro .OfferMaker_orderType button { color: var(--bn-ink-2); font-weight: var(--rx-fw-medium); }
html.RudraNext .ExchangePro .OfferMaker_orderType button.active { background: var(--bn-chip); color: var(--rn-teal); box-shadow: none; }
/* Hover on these flat toggles: the hover grey, ink text. (0,4,2)/(0,5,2) beat the (0,3,1)/(0,4,1) hover rules in Exchange.scss. */
@media (hover: hover) {
  html.RudraNext :is(.ExchangePro__segmented, .ExchangePro__bookTabs, .ExchangePro__timeframes) button:not(.active):hover,
  html.RudraNext .ExchangePro .OfferMaker_orderType button:not(.active):hover { background: var(--bn-hover); border-color: transparent; color: var(--bn-ink); }
}
html.RudraNext .ExchangePro__manageColumns { background: var(--bn-bg); color: var(--bn-ink-2); font-size: var(--rx-fs-1); }
html.RudraNext :is(.ManageOffers__empty, .RecentTrades__empty) { color: var(--bn-ink-2); }
html.RudraNext :is(.RecentTrades__row, .OfferTable) { font-variant-numeric: tabular-nums; }

/* Swap: amount-first composition and a clear, unambiguous primary action. */
html.RudraNext .Swap_stage {
  background: var(--rn-bg);
  padding-top: 56px;
  padding-bottom: 80px;
}
html.RudraNext .Swap_guide { background: linear-gradient(145deg, #10343f, #155765); border-color: #1c5b68; border-radius: 18px; }
html.RudraNext .Swap_guide > p { color: #c5e1e7; font-size: 16px; }
html.RudraNext .Swap_guideSteps li { border-bottom: 1px solid #ffffff16; padding-bottom: 14px; }
html.RudraNext .Swap_container { border-radius: 18px; padding: 30px; box-shadow: none; }
html.RudraNext .Swap_title { color: var(--rn-ink); font-size: 30px; letter-spacing: -.035em; }
/* The 17px 'on Stellar' must not inherit the 30px title's -.035em tracking (about -1px per letter). */
html.RudraNext .Swap_title-broker { color: var(--rn-secondary); letter-spacing: 0; }
html.RudraNext .Swap_amountCard { padding: 20px; border-radius: 12px; border-color: var(--bn-line-strong); background: var(--bn-bg); }
html.RudraNext .Swap_amountCard--from { background: var(--bn-panel); }
html.RudraNext .Swap_amountCard.is-focused { border-color: var(--rn-teal); box-shadow: 0 0 0 3px #4795a414; }
html.RudraNext .Swap_amountCard.is-invalid { border-color: var(--bn-down); box-shadow: 0 0 0 2px var(--bn-down-bg); }
html.RudraNext .Swap_amountRow input { color: var(--rn-ink); font-size: 32px; font-weight: var(--rx-fw-regular); letter-spacing: -.025em; }
html.RudraNext .Swap_assetSelector { background: var(--bn-panel); border-color: var(--bn-line-strong); border-radius: 8px; padding: 9px 12px; }
html.RudraNext .Swap_assetIdentityCode { color: var(--rn-ink); font-size: var(--rx-fs-3); font-weight: var(--rx-fw-medium); }
html.RudraNext .Swap_assetIdentityDomain { color: var(--bn-ink-2); }
html.RudraNext .Swap_usdValue { color: var(--bn-ink-2); }
html.RudraNext .Swap_switch { border-color: var(--bn-line-strong); box-shadow: none; background: var(--bn-panel); color: #28798f; }
html.RudraNext .Swap_switch:hover { background: var(--bn-hover); border-color: #28798f; }
html.RudraNext .Swap_quote { background: var(--bn-bg); border-color: var(--bn-line); border-radius: 10px; }
html.RudraNext .Swap_quoteSummary { color: var(--bn-ink-2); }
html.RudraNext .Swap_cta { min-height: 52px; background: #28798f; border-radius: 8px; box-shadow: none; font-size: var(--rx-fs-3); font-weight: var(--rx-fw-semibold); }
html.RudraNext .Swap_cta:not(:disabled):hover { background: var(--rn-teal); }
html.RudraNext .Swap_cta:disabled { background: var(--bn-disabled-bg); color: var(--bn-ink-2); box-shadow: none; }
html.RudraNext .Swap_pickerRow:hover { background: var(--bn-hover); }
html.RudraNext .Swap_settingsPanel { border-color: var(--bn-line-strong); border-radius: 10px; }

/* Existing hero composition remains recognizable; light architecture replaces haze. */
html.RudraNext .RudraHomeHero { background: var(--rn-bg); }
html.RudraNext .RudraHomeHero__title { color: var(--rn-ink); letter-spacing: -.06em; }
html.RudraNext .RudraHomeHero__description { color: var(--bn-ink-2); }
html.RudraNext .RudraHomeHero__primary { background: var(--rn-teal); box-shadow: none; }
html.RudraNext .RudraHomeHero__secondary { background: var(--bn-panel); border-color: var(--bn-line-strong); color: var(--bn-ink); }
html.RudraNext .RudraHomeHero__market { border-color: var(--bn-line); box-shadow: none; }
html.RudraNext .RudraAssetTable__row { border-color: var(--bn-line); }
html.RudraNext .RudraAssetTable__row:hover { background: var(--bn-hover); }
html.RudraNext .RudraAssetTable__row .AssetCardMain__header__code { color: var(--rn-ink); font-size: 16px; font-weight: var(--rx-fw-medium); }
html.RudraNext .AssetCardMain__header__domain { color: var(--bn-ink-2); }
html.RudraNext .AssetCardMain__issuerAccountId { color: var(--bn-ink-2); }

/* Auth/account and documentation: same surfaces, no changes to their actions. */
html.RudraNext .RudraAccountLogin__rail { background: linear-gradient(145deg, #10343f, #155765); }
html.RudraNext .RudraAccountLogin__card { border-radius: 18px; }
html.RudraNext .GlobalModalBackdrop { background: var(--bn-scrim); }
html.RudraNext :is(.GlobalModal, .AccountLoginModal) { box-shadow: 0 16px 48px rgba(0, 0, 0, .18); }
html.RudraNext .RudraBalances__tableHeader { background: transparent; border-bottom: 1px solid var(--bn-line); color: var(--bn-ink-2); }
html.RudraNext .RudraBalances__tableRow:hover { background: var(--bn-hover); }
html.RudraNext :is(.Whitepaper__hero, .Security__hero, .LegalDoc__hero) {
  background: var(--bn-panel);
}
html.RudraNext :is(.Whitepaper__hero h1, .Security__hero h1, .LegalDoc__hero h1) {
  color: var(--rn-ink);
  letter-spacing: -.04em;
}
/* One 'On this page' rail on the four document pages: grey, line token and the card shadow, like the document
   card beside it. Its rows are white tiles at rest (a grey hover tint would vanish on the grey), so hover keeps
   the tile and draws its edge instead. */
html.RudraNext :is(.Whitepaper__rail, .Security__rail, .LegalDoc__rail, .Roadmap__rail) {
  border-color: var(--rn-line);
  background: var(--bn-bg);
  border-radius: 14px;
  box-shadow: var(--rn-shadow);
}
html.RudraNext :is(.Whitepaper__railLinks > a, .Security__railLinks > a, .Roadmap__railLinks > a,
  .LegalDoc__railLinks > a, .LegalDoc__railLibrary > a, .Whitepaper__rail > .Whitepaper__railTokenomics,
  .Security__rail > .Security__railReport, .Roadmap__rail > .Roadmap__whitepaperLink) {
  background: var(--bn-panel);
}
html.RudraNext :is(.Whitepaper__railLinks > a, .Security__railLinks > a, .Roadmap__railLinks > a,
  .LegalDoc__railLinks > a, .LegalDoc__railLibrary > a, .Whitepaper__rail > .Whitepaper__railTokenomics,
  .Security__rail > .Security__railReport, .Roadmap__rail > .Roadmap__whitepaperLink):hover {
  background: var(--bn-panel);
  box-shadow: inset 0 0 0 1px var(--bn-line-strong);
}
html.RudraNext :is(.Generic__content, .Whitepaper__documentBody, .Security__documentBody) { color: var(--bn-ink); line-height: 1.7; }
html.RudraNext :is(.Tokenomics__hero, .Roadmap__hero) {
  background: var(--bn-panel);
}
html.RudraNext :is(.Tokenomics__hero h1, .Roadmap__hero h1) { color: var(--rn-ink); letter-spacing: -.04em; }
/* Tokenomics__configDesktop/Mobile are panels nested in a 14px card; they keep their own 10px from Tokenomics.scss. */
html.RudraNext :is(.Roadmap__document, .RudraSignup__card, .island:has(> .Generic__content)) {
  border: 1px solid var(--rn-line);
  border-radius: 14px;
  box-shadow: var(--rn-shadow);
}
/* The utility cards are panels nested in the 14px Utility section card too: 10px, no resting shadow (the hover lift
   from Tokenomics.scss stays). */
html.RudraNext .Tokenomics__utilityCard { border: 1px solid var(--rn-line); border-radius: 10px; }
html.RudraNext :is(.Roadmap__documentBody, .Generic__content) { color: var(--bn-ink); line-height: 1.7; }
html.RudraNext .Generic__content { padding: 28px 32px; font-size: 16px; }
html.RudraNext .Generic__content h3 { color: var(--rn-ink); margin-top: 28px; font-weight: var(--rx-fw-medium); }
html.RudraNext .island:has(> .Generic__content) > .island__header { background: var(--bn-bg); color: var(--rn-ink); }
html.RudraNext .RudraSignup__rail { background: linear-gradient(145deg, #10343f, #155765); }
html.RudraNext .RudraSignup__primary { background: #28798f; border-radius: 8px; }
html.RudraNext .RudraSignup__primary:hover:not(:disabled) { background: var(--rn-teal); }
html.RudraNext .Footer { background: var(--bn-panel); border-top: 1px solid var(--rn-line); }
html.RudraNext .Footer :is(a, .Footer_menu_title) { color: var(--bn-ink-2); }
html.RudraNext .Footer a:hover { color: var(--rn-teal); text-decoration: underline; }

.RudraDesignNote {
  background: var(--bn-chip, #ededed);
  color: var(--bn-ink, #000);
  border-bottom: 1px solid var(--bn-line-strong, #ddd);
  padding: 7px 22px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font: 12px/1.35 var(--rx-font, sans-serif);
  letter-spacing: .025em;
}
.RudraDesignNote strong { color: var(--bn-ink, #000); letter-spacing: .1em; font-size: 10px; }
.RudraDesignNote a { color: var(--rn-teal, #176d7e); text-decoration: underline; }

@media (min-width: 1200px) {
  html.RudraNext :is(.ExchangePro__grid) { grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; }
  html.RudraNext .ExchangePro__main, html.RudraNext .ExchangePro__rail { gap: 20px; }
  html.RudraNext .ExchangePro .OfferMakers_maker { padding: 20px 24px 24px; }
  html.RudraNext .ExchangePro .ExchangeOfferMakerSection .ExchangePro__sectionHeader { padding-left: 24px; padding-right: 24px; }
  html.RudraNext .RudraAssetTable__row { min-height: 78px; }
  html.RudraNext .MarketsPage--claude .MarketsSectionHeader { padding: 20px 24px; }
}
@media (max-width: 1199px) and (min-width: 701px) {
  html.RudraNext .Swap_stage { grid-template-columns: minmax(0, 524px); }
  html.RudraNext .Swap_guide { display: none; }
}
@media (max-width: 1100px) {
  html.RudraNext .ExchangePro__grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}
@media (max-width: 700px) {
  html.RudraNext .Header_main .Header_background .Header { padding: 12px 14px; }
  html.RudraNext .Header_main .Header_background .Header:has(.Header_login) { position: relative; gap: 0; }
  html.RudraNext .Header_main .Header_background .Header:has(.Header_login) .Header_nav {
    align-items: stretch;
    gap: 8px;
  }
  html.RudraNext .Header_main .Header_background .Header:has(.Header_login) .Nav_logo {
    justify-content: flex-start;
    width: 48px;
    height: 44px;
  }
  html.RudraNext .Header_main .Header_background .Header:has(.Header_login) .Header_login {
    position: absolute;
    top: 12px;
    right: 14px;
    width: auto;
    max-width: calc(100% - 90px);
  }
  html.RudraNext .Header_main .Header_background .Header .Header_nav .Nav_link {
    border-radius: 8px;
    border-color: transparent;
    background: transparent;
    padding: 0 10px;
    font-size: 12px;
  }
  html.RudraNext .Header_main .Header_background .Header .Header_nav .Nav_link.is-current {
    background: #ffffff10;
    box-shadow: inset 0 -2px var(--rn-cyan);
  }
  html.RudraNext .Header_main .Header_nav .Nav_link { padding: 10px 9px; margin-right: 0; font-size: 12px; border-radius: 7px; }
  html.RudraNext .Header_main .Header_nav .Nav_pages { gap: 4px; }
  html.RudraNext .Header_login-button { padding: 11px 16px; }
  html.RudraNext .ExplorerPage--claude { padding: 26px 14px 40px; }
  /* The Assets screener runs full-bleed on phones like the same component on Home (its sections drop their side
     borders below 600px); the inset above stays for the loading skeleton. */
  html.RudraNext .ExplorerPage--claude.RudraExplorerScreener { padding: 0; }
  html.RudraNext .ExplorerSearch { padding: 18px 16px; }
  html.RudraNext .ExplorerSearch__field { min-height: 48px; }
  html.RudraNext .ExplorerHero h1 { font-size: 32px; }
  html.RudraNext .ExplorerHero > p { font-size: 14px; }
  html.RudraNext .ExplorerAssetCard { padding: 14px; }
  html.RudraNext .ExplorerSpotlight { padding: 14px; }
  html.RudraNext .ExchangePro { padding-top: 16px; }
  html.RudraNext .ExchangePro__grid { grid-template-columns: minmax(0, 1fr); }
  html.RudraNext .ExchangePro .ExchangePairPickerSection .island { padding: 20px; }
  html.RudraNext .ExchangePro__chartToolbar { padding: 12px; }
  html.RudraNext .ExchangePro__chartTypes button { padding: 8px 10px; gap: 6px; }
  html.RudraNext .ExchangePro__chartTypes button span { display: inline; }
  html.RudraNext .ExchangePro .OfferMakers_maker { padding: 16px; }
  html.RudraNext .ExchangePro .OfferMaker_table input { min-height: 42px; font-size: 16px; }
  html.RudraNext .Swap_stage { padding: 24px 14px 48px; }
  html.RudraNext .Swap_container { padding: 23px 18px; width: 100%; max-width: 524px; }
  html.RudraNext .Swap_title { font-size: 27px; }
  html.RudraNext .Swap_amountCard { padding: 17px 14px; }
  html.RudraNext .Swap_amountRow input { font-size: 27px; }
  html.RudraNext .Swap_assetSelector { padding: 8px; }
  html.RudraNext .Swap_assetIdentityCode { font-size: 16px; }
  html.RudraNext .Swap_quoteSummary { font-size: 12px; }
  html.RudraNext .RudraAccountLogin { padding: 24px 14px 40px; }
  html.RudraNext .Generic__content { padding: 20px 18px; font-size: 15px; }
  .RudraDesignNote { padding: 7px 14px; font-size: 10px; }
  .RudraDesignNote > span { max-width: 60%; text-align: right; }
}
html.RudraNext .DownloadBack {
  background: var(--rn-bg);
  color: var(--rn-ink);
}
html.RudraNext .DownloadBack .Desktop_centered { max-width: 1120px; margin: 0 auto; padding: 52px 24px; text-align: center; }
/* The document-hero title scale (58 / 44 / 34px, 600, -.04em) shared with Security, Roadmap and the policy pages. */
html.RudraNext .DownloadBack .desktop_title {
  margin: 0 0 16px;
  font-size: clamp(44px, 4.1vw, 58px);
  font-weight: var(--rx-fw-semibold);
  letter-spacing: -.04em;
  text-wrap: balance;
}
html.RudraNext .DownloadBack .desktop_subtitle { max-width: 640px; line-height: 1.45; font-size: 19px; font-weight: var(--rx-fw-regular); }
/* The site primary button: #28798f, hover #176d7e, semibold, flat, and the 52px auth-group CTA height. :active is covered too, so the
   StellarTerm green press state in Download.scss never shows. */
html.RudraNext .DownloadBack .download_link {
  min-height: 52px;
  padding-top: 0;
  padding-bottom: 0;
  border-radius: 12px;
  background: #28798f;
  border-color: #28798f;
  font-weight: var(--rx-fw-semibold);
  box-shadow: none;
}
html.RudraNext .DownloadBack .download_link:is(:hover, :active) { background: var(--rn-teal); border-color: var(--rn-teal); }
html.RudraNext .DownloadBack .Desktop_description {
  margin: 40px 0 12px;
  padding: 28px;
  background: var(--bn-panel);
  border: 1px solid var(--rn-line);
  border-radius: 14px;
  box-shadow: var(--rn-shadow);
  text-align: left;
  gap: 16px;
}
html.RudraNext .DownloadBack .description-text { font-weight: var(--rx-fw-regular); line-height: 1.6; }
@media (max-width: 700px) {
  html.RudraNext .DownloadBack { padding: 0; }
  html.RudraNext .DownloadBack .Desktop_centered { padding: 36px 20px; }
  html.RudraNext .DownloadBack .desktop_title { font-size: 34px; }
  html.RudraNext .DownloadBack .Desktop_description { padding: 22px; }
}
/* 390-413: "Rudra For Your Desktop" was 364px of Inter at 34px/-.04em, 2px more than the 362px column at 390 (Figtree: 335px,
   Roboto: 330px, so it fits either way). The centered title may use 2px of each side inset, so it stays one line; the rest of the page keeps its inset. */
@media (min-width: 390px) and (max-width: 413px) {
  html.RudraNext .DownloadBack .desktop_title { margin-left: -2px; margin-right: -2px; }
}
@media (prefers-reduced-motion: reduce) {
  html.RudraNext *, html.RudraNext *::before, html.RudraNext *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
@media (forced-colors: active) {
  html.RudraNext :is(.Swap_container, .ExplorerSearch, .ExchangePairPickerSection > .island, .RudraHomeHero__market, .RudraAccountLogin__card)::before { display: none; }
}
@media print { .RudraDesignNote { display: none; } }

/* ---------------------------------------------------------------------------
   Exchange terminal, 2026-09-20 pixel pass.

   1. The toolbar's two groups need more width than the chart column offers
      between 1360 and roughly 1536px, so space-between dropped the right group
      onto a second line at the LEFT edge, reading as a wrap accident rather
      than a layout. Keep it on the right when it wraps, and give the wrap a
      tighter row gap so it costs the chart less height.
   2. One secondary-control size on the desktop terminal. The chart-type,
      interval, scale, order-book and order-type strips were each sized by
      their own padding, so controls standing side by side landed on six
      heights (20.5 / 24 / 25.5 / 26.5 / 28 / 30px) and three type sizes
      (12 / 12.5 / 13px). One 28px track, one 22px button inside it, one
      12px size (--rx-fs-1, 2026-10-15; was 12.5px). Below 1101px the terminal has its own tablet and coarse
      pointer rules with 44px targets, so this leaves those widths alone.
      2026-09-23: a mouse-driven window 641-1100px wide matched neither set
      (24 / 26 / 27 / 30px), so fine-pointer tablet widths share this system.
   --------------------------------------------------------------------------- */
html.RudraNext .ExchangePro__chartToolbarRight { margin-left: auto; }
html.RudraNext .ExchangePro__chartToolbar { row-gap: 8px; }

@media (min-width: 1101px), (min-width: 641px) and (pointer: fine) {
  html.RudraNext .ExchangePro--terminal { --term-ctl: 28px; }
  html.RudraNext .ExchangePro--terminal .ExchangePro__segmented,
  html.RudraNext .ExchangePro--terminal .ExchangePro__bookTabs,
  html.RudraNext .ExchangePro--terminal .ExchangeOfferMakerSection .OfferMaker_orderType { padding: 2px; }
  html.RudraNext .ExchangePro--terminal .ExchangePro__segmented button,
  html.RudraNext .ExchangePro--terminal .ExchangePro__bookTabs button,
  html.RudraNext .ExchangePro--terminal .ExchangeOfferMakerSection .OfferMaker_orderType button {
    font-size: var(--rx-fs-1);
    height: calc(var(--term-ctl) - 6px);
    min-height: 0;
    padding-bottom: 0;
    padding-top: 0;
  }
  html.RudraNext .ExchangePro--terminal .ExchangePro__timeframes button,
  html.RudraNext .ExchangePro--terminal .ExchangePro__chartToolbarRight > button {
    font-size: var(--rx-fs-1);
    height: var(--term-ctl);
    min-height: 0;
    padding-bottom: 0;
    padding-top: 0;
  }
  html.RudraNext .ExchangePro--terminal .ExchangePro__chartToolbarRight > button {
    border-radius: 6px;
    padding-left: 9px;
    padding-right: 9px;
  }
  html.RudraNext .ExchangePro--terminal .fullscreen_Block .actionBtn,
  html.RudraNext .ExchangePro--terminal .fullscreen_Block .actionBtn .ExchangePro__iconButton {
    height: var(--term-ctl);
    width: var(--term-ctl);
  }
}

/* ------------------------------------------------------------------------------------------------
   Site-wide component pass, 2026-09-23. One corner scale across every page, the same one the
   Exchange uses: 14px cards · 10px panels nested inside a card · 8px controls (buttons, fields,
   selectors, icon tiles) · 6px chips and segments inside a control. Measured values it replaces
   are noted per group.
------------------------------------------------------------------------------------------------ */
/* Header (9px desktop / 10px mobile) */
html.RudraNext .Header_login .Header_login-button { border-radius: 8px; }

/* Home + Assets screener (3/4/5px) */
html.RudraNext .RudraScreener .RudraScreener__pill,
html.RudraNext .RudraScreener .RudraScreener__tileRank,
html.RudraNext .RudraScreener__chips .RudraScreener__chipGroup > button,
html.RudraNext .RudraScreener__chips > .RudraScreener__allChip { border-radius: 6px; }
/* The dApp CTA is a standalone button, not a chip inside a control. */
html.RudraNext .RudraScreener .RudraScreener__dappCta { border-radius: 8px; }
html.RudraNext .RudraAssets__trust { border-radius: 8px; }
html.RudraNext .RudraScreener__tabs .RudraScreener__search > input { border-radius: 8px; }

/* Swap (9/10/12px) */
html.RudraNext .Swap_container .Swap_settings,
html.RudraNext .Swap_amountRow > .Swap_assetSelector,
html.RudraNext .Swap_form > .Swap_cta { border-radius: 8px; }
html.RudraNext .Swap_form > .Swap_amountCard { border-radius: 10px; }

/* Log in + Create account (9/12px) */
html.RudraNext .RudraAccountLogin__form > .RudraAccountLogin__tabs,
html.RudraNext .RudraSignup__form > .RudraSignup__tabs,
html.RudraNext .RudraAccountLogin__keyPanel > .RudraAccountLogin__accept,
html.RudraNext .RudraAccountLogin__accept > .RudraAccountLogin__acceptTarget,
html.RudraNext .RudraSignup__steps > .RudraSignup__step { border-radius: 10px; }
html.RudraNext .RudraAccountLogin__form > .RudraAccountLogin__tabs > button,
html.RudraNext .RudraSignup__form > .RudraSignup__tabs > button,
html.RudraNext .RudraAccountLogin__inputWrap > button { border-radius: 6px; }
html.RudraNext .RudraAccountLogin__inputWrap > input,
html.RudraNext .RudraAccountLogin__keyPanel > .RudraAccountLogin__submit,
html.RudraNext .RudraSignup__introPanel > .RudraSignup__primary,
html.RudraNext .RudraAccountLogin__securityRow > .RudraAccountLogin__securityIcon,
html.RudraNext .RudraSignup__perk > .RudraSignup__perkIcon { border-radius: 8px; }

/* Security + Roadmap (9/10/11/12/18px) */
html.RudraNext .Security__custodyCardWrap > .Security__custodyCard,
html.RudraNext .Roadmap__statusCardWrap > .Roadmap__statusCard,
html.RudraNext nav.Security__rail,
html.RudraNext nav.Roadmap__rail { border-radius: 14px; }
html.RudraNext .Security__evidenceGrid > .Security__evidenceCard,
html.RudraNext .Security__relatedGrid > .Security__relatedLink { border-radius: 10px; }
html.RudraNext .Security__heroActions > .Security__button,
html.RudraNext .Security__railLinks > a,
html.RudraNext .Roadmap__railLinks > a,
html.RudraNext .Security__rail > .Security__railReport,
html.RudraNext .Roadmap__rail > .Roadmap__whitepaperLink,
html.RudraNext .Security__documentFooter > a,
html.RudraNext .Roadmap__documentFooter > a,
html.RudraNext .Security__pillar > .Security__pillarIcon,
html.RudraNext .Security__relatedLink > .Security__relatedIcon,
html.RudraNext .Roadmap__stageSummaryLink > .Roadmap__stageSummaryIcon,
html.RudraNext .Roadmap__sectionHeader .Roadmap__sectionIcon { border-radius: 8px; }

/* Download + Buy XLM (3/10/12/16px) */
html.RudraNext .s-button, html.RudraNext .s-button:link,
html.RudraNext .Desktop_centered > .s-button.download_link { border-radius: 8px; }
html.RudraNext .DownloadBack .Desktop_description,
html.RudraNext section.Widget_Unavailable { border-radius: 14px; }
/* Legal and info cards: the tinted title bar nests inside the 14px card and its 1px border (was 3px at desktop). */
html.RudraNext .island:has(> .Generic__content) > .island__header { border-radius: 13px 13px 0 0; }

/* Swap token picker rows use the Exchange token picker type: 15px code (the Swap form selectors keep 17/16px). */
html.RudraNext .Swap_pickerRow .Swap_assetIdentityCode { font-size: 15px; }

/* Mouse-driven tablet widths (641-1100px, fine pointer) take the desktop order-form sizes too:
   42px fields, 28px percent chips, 44px submit (they measured 40 / 27 / 42px). Touch tablets keep their 44px rules. */
@media (min-width: 641px) and (max-width: 1100px) and (pointer: fine) {
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__trade .OfferMaker_table .offer_table_row--price .offer_input_group input,
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__trade .OfferMaker_table .offer_table_row--amount .offer_input_group input,
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__trade .OfferMaker_table .offer_table_row--market-input .offer_input_group input,
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__trade .OfferMaker_table .offer_table_row--market .offer_input_group .offer_input_fake,
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__trade .OfferMaker_table .offer_table_row--market-estimate:not(:last-child) .offer_input_group .offer_input_fake { height: 42px; }
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__trade .OfferMaker_table .offer_table_percent_row .offer_table_buttons button { height: 28px; }
  html.RudraNext .ExchangePro--terminal .ExchangeTerminal__trade .ExchangeOfferMakerSection .offer_button { height: 44px; }
}

/* ------------------------------------------------------------------------------------------------
   Type pass, 2026-09-30.
   1. Body text inherited weight 300 from the StellarTerm base, so any text without its own weight
      (homepage and Assets table rows, card subtitles, rank badges) rendered light at 12-17px. Body
      copy is regular weight across the whole site.
   2. The ten document pages used five title sizes for the same role (52 / 56 / 58 / 58 / 60px at
      1440). One scale: fluid up to 58px on desktop, 44px on tablets, 34px on phones.
------------------------------------------------------------------------------------------------ */
html.RudraNext body { font-weight: var(--rx-fw-regular); }

html.RudraNext :is(.Security__hero, .Roadmap__hero, .Whitepaper__hero, .Tokenomics__hero, .LegalDoc__hero) h1 {
  font-size: clamp(44px, 4.1vw, 58px);
}
@media (max-width: 999px) {
  html.RudraNext :is(.Security__hero, .Roadmap__hero, .Whitepaper__hero, .Tokenomics__hero, .LegalDoc__hero) h1 {
    font-size: 44px;
  }
}
@media (max-width: 619px) {
  html.RudraNext :is(.Security__hero, .Roadmap__hero, .Whitepaper__hero, .Tokenomics__hero, .LegalDoc__hero) h1 {
    font-size: 34px;
  }
}

/* ------------------------------------------------------------------------------------------------
   Laser beam, 2026-09-30 (owner request). The one-pass arrival beam on the Swap, Exchange pair,
   Assets search and login cards now keeps sweeping their top edge, and the same beam runs along the
   bottom of the header on every page. The beam is a gradient moved with background-position inside
   a clipped 2px strip, so it never leaves its edge, never covers data and costs no layout. It is
   hidden under reduced motion (the global rule above stops it) and in forced-colors mode.
------------------------------------------------------------------------------------------------ */
html.RudraNext :is(.Swap_container, .ExplorerSearch, .ExchangePairPickerSection > .island, .RudraHomeHero__market, .RudraAccountLogin__card)::before {
  left: 14px;
  width: calc(100% - 28px);
  border-radius: 2px;
  background: linear-gradient(90deg, transparent, #30b7cf, #c9ffff, #30b7cf, transparent) no-repeat;
  background-size: 34% 100%;
  background-position: -60% 0;
  box-shadow: none;
  filter: drop-shadow(0 1px 4px #46cbd380);
  transform: none;
  animation: rudraBeamSweep 7s cubic-bezier(.45, 0, .25, 1) .3s infinite;
}
#rudra_header .Header_background { position: relative; }
#rudra_header .Header_background::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, #30b7cf, #c9ffff, #30b7cf, transparent) no-repeat;
  background-size: 22% 100%;
  background-position: -40% 0;
  filter: drop-shadow(0 0 4px #46cbd3aa);
  animation: rudraBeamSweep 9s cubic-bezier(.45, 0, .25, 1) 1.2s infinite;
}
/* The account "Copied" popup hangs across the header's bottom edge on desktop; keep it above the beam. */
#rudra_header .Header_account-info .CopyButton__popup { z-index: 2; }
@keyframes rudraBeamSweep {
  0% { background-position: -60% 0; opacity: 0; }
  6% { opacity: 1; }
  38% { opacity: 1; }
  44% { background-position: 160% 0; opacity: 0; }
  100% { background-position: 160% 0; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  #rudra_header .Header_background::after { display: none; }
}
@media (forced-colors: active) {
  #rudra_header .Header_background::after { display: none; }
}
@media (max-width: 640px) {
  html.RudraNext .ExchangePro .ExchangeOfferMakerSection .ExchangePro__sectionHeader { padding-left: 14px; padding-right: 14px; }
}

/* ------------------------------------------------------------------------------------------------
   Account pages type scale, 2026-10-05 (owner: "upgrade its ui and fonts size so both mobile and
   desktop users will have best experience"). Balances, Send, Accept assets, Activity and Pending
   payments carried most of their supporting text at 12-12.5px and helper copy at 13.5px, measured
   signed in. One scale for all five: labels and meta 13px, helper and body copy 14px/1.5, values
   keep their sizes, nothing below 12px, and inputs at 16px on phones so iOS does not zoom on focus.
   2026-10-15 type pass: snapped to the --rx-fs scale (13px and 12.5px -> fs-1 12px, 13.5px -> fs-2 14px).
------------------------------------------------------------------------------------------------ */
html.RudraNext :is(
  .RudraBalances__eyebrow, .RudraBalances__totalValue > span, .RudraBalances__tableHeader > button > span,
  .RudraBalances__tableHeader > span, .RudraBalances__accountId > button > span,
  .RudraSend__eyebrow, .RudraSend__labelRow > span, .RudraSend__labelRow > span > strong, .RudraSend__fieldNote > span,
  .RudraSend__securityNote > span, .RudraSend__summaryRows > div > span, .RudraSend__amountActions > button,
  .RudraSend__steps > li > span > b,
  .RudraAcceptAssets__stats > span, .RudraAcceptAssets__manualField > label > span, .RudraAcceptAssets__manualField > span,
  .RudraAcceptAssets__preview > p > span, .RudraAcceptAssets__previewCosts > span > i, .RudraAcceptAssets__previewIdentity > div > span,
  .RudraAcceptAssets__previewLabel, .RudraAcceptAssets__availableName > span, .RudraAcceptAssets__acceptedAction > button > span,
  .RudraAcceptAssets__availableAction > button > span,
  .RudraActivityPage__stat, .RudraPendingPayments__status, .RudraPendingPayments__usd
) { font-size: var(--rx-fs-1); }
/* Issuers and pending-payment meta left the list above (its `.RudraSend__steps > li > span > b` entry gives it
   (0,2,4) specificity, which pinned these over their own rules and clipped issuers at 768). */
html.RudraNext :is(.RudraBalances__issuer, .RudraAcceptAssets__issuerShort, .RudraAcceptAssets__issuerFull,
  .RudraPendingPayments__meta > div > strong) { font-size: var(--rx-fs-1); font-variant-numeric: proportional-nums; }
html.RudraNext .RudraPendingPayments__meta > div > span { font-size: var(--rx-fs-1); }

html.RudraNext :is(
  .RudraBalances__accountHelp, .RudraBalances__balanceHeader > div > p, .RudraBalances__supportingCopy,
  .RudraBalances__warning > span, .RudraBalances__zeroToggle > span,
  .RudraAcceptAssets__sectionHeader > div > p, .RudraActivityPage__toolbar > div > p, .RudraActivityPage__empty > p,
  .RudraBalances__pendingMessage p, .RudraBalances__federationMessage, .RudraBalances__money > p,
  .RudraBalances__reserveCopy p
) { font-size: var(--rx-fs-2); line-height: 1.5; }

html.RudraNext :is(.RudraBalances__assetName > span, .RudraBalances__change, .RudraBalances__assetCount,
  .RudraSend__summaryRows > div > strong, .RudraSend .AssetCardSeparateLogo_domain) { font-size: var(--rx-fs-2); }

/* Count chips and logo initials: compact by design, but never under 12px. */
html.RudraNext :is(.RudraBalances__pendingCount, .RudraActivityPage__tabCount, .RudraSend__steps > li > span > i,
  .RudraAcceptAssets__count) { font-size: var(--rx-fs-1); }
html.RudraNext :is(.RudraBalances__assetFallback, .RudraAcceptAssets__assetFallback, .RudraActivityAsset__fallback) { font-size: var(--rx-fs-1); }

/* Activity and Pending payments tables and phone cards: their uppercase field labels and date/footer meta were
   12-12.5px with .07em tracking; they now share the account label size and the caps tracking (--rx-fs-1, --rx-ls-caps). */
html.RudraNext .RudraActivityPage :is(
  .RudraActivityPage__tableHeader > span, .RudraActivityPage__detailGrid > div > span:first-child,
  .RudraActivityPage__mobileValues > div > span:first-child, .RudraPendingPayments__historyHeader > span,
  .RudraPendingPayments__historyCards > article > div > span:first-child
) { font-size: var(--rx-fs-1); letter-spacing: var(--rx-ls-caps); }
html.RudraNext .RudraActivityPage :is(
  .RudraActivityPage__mobileCards > article > header > span, .RudraPendingPayments__historyCards > article > header,
  .RudraActivityPage__footer, .RudraPendingPayments__historyCards > article > div > strong
) { font-size: var(--rx-fs-1); }

@media (max-width: 700px) {
  html.RudraNext :is(.RudraBalances, .RudraSend, .RudraAcceptAssets, .RudraActivityPage) :is(input:not([type=checkbox]):not([type=radio]), select, textarea) {
    font-size: 16px;
  }
}
/* Balances filter: 340px wide plus 54px padding pushed the field 32px past its row on phones. */
html.RudraNext .RudraBalances__search input { box-sizing: border-box; width: 100%; }
/* Balances filter icon sat under the input (the input is positioned and painted later). */
html.RudraNext .RudraBalances__search > span { z-index: 2; pointer-events: none; }
/* Phone balance cards: numbers wrap only where <wbr> allows (before the decimals), never mid-digit. */
html.RudraNext .RudraBalances__mobileValues strong { overflow-wrap: normal; word-break: normal; }

/* ------------------------------------------------------------------------------------------------
   Headings, 2026-10-15 (owner: "bold… good to the eye, easy to read"). The first type pass mapped the 24-25px section
   and page headings to 20px; they read small next to the bolder body. Back to 24px (sized with Inter; Roboto runs about
   6% narrower) at every width, as on live.
------------------------------------------------------------------------------------------------ */
html.RudraNext :is(.Tokenomics__notice h2, .Whitepaper__sectionHeading h2, .Roadmap__sectionHeader h2,
  .Security__sectionHeading h2, .LegalDoc__sectionHeading h2, .Widget_Unavailable h1, .notFound-container h2,
  .AssetCardMain__header__code) { font-size: var(--rx-fs-heading); }
/* Phone/tablet steps that had dropped to 20px: Tokenomics section titles below 620px, the Log in / Create account
   headlines below 900px. */
@media (max-width: 899px) {
  html.RudraNext :is(.RudraAccountLogin__railIntro h1, .RudraSignup__rail h1) { font-size: var(--rx-fs-heading); }
}
@media (max-width: 619px) {
  html.RudraNext .Tokenomics__sectionHeading h2 { font-size: var(--rx-fs-heading); }
}
/* Stellar account IDs and their shortened forms: Inter's capitals and figures were wider than the face these slots were
   sized for, so a hair of tracking keeps every character visible instead of ending the ID in an ellipsis. Roboto is
   narrower still (a 56-character ID at 12px: 414px vs Figtree's 436px and Inter's 453px), so the rule only adds room. */
html.RudraNext :is(.RudraPendingPayments__meta strong, .RudraAcceptAssets__issuerFull, .RudraAcceptAssets__issuerShort,
  .RudraActivityIdenticon + .RudraActivityPage__cellValue, .AssetCardMain__issuerAccountIdText,
  .PairPicker_metaIssuer) { letter-spacing: -.02em; }
/* The full 56-character issuer in the 448px Accept assets column at 768. */
html.RudraNext .RudraAcceptAssets__availableIdentity .RudraAcceptAssets__issuerFull { letter-spacing: -.025em; }
@media (max-width: 339px) {
  html.RudraNext .RudraAcceptAssets__acceptedItem { gap: 7px; }
}

/* ------------------------------------------------------------------------------------------------
   Roboto, 2026-10-17. Roboto's figures are narrower than Figtree's but some lowercase runs about 1-2% wider, so a few
   lines that only just fitted wrapped or ended in an ellipsis. Each keeps its size and wording and gets back the room it had.
------------------------------------------------------------------------------------------------ */
/* Security 'On this page' at 1440: "Transaction and market risk controls" stays one line in the 226px title column;
   3px of the row's right inset goes to the title. */
html.RudraNext .Security__railLinks > a { padding-right: 7px; }
/* Create account rail below 360px: the intro keeps four lines ("clicks." no longer drops to a line of its own) by
   using 2px of the rail's right inset. */
@media (max-width: 359px) {
  html.RudraNext .RudraSignup__railIntro { margin-right: -2px; }
}
/* Legal documents below 340px: list items take the same 2px of the 14px right gutter, so the privacy bullet on the
   saved session keeps its four lines ("clears them." no longer drops to a line of its own). */
@media (max-width: 339px) {
  html.RudraNext .LegalDoc__sectionBody li { margin-right: -2px; }
}
/* Assets table, 1024-1199: issuer domains under the token code keep the width they had in Figtree (stocks.kraken.com.bz
   at 1024 and stellar.spacexsi.exchange at 1101 stay whole); longer domains still end in an ellipsis, as before. */
@media (min-width: 1024px) and (max-width: 1199px) {
  html.RudraNext .RudraAssets__table td .RudraScreener__name small { letter-spacing: -0.02em; }
}

/* ------------------------------------------------------------------------------------------------
   Glass depth, 2026-10-18. Owner: the flat UI "looks old school… same color but like 3d, not exactly 3d but
   modern"; shown flat / soft depth / glass depth previews he chose "glass depth will look good". Every colour
   token, the palette (--bn-*, the teal, up/down), Roboto, every size, layout and wording stay as they are; this
   section only adds depth: a soft teal/cyan glow on the page, frosted panels on three elevation tokens, lifted
   primary buttons, inset fields, a glassy header, raised active chips and elevated dialogs.
   Performance: backdrop-filter runs only on the sticky header and the centred dialogs (large, fixed surfaces);
   rows, lists, repeated cards, chips and sheets get flat translucent white plus an inset highlight (one paint,
   no per-frame filter). The glow is one fixed layer, so scrolling composites it instead of repainting.
   prefers-reduced-transparency: opaque panels, no glow, no blur. prefers-reduced-motion: the global rule above
   already stops the lift/press transitions. forced-colors: shadows and glows drop out on their own.
   Contrast, worst case (computed in ~/.rudra-claude-work/speed2/glass/contrast.mjs): on a .86 white panel over
   the glow peak (#fafbfc) ink-2 5.56, teal 5.77, up/down 5.46, #28798f-as-text 4.81, focus ring 4.55; text
   straight on the page at the strongest glow overlap (#dfebed) ink-2 4.72, teal 4.90, up/down 4.64; dialogs at
   .94 white over a black backdrop (#f0f0f0) ink-2 5.02, teal 5.21, down 4.94; the header gradient at .92 over
   white content: nav #d8e9eb 4.85 on the lightest stop, white 6.08; every button gradient runs from the token
   colour (white 4.97 / 5.64 / 5.64) to a darker stop of the same hue, never lighter. All pass AA.
------------------------------------------------------------------------------------------------ */
html.RudraNext {
  /* Page glow (teal brand and the header cyan, 9% and 7%: the strongest the page can carry with ink-2 still AA). */
  --rx-glow-a: rgba(53, 137, 161, .09);
  --rx-glow-b: rgba(104, 232, 239, .07);
  --rx-glow-c: rgba(53, 137, 161, .05);
  /* Frosted surfaces: panels .9, dialogs and sheets .94, a fine translucent ink-teal border, a 1px light inner top edge. */
  --rx-glass: rgba(255, 255, 255, .9);
  --rx-glass-strong: rgba(255, 255, 255, .94);
  --rx-glass-line: rgba(16, 57, 67, .09);
  --rx-glass-edge: inset 0 1px 0 rgba(255, 255, 255, .95);
  /* Elevation: 1 resting panels, 2 popovers and lifted hovers, 3 dialogs and sheets. Teal-black shadows, two layers each. */
  --rx-elev-1: 0 1px 2px rgba(16, 40, 48, .05), 0 16px 40px -18px rgba(16, 57, 67, .28);
  --rx-elev-2: 0 2px 6px rgba(16, 40, 48, .08), 0 24px 56px -20px rgba(16, 57, 67, .34);
  --rx-elev-3: 0 8px 20px rgba(16, 40, 48, .12), 0 36px 90px -24px rgba(16, 57, 67, .42);
  /* Active chip, slightly raised; field, softly inset. */
  --rx-raise: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(16, 40, 48, .1), 0 2px 5px -2px rgba(16, 57, 67, .18);
  --rx-inset: inset 0 1px 2px rgba(16, 40, 48, .07);
  /* Primary buttons: the token colour on top, 4% darker of the same hue at the bottom; hover takes the hover token the same way. */
  --rx-cta-teal: linear-gradient(180deg, #28798f, #246c7f);
  --rx-cta-teal-hover: linear-gradient(180deg, #176d7e, #145e6d);
  --rx-cta-up: linear-gradient(180deg, #017744, #016338);
  --rx-cta-up-hover: linear-gradient(180deg, #015f36, #01532f);
  --rx-cta-down: linear-gradient(180deg, #cc123e, #b91038);
  --rx-cta-down-hover: linear-gradient(180deg, #a80f33, #960e2e);
  --rx-cta-edge: inset 0 1px 0 rgba(255, 255, 255, .22);
  --rx-cta-press: inset 0 2px 4px rgba(0, 0, 0, .18);
  --rx-cta-shadow-teal: 0 6px 14px -6px rgba(31, 111, 132, .55);
  --rx-cta-shadow-teal-hover: 0 10px 20px -8px rgba(31, 111, 132, .6);
  --rx-cta-shadow-up: 0 6px 14px -6px rgba(1, 106, 60, .5);
  --rx-cta-shadow-up-hover: 0 10px 20px -8px rgba(1, 106, 60, .55);
  --rx-cta-shadow-down: 0 6px 14px -6px rgba(204, 18, 62, .45);
  --rx-cta-shadow-down-hover: 0 10px 20px -8px rgba(204, 18, 62, .5);
  --rx-cta-motion: transform var(--rx-dur-1) var(--rx-ease), box-shadow var(--rx-dur-2) var(--rx-ease), background-color var(--rx-dur-1) var(--rx-ease);
  /* Panels now rest on elevation 1 (they were flat), and popovers on elevation 2; every rule reading these tokens follows. */
  --rn-shadow: var(--rx-glass-edge), var(--rx-elev-1);
  --bn-shadow-pop: var(--rx-elev-2);
  /* The page grey lives on the root; the body is clear so its fixed glow layer shows between the panels. */
  background: var(--rn-bg);
}
html.RudraNext body { background: transparent; }
html.RudraNext body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  min-height: 100lvh;
  pointer-events: none;
  background:
    radial-gradient(900px 520px at 8% -6%, var(--rx-glow-a), rgba(53, 137, 161, 0) 70%),
    radial-gradient(760px 480px at 96% 18%, var(--rx-glow-b), rgba(104, 232, 239, 0) 70%),
    radial-gradient(640px 400px at 50% 112%, var(--rx-glow-c), rgba(53, 137, 161, 0) 70%);
}
/* Page roots painted the same grey as the body; clear, so the glow shows between their panels (nested panels keep their tints). */
html.RudraNext :is(.ExchangePro, .ExplorerPage--claude, .MarketsPage--claude, .RudraBalances, .RudraAccountLogin,
  .Tokenomics, .Whitepaper, .Roadmap, .Security, .LegalDoc, .RudraSignup, .RudraSend, .RudraActivityPage, .RudraAcceptAssets,
  .Swap_stage, .RudraHomeHero, .RudraScreener, .DownloadBack) { background: transparent; }

/* Panels: frosted white, the translucent edge, the inner top highlight and elevation 1. */
html.RudraNext :is(.ExplorerCard, .ExplorerAssetCard, .ExplorerSpotlight, .MarketsPage--claude .MarketsCard,
  .ExchangePro .island, .RudraBalances__card, .RudraAccountLogin__card, .Swap_container,
  .RudraBalances__pending, .RudraSend__card, .RudraAcceptAssets__card, .RudraActivityPage__panel,
  .Whitepaper__document, .Security__document, .LegalDoc__document, .Roadmap__document, .RudraSignup__card,
  .island:has(> .Generic__content), .DownloadBack .Desktop_description, .RudraHomeHero__market,
  .RudraScreener__stats, .RudraScreener__featuredRow, .RudraScreener__dapps, .RudraScreener__board) {
  background-color: var(--rx-glass);
  border-color: var(--rx-glass-line);
  box-shadow: var(--rx-glass-edge), var(--rx-elev-1);
}
html.RudraNext .ExchangePro .ExchangePairPickerSection .island { background-color: var(--rx-glass); border-top-color: var(--rx-glass-line); }
html.RudraNext .RudraScreener { --scr-card-shadow: var(--rn-shadow); --scr-card-line: var(--rx-glass-line); }
/* Headers and toolbars inside a panel share its surface instead of painting their own opaque white over it. */
html.RudraNext :is(.ExchangePro__chartToolbar, .ExchangePro__sectionHeader) { background: transparent; }
html.RudraNext :is(.ExplorerAssetCard, .ExplorerSpotlight):hover {
  border-color: var(--rx-glass-line);
  box-shadow: var(--rx-glass-edge), var(--rx-elev-2);
}
/* The four document rails keep their grey tint (their rows are white tiles); they take elevation 1 through --rn-shadow. */

/* Primary buttons: same-hue gradient, inner top highlight, coloured shadow, a 1px lift on hover, a press state. */
html.RudraNext :is(.Swap_cta, .RudraSignup__primary, .DownloadBack .download_link, .s-button, .s-button:link,
  .ManageOffers__login, .Security__button--primary, .Whitepaper__button--primary, .Tokenomics__button--primary,
  .RudraAccountLogin__submit, .RudraPendingPayments__claimAll, .RudraPendingPayments__claimButton,
  .RudraSend__next, .RudraSend__primaryAction, .RudraSignup__keyActions > .is-primary,
  .RudraWalletTerms__actions .is-primary, .LoginPage__body .LoginPage__button) {
  background-image: var(--rx-cta-teal);
  box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-teal);
  transition: var(--rx-cta-motion);
}
html.RudraNext .RudraHomeHero__primary { background-image: var(--rx-cta-teal-hover); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-teal); transition: var(--rx-cta-motion); }
@media (hover: hover) {
  html.RudraNext :is(.Swap_cta, .RudraSignup__primary, .DownloadBack .download_link, .s-button, .s-button:link,
    .ManageOffers__login, .Security__button--primary, .Whitepaper__button--primary, .Tokenomics__button--primary,
    .RudraAccountLogin__submit, .RudraPendingPayments__claimAll, .RudraPendingPayments__claimButton,
    .RudraSend__next, .RudraSend__primaryAction, .RudraSignup__keyActions > .is-primary,
    .RudraWalletTerms__actions .is-primary, .LoginPage__body .LoginPage__button):not(:disabled, [aria-disabled='true']):hover {
    background-image: var(--rx-cta-teal-hover);
    box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-teal-hover);
    transform: translateY(-1px);
  }
  html.RudraNext .RudraHomeHero__primary:not(:disabled):hover { box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-teal-hover); transform: translateY(-1px); }
}
html.RudraNext :is(.Swap_cta, .RudraSignup__primary, .DownloadBack .download_link, .s-button, .s-button:link,
  .ManageOffers__login, .Security__button--primary, .Whitepaper__button--primary, .Tokenomics__button--primary,
  .RudraAccountLogin__submit, .RudraPendingPayments__claimAll, .RudraPendingPayments__claimButton,
  .RudraSend__next, .RudraSend__primaryAction, .RudraSignup__keyActions > .is-primary,
  .RudraWalletTerms__actions .is-primary, .LoginPage__body .LoginPage__button,
  .RudraHomeHero__primary):not(:disabled, [aria-disabled='true']):active {
  background-image: var(--rx-cta-teal-hover);
  box-shadow: var(--rx-cta-press);
  transform: translateY(0);
}
/* Disabled keeps the flat grey the components already draw. */
html.RudraNext :is(.Swap_cta, .RudraSignup__primary, .DownloadBack .download_link, .s-button, .s-button:link,
  .ManageOffers__login, .Security__button--primary, .Whitepaper__button--primary, .Tokenomics__button--primary,
  .RudraAccountLogin__submit, .RudraPendingPayments__claimAll, .RudraPendingPayments__claimButton,
  .RudraSend__next, .RudraSend__primaryAction, .RudraSignup__keyActions > .is-primary,
  .RudraWalletTerms__actions .is-primary, .LoginPage__body .LoginPage__button,
  .RudraHomeHero__primary):is(:disabled, [aria-disabled='true']) {
  background-image: none;
  box-shadow: none;
  transform: none;
}
/* The three account-page CTAs whose buttons carry no class of their own (kept apart from the list above on purpose). */
html.RudraNext :is(.RudraAcceptAssets__availableAction > button, .RudraAcceptAssets__preview > button, .RudraBalances__federationActions > button) { background-image: var(--rx-cta-teal); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-teal); transition: var(--rx-cta-motion); }
@media (hover: hover) {
  html.RudraNext :is(.RudraAcceptAssets__availableAction > button, .RudraAcceptAssets__preview > button, .RudraBalances__federationActions > button):not(:disabled):hover { background-image: var(--rx-cta-teal-hover); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-teal-hover); transform: translateY(-1px); }
}
html.RudraNext :is(.RudraAcceptAssets__availableAction > button, .RudraAcceptAssets__preview > button, .RudraBalances__federationActions > button):not(:disabled):active { background-image: var(--rx-cta-teal-hover); box-shadow: var(--rx-cta-press); transform: translateY(0); }
html.RudraNext :is(.RudraAcceptAssets__availableAction > button, .RudraAcceptAssets__preview > button, .RudraBalances__federationActions > button):disabled { background-image: none; box-shadow: none; transform: none; }
/* Buy (green) and Sell (red): the order submit and the terminal's Buy | Sell tabs. */
html.RudraNext :is(.ExchangePro, .GlobalModal, .EditOfferModal) .offer_button.Buy:not(:disabled) { background-image: var(--rx-cta-up); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-up); transition: var(--rx-cta-motion); }
html.RudraNext :is(.ExchangePro, .GlobalModal, .EditOfferModal) .offer_button.Sell:not(:disabled) { background-image: var(--rx-cta-down); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-down); transition: var(--rx-cta-motion); }
@media (hover: hover) {
  html.RudraNext :is(.ExchangePro, .GlobalModal, .EditOfferModal) .offer_button.Buy:not(:disabled):hover { background-image: var(--rx-cta-up-hover); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-up-hover); transform: translateY(-1px); }
  html.RudraNext :is(.ExchangePro, .GlobalModal, .EditOfferModal) .offer_button.Sell:not(:disabled):hover { background-image: var(--rx-cta-down-hover); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-down-hover); transform: translateY(-1px); }
}
html.RudraNext :is(.ExchangePro, .GlobalModal, .EditOfferModal) .offer_button.Buy:not(:disabled):active { background-image: var(--rx-cta-up-hover); box-shadow: var(--rx-cta-press); transform: translateY(0); }
html.RudraNext :is(.ExchangePro, .GlobalModal, .EditOfferModal) .offer_button.Sell:not(:disabled):active { background-image: var(--rx-cta-down-hover); box-shadow: var(--rx-cta-press); transform: translateY(0); }
html.RudraNext .ExchangeTerminal__sideTabs button.is-buy[aria-selected='true'] { background-image: var(--rx-cta-up); box-shadow: var(--rx-cta-edge), 0 2px 6px -2px rgba(1, 106, 60, .45); }
html.RudraNext .ExchangeTerminal__sideTabs button.is-sell[aria-selected='true'] { background-image: var(--rx-cta-down); box-shadow: var(--rx-cta-edge), 0 2px 6px -2px rgba(204, 18, 62, .4); }
/* The phone Buy | Sell shortcut bar (shown below 768px; a fixed surface whose own solid white stays, the two buttons take the gradients). */
@media (max-width: 767px) {
  html.RudraNext .ExchangeTerminal__mobileBar .is-buy { background-image: var(--rx-cta-up); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-up); }
  html.RudraNext .ExchangeTerminal__mobileBar .is-sell { background-image: var(--rx-cta-down); box-shadow: var(--rx-cta-edge), var(--rx-cta-shadow-down); }
}

/* Fields: a soft inset at rest; every focus ring the components draw replaces it (the rules below only apply unfocused). */
html.RudraNext :where(input:not([type=checkbox], [type=radio], [type=range], [type=file], [type=submit], [type=button], [type=color], [type=hidden], :focus), textarea:not(:focus), select:not(:focus)) {
  box-shadow: var(--rx-inset);
}
html.RudraNext :is(.ExplorerSearch__field, .MarketsSearch__field, .Swap_amountCard, .RudraAccountLogin__inputWrap > input, .RudraSend__input,
  .ExchangePro .OfferMaker_table input, .ExchangePro .OfferMaker_table .offer_input_fake, .RudraScreener__tabs .RudraScreener__search > input):not(:focus, :focus-within, .is-focused, .is-invalid) {
  box-shadow: var(--rx-inset);
}
/* Borderless inputs composed inside a field keep no shadow of their own. */
html.RudraNext :is(.Swap_amountRow input, .ExplorerSearch__field input, .MarketsSearch__field input) { box-shadow: none; }

/* Header: the same dark teal gradient at 92%, with the page blurred behind it as it scrolls underneath. The blur
   sits on a pseudo-element behind the bar, so the bar itself stays an ordinary containing block. */
html.RudraNext .Header_main .Header_background {
  background: linear-gradient(110deg, rgba(12, 47, 56, .92), rgba(22, 82, 97, .92) 78%, rgba(23, 94, 106, .92));
}
#rudra_header .Header_background::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  -webkit-backdrop-filter: blur(12px) saturate(1.2);
  backdrop-filter: blur(12px) saturate(1.2);
}
html.RudraNext .Header_main { box-shadow: 0 8px 30px -22px #0d344b80, 0 1px 12px -6px rgba(13, 52, 75, .25); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html.RudraNext .Header_main .Header_background {
    background: linear-gradient(110deg, rgba(12, 47, 56, .97), rgba(22, 82, 97, .97) 78%, rgba(23, 94, 106, .97));
  }
}

/* Tabs, chips and segmented controls: the active one sits slightly raised (same chip colour). */
html.RudraNext :is(.ExchangePro__segmented button.active, .ExchangePro__timeframes button.active, .ExchangePro__bookTabs button.active,
  .ExchangePro .OfferMaker_orderType button.active, .ExchangePro .offer_table_buttons button.active,
  .RudraScreener__chipGroup > button[aria-pressed='true'], .RudraScreener__chips > .RudraScreener__allChip[aria-pressed='true'],
  .RudraAccountLogin__tabs > button.is-active, .RudraSignup__tabs > button.is-active,
  .ExplorerCategories button.is-active, .ExplorerViewToggle button.is-active, .ExplorerTimeTabs button.is-active,
  .RudraActivityPage__segments button.is-active, .RudraSend__steps span.is-active, .RudraBalances__zeroToggle.is-active,
  .Swap_settingsPanel button.is-active) {
  box-shadow: var(--rx-raise);
}

/* Dialogs: frosted at 94% with the page blurred behind, on elevation 3. The other dialog roots, the mobile trade sheet
   and popovers keep their own opaque surface and take the elevation only (no blur; without one, translucency over
   live rows only shows them through). */
html.RudraNext :is(.GlobalModal, .AccountLoginModal) {
  position: relative;
  isolation: isolate;
  background: var(--rx-glass-strong);
  border-color: rgba(255, 255, 255, .55);
  box-shadow: var(--rx-glass-edge), var(--rx-elev-3);
}
html.RudraNext :is(.GlobalModal, .AccountLoginModal)::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
  -webkit-backdrop-filter: blur(18px) saturate(1.3);
  backdrop-filter: blur(18px) saturate(1.3);
}
/* Inside the login dialog only the dialog carries elevation; its inner card stays flat, as on live. */
html.RudraNext .AccountLoginModal .RudraAccountLogin__card { box-shadow: none; }
/* Dialog roots GlobalModal.jsx renders straight inside the backdrop (not inside .GlobalModal): elevation 3 on their own
   opaque card; position and size stay theirs. */
html.RudraNext .GlobalModalBackdrop > :is(.SwapConfirm, .SwapSuccess, .SwapSavings, .SwapSettings, .EditOfferModal, .CancelOffersModal,
  .LoginModal, .ClaimableBalanceDetails, .ChooseTransferServer, .WalletConnectQRModal, .WalletConnectPairingModal,
  .WalletConnectRequestModal, .WalletConnectSessionRequestModal, .MultisigSubmitModal, .MultisigUnknownSubmitModal, .Sep6Modal,
  .Sep24Modal, .Sep7PayModal, .Sep7ChangeTrustModal, .Sep7ErrorModal, .BrowserModal, .SignChallengeWithMultisig,
  .MultisigEnableStep1, .MultisigEnableStep2, .MultisigEnableStep3, .MultisigDisableModal, .MultisigSetRequiredSigners) {
  box-shadow: var(--rx-glass-edge), var(--rx-elev-3);
}
/* The phone Buy/Sell sheet: opaque like its sticky head (one tone, nothing of the live book showing through). */
@media (max-width: 767px) {
  html.RudraNext .ExchangeTerminal:not(.is-fullscreen) .ExchangeTerminal__trade {
    background: var(--bn-panel);
    box-shadow: var(--rx-glass-edge), 0 -12px 32px rgba(0, 0, 0, .18), var(--rx-elev-3);
  }
}
/* The Swap settings block sits in the form's flow (it pushes FROM down), so it takes the resting-panel level. */
html.RudraNext .Swap_settingsPanel {
  background: var(--rx-glass-strong);
  box-shadow: var(--rx-glass-edge), var(--rx-elev-1);
}
html.RudraNext .RudraMarketOverview__metricHelp p {
  background: var(--rx-glass-strong);
  box-shadow: var(--rx-glass-edge), var(--rx-elev-2);
}

/* Reduced transparency: opaque surfaces, no glow, no blur; the elevation stays. */
@media (prefers-reduced-transparency: reduce) {
  html.RudraNext { --rx-glass: var(--bn-panel); --rx-glass-strong: var(--bn-panel); }
  html.RudraNext body { background: var(--rn-bg); }
  html.RudraNext body::before { display: none; }
  html.RudraNext .Header_main .Header_background { background: linear-gradient(110deg, #0c2f38, #165261 78%, #175e6a); }
  #rudra_header .Header_background::before, html.RudraNext :is(.GlobalModal, .AccountLoginModal)::before { display: none; }
  html.RudraNext :is(.GlobalModal, .AccountLoginModal) { border-color: var(--rn-line); }
}
@media (forced-colors: active) {
  html.RudraNext body::before, #rudra_header .Header_background::before, html.RudraNext :is(.GlobalModal, .AccountLoginModal)::before { display: none; }
}