.rx-markets {
--rx-hud-green: #40d98c;
--rx-hud-amber: #e8b93e;
--rx-hud-line: rgba(240, 133, 102, 0.22); max-width: 1200px;
margin: 0 auto;
padding: var(--rx-s-5) var(--rx-s-3) var(--rx-s-6);
}
.rx-mono {
font-family: ui-monospace, 'SF Mono', 'Cascadia Mono', Menlo, Consolas, monospace;
font-variant-numeric: tabular-nums;
letter-spacing: 0.04em;
} .rx-cockpit-panel {
position: relative;
border: 1px solid var(--rx-line);
border-radius: var(--rx-r-md);
background:
linear-gradient(rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.02)), repeating-linear-gradient(0deg,   transparent 0 31px, rgba(255, 255, 255, 0.025) 31px 32px),
repeating-linear-gradient(90deg,  transparent 0 31px, rgba(255, 255, 255, 0.025) 31px 32px),
var(--rx-surface-dark);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
padding: var(--rx-s-3);
padding-top: calc(var(--rx-s-3) + 14px);
} .rx-cockpit-panel::before,
.rx-cockpit-panel::after {
content: '';
position: absolute;
width: 22px;
height: 22px;
pointer-events: none;
}
.rx-cockpit-panel::before {
top: -1px;
left: -1px;
border-top: 2px solid var(--rx-orange);
border-left: 2px solid var(--rx-orange);
border-top-left-radius: var(--rx-r-md);
}
.rx-cockpit-panel::after {
bottom: -1px;
right: -1px;
border-bottom: 2px solid var(--rx-hud-line);
border-right: 2px solid var(--rx-hud-line);
border-bottom-right-radius: var(--rx-r-md);
}
.rx-cockpit-panel__tag {
position: absolute;
top: 0;
left: var(--rx-s-3);
transform: translateY(-50%);
font-size: 0.65rem;
font-weight: 700;
letter-spacing: 0.22em;
text-transform: uppercase;
color: var(--rx-orange-300);
background: var(--rx-navy);
border: 1px solid var(--rx-hud-line);
border-radius: var(--rx-r-pill);
padding: 0.35em 1em;
white-space: nowrap;
max-width: calc(100% - 2 * var(--rx-s-3));
overflow: hidden;
text-overflow: ellipsis;
} .rx-cockpit__mast {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: var(--rx-s-3);
flex-wrap: wrap;
}
.rx-markets__eyebrow {
margin: 0 0 var(--rx-s-1);
font-size: var(--rx-fs-xs);
font-weight: 700;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--rx-orange-300);
}
.rx-markets__headline {
margin: 0;
font-size: var(--rx-fs-2xl);
font-weight: 800;
line-height: 1.08;
color: #fff;
}
.rx-markets__subhead {
margin: var(--rx-s-2) 0 0;
max-width: 56ch;
font-size: var(--rx-fs-md);
color: rgba(255, 255, 255, 0.72);
} .rx-cockpit__systems {
display: flex;
align-items: center;
justify-content: space-between; width: 100%;
gap: var(--rx-s-2);
padding: var(--rx-s-1) var(--rx-s-2);
border-radius: var(--rx-r-md);
flex-wrap: wrap;
row-gap: 4px;
}
.rx-cockpit__sys {
display: flex;
align-items: center;
gap: 0.45em;
font-size: var(--rx-fs-xs);
white-space: nowrap;
}
.rx-cockpit__sys-name {
font-weight: 700;
letter-spacing: 0.1em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.75);
}
.rx-cockpit__sys-src { color: rgba(255, 255, 255, 0.58); }
.rx-cockpit__sys--clock {
color: var(--rx-hud-green);
}
.rx-cockpit__sys--clock .rx-cockpit__sys-name { color: rgba(255, 255, 255, 0.45); }
.rx-cockpit__led {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--rx-hud-green);
box-shadow: 0 0 8px rgba(64, 217, 140, 0.8);
}
.rx-cockpit__sys.is-down .rx-cockpit__led {
background: var(--rx-orange);
box-shadow: 0 0 8px rgba(220, 79, 44, 0.8);
} .rx-cockpit__row {
display: grid;
grid-template-columns: minmax(0, 1fr) 340px;
gap: var(--rx-s-3);
margin-top: var(--rx-s-4);
align-items: stretch;
} .rx-cockpit-panel--tminus {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
min-height: 260px; } .rx-cockpit-panel--tminus {
background-image:
radial-gradient(ellipse 70% 45% at 50% 108%, rgba(220, 79, 44, 0.22), transparent 70%),
repeating-linear-gradient(0deg,  transparent 0 31px, rgba(255, 255, 255, 0.025) 31px 32px),
repeating-linear-gradient(90deg, transparent 0 31px, rgba(255, 255, 255, 0.025) 31px 32px);
}
.rx-tminus__event {
margin: 0 0 var(--rx-s-1);
font-size: var(--rx-fs-md);
font-weight: 600;
color: rgba(255, 255, 255, 0.85);
}
.rx-tminus__event b { color: var(--rx-orange-300); font-weight: 700; }
.rx-tminus__clock {
font-size: clamp(2.6rem, 6vw, 4.2rem);
font-weight: 700;
line-height: 1;
color: #fff;
text-shadow: 0 0 24px rgba(220, 79, 44, 0.45);
}
.rx-cockpit-panel--tminus.is-imminent .rx-tminus__clock {
color: var(--rx-orange-300);
text-shadow: 0 0 32px rgba(220, 79, 44, 0.75);
}
.rx-cockpit-panel--tminus.is-standby .rx-tminus__clock {
color: rgba(255, 255, 255, 0.3);
text-shadow: none;
}
.rx-tminus__label {
margin: var(--rx-s-1) 0 0;
font-size: var(--rx-fs-xs);
font-weight: 700;
letter-spacing: 0.32em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.45);
} .rx-cockpit-panel--radar {
display: flex;
flex-direction: column;
align-items: center;
gap: var(--rx-s-1);
}
.rx-radar {
position: relative;
width: min(220px, 100%);
aspect-ratio: 1;
}
.rx-radar__svg {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
}
.rx-radar__ring,
.rx-radar__axis {
fill: none;
stroke: rgba(255, 255, 255, 0.1);
stroke-width: 1;
}
.rx-radar__blip { stroke: none; }
.rx-radar__blip--high   { fill: var(--rx-orange);   filter: drop-shadow(0 0 4px rgba(220, 79, 44, 0.9)); }
.rx-radar__blip--medium { fill: var(--rx-hud-amber); }
.rx-radar__blip--low    { fill: rgba(255, 255, 255, 0.45); }
.rx-radar__sweep {
position: absolute;
inset: 6%;
border-radius: 50%;
background: conic-gradient(from 0deg, rgba(220, 79, 44, 0.28), transparent 70deg, transparent 360deg);
-webkit-mask-image: radial-gradient(circle, black 98%, transparent 100%);
mask-image: radial-gradient(circle, black 98%, transparent 100%);
animation: rx-radar-sweep 6s linear infinite;
pointer-events: none;
}
@keyframes rx-radar-sweep {
to { transform: rotate(360deg); }
}
.rx-radar__legend {
display: flex;
gap: var(--rx-s-2);
font-size: 0.65rem;
text-transform: uppercase;
letter-spacing: 0.12em;
color: rgba(255, 255, 255, 0.5);
}
.rx-radar__legend span { display: flex; align-items: center; gap: 0.45em; }
.rx-radar__key {
width: 7px;
height: 7px;
border-radius: 50%;
display: inline-block;
}
.rx-radar__key--high   { background: var(--rx-orange); }
.rx-radar__key--medium { background: var(--rx-hud-amber); }
.rx-radar__key--low    { background: rgba(255, 255, 255, 0.45); } .rx-markets__bar {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--rx-s-2);
flex-wrap: wrap;
margin-top: var(--rx-s-3);
padding: var(--rx-s-1) var(--rx-s-2);
border-radius: var(--rx-r-pill);
border: 1px solid var(--rx-line);
}
.rx-markets__status {
display: flex;
align-items: center;
gap: 0.5em;
font-size: var(--rx-fs-sm);
font-weight: 600;
color: rgba(255, 255, 255, 0.85);
padding-left: var(--rx-s-1);
}
.rx-markets__dot {
width: 9px;
height: 9px;
border-radius: 50%;
background: var(--rx-orange);
box-shadow: 0 0 0 0 rgba(220, 79, 44, 0.6);
animation: rx-markets-pulse 2.2s var(--rx-ease-in-out) infinite;
}
@keyframes rx-markets-pulse {
0%   { box-shadow: 0 0 0 0 rgba(220, 79, 44, 0.55); }
70%  { box-shadow: 0 0 0 9px rgba(220, 79, 44, 0); }
100% { box-shadow: 0 0 0 0 rgba(220, 79, 44, 0); }
}
.rx-markets__updated {
font-weight: 400;
color: rgba(255, 255, 255, 0.55);
}
.rx-markets__tabs {
display: flex;
gap: 4px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.rx-markets__tabs::-webkit-scrollbar { display: none; } button.rx-markets-tab {
appearance: none;
border: 1px solid transparent;
background-color: transparent !important;
color: rgba(255, 255, 255, 0.65);
font: 600 var(--rx-fs-sm) / 1 inherit;
font-family: inherit;
padding: 0.55em 1em;
border-radius: var(--rx-r-pill);
cursor: pointer;
white-space: nowrap;
transition: color var(--rx-dur-fast) var(--rx-ease-out),
background-color var(--rx-dur-fast) var(--rx-ease-out),
border-color var(--rx-dur-fast) var(--rx-ease-out);
}
button.rx-markets-tab:hover { color: #fff; }
button.rx-markets-tab.is-active {
color: #fff;
background-color: rgba(220, 79, 44, 0.18) !important;
border-color: rgba(220, 79, 44, 0.4);
} .rx-markets__grid {
display: grid;
grid-template-columns: minmax(0, 1fr) 400px;
gap: var(--rx-s-3);
margin-top: var(--rx-s-3);
align-items: start;
} .rx-markets__news {
display: flex;
flex-direction: column;
min-width: 0;
}
.rx-markets-card {
padding: var(--rx-s-2) 0;
border-bottom: 1px solid var(--rx-line);
transition: background-color var(--rx-dur-fast) var(--rx-ease-out);
}
.rx-markets-card:last-child { border-bottom: 0; }
.rx-markets-card:hover { background: rgba(255, 255, 255, 0.025); }
.rx-markets-card.is-hidden { display: none; }
.rx-markets-card__frame {
position: relative;
margin: 0 0 var(--rx-s-2);
border: 1px solid var(--rx-hud-line);
border-radius: var(--rx-r-sm);
overflow: hidden;
} .rx-markets-card__frame::before,
.rx-markets-card__frame::after {
content: '';
position: absolute;
width: 18px;
height: 18px;
z-index: 1;
}
.rx-markets-card__frame::before { top: 0; left: 0; border-top: 2px solid var(--rx-orange); border-left: 2px solid var(--rx-orange); }
.rx-markets-card__frame::after  { bottom: 0; right: 0; border-bottom: 2px solid var(--rx-orange); border-right: 2px solid var(--rx-orange); }
.rx-markets-card__img {
display: block;
width: 100%;
height: 220px;
object-fit: cover;
filter: saturate(0.85);
}
.rx-markets-card__head {
display: flex;
align-items: center;
gap: var(--rx-s-1);
flex-wrap: wrap;
font-size: var(--rx-fs-xs);
margin-bottom: 6px;
}
.rx-markets-card__head > time { color: var(--rx-hud-green); }
.rx-markets-card__src {
color: rgba(255, 255, 255, 0.45);
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.rx-markets-card__src::before { content: '◦ '; color: rgba(255, 255, 255, 0.25); }
.rx-markets-card__tags {
display: flex;
gap: 5px;
flex-wrap: wrap;
margin-left: auto;
}
.rx-markets-tag {
font-size: 0.65rem;
font-weight: 700;
letter-spacing: 0.06em;
color: var(--rx-orange-300);
background: rgba(220, 79, 44, 0.14);
border: 1px solid rgba(220, 79, 44, 0.28);
padding: 0.2em 0.65em;
border-radius: var(--rx-r-pill);
}
.rx-markets-card__title {
margin: 0;
font-size: var(--rx-fs-base);
font-weight: 700;
line-height: 1.35;
}
.rx-markets-card--featured .rx-markets-card__title { font-size: var(--rx-fs-lg); } button.rx-markets-card__open {
appearance: none;
border: 0;
background-color: transparent !important;
padding: 0;
margin: 0;
font: inherit;
font-family: inherit;
text-align: left;
color: #fff;
cursor: pointer; display: block;
width: 100%;
white-space: normal;
overflow-wrap: break-word;
transition: color var(--rx-dur-fast) var(--rx-ease-out);
}
button.rx-markets-card__open:hover,
button.rx-markets-card__open:focus-visible { color: var(--rx-orange-300); }
.rx-markets-card__excerpt {
margin: 6px 0 0;
font-size: var(--rx-fs-sm);
line-height: 1.55;
color: rgba(255, 255, 255, 0.62);
} .rx-markets__cal {
position: sticky;
top: calc(var(--rx-s-6) + 24px);  }
.rx-markets-cal__days {
max-height: calc(100vh - var(--rx-s-8) - 80px);
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-width: thin;
}
.rx-markets-cal__daylabel {
margin: var(--rx-s-2) 0 var(--rx-s-1);
font-size: var(--rx-fs-xs);
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--rx-orange-300);
}
.rx-markets-cal__day:first-child .rx-markets-cal__daylabel { margin-top: 0; }
.rx-markets-cal__list {
list-style: none;
margin: 0;
padding: 0;
}
.rx-markets-ev {
display: grid;
grid-template-columns: auto auto auto minmax(0, 1fr);
align-items: baseline;
gap: 10px;
padding: 10px 4px;
border-bottom: 1px solid var(--rx-line);
}
.rx-markets-ev:last-child { border-bottom: 0; }
.rx-markets-ev.is-past { opacity: 0.45; }
.rx-markets-ev__time {
font-family: ui-monospace, 'SF Mono', 'Cascadia Mono', Menlo, Consolas, monospace;
font-size: var(--rx-fs-xs);
font-variant-numeric: tabular-nums;
color: var(--rx-hud-green);
}
.rx-markets-ev.is-past .rx-markets-ev__time { color: rgba(255, 255, 255, 0.55); }
.rx-markets-ev__cur {
font-size: var(--rx-fs-xs);
font-weight: 700;
letter-spacing: 0.08em;
color: rgba(255, 255, 255, 0.85);
}
.rx-markets-ev__dot {
width: 8px;
height: 8px;
border-radius: 50%;
align-self: center;
background: var(--rx-mute);
}
.rx-markets-ev[data-impact='high']   .rx-markets-ev__dot { background: var(--rx-orange); box-shadow: 0 0 10px rgba(220, 79, 44, 0.6); }
.rx-markets-ev[data-impact='medium'] .rx-markets-ev__dot { background: var(--rx-hud-amber); }
.rx-markets-ev__title {
display: block;
font-size: var(--rx-fs-sm);
font-weight: 600;
color: rgba(255, 255, 255, 0.88);
line-height: 1.35;
}
.rx-markets-ev__vals {
display: flex;
gap: var(--rx-s-1);
flex-wrap: wrap;
margin-top: 2px;
font-family: ui-monospace, 'SF Mono', 'Cascadia Mono', Menlo, Consolas, monospace;
font-size: var(--rx-fs-xs);
font-variant-numeric: tabular-nums;
color: rgba(255, 255, 255, 0.5);
}
.rx-markets-ev__val b {
font-weight: 700;
color: rgba(255, 255, 255, 0.55);
margin-right: 2px;
}
.rx-markets-ev__val--actual { color: var(--rx-orange-300); }
.rx-markets-cal__empty {
font-size: var(--rx-fs-sm);
color: rgba(255, 255, 255, 0.55);
}
.rx-markets-cal__export {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5em;
margin-top: var(--rx-s-2);
padding: 0.7em 1em;
font-size: var(--rx-fs-xs);
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
text-decoration: none;
color: var(--rx-orange-300);
border: 1px dashed rgba(220, 79, 44, 0.4);
border-radius: var(--rx-r-md);
transition: background-color var(--rx-dur-fast) var(--rx-ease-out),
border-color var(--rx-dur-fast) var(--rx-ease-out),
color var(--rx-dur-fast) var(--rx-ease-out);
}
.rx-markets-cal__export:hover {
color: #fff;
background: rgba(220, 79, 44, 0.14);
border-color: rgba(220, 79, 44, 0.6);
border-style: solid;
}
.rx-markets-cal__tz {
margin: var(--rx-s-2) 0 0;
font-size: 0.65rem;
color: rgba(255, 255, 255, 0.55);
} .rx-markets__disclaimer {
margin: var(--rx-s-4) 0 0;
font-size: var(--rx-fs-xs);
color: rgba(255, 255, 255, 0.58);
max-width: 72ch;
} .rx-markets-modal {
position: fixed;
inset: 0;
z-index: var(--rx-z-modal, 9000);
display: flex;
align-items: center;
justify-content: center;
padding: var(--rx-s-3);
} .rx-markets-modal[hidden] { display: none; }
.rx-markets-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(4, 7, 18, 0.72);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
}
.rx-markets-modal__panel {
position: relative;
display: flex;
flex-direction: column;
width: min(680px, 100%);
max-height: min(80vh, 720px); background-color: var(--rx-navy);
box-shadow: 0 24px 80px rgba(0, 0, 0, 0.6);
animation: rx-modal-in 0.28s var(--rx-ease-out);
}
@keyframes rx-modal-in {
from { opacity: 0; transform: translateY(14px) scale(0.985); }
to   { opacity: 1; transform: none; }
}
button.rx-markets-modal__close {
position: absolute;
top: var(--rx-s-2);
right: var(--rx-s-2);
appearance: none;
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box; width: 34px;
height: 34px;
min-width: 0;
min-height: 0;
padding: 0;
border: 1px solid var(--rx-line);
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.05) !important;
color: rgba(255, 255, 255, 0.75);
font-size: 0.85rem;
line-height: 1;
cursor: pointer;
transition: color var(--rx-dur-fast) var(--rx-ease-out),
border-color var(--rx-dur-fast) var(--rx-ease-out);
}
button.rx-markets-modal__close:hover {
color: #fff;
border-color: rgba(220, 79, 44, 0.5);
}
button.rx-markets-modal__close:focus-visible {
outline: 2px solid var(--rx-orange-300);
outline-offset: 2px;
}
.rx-markets-modal__head { padding-right: 44px; }
.rx-markets-modal__title {
margin: var(--rx-s-1) 0 var(--rx-s-2);
font-size: var(--rx-fs-lg);
font-weight: 800;
line-height: 1.25;
color: #fff;
}
.rx-markets-modal__body {
flex: 1 1 auto;
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-width: thin;
font-size: var(--rx-fs-sm);
line-height: 1.65;
color: rgba(255, 255, 255, 0.75);
}
.rx-markets-modal__body p,
.rx-markets-modal__body ul,
.rx-markets-modal__body ol { margin: 0 0 var(--rx-s-2); }
.rx-markets-modal__body li { margin-bottom: 6px; }
.rx-markets-modal__body strong { color: rgba(255, 255, 255, 0.92); }
.rx-markets-modal__body h3,
.rx-markets-modal__body h4 {
margin: var(--rx-s-2) 0 var(--rx-s-1);
font-size: var(--rx-fs-base);
color: #fff;
}
.rx-markets-modal__attr {
margin: var(--rx-s-2) 0 0;
padding-top: var(--rx-s-2);
border-top: 1px solid var(--rx-line);
font-size: var(--rx-fs-xs);
color: rgba(255, 255, 255, 0.58);
}
.rx-markets-modal__attr-link {
color: var(--rx-orange);
text-decoration: underline;
text-underline-offset: 2px;
}
.rx-markets-modal__attr-link:hover,
.rx-markets-modal__attr-link:focus-visible {
color: var(--rx-orange);
text-decoration: none;
} @media (prefers-reduced-motion: reduce) {
.rx-markets__dot { animation: none; }
.rx-radar__sweep { animation: none; opacity: 0.35; }
.rx-markets-modal__panel { animation: none; }
} @media (max-width: 1024px) {
.rx-cockpit__row,
.rx-markets__grid { grid-template-columns: 1fr; }
.rx-markets__cal {
position: static;
max-height: none;
order: -1; }
}
@media (max-width: 600px) {
.rx-markets__headline { font-size: var(--rx-fs-xl); }
.rx-markets__bar { border-radius: var(--rx-r-lg); }
.rx-markets-card__img { height: 170px; }
.rx-cockpit-panel--tminus { min-height: 200px; }
.rx-cockpit__systems { width: 100%; } .rx-cockpit__mast-copy { width: 100%; }
.rx-markets__eyebrow { text-align: center; }
}