/* FXpips Dark Edition — extracted verbatim from FXpips-dark-client.html (second <style> block).
   Layers over theme.css; Phase I components live in phase1.css. */
/* FXpips Dark Edition — reference-matched neon trading interface. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e5edf2;
  --heading: #f4f7fa;
  --muted: #8ca1ad;
  --teal: #42eca2;
  --teal-dark: #55e6ab;
  --magenta: #13c6ef;
  --line: #19313d;
  --gradient: linear-gradient(100deg, #1ec9ee, #45eda4);
  --neon-button: linear-gradient(180deg, #13e2f5 0%, #00c7ee 52%, #009edd 100%);
}
:where([data-theme="dark"]) body { background: #607183; color: var(--ink); }
:where([data-theme="dark"]) ::selection { background: #1b815c; color: white; }
:where([data-theme="dark"]) .ambient-background {
  background: radial-gradient(ellipse at 12% 25%, #22dded25, transparent 38%), radial-gradient(ellipse at 90% 68%, #0fdbe324, transparent 34%), linear-gradient(115deg, #576778, #768b9c 50%, #51677a);
}
:where([data-theme="dark"]) .ambient-background::after {
  content: ""; position: absolute; inset: 0; opacity: .38;
  background: radial-gradient(ellipse at 7% 76%, #84ffff 0, #21f5f936 1.5%, transparent 4%), radial-gradient(ellipse at 13% 19%, #23fffbb0, transparent 5%), radial-gradient(ellipse at 91% 82%, #90ffff99, transparent 3%), radial-gradient(ellipse at 91% 16%, #9dfff99c, transparent 4%);
  filter: blur(5px);
}
:where([data-theme="dark"]) .network-art { display: none; }
:where([data-theme="dark"]) .map-dots { opacity: .32; background-image: radial-gradient(#79edfc 1.5px, transparent 1.8px); background-size: 5px 5px; filter: drop-shadow(0 0 13px #2bdfea); }
:where([data-theme="dark"]) .background-chart { opacity: .64; filter: blur(1.2px) drop-shadow(0 0 4px #3ddcdd); }
:where([data-theme="dark"]) .chart-left { top: 17%; left: -2%; width: 25%; transform: none; }
:where([data-theme="dark"]) .chart-left g { fill: #47e3d1; stroke: #6aeedf; }
:where([data-theme="dark"]) .chart-left > path { stroke: #bd8093; }
:where([data-theme="dark"]) .chart-right { top: 15%; right: -3%; width: 24%; }
:where([data-theme="dark"]) .chart-right > path:first-of-type { stroke: #86fffd; }
:where([data-theme="dark"]) .chart-right > path:last-of-type { stroke: #d1919d; }
:where([data-theme="dark"]) .chart-right g:last-child { fill: #9cedf9; }
:where([data-theme="dark"]) .site-shell {
  max-width: 1080px; min-height: 0; margin: 0 auto; border-radius: 19px 19px 12px 12px;
  background: radial-gradient(ellipse at 93% 26%, #003b3027, transparent 36%), radial-gradient(ellipse at 57% 4%, #00263715, transparent 40%), #03090e;
  box-shadow: 0 0 70px #0d213d69, 0 15px 70px #111c31aa;
}
:where([data-theme="dark"]) .site-header { height: 82px; background: transparent; border: 0; padding: 0 51px; gap: 23px; }
:where([data-theme="dark"]) main { padding: 0 51px; }
:where([data-theme="dark"]) .brand { color: #f7f9fa; font-size: 27px; letter-spacing: -.7px; }
:where([data-theme="dark"]) .brand b { color: #4de5a5; }
:where([data-theme="dark"]) .brand-symbol { height: 53px; width: 45px; }
:where([data-theme="dark"]) .main-nav { gap: 15px; }
:where([data-theme="dark"]) .nav-link { color: #eff3f6; font-size: 10px; }
:where([data-theme="dark"]) .nav-link.active, :where([data-theme="dark"]) .nav-link:hover { color: #72eab4; }
:where([data-theme="dark"]) .nav-link:after { background: #4ce5a2; height: 1px; }
:where([data-theme="dark"]) .header-actions { gap: 11px; }
:where([data-theme="dark"]) .button { min-height: 37px; font-size: 11px; padding: 0 24px; }
:where([data-theme="dark"]) .button-gradient, :where([data-theme="dark"]) .modal-primary, :where([data-theme="dark"]) .trade-button {
  background: var(--neon-button); color: #032737; border: 1px solid #22d9f350;
  box-shadow: 0 0 19px #00ccec52, 0 3px 14px #008de63b, inset 0 1px 0 #a2ffff54;
  font-weight: 700;
}
:where([data-theme="dark"]) .button-gradient:hover, :where([data-theme="dark"]) .modal-primary:hover, :where([data-theme="dark"]) .trade-button:hover {
  background: linear-gradient(180deg, #58f3ff, #04cdef 58%, #00b3ee);
  box-shadow: 0 0 26px #00cdec80, 0 4px 15px #009dd64d;
}
:where([data-theme="dark"]) .button-outline, :where([data-theme="dark"]) .button-login, :where([data-theme="dark"]) .modal-secondary {
  color: #63e2aa; background: linear-gradient(135deg, #06131b, #03090e);
  border: 1px solid #55b88f; box-shadow: inset 0 0 10px #47edaa05;
}
:where([data-theme="dark"]) .button-outline:hover, :where([data-theme="dark"]) .button-login:hover, :where([data-theme="dark"]) .modal-secondary:hover { background: #0d2824; box-shadow: 0 0 14px #2ceea224; }
:where([data-theme="dark"]) .button-login { min-height: 32px; font-size: 10px; padding: 0 18px; }
:where([data-theme="dark"]) .button-small { min-height: 32px; font-size: 10px; padding: 0 17px; }
:where([data-theme="dark"]) .button-small > span, :where([data-theme="dark"]) .hero-actions .button > span, :where([data-theme="dark"]) .hero-actions .button > svg { display: none; }
:where([data-theme="dark"]) .hero { min-height: 340px; padding: 24px 0 37px; }
:where([data-theme="dark"]) .hero-copy { width: 68%; }
:where([data-theme="dark"]) h1 { font-size: 47px; line-height: 1.075; letter-spacing: -1.35px; color: #f7f9fb; font-weight: 750; }
:where([data-theme="dark"]) .headline-accent { color: #42e79a; }
:where([data-theme="dark"]) .hero-description { max-width: 655px; font-size: 12px; margin-top: 14px; color: #d6d8da; line-height: 1.75; letter-spacing: -.2px; }
:where([data-theme="dark"]) .desktop-divider { color: #a4adb3; padding: 0 2px; }
:where([data-theme="dark"]) .hero-actions { gap: 15px; margin-top: 23px; }
:where([data-theme="dark"]) .hero-assurance { display: none; }
:where([data-theme="dark"]) .hero-visual { right: -20px; top: -1px; width: 39%; }
:where([data-theme="dark"]) .hero-visual img { width: 117%; max-height: 348px; opacity: 1; filter: drop-shadow(0 11px 24px #00c7fa12); }
:where([data-theme="dark"]) .hero-glow { height: 82%; background: radial-gradient(ellipse, #00a4ec17, #00dc9320 44%, transparent 72%); filter: blur(16px); }
:where([data-theme="dark"]) .markets-grid { gap: 23px; }
:where([data-theme="dark"]) .section-heading h2 { color: #f0f3f5; font-size: 19px; }
:where([data-theme="dark"]) .view-more { color: #60dca8; font-size: 10px; }
:where([data-theme="dark"]) .view-more:hover { color: #a0ffd2; }
:where([data-theme="dark"]) .market-ticker { background: #18232e; color: #d1dbe1; border-radius: 9px; height: 21px; }
:where([data-theme="dark"]) .market-ticker::after { background: linear-gradient(90deg, transparent, #18232e); }
:where([data-theme="dark"]) .ticker-label { color: #ebf0f4; }
:where([data-theme="dark"]) .ticker-label i { background: #48daa4; }
:where([data-theme="dark"]) .positive { color: #5fdfa6; }
:where([data-theme="dark"]) .negative { color: #e97b83; }
:where([data-theme="dark"]) .signal-grid { gap: 9px; }
:where([data-theme="dark"]) .signal-card {
  border: 1px solid #285570; background: linear-gradient(135deg, #0b2030, #0a2333); border-radius: 12px;
  padding: 11px 10px 10px; min-height: 186px; box-shadow: 0 3px 12px #0004, inset 0 0 28px #00aeff08;
}
:where([data-theme="dark"]) .signal-card:hover { border-color: #399bb3; box-shadow: 0 0 20px #10bff215; }
:where([data-theme="dark"]) #crypto-cards .signal-card { border-color: #27644f; background: linear-gradient(130deg, #04251e, #092d25); box-shadow: inset 0 0 23px #05ce7f08; }
:where([data-theme="dark"]) .signal-card[data-side="sell"], :where([data-theme="dark"]) #crypto-cards .signal-card[data-side="sell"] { border-color: #773d4b; background: linear-gradient(135deg, #26151f, #291e29); box-shadow: inset 0 0 20px #ed385708; }
:where([data-theme="dark"]) .signal-card[data-side="sell"]:hover { border-color: #a65a6b; }
:where([data-theme="dark"]) .signal-top { margin-bottom: 9px; }
:where([data-theme="dark"]) .signal-name { color: #f3f5f6; font-weight: 550; font-size: 12px; }
:where([data-theme="dark"]) .coin-icon { height: 21px; width: 21px; min-width: 21px; }
:where([data-theme="dark"]) .coin-icon.gold { background: linear-gradient(135deg, #edc74f, #b38f29); }
:where([data-theme="dark"]) .coin-icon.bitcoin { background: #ed9b2b; }
:where([data-theme="dark"]) .coin-icon.sterling { color: #dc4865; background: #f4f5f7; }
:where([data-theme="dark"]) .coin-icon.ethereum { color: #a6bcc8; }
:where([data-theme="dark"]) .coin-icon.solana { color: #67e8ce; background: #06131e; }
:where([data-theme="dark"]) .trade-tag.buy { background: #0b4639; color: #5ee7ab; }
:where([data-theme="dark"]) .trade-tag.sell { background: #522632; color: #eb8d92; }
:where([data-theme="dark"]) .sparkline { height: 75px; }
:where([data-theme="dark"]) .chart-grid { stroke: #25434d; }
:where([data-theme="dark"]) .chart-axis { fill: #92acb6; }
:where([data-theme="dark"]) .chart-stats { color: #d9e3e7; padding-top: 4px; padding-bottom: 5px; }
:where([data-theme="dark"]) .win-rate strong { color: #4ce6a2; font-size: 25px; }
:where([data-theme="dark"]) .pips strong { color: #50e5aa; }
:where([data-theme="dark"]) .signal-table { line-height: 1.55; margin-top: 0; margin-bottom: 2px; }
:where([data-theme="dark"]) .signal-table th { color: #c4d0d6; font-size: 10px; line-height: 1.7; }
:where([data-theme="dark"]) .signal-table td { color: #e0e7e9; font-size: 10px; }
:where([data-theme="dark"]) .signal-card[data-side="sell"] .signal-table td { color: #e5979d; }
:where([data-theme="dark"]) #crypto-cards .signal-card[data-side="buy"] .signal-table td { color: #72e6b0; }
:where([data-theme="dark"]) .signal-status { color: #d5dfe4; margin-top: 5px; margin-bottom: 11px; }
:where([data-theme="dark"]) .signal-status .status-active { background: #104639; color: #72e7b7; }
:where([data-theme="dark"]) .status-demo { color: #91acbb; }
:where([data-theme="dark"]) .trade-button { min-height: 28px; border-radius: 24px; font-size: 9px; gap: 5px; }
:where([data-theme="dark"]) .trade-button > span { display: none; }
:where([data-theme="dark"]) .trade-button.is-saved { background: linear-gradient(180deg, #6bf2b3, #2bbb8b); color: #05382e; border-color: #74efbc; box-shadow: 0 0 14px #2aef971f; }
:where([data-theme="dark"]) .section-underline { background: #172b36; height: 2px; margin-top: 11px; }
:where([data-theme="dark"]) .section-underline:before { background: linear-gradient(90deg, #2285b4, #41deb4); width: 63%; }
:where([data-theme="dark"]) .bottom-grid { grid-template-columns: 1.34fr 1fr; gap: 15px; margin-top: 18px; }
:where([data-theme="dark"]) .performance-panel { grid-template-columns: minmax(0,1fr) 122px; gap: 16px; background: linear-gradient(130deg, #08291f, #092720); border: 1px solid #245b49; border-radius: 13px; padding: 16px 15px 12px; min-height: 184px; box-shadow: inset 0 0 35px #12ce7905; }
:where([data-theme="dark"]) .performance-panel .section-heading { gap: 5px; }
:where([data-theme="dark"]) .performance-panel h2 { font-size: 15px; }
:where([data-theme="dark"]) .performance-panel select { color: #8aa99d; font-size: 8px; max-width: 76px; }
:where([data-theme="dark"]) select option { background: #102128; color: #dcebe8; }
:where([data-theme="dark"]) .performance-chart { min-height: 118px; }
:where([data-theme="dark"]) .performance-chart line { stroke: #214137; }
:where([data-theme="dark"]) .performance-chart text { fill: #becfc9; }
:where([data-theme="dark"]) .performance-chart .bar { filter: drop-shadow(0 0 4px #21f0a13d); }
:where([data-theme="dark"]) .chart-legend { color: #aac9ba; font-size: 7px; }
:where([data-theme="dark"]) .legend-forex { background: #33ed98; box-shadow: 0 0 6px #33ed9850; }
:where([data-theme="dark"]) .legend-crypto { background: #17d2c2; }
:where([data-theme="dark"]) .performance-stats { padding: 0 0 7px; }
:where([data-theme="dark"]) .performance-stats h3 { font-size: 10px; color: #edf5f1; }
:where([data-theme="dark"]) .performance-stats strong { color: #4aeb9f; font-size: 31px; letter-spacing: -.3px; text-shadow: 0 0 18px #16f89115; }
:where([data-theme="dark"]) .performance-stats #active-subscribers { color: #2bcbd2; }
:where([data-theme="dark"]) .stat-trend { color: #69bd9a; font-size: 7px; }
:where([data-theme="dark"]) .stat-note { color: #86aa9a; font-size: 8px; }
:where([data-theme="dark"]) .footer-panel { background: #030a10; border: 1px solid #1b3444; border-radius: 13px; padding: 12px 13px 0; }
:where([data-theme="dark"]) .footer-top { border-color: #112634; padding-bottom: 9px; }
:where([data-theme="dark"]) .brand-footer { font-size: 22px; }
:where([data-theme="dark"]) .brand-footer .brand-symbol { height: 37px; width: 32px; }
:where([data-theme="dark"]) .footer-socials { gap: 6px; }
:where([data-theme="dark"]) .footer-socials button { color: #f4f6f7; background: #1c2a37; height: 22px; width: 22px; font-size: 12px; }
:where([data-theme="dark"]) .footer-socials button:hover { background: #155645; }
:where([data-theme="dark"]) .footer-socials svg path { fill: #1c2a37; }
:where([data-theme="dark"]) .footer-columns { grid-template-columns: 1.5fr 1fr .8fr; gap: 12px; padding: 12px 0 15px; }
:where([data-theme="dark"]) .footer-columns h3 { color: #edf1f3; font-size: 10px; }
:where([data-theme="dark"]) .footer-columns p, :where([data-theme="dark"]) .footer-columns a, :where([data-theme="dark"]) .footer-columns button { color: #99a7b0; font-size: 9px; }
:where([data-theme="dark"]) .footer-columns a:hover, :where([data-theme="dark"]) .footer-columns button:hover { color: #71eab8; }
:where([data-theme="dark"]) .footer-bottom { border-color: #112634; color: #8a9eaa; font-size: 7px; padding: 9px 0; }
:where([data-theme="dark"]) .footer-tagline { color: #89a5b0; }
:where([data-theme="dark"]) .demo-notice { color: #7d929f; font-size: 7px; padding: 12px 0 14px; }
:where([data-theme="dark"]) .demo-notice i { background: #49b995; }
:where([data-theme="dark"]) .skip-link { background: #10272d; color: #e2f8ed; }
:where([data-theme="dark"]) .app-dialog { background: radial-gradient(ellipse at 100% 0, #143529, transparent 70%), #07131c; border-color: #285145; color: #e2eee9; box-shadow: 0 20px 100px #0008, 0 0 45px #22c2a517; }
:where([data-theme="dark"]) .app-dialog::backdrop { background: #01080eb0; backdrop-filter: blur(7px); }
:where([data-theme="dark"]) .dialog-close { color: #c2d8d4; background: #1c333a; }
:where([data-theme="dark"]) .dialog-close:hover { background: #27584a; }
:where([data-theme="dark"]) .modal-kicker { color: #56e3a7; }
:where([data-theme="dark"]) .modal-title { color: #f1f7f4; }
:where([data-theme="dark"]) .modal-copy { color: #9cb3bb; }
:where([data-theme="dark"]) .form-field { color: #c2d8d4; }
:where([data-theme="dark"]) .form-field input, :where([data-theme="dark"]) .form-field textarea, :where([data-theme="dark"]) .form-field select { color: #ecf7f3; background: #091f25; border-color: #2a4b4b; }
:where([data-theme="dark"]) .form-field input::placeholder, :where([data-theme="dark"]) .form-field textarea::placeholder { color: #769094; }
:where([data-theme="dark"]) .form-note { color: #8caba8; }
:where([data-theme="dark"]) .demo-banner { color: #91bdae; background: #0c3027; }
:where([data-theme="dark"]) .form-success { background: #0c352a; border-color: #286c50; color: #9becbb; }
:where([data-theme="dark"]) .trade-detail { background: #102c29; color: #9bbab0; }
:where([data-theme="dark"]) .trade-detail strong { color: #83eeb5; }
:where([data-theme="dark"]) .price-option { background: #102523; border-color: #2f574a; }
:where([data-theme="dark"]) .price-option.is-featured { background: linear-gradient(140deg, #10432f, #10252d); border-color: #409275; }
:where([data-theme="dark"]) .price-option p, :where([data-theme="dark"]) .price-option li { color: #a6bcb4; }
:where([data-theme="dark"]) .price-value { color: #5beaab; }
:where([data-theme="dark"]) .price-value span { color: #96b6a8; }
:where([data-theme="dark"]) button:focus-visible, :where([data-theme="dark"]) a:focus-visible, :where([data-theme="dark"]) input:focus-visible, :where([data-theme="dark"]) select:focus-visible, :where([data-theme="dark"]) textarea:focus-visible { outline-color: #5af2bb; }
@media (min-width: 1450px) {
  :where([data-theme="dark"]) .site-shell { margin: 20px auto; }
  :where([data-theme="dark"]) .hero { min-height: 350px; }
  :where([data-theme="dark"]) .signal-card { min-height: 190px; }
}
@media (max-width: 1100px) {
  :where([data-theme="dark"]) .site-shell { max-width: 980px; }
  :where([data-theme="dark"]) .site-header { padding: 0 35px; gap: 18px; }
  :where([data-theme="dark"]) main { padding: 0 35px; }
  :where([data-theme="dark"]) .main-nav { gap: 12px; }
  :where([data-theme="dark"]) .nav-link { font-size: 9px; }
  :where([data-theme="dark"]) .brand { font-size: 26px; }
  :where([data-theme="dark"]) .hero { min-height: 328px; }
  :where([data-theme="dark"]) h1 { font-size: 41px; }
  :where([data-theme="dark"]) .hero-description { font-size: 11px; max-width: 570px; }
  :where([data-theme="dark"]) .hero-visual { width: 39%; right: -20px; }
  :where([data-theme="dark"]) .hero-visual img { max-height: 328px; }
  :where([data-theme="dark"]) .button { padding: 0 19px; }
  :where([data-theme="dark"]) .button-login, :where([data-theme="dark"]) .button-small { padding: 0 15px; }
  :where([data-theme="dark"]) .signal-name { font-size: 11px; }
  :where([data-theme="dark"]) .signal-table td { font-size: 10px; }
  :where([data-theme="dark"]) .signal-grid { gap: 8px; }
  :where([data-theme="dark"]) .markets-grid { gap: 20px; }
  :where([data-theme="dark"]) .bottom-grid { grid-template-columns: 1.35fr 1fr; }
  :where([data-theme="dark"]) .performance-panel { grid-template-columns: minmax(0,1fr) 115px; gap: 12px; padding: 15px 12px 11px; }
  :where([data-theme="dark"]) .performance-panel h2 { font-size: 14px; }
  :where([data-theme="dark"]) .performance-panel select { font-size: 7px; max-width: 68px; }
  :where([data-theme="dark"]) .footer-columns { gap: 9px; }
  :where([data-theme="dark"]) .footer-columns p, :where([data-theme="dark"]) .footer-columns a, :where([data-theme="dark"]) .footer-columns button { font-size: 8px; }
}
@media (max-width: 990px) {
  :where([data-theme="dark"]) .site-header { height: 77px; gap: 15px; padding: 0 29px; }
  :where([data-theme="dark"]) main { padding: 0 29px; }
  :where([data-theme="dark"]) .main-nav { gap: 11px; }
  :where([data-theme="dark"]) .nav-link { font-size: 9px; }
  :where([data-theme="dark"]) .hero-copy { width: 69%; }
  :where([data-theme="dark"]) h1 { font-size: 39px; }
  :where([data-theme="dark"]) .hero-visual { right: -12px; }
  :where([data-theme="dark"]) .hero-description { font-size: 11px; }
  :where([data-theme="dark"]) .hero-actions .button { min-height: 35px; font-size: 10px; }
  :where([data-theme="dark"]) .signal-name { font-size: 10px; }
  :where([data-theme="dark"]) .coin-icon { height: 19px; width: 19px; min-width: 19px; }
  :where([data-theme="dark"]) .signal-card { padding: 10px 8px; }
  :where([data-theme="dark"]) .signal-table td, :where([data-theme="dark"]) .signal-table th { font-size: 9px; }
  :where([data-theme="dark"]) .performance-panel { grid-template-columns: minmax(0,1fr) 100px; gap: 9px; }
  :where([data-theme="dark"]) .performance-panel h2 { font-size: 12px; }
  :where([data-theme="dark"]) .performance-panel select { max-width: 60px; font-size: 7px; }
  :where([data-theme="dark"]) .performance-stats h3 { font-size: 9px; }
  :where([data-theme="dark"]) .performance-stats strong { font-size: 29px; }
}
@media (max-width: 780px) {
  :where([data-theme="dark"]) .site-shell { max-width: 720px; border-radius: 0; }
  :where([data-theme="dark"]) .site-header { height: 76px; padding: 0 25px; background: #040c12; }
  :where([data-theme="dark"]) main { padding: 0 25px; }
  :where([data-theme="dark"]) .brand { font-size: 28px; }
  :where([data-theme="dark"]) .brand-symbol { height: 48px; width: 41px; }
  :where([data-theme="dark"]) .menu-toggle span { background: #83cbb2; }
  :where([data-theme="dark"]) .main-nav { top: 76px; background: #07161f; border-color: #17343b; box-shadow: 0 12px 22px #0006; padding: 18px 25px 22px; }
  :where([data-theme="dark"]) .nav-link { font-size: 12px; }
  :where([data-theme="dark"]) .hero { min-height: 315px; padding: 28px 0; }
  :where([data-theme="dark"]) h1 { font-size: 35px; }
  :where([data-theme="dark"]) .hero-description { max-width: 345px; font-size: 11px; }
  :where([data-theme="dark"]) .hero-actions { gap: 11px; margin-top: 21px; }
  :where([data-theme="dark"]) .hero-actions .button { padding: 0 16px; min-height: 35px; font-size: 9px; }
  :where([data-theme="dark"]) .hero-visual { width: 39%; right: -18px; top: 12px; }
  :where([data-theme="dark"]) .hero-visual img { width: 117%; }
  :where([data-theme="dark"]) .section-heading h2 { font-size: 19px; }
  :where([data-theme="dark"]) .markets-grid { gap: 25px; }
  :where([data-theme="dark"]) .signal-grid { gap: 12px; }
  :where([data-theme="dark"]) .signal-card { padding: 13px 12px; min-height: 204px; }
  :where([data-theme="dark"]) .signal-name { font-size: 13px; }
  :where([data-theme="dark"]) .coin-icon { height: 24px; width: 24px; min-width: 24px; }
  :where([data-theme="dark"]) .signal-table th, :where([data-theme="dark"]) .signal-table td { font-size: 11px; }
  :where([data-theme="dark"]) .signal-status { margin-top: 8px; font-size: 10px; }
  :where([data-theme="dark"]) .sparkline { height: 87px; }
  :where([data-theme="dark"]) .trade-button { min-height: 32px; font-size: 10px; }
  :where([data-theme="dark"]) .bottom-grid { grid-template-columns: 1fr; gap: 20px; margin-top: 23px; }
  :where([data-theme="dark"]) .performance-panel { grid-template-columns: minmax(0,1fr) 145px; gap: 24px; padding: 20px; }
  :where([data-theme="dark"]) .performance-panel h2 { font-size: 18px; }
  :where([data-theme="dark"]) .performance-panel select { max-width: 95px; font-size: 9px; }
  :where([data-theme="dark"]) .performance-chart { min-height: 140px; }
  :where([data-theme="dark"]) .performance-stats h3 { font-size: 12px; }
  :where([data-theme="dark"]) .performance-stats strong { font-size: 36px; }
  :where([data-theme="dark"]) .stat-trend, :where([data-theme="dark"]) .stat-note { font-size: 9px; }
  :where([data-theme="dark"]) .chart-legend { font-size: 9px; }
  :where([data-theme="dark"]) .footer-panel { padding: 15px 20px 0; }
  :where([data-theme="dark"]) .brand-footer { font-size: 26px; }
  :where([data-theme="dark"]) .brand-footer .brand-symbol { height: 41px; width: 36px; }
  :where([data-theme="dark"]) .footer-socials button { height: 27px; width: 27px; }
  :where([data-theme="dark"]) .footer-columns { padding: 17px 0 20px; gap: 20px; }
  :where([data-theme="dark"]) .footer-columns h3 { font-size: 12px; }
  :where([data-theme="dark"]) .footer-columns p, :where([data-theme="dark"]) .footer-columns a, :where([data-theme="dark"]) .footer-columns button { font-size: 11px; }
  :where([data-theme="dark"]) .footer-bottom { font-size: 9px; padding: 12px 0; }
  :where([data-theme="dark"]) .demo-notice { font-size: 8px; padding: 16px 0 20px; }
}
@media (max-width: 540px) {
  :where([data-theme="dark"]) .site-header { height: 73px; padding: 0 20px; }
  :where([data-theme="dark"]) main { padding: 0 20px; }
  :where([data-theme="dark"]) .brand { font-size: 27px; }
  :where([data-theme="dark"]) .brand-symbol { height: 46px; width: 40px; }
  :where([data-theme="dark"]) .main-nav { top: 73px; }
  :where([data-theme="dark"]) .hero { min-height: 0; padding: 39px 0 16px; }
  :where([data-theme="dark"]) .hero-copy { width: 100%; }
  :where([data-theme="dark"]) h1 { font-size: clamp(30px, 7.8vw, 41px); letter-spacing: -1px; line-height: 1.13; }
  :where([data-theme="dark"]) .hero-description { font-size: 12px; line-height: 1.8; max-width: 365px; margin-top: 15px; }
  :where([data-theme="dark"]) .hero-actions { gap: 12px; margin-top: 22px; }
  :where([data-theme="dark"]) .hero-actions .button { min-height: 38px; font-size: 9px; padding: 0 19px; }
  :where([data-theme="dark"]) .hero-visual { position: relative; width: 100%; height: 278px; top: auto; right: auto; margin-top: 9px; }
  :where([data-theme="dark"]) .hero-visual img { width: 336px; height: 292px; max-height: none; max-width: 104%; }
  :where([data-theme="dark"]) .hero-glow { height: 98%; }
  :where([data-theme="dark"]) .section-heading h2 { font-size: 18px; }
  :where([data-theme="dark"]) .signal-grid { gap: 12px; grid-auto-columns: 178px; scrollbar-color: #205b48 transparent; }
  :where([data-theme="dark"]) .signal-card { min-height: 216px; padding: 13px 12px; }
  :where([data-theme="dark"]) .signal-name { font-size: 12px; }
  :where([data-theme="dark"]) .signal-top { margin-bottom: 11px; }
  :where([data-theme="dark"]) .signal-table th, :where([data-theme="dark"]) .signal-table td { font-size: 11px; }
  :where([data-theme="dark"]) .signal-status { margin-top: 11px; }
  :where([data-theme="dark"]) .sparkline { height: 79px; }
  :where([data-theme="dark"]) .trade-button { min-height: 31px; font-size: 9px; }
  :where([data-theme="dark"]) .section-underline { margin-top: 4px; }
  :where([data-theme="dark"]) .performance-panel { grid-template-columns: minmax(0,1fr) 104px; gap: 12px; padding: 16px 12px; min-height: 173px; }
  :where([data-theme="dark"]) .performance-panel h2 { font-size: 12px; }
  :where([data-theme="dark"]) .performance-panel select { max-width: 61px; font-size: 7px; }
  :where([data-theme="dark"]) .performance-chart { min-height: 109px; }
  :where([data-theme="dark"]) .performance-stats h3 { font-size: 9px; }
  :where([data-theme="dark"]) .performance-stats strong { font-size: 29px; }
  :where([data-theme="dark"]) .stat-trend, :where([data-theme="dark"]) .stat-note { font-size: 7px; }
  :where([data-theme="dark"]) .chart-legend { font-size: 7px; }
  :where([data-theme="dark"]) .footer-panel { padding: 13px 15px 0; }
  :where([data-theme="dark"]) .footer-columns { gap: 10px; grid-template-columns: 1.4fr 1fr .75fr; }
  :where([data-theme="dark"]) .footer-columns h3 { font-size: 10px; }
  :where([data-theme="dark"]) .footer-columns p, :where([data-theme="dark"]) .footer-columns a, :where([data-theme="dark"]) .footer-columns button { font-size: 9px; }
  :where([data-theme="dark"]) .footer-bottom { font-size: 7px; }
  :where([data-theme="dark"]) .demo-notice { font-size: 7px; }
}
@media (max-width: 365px) {
  :where([data-theme="dark"]) .site-header { padding: 0 14px; }
  :where([data-theme="dark"]) main { padding: 0 14px; }
  :where([data-theme="dark"]) .hero-actions { gap: 9px; }
  :where([data-theme="dark"]) .hero-actions .button { padding: 0 14px; font-size: 8px; }
  :where([data-theme="dark"]) .performance-panel { grid-template-columns: minmax(0,1fr) 92px; gap: 8px; }
  :where([data-theme="dark"]) .performance-panel h2 { font-size: 11px; }
  :where([data-theme="dark"]) .performance-panel select { max-width: 54px; font-size: 7px; }
}