@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap');/* vanilla-extract-css-ns:src/css/reset.css.ts.vanilla.css?source=Lmlla2JjYzAgewogIGJvcmRlcjogMDsKICBib3gtc2l6aW5nOiBib3JkZXItYm94OwogIGZvbnQtc2l6ZTogMTAwJTsKICBsaW5lLWhlaWdodDogbm9ybWFsOwogIG1hcmdpbjogMDsKICBwYWRkaW5nOiAwOwogIHRleHQtYWxpZ246IGxlZnQ7CiAgdmVydGljYWwtYWxpZ246IGJhc2VsaW5lOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmlla2JjYzEgewogIGxpc3Qtc3R5bGU6IG5vbmU7Cn0KLmlla2JjYzIgewogIHF1b3Rlczogbm9uZTsKfQouaWVrYmNjMjpiZWZvcmUsIC5pZWtiY2MyOmFmdGVyIHsKICBjb250ZW50OiAnJzsKfQouaWVrYmNjMyB7CiAgYm9yZGVyLWNvbGxhcHNlOiBjb2xsYXBzZTsKICBib3JkZXItc3BhY2luZzogMDsKfQouaWVrYmNjNCB7CiAgYXBwZWFyYW5jZTogbm9uZTsKfQouaWVrYmNjNSB7CiAgb3V0bGluZTogbm9uZTsKfQouaWVrYmNjNTo6cGxhY2Vob2xkZXIgewogIG9wYWNpdHk6IDE7Cn0KLmlla2JjYzYgewogIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50OwogIGNvbG9yOiBpbmhlcml0Owp9Ci5pZWtiY2M3OmRpc2FibGVkIHsKICBvcGFjaXR5OiAxOwp9Ci5pZWtiY2M3OjotbXMtZXhwYW5kIHsKICBkaXNwbGF5OiBub25lOwp9Ci5pZWtiY2M4OjotbXMtY2xlYXIgewogIGRpc3BsYXk6IG5vbmU7Cn0KLmlla2JjYzg6Oi13ZWJraXQtc2VhcmNoLWNhbmNlbC1idXR0b24gewogIC13ZWJraXQtYXBwZWFyYW5jZTogbm9uZTsKfQouaWVrYmNjOSB7CiAgYmFja2dyb3VuZDogbm9uZTsKICBjdXJzb3I6IHBvaW50ZXI7CiAgdGV4dC1hbGlnbjogbGVmdDsKfQouaWVrYmNjYSB7CiAgY29sb3I6IGluaGVyaXQ7CiAgdGV4dC1kZWNvcmF0aW9uOiBub25lOwp9 */
[data-rk] .iekbcc0 {
  border: 0;
  box-sizing: border-box;
  font-size: 100%;
  line-height: normal;
  margin: 0;
  padding: 0;
  text-align: left;
  vertical-align: baseline;
  -webkit-tap-highlight-color: transparent;
}
[data-rk] .iekbcc1 {
  list-style: none;
}
[data-rk] .iekbcc2 {
  quotes: none;
}
[data-rk] .iekbcc2:before,
[data-rk] .iekbcc2:after {
  content: "";
}
[data-rk] .iekbcc3 {
  border-collapse: collapse;
  border-spacing: 0;
}
[data-rk] .iekbcc4 {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
[data-rk] .iekbcc5 {
  outline: none;
}
[data-rk] .iekbcc5::-moz-placeholder {
  opacity: 1;
}
[data-rk] .iekbcc5::placeholder {
  opacity: 1;
}
[data-rk] .iekbcc6 {
  background-color: transparent;
  color: inherit;
}
[data-rk] .iekbcc7:disabled {
  opacity: 1;
}
[data-rk] .iekbcc7::-ms-expand {
  display: none;
}
[data-rk] .iekbcc8::-ms-clear {
  display: none;
}
[data-rk] .iekbcc8::-webkit-search-cancel-button {
  -webkit-appearance: none;
}
[data-rk] .iekbcc9 {
  background: none;
  cursor: pointer;
  text-align: left;
}
[data-rk] .iekbcca {
  color: inherit;
  text-decoration: none;
}

/* vanilla-extract-css-ns:src/css/sprinkles.css.ts.vanilla.css?source=#H4sIAAAAAAAAE6Vdy67rxhHc-yu0CWAvZOhJPbJJrp0gBhJkEQNZU-SQ4hFF6pDU6wT-90DiebCre2aavDtbXV3TNdMcFTm8Rz-_nOfB6jIZ_e-H0SjMs7QYZ4051ttRkpvbuG7CqvnzD3_88HOLm1lwpog7qAVHRaZoTNXBBE9MnNWnPLxvR0VZmE50TaO7vIwOnXBIw48SOtGIRrMizwi56ZRXmzyxaE1kGJWaMhBTun9CdmF0SKvyXMTjOnsz21FUXggsa2FlFZtqXIVxdq63o-mpK-xFggQEchBZJgSTi5g5wRwlzCWsfhyPq8Pzg2wcRk1WFt_OTVMWP3VyC0VuVBaFiRqeXCqSj6Y488yTJrOMw7yb9KpN-le5y3LTTa2k1NnyTx1ILUE2m82GzHXTRdXNPTfbUV3mWbfPzl3MNYub_XZEV_UiIGj7XAXEjCBuAmJBEPcnIjpXdVltR6cyg2Z_I3G4qqftNvOeNTYXUzQ1R01FVJjnXVC7Ex2zYrw3WbpvtqM1KXQ6Z4AFlTJtt6nnRR1nlXl283ZUldcuaCmCojI_H4surt3PkrJoxkl4zPJ7p40en9bjXRnfu_0zXX2ltFvC9Lkao9Fjv_qsegq61ixrrsjasKyFIitkWYGQNaONON2xrLWUBasRYVZL68mKWZY0GzN6wU3NV9b1ozkmky4i4YglRaQcEVDEniNWFJFxxJoi2i0_DU_bEfn88PU5vcin-VeEXtzT41eEbvbT4isC81t-RZY0cvqK0K-g6etXBPqp6lQNTVN3QlB30wlBeedOCKq4dEJQxrUzRVDGrROCse6dEBC-dWaWFj-bdEK0wtm0M-t0rNmsM7kQmn-FxnTpZ-2G9nkx0-CSBKHKgARhxBUJUumzNR0TeDd0UDrZs5BGYdgdjcK4EYnOgTmmUajK0CiMm9AoLFpKZwrG3dMoMGc0CopeSHQJuQcSDWDcHOYZwke6SJNJ16TMChI9hreHO2tMQYx_uxG8nOsmS-4fANtdwskBpv559ipDmYueVTKwPoWRGe9MczWm-4U8q1348OnEu_B2k2nMrRk_3fx2lJuEiDozBC_ywjBZsTdVRoja7ecYVmlWjHdl05RHurvPbhICrue7hIFGf5MwdO-fTyQMbb75VMLQ74P5TMLQi2c-lzD0MpgvRO20oedLEUTVzwMRBNJWIgjqXosgKHwjLggUHoogqGkngmC4SFxbmIJYBIE6I3YA1JSIywugVALBt9R83wU9LjLa_POMx4HhhSNA94EjoO1zjgAxR46Ali84Aqa25AhYxpOgFnrmVYCA3kqAgJxagEC1jQCBcs_C1EO5FwECtVwFCAx0E1YQRN8FCCh6E1aZ1rKYCIsIkCmHQFMvyO5Xtd-k3a5ezAUAcCwECJW8WAoQ2tiLQICAnpUAoa29WAsQOreLjQChi7gIJdG0XRY7CQOyIwkDomIJAyUbCQM1J9IqQM2phIF69hIGxsqk5QTtLxIGdB2kNYd6cmlFAXMUMNjpZNNrSrgxXZQsDPknBgDBrwwAHV4xAMioGQC6u2EAmNAzA8DKXbhM6JErR4DQG0eAkDtHQKFvHEErXU74fNNKl1OOoHUsZxwBo8z5olG1ywVHUC3LJV9XqCPg6waIFUNA_y4_drab_JB0ucE46AgxDhXsMA4zFbHxYYCYFQDrZRgASkgYAGpIEQD3z8s9A0CRGQNADS8MAKt9YPMINeQMAEMcGQBkFgiAm-pliQC4r16e-FoA4pUtJ727XlYIkG-wl--bVlZY-rLBOKzIGeOg9YJxmKwrGx8GuLECYCruDAAlvDEArSGYIAD6MpgyAC0ymDEArSGYMwDty2DB5hFqWDIADBEwAMhcIQD6MlgjAPoy2PC1AETIlpP2ZbBDgNyXQbtfPQ4rk7y8bkf7LI7Jk5ag3bBOYRxnRSo-0AiMCKEdHiQiCBY4FUHUIQR7EQSTnIkg6hSCFxEELXMQQbDouTwFsGxHGQWTUMgoEFjKKCj-JKOg-ld5baD6SkZBXbWMghEbeaFhJs4yCjRe5H6Auq7yWgPqJqLAZQR3guJPOYI3AUA5VhMBQuWvpgKEXgurmQChklZzAUKvg9VCgNBJXi0FCF3TVSCJpj20WkkYkL2WMCBqI2Gg5FDCQM07aRWg5kjCQD2xhIGxjLScoD2RMKArldYc6tlLKwqYTMBAp6_oDik8-lgdJASw5BIGlB8lDHR7IWFAVSlhoN9PEgZm-VXCwIpWonZon1oEgfpGBIG0swiCui8iCAq_igsChd9EENR0F0Ew3Ju4tnQK1hMRRNWtp2IH0JrWM3F5ATSXQND-a7oxsuch6yWPA0PAEaB7xRG07ddrjgAxG46gLb8OOQKmdscRdBnXkaCW9sw6FiCg1wgQkJMIEKg2FSBQ7l6Yeig3EyBQy4sAgYEOwgqC6FyAgKKjsMpQSyEsIkBKDsGmft_9yjprX3cKd3WZnxvyhuYrYJLsZronqusKAJXJwya7EJJ25xtfze6QNeNz_XgBzuQmavgboe3-J3y_rN8PZquw-Bhq8vN0tqxHJqwJxYUBn_-dlNXRltJug87C2k1QvGlf37sxWPC3boyu0WbSjdFe2kzJeJR0MyMD0l7ezEkQhlyQIIy57AbhpnwTkCAUtCJBGHNNgrTbNxsyPzBmSIJAuyNBkBJ1g3DjvYm7Qbjp3hg6txBNyLLQm-1N2g3KN9qbr_eE46o8jZMsb0zVeYtwl5-run0Z9d8XU-UheZtwk32mt68ZdzKjMi-rehxGjxcWfnn8D8l82e4ft_eD8w_bx5vA769VDyHI-2T-vaxMCyMcx_4iLEzFADkWqlLB8fUO9bfne7eE4KRW5aR51Uty8gwphL84vakHqxLImuHaBLZzL5r_mKgs4rC6f_tMIGyXAUJ9nNchen2kNy9blJe14S_db-5Kibb8N60cC0E46ZMpyw-n_UVYmGYD5Fio5n6O7j-isLAstNIUXEu1OAVZMJTlb1VFvz_C1fdp5ITr7xTKGTf9qH4rClNZJi4cotZFuBuk1sUY9aP63dwakh8PkchYzCBdjCbpn8_XPx2qiFPtB8viXH7T-E6SPRY8zqKwAQatefTxqE2kj8hvJuPyWuRlGH97Prv_JaxiSxtrPaWaUG0t1Yx-h_lB9Xt5cvBojaaOTe03dXT-sgzrbK3H5JlqQ8lT_e4xNYWpwpx761DrFe0Mamdop_D7QJL7a3Yk6Voz6CRRO0IXy85vCx__ivS3xhzlpttpPaGHRm0IPTx-N_h8MvDt_fEBydV6QDuD2vnZKfx-7zNXkK-1eC4OtatzkfiNXJvNrq2d1rfZ8tU2zUbgd2XPTDRAO60bk7PVLkxO97uvzzzcArSey0qgdlpWBr-_-kz9vEUnBFp75aFRuysPj99cnaoyyXLz16dDI7laN2VnUNsnO4XfL5HcfzwqJgRao-ShUTskD4-6EPkJ5U5rk9wsasvkpvHbp_YMxsT_Pj2fbfE9TuuivERqM-Vl8nuqugmLeEevNK2VknLVDkpIjt6NU_s3IJ449YP8iHimQQzULg2imPfLlXsxWgyRYuFaDhJlIQtULK7H-NGqhzYn0bqPMCfTZhAFf4Afhd-hTaDbfY9CgS_qSeR5cB_Fg-T6WM0w1T7aRMFnecwfpWqhNoa9XpSNIuuXa5mGlyFSLFyHQaIsZLmGxf9oPzrqBSrYih4SFXTlcB72_DQ6fa9STvn63XI5Z-8CHQ_3o3qYZhdlM1Czi_PclwxvPaPLMKGM5zpQHSO6DWHg3XAfrouTvX2HOMYWa8yn5wAg1ptQH1MPM-qj0phS7UP_WO9N1ZQ9LKqaU-NUVQcAsd6w6vh6-FYdoca-suOCWO9VeW4PY8qTNS7UekgQ6z2nnaOHw7STaPyk65Ag1ptKJ00PZ-nk0dhL9zFBrPeWHqIextLDpHGV1mODWO8l7Rw9HKSdROMbHQcHsd4qulh6uEMXjb4MftXp_Z-NoYfds1Fo3J14oBDrXZ2c38PNyQQaF2c7UIj13s1K0cOx2TiMxqe5jxKM3qZ5iHq4NA-TxqRZjxaM3pXZOXrYMDuJxne5jxWM3nB5iHo4LQ-TxmI5jxeM3m65eXpYLzeRxob5jheM3o15qXqYMi-XxpsJxw9Gb8mk7B5OTEr_MGC3cb0P48dfO_jMaj-Am1iSTK3XIAowXYM4cn9ynIV5mZKso7Z4IbdQVy0kl_6s94voV9OEWV4LG95JW7yX6VUtxUulKIdeRCS71kpycDRqMQ6Ssz77v2GeG-J1zKWvDIHj2luGQHLzZ1-fWf8s05Jk3rUSLPlv6vJlgqT1WpZdzHIImnTdVc9U4qd65s6VSfIXYrLoVbWFZNmvfgtL4E53HWYmK40MJ8NapcFJsemXy88qk3CIDIFnN0iMQBRpGTwHkUncT5mPzvQU6ONLXESWs8kk9Wuype4V9dtyM2WSRepLr6otJId-9VtYcme6_2QxOSq0KGgKjRoFTzmAgJ3IJKfBojjX63BlnExfkuOUMKl7ynNxNX3lucjOahZ8wJRcempiBNe-QhjDrVcqX9z7AAmc5W2IDkaTOg2Y5-AvVRgxH4XGkPk4nMZMe6KXKvyZmktj09RkTremOsJLFaZNR6Txbjomp4Vjp3qpwq_xJI0541lOJ2Y9sEsVvsuerHFZ9mynp3KdyqUKY-XM17grJ4HTYrkP31KFv_IwaMyVh8LprKwnbqnCT9mTNS7Knu30To6DtVRhl1zpGofkylcMzC8NhQeypWosjy3X6XDEo7NU4WzkRI2jkTOdTsZ2PpYq_Is1V-NabMl7p1dxH3_tFVbFw6BxKh4Kp1GxnnntFc7EnqyxIvZsp_dwH2rtFabDw6BxGx4Kp81wnmDtFZbDTaCxH24GpxXxHVPtFY7Ey6ExJl4Spz8Rzqr2ClsipWncSDfvL0cTZ-GojipjilFYxKMfO38zfBWsT7efnlzvA7R_nc7xW9Kj0R9f6LkV_fyZOIJdStiPn2AjyNU7En5dmmA2iHn_jWkC2iGo_aVpgokR8_F70w_UH_8HNiLX2mB7AAA */
[data-rk] .ju367v0 {
  align-items: flex-start;
}
[data-rk] .ju367v2 {
  align-items: flex-end;
}
[data-rk] .ju367v4 {
  align-items: center;
}
[data-rk] .ju367v6 {
  display: none;
}
[data-rk] .ju367v8 {
  display: block;
}
[data-rk] .ju367va {
  display: flex;
}
[data-rk] .ju367vc {
  display: inline;
}
[data-rk] .ju367ve {
  align-self: flex-start;
}
[data-rk] .ju367vf {
  align-self: flex-end;
}
[data-rk] .ju367vg {
  align-self: center;
}
[data-rk] .ju367vh {
  background-size: cover;
}
[data-rk] .ju367vi {
  border-radius: 1px;
}
[data-rk] .ju367vj {
  border-radius: 6px;
}
[data-rk] .ju367vk {
  border-radius: 10px;
}
[data-rk] .ju367vl {
  border-radius: 13px;
}
[data-rk] .ju367vm {
  border-radius: var(--rk-radii-actionButton);
}
[data-rk] .ju367vn {
  border-radius: var(--rk-radii-connectButton);
}
[data-rk] .ju367vo {
  border-radius: var(--rk-radii-menuButton);
}
[data-rk] .ju367vp {
  border-radius: var(--rk-radii-modal);
}
[data-rk] .ju367vq {
  border-radius: var(--rk-radii-modalMobile);
}
[data-rk] .ju367vr {
  border-radius: 25%;
}
[data-rk] .ju367vs {
  border-radius: 9999px;
}
[data-rk] .ju367vt {
  border-style: solid;
}
[data-rk] .ju367vu {
  border-width: 0px;
}
[data-rk] .ju367vv {
  border-width: 1px;
}
[data-rk] .ju367vw {
  border-width: 2px;
}
[data-rk] .ju367vx {
  border-width: 4px;
}
[data-rk] .ju367vy {
  cursor: pointer;
}
[data-rk] .ju367vz {
  cursor: none;
}
[data-rk] .ju367v10 {
  pointer-events: none;
}
[data-rk] .ju367v11 {
  pointer-events: all;
}
[data-rk] .ju367v12 {
  min-height: 8px;
}
[data-rk] .ju367v13 {
  min-height: 44px;
}
[data-rk] .ju367v14 {
  flex-direction: row;
}
[data-rk] .ju367v15 {
  flex-direction: column;
}
[data-rk] .ju367v16 {
  font-family: var(--rk-fonts-body);
}
[data-rk] .ju367v17 {
  font-size: 12px;
  line-height: 18px;
}
[data-rk] .ju367v18 {
  font-size: 13px;
  line-height: 18px;
}
[data-rk] .ju367v19 {
  font-size: 14px;
  line-height: 18px;
}
[data-rk] .ju367v1a {
  font-size: 16px;
  line-height: 20px;
}
[data-rk] .ju367v1b {
  font-size: 18px;
  line-height: 24px;
}
[data-rk] .ju367v1c {
  font-size: 20px;
  line-height: 24px;
}
[data-rk] .ju367v1d {
  font-size: 23px;
  line-height: 29px;
}
[data-rk] .ju367v1e {
  font-weight: 400;
}
[data-rk] .ju367v1f {
  font-weight: 500;
}
[data-rk] .ju367v1g {
  font-weight: 600;
}
[data-rk] .ju367v1h {
  font-weight: 700;
}
[data-rk] .ju367v1i {
  font-weight: 800;
}
[data-rk] .ju367v1j {
  gap: 0;
}
[data-rk] .ju367v1k {
  gap: 1px;
}
[data-rk] .ju367v1l {
  gap: 2px;
}
[data-rk] .ju367v1m {
  gap: 3px;
}
[data-rk] .ju367v1n {
  gap: 4px;
}
[data-rk] .ju367v1o {
  gap: 5px;
}
[data-rk] .ju367v1p {
  gap: 6px;
}
[data-rk] .ju367v1q {
  gap: 8px;
}
[data-rk] .ju367v1r {
  gap: 10px;
}
[data-rk] .ju367v1s {
  gap: 12px;
}
[data-rk] .ju367v1t {
  gap: 14px;
}
[data-rk] .ju367v1u {
  gap: 16px;
}
[data-rk] .ju367v1v {
  gap: 18px;
}
[data-rk] .ju367v1w {
  gap: 20px;
}
[data-rk] .ju367v1x {
  gap: 24px;
}
[data-rk] .ju367v1y {
  gap: 28px;
}
[data-rk] .ju367v1z {
  gap: 32px;
}
[data-rk] .ju367v20 {
  gap: 36px;
}
[data-rk] .ju367v21 {
  gap: 44px;
}
[data-rk] .ju367v22 {
  gap: 64px;
}
[data-rk] .ju367v23 {
  gap: -1px;
}
[data-rk] .ju367v24 {
  height: 1px;
}
[data-rk] .ju367v25 {
  height: 2px;
}
[data-rk] .ju367v26 {
  height: 4px;
}
[data-rk] .ju367v27 {
  height: 8px;
}
[data-rk] .ju367v28 {
  height: 12px;
}
[data-rk] .ju367v29 {
  height: 20px;
}
[data-rk] .ju367v2a {
  height: 24px;
}
[data-rk] .ju367v2b {
  height: 28px;
}
[data-rk] .ju367v2c {
  height: 30px;
}
[data-rk] .ju367v2d {
  height: 32px;
}
[data-rk] .ju367v2e {
  height: 34px;
}
[data-rk] .ju367v2f {
  height: 36px;
}
[data-rk] .ju367v2g {
  height: 40px;
}
[data-rk] .ju367v2h {
  height: 44px;
}
[data-rk] .ju367v2i {
  height: 48px;
}
[data-rk] .ju367v2j {
  height: 54px;
}
[data-rk] .ju367v2k {
  height: 60px;
}
[data-rk] .ju367v2l {
  height: 200px;
}
[data-rk] .ju367v2m {
  height: 100%;
}
[data-rk] .ju367v2n {
  height: -moz-max-content;
  height: max-content;
}
[data-rk] .ju367v2o {
  justify-content: flex-start;
}
[data-rk] .ju367v2p {
  justify-content: flex-end;
}
[data-rk] .ju367v2q {
  justify-content: center;
}
[data-rk] .ju367v2r {
  justify-content: space-between;
}
[data-rk] .ju367v2s {
  justify-content: space-around;
}
[data-rk] .ju367v2t {
  text-align: left;
}
[data-rk] .ju367v2u {
  text-align: center;
}
[data-rk] .ju367v2v {
  text-align: inherit;
}
[data-rk] .ju367v2w {
  margin-bottom: 0;
}
[data-rk] .ju367v2x {
  margin-bottom: 1px;
}
[data-rk] .ju367v2y {
  margin-bottom: 2px;
}
[data-rk] .ju367v2z {
  margin-bottom: 3px;
}
[data-rk] .ju367v30 {
  margin-bottom: 4px;
}
[data-rk] .ju367v31 {
  margin-bottom: 5px;
}
[data-rk] .ju367v32 {
  margin-bottom: 6px;
}
[data-rk] .ju367v33 {
  margin-bottom: 8px;
}
[data-rk] .ju367v34 {
  margin-bottom: 10px;
}
[data-rk] .ju367v35 {
  margin-bottom: 12px;
}
[data-rk] .ju367v36 {
  margin-bottom: 14px;
}
[data-rk] .ju367v37 {
  margin-bottom: 16px;
}
[data-rk] .ju367v38 {
  margin-bottom: 18px;
}
[data-rk] .ju367v39 {
  margin-bottom: 20px;
}
[data-rk] .ju367v3a {
  margin-bottom: 24px;
}
[data-rk] .ju367v3b {
  margin-bottom: 28px;
}
[data-rk] .ju367v3c {
  margin-bottom: 32px;
}
[data-rk] .ju367v3d {
  margin-bottom: 36px;
}
[data-rk] .ju367v3e {
  margin-bottom: 44px;
}
[data-rk] .ju367v3f {
  margin-bottom: 64px;
}
[data-rk] .ju367v3g {
  margin-bottom: -1px;
}
[data-rk] .ju367v3h {
  margin-left: 0;
}
[data-rk] .ju367v3i {
  margin-left: 1px;
}
[data-rk] .ju367v3j {
  margin-left: 2px;
}
[data-rk] .ju367v3k {
  margin-left: 3px;
}
[data-rk] .ju367v3l {
  margin-left: 4px;
}
[data-rk] .ju367v3m {
  margin-left: 5px;
}
[data-rk] .ju367v3n {
  margin-left: 6px;
}
[data-rk] .ju367v3o {
  margin-left: 8px;
}
[data-rk] .ju367v3p {
  margin-left: 10px;
}
[data-rk] .ju367v3q {
  margin-left: 12px;
}
[data-rk] .ju367v3r {
  margin-left: 14px;
}
[data-rk] .ju367v3s {
  margin-left: 16px;
}
[data-rk] .ju367v3t {
  margin-left: 18px;
}
[data-rk] .ju367v3u {
  margin-left: 20px;
}
[data-rk] .ju367v3v {
  margin-left: 24px;
}
[data-rk] .ju367v3w {
  margin-left: 28px;
}
[data-rk] .ju367v3x {
  margin-left: 32px;
}
[data-rk] .ju367v3y {
  margin-left: 36px;
}
[data-rk] .ju367v3z {
  margin-left: 44px;
}
[data-rk] .ju367v40 {
  margin-left: 64px;
}
[data-rk] .ju367v41 {
  margin-left: -1px;
}
[data-rk] .ju367v42 {
  margin-right: 0;
}
[data-rk] .ju367v43 {
  margin-right: 1px;
}
[data-rk] .ju367v44 {
  margin-right: 2px;
}
[data-rk] .ju367v45 {
  margin-right: 3px;
}
[data-rk] .ju367v46 {
  margin-right: 4px;
}
[data-rk] .ju367v47 {
  margin-right: 5px;
}
[data-rk] .ju367v48 {
  margin-right: 6px;
}
[data-rk] .ju367v49 {
  margin-right: 8px;
}
[data-rk] .ju367v4a {
  margin-right: 10px;
}
[data-rk] .ju367v4b {
  margin-right: 12px;
}
[data-rk] .ju367v4c {
  margin-right: 14px;
}
[data-rk] .ju367v4d {
  margin-right: 16px;
}
[data-rk] .ju367v4e {
  margin-right: 18px;
}
[data-rk] .ju367v4f {
  margin-right: 20px;
}
[data-rk] .ju367v4g {
  margin-right: 24px;
}
[data-rk] .ju367v4h {
  margin-right: 28px;
}
[data-rk] .ju367v4i {
  margin-right: 32px;
}
[data-rk] .ju367v4j {
  margin-right: 36px;
}
[data-rk] .ju367v4k {
  margin-right: 44px;
}
[data-rk] .ju367v4l {
  margin-right: 64px;
}
[data-rk] .ju367v4m {
  margin-right: -1px;
}
[data-rk] .ju367v4n {
  margin-top: 0;
}
[data-rk] .ju367v4o {
  margin-top: 1px;
}
[data-rk] .ju367v4p {
  margin-top: 2px;
}
[data-rk] .ju367v4q {
  margin-top: 3px;
}
[data-rk] .ju367v4r {
  margin-top: 4px;
}
[data-rk] .ju367v4s {
  margin-top: 5px;
}
[data-rk] .ju367v4t {
  margin-top: 6px;
}
[data-rk] .ju367v4u {
  margin-top: 8px;
}
[data-rk] .ju367v4v {
  margin-top: 10px;
}
[data-rk] .ju367v4w {
  margin-top: 12px;
}
[data-rk] .ju367v4x {
  margin-top: 14px;
}
[data-rk] .ju367v4y {
  margin-top: 16px;
}
[data-rk] .ju367v4z {
  margin-top: 18px;
}
[data-rk] .ju367v50 {
  margin-top: 20px;
}
[data-rk] .ju367v51 {
  margin-top: 24px;
}
[data-rk] .ju367v52 {
  margin-top: 28px;
}
[data-rk] .ju367v53 {
  margin-top: 32px;
}
[data-rk] .ju367v54 {
  margin-top: 36px;
}
[data-rk] .ju367v55 {
  margin-top: 44px;
}
[data-rk] .ju367v56 {
  margin-top: 64px;
}
[data-rk] .ju367v57 {
  margin-top: -1px;
}
[data-rk] .ju367v58 {
  max-width: 1px;
}
[data-rk] .ju367v59 {
  max-width: 2px;
}
[data-rk] .ju367v5a {
  max-width: 4px;
}
[data-rk] .ju367v5b {
  max-width: 8px;
}
[data-rk] .ju367v5c {
  max-width: 12px;
}
[data-rk] .ju367v5d {
  max-width: 20px;
}
[data-rk] .ju367v5e {
  max-width: 24px;
}
[data-rk] .ju367v5f {
  max-width: 28px;
}
[data-rk] .ju367v5g {
  max-width: 30px;
}
[data-rk] .ju367v5h {
  max-width: 32px;
}
[data-rk] .ju367v5i {
  max-width: 34px;
}
[data-rk] .ju367v5j {
  max-width: 36px;
}
[data-rk] .ju367v5k {
  max-width: 40px;
}
[data-rk] .ju367v5l {
  max-width: 44px;
}
[data-rk] .ju367v5m {
  max-width: 48px;
}
[data-rk] .ju367v5n {
  max-width: 54px;
}
[data-rk] .ju367v5o {
  max-width: 60px;
}
[data-rk] .ju367v5p {
  max-width: 200px;
}
[data-rk] .ju367v5q {
  max-width: 100%;
}
[data-rk] .ju367v5r {
  max-width: -moz-max-content;
  max-width: max-content;
}
[data-rk] .ju367v5s {
  min-width: 1px;
}
[data-rk] .ju367v5t {
  min-width: 2px;
}
[data-rk] .ju367v5u {
  min-width: 4px;
}
[data-rk] .ju367v5v {
  min-width: 8px;
}
[data-rk] .ju367v5w {
  min-width: 12px;
}
[data-rk] .ju367v5x {
  min-width: 20px;
}
[data-rk] .ju367v5y {
  min-width: 24px;
}
[data-rk] .ju367v5z {
  min-width: 28px;
}
[data-rk] .ju367v60 {
  min-width: 30px;
}
[data-rk] .ju367v61 {
  min-width: 32px;
}
[data-rk] .ju367v62 {
  min-width: 34px;
}
[data-rk] .ju367v63 {
  min-width: 36px;
}
[data-rk] .ju367v64 {
  min-width: 40px;
}
[data-rk] .ju367v65 {
  min-width: 44px;
}
[data-rk] .ju367v66 {
  min-width: 48px;
}
[data-rk] .ju367v67 {
  min-width: 54px;
}
[data-rk] .ju367v68 {
  min-width: 60px;
}
[data-rk] .ju367v69 {
  min-width: 200px;
}
[data-rk] .ju367v6a {
  min-width: 100%;
}
[data-rk] .ju367v6b {
  min-width: -moz-max-content;
  min-width: max-content;
}
[data-rk] .ju367v6c {
  overflow: hidden;
}
[data-rk] .ju367v6d {
  padding-bottom: 0;
}
[data-rk] .ju367v6e {
  padding-bottom: 1px;
}
[data-rk] .ju367v6f {
  padding-bottom: 2px;
}
[data-rk] .ju367v6g {
  padding-bottom: 3px;
}
[data-rk] .ju367v6h {
  padding-bottom: 4px;
}
[data-rk] .ju367v6i {
  padding-bottom: 5px;
}
[data-rk] .ju367v6j {
  padding-bottom: 6px;
}
[data-rk] .ju367v6k {
  padding-bottom: 8px;
}
[data-rk] .ju367v6l {
  padding-bottom: 10px;
}
[data-rk] .ju367v6m {
  padding-bottom: 12px;
}
[data-rk] .ju367v6n {
  padding-bottom: 14px;
}
[data-rk] .ju367v6o {
  padding-bottom: 16px;
}
[data-rk] .ju367v6p {
  padding-bottom: 18px;
}
[data-rk] .ju367v6q {
  padding-bottom: 20px;
}
[data-rk] .ju367v6r {
  padding-bottom: 24px;
}
[data-rk] .ju367v6s {
  padding-bottom: 28px;
}
[data-rk] .ju367v6t {
  padding-bottom: 32px;
}
[data-rk] .ju367v6u {
  padding-bottom: 36px;
}
[data-rk] .ju367v6v {
  padding-bottom: 44px;
}
[data-rk] .ju367v6w {
  padding-bottom: 64px;
}
[data-rk] .ju367v6x {
  padding-bottom: -1px;
}
[data-rk] .ju367v6y {
  padding-left: 0;
}
[data-rk] .ju367v6z {
  padding-left: 1px;
}
[data-rk] .ju367v70 {
  padding-left: 2px;
}
[data-rk] .ju367v71 {
  padding-left: 3px;
}
[data-rk] .ju367v72 {
  padding-left: 4px;
}
[data-rk] .ju367v73 {
  padding-left: 5px;
}
[data-rk] .ju367v74 {
  padding-left: 6px;
}
[data-rk] .ju367v75 {
  padding-left: 8px;
}
[data-rk] .ju367v76 {
  padding-left: 10px;
}
[data-rk] .ju367v77 {
  padding-left: 12px;
}
[data-rk] .ju367v78 {
  padding-left: 14px;
}
[data-rk] .ju367v79 {
  padding-left: 16px;
}
[data-rk] .ju367v7a {
  padding-left: 18px;
}
[data-rk] .ju367v7b {
  padding-left: 20px;
}
[data-rk] .ju367v7c {
  padding-left: 24px;
}
[data-rk] .ju367v7d {
  padding-left: 28px;
}
[data-rk] .ju367v7e {
  padding-left: 32px;
}
[data-rk] .ju367v7f {
  padding-left: 36px;
}
[data-rk] .ju367v7g {
  padding-left: 44px;
}
[data-rk] .ju367v7h {
  padding-left: 64px;
}
[data-rk] .ju367v7i {
  padding-left: -1px;
}
[data-rk] .ju367v7j {
  padding-right: 0;
}
[data-rk] .ju367v7k {
  padding-right: 1px;
}
[data-rk] .ju367v7l {
  padding-right: 2px;
}
[data-rk] .ju367v7m {
  padding-right: 3px;
}
[data-rk] .ju367v7n {
  padding-right: 4px;
}
[data-rk] .ju367v7o {
  padding-right: 5px;
}
[data-rk] .ju367v7p {
  padding-right: 6px;
}
[data-rk] .ju367v7q {
  padding-right: 8px;
}
[data-rk] .ju367v7r {
  padding-right: 10px;
}
[data-rk] .ju367v7s {
  padding-right: 12px;
}
[data-rk] .ju367v7t {
  padding-right: 14px;
}
[data-rk] .ju367v7u {
  padding-right: 16px;
}
[data-rk] .ju367v7v {
  padding-right: 18px;
}
[data-rk] .ju367v7w {
  padding-right: 20px;
}
[data-rk] .ju367v7x {
  padding-right: 24px;
}
[data-rk] .ju367v7y {
  padding-right: 28px;
}
[data-rk] .ju367v7z {
  padding-right: 32px;
}
[data-rk] .ju367v80 {
  padding-right: 36px;
}
[data-rk] .ju367v81 {
  padding-right: 44px;
}
[data-rk] .ju367v82 {
  padding-right: 64px;
}
[data-rk] .ju367v83 {
  padding-right: -1px;
}
[data-rk] .ju367v84 {
  padding-top: 0;
}
[data-rk] .ju367v85 {
  padding-top: 1px;
}
[data-rk] .ju367v86 {
  padding-top: 2px;
}
[data-rk] .ju367v87 {
  padding-top: 3px;
}
[data-rk] .ju367v88 {
  padding-top: 4px;
}
[data-rk] .ju367v89 {
  padding-top: 5px;
}
[data-rk] .ju367v8a {
  padding-top: 6px;
}
[data-rk] .ju367v8b {
  padding-top: 8px;
}
[data-rk] .ju367v8c {
  padding-top: 10px;
}
[data-rk] .ju367v8d {
  padding-top: 12px;
}
[data-rk] .ju367v8e {
  padding-top: 14px;
}
[data-rk] .ju367v8f {
  padding-top: 16px;
}
[data-rk] .ju367v8g {
  padding-top: 18px;
}
[data-rk] .ju367v8h {
  padding-top: 20px;
}
[data-rk] .ju367v8i {
  padding-top: 24px;
}
[data-rk] .ju367v8j {
  padding-top: 28px;
}
[data-rk] .ju367v8k {
  padding-top: 32px;
}
[data-rk] .ju367v8l {
  padding-top: 36px;
}
[data-rk] .ju367v8m {
  padding-top: 44px;
}
[data-rk] .ju367v8n {
  padding-top: 64px;
}
[data-rk] .ju367v8o {
  padding-top: -1px;
}
[data-rk] .ju367v8p {
  position: absolute;
}
[data-rk] .ju367v8q {
  position: fixed;
}
[data-rk] .ju367v8r {
  position: relative;
}
[data-rk] .ju367v8s {
  -webkit-user-select: none;
}
[data-rk] .ju367v8t {
  right: 0;
}
[data-rk] .ju367v8u {
  transition: 0.125s ease;
}
[data-rk] .ju367v8v {
  transition: transform 0.125s ease;
}
[data-rk] .ju367v8w {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
[data-rk] .ju367v8x {
  width: 1px;
}
[data-rk] .ju367v8y {
  width: 2px;
}
[data-rk] .ju367v8z {
  width: 4px;
}
[data-rk] .ju367v90 {
  width: 8px;
}
[data-rk] .ju367v91 {
  width: 12px;
}
[data-rk] .ju367v92 {
  width: 20px;
}
[data-rk] .ju367v93 {
  width: 24px;
}
[data-rk] .ju367v94 {
  width: 28px;
}
[data-rk] .ju367v95 {
  width: 30px;
}
[data-rk] .ju367v96 {
  width: 32px;
}
[data-rk] .ju367v97 {
  width: 34px;
}
[data-rk] .ju367v98 {
  width: 36px;
}
[data-rk] .ju367v99 {
  width: 40px;
}
[data-rk] .ju367v9a {
  width: 44px;
}
[data-rk] .ju367v9b {
  width: 48px;
}
[data-rk] .ju367v9c {
  width: 54px;
}
[data-rk] .ju367v9d {
  width: 60px;
}
[data-rk] .ju367v9e {
  width: 200px;
}
[data-rk] .ju367v9f {
  width: 100%;
}
[data-rk] .ju367v9g {
  width: -moz-max-content;
  width: max-content;
}
[data-rk] .ju367v9h {
  backdrop-filter: var(--rk-blurs-modalOverlay);
}
[data-rk] .ju367v9i {
  background: var(--rk-colors-accentColor);
}
[data-rk] .ju367v9j:hover {
  background: var(--rk-colors-accentColor);
}
[data-rk] .ju367v9k:active {
  background: var(--rk-colors-accentColor);
}
[data-rk] .ju367v9l {
  background: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367v9m:hover {
  background: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367v9n:active {
  background: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367v9o {
  background: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367v9p:hover {
  background: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367v9q:active {
  background: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367v9r {
  background: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367v9s:hover {
  background: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367v9t:active {
  background: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367v9u {
  background: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367v9v:hover {
  background: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367v9w:active {
  background: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367v9x {
  background: var(--rk-colors-closeButton);
}
[data-rk] .ju367v9y:hover {
  background: var(--rk-colors-closeButton);
}
[data-rk] .ju367v9z:active {
  background: var(--rk-colors-closeButton);
}
[data-rk] .ju367va0 {
  background: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367va1:hover {
  background: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367va2:active {
  background: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367va3 {
  background: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367va4:hover {
  background: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367va5:active {
  background: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367va6 {
  background: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367va7:hover {
  background: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367va8:active {
  background: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367va9 {
  background: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vaa:hover {
  background: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vab:active {
  background: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vac {
  background: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vad:hover {
  background: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vae:active {
  background: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vaf {
  background: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vag:hover {
  background: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vah:active {
  background: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vai {
  background: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367vaj:hover {
  background: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367vak:active {
  background: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367val {
  background: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367vam:hover {
  background: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367van:active {
  background: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367vao {
  background: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367vap:hover {
  background: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367vaq:active {
  background: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367var {
  background: var(--rk-colors-error);
}
[data-rk] .ju367vas:hover {
  background: var(--rk-colors-error);
}
[data-rk] .ju367vat:active {
  background: var(--rk-colors-error);
}
[data-rk] .ju367vau {
  background: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vav:hover {
  background: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vaw:active {
  background: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vax {
  background: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vay:hover {
  background: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vaz:active {
  background: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vb0 {
  background: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vb1:hover {
  background: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vb2:active {
  background: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vb3 {
  background: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vb4:hover {
  background: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vb5:active {
  background: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vb6 {
  background: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vb7:hover {
  background: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vb8:active {
  background: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vb9 {
  background: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vba:hover {
  background: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vbb:active {
  background: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vbc {
  background: var(--rk-colors-modalText);
}
[data-rk] .ju367vbd:hover {
  background: var(--rk-colors-modalText);
}
[data-rk] .ju367vbe:active {
  background: var(--rk-colors-modalText);
}
[data-rk] .ju367vbf {
  background: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367vbg:hover {
  background: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367vbh:active {
  background: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367vbi {
  background: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367vbj:hover {
  background: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367vbk:active {
  background: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367vbl {
  background: var(--rk-colors-profileAction);
}
[data-rk] .ju367vbm:hover {
  background: var(--rk-colors-profileAction);
}
[data-rk] .ju367vbn:active {
  background: var(--rk-colors-profileAction);
}
[data-rk] .ju367vbo {
  background: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367vbp:hover {
  background: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367vbq:active {
  background: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367vbr {
  background: var(--rk-colors-profileForeground);
}
[data-rk] .ju367vbs:hover {
  background: var(--rk-colors-profileForeground);
}
[data-rk] .ju367vbt:active {
  background: var(--rk-colors-profileForeground);
}
[data-rk] .ju367vbu {
  background: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367vbv:hover {
  background: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367vbw:active {
  background: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367vbx {
  background: var(--rk-colors-standby);
}
[data-rk] .ju367vby:hover {
  background: var(--rk-colors-standby);
}
[data-rk] .ju367vbz:active {
  background: var(--rk-colors-standby);
}
[data-rk] .ju367vc0 {
  border-color: var(--rk-colors-accentColor);
}
[data-rk] .ju367vc1:hover {
  border-color: var(--rk-colors-accentColor);
}
[data-rk] .ju367vc2:active {
  border-color: var(--rk-colors-accentColor);
}
[data-rk] .ju367vc3 {
  border-color: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367vc4:hover {
  border-color: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367vc5:active {
  border-color: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367vc6 {
  border-color: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367vc7:hover {
  border-color: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367vc8:active {
  border-color: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367vc9 {
  border-color: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367vca:hover {
  border-color: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367vcb:active {
  border-color: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367vcc {
  border-color: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367vcd:hover {
  border-color: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367vce:active {
  border-color: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367vcf {
  border-color: var(--rk-colors-closeButton);
}
[data-rk] .ju367vcg:hover {
  border-color: var(--rk-colors-closeButton);
}
[data-rk] .ju367vch:active {
  border-color: var(--rk-colors-closeButton);
}
[data-rk] .ju367vci {
  border-color: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367vcj:hover {
  border-color: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367vck:active {
  border-color: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367vcl {
  border-color: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367vcm:hover {
  border-color: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367vcn:active {
  border-color: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367vco {
  border-color: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367vcp:hover {
  border-color: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367vcq:active {
  border-color: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367vcr {
  border-color: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vcs:hover {
  border-color: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vct:active {
  border-color: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vcu {
  border-color: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vcv:hover {
  border-color: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vcw:active {
  border-color: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vcx {
  border-color: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vcy:hover {
  border-color: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vcz:active {
  border-color: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vd0 {
  border-color: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367vd1:hover {
  border-color: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367vd2:active {
  border-color: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367vd3 {
  border-color: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367vd4:hover {
  border-color: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367vd5:active {
  border-color: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367vd6 {
  border-color: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367vd7:hover {
  border-color: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367vd8:active {
  border-color: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367vd9 {
  border-color: var(--rk-colors-error);
}
[data-rk] .ju367vda:hover {
  border-color: var(--rk-colors-error);
}
[data-rk] .ju367vdb:active {
  border-color: var(--rk-colors-error);
}
[data-rk] .ju367vdc {
  border-color: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vdd:hover {
  border-color: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vde:active {
  border-color: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vdf {
  border-color: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vdg:hover {
  border-color: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vdh:active {
  border-color: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vdi {
  border-color: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vdj:hover {
  border-color: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vdk:active {
  border-color: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vdl {
  border-color: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vdm:hover {
  border-color: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vdn:active {
  border-color: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vdo {
  border-color: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vdp:hover {
  border-color: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vdq:active {
  border-color: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vdr {
  border-color: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vds:hover {
  border-color: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vdt:active {
  border-color: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vdu {
  border-color: var(--rk-colors-modalText);
}
[data-rk] .ju367vdv:hover {
  border-color: var(--rk-colors-modalText);
}
[data-rk] .ju367vdw:active {
  border-color: var(--rk-colors-modalText);
}
[data-rk] .ju367vdx {
  border-color: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367vdy:hover {
  border-color: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367vdz:active {
  border-color: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367ve0 {
  border-color: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367ve1:hover {
  border-color: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367ve2:active {
  border-color: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367ve3 {
  border-color: var(--rk-colors-profileAction);
}
[data-rk] .ju367ve4:hover {
  border-color: var(--rk-colors-profileAction);
}
[data-rk] .ju367ve5:active {
  border-color: var(--rk-colors-profileAction);
}
[data-rk] .ju367ve6 {
  border-color: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367ve7:hover {
  border-color: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367ve8:active {
  border-color: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367ve9 {
  border-color: var(--rk-colors-profileForeground);
}
[data-rk] .ju367vea:hover {
  border-color: var(--rk-colors-profileForeground);
}
[data-rk] .ju367veb:active {
  border-color: var(--rk-colors-profileForeground);
}
[data-rk] .ju367vec {
  border-color: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367ved:hover {
  border-color: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367vee:active {
  border-color: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367vef {
  border-color: var(--rk-colors-standby);
}
[data-rk] .ju367veg:hover {
  border-color: var(--rk-colors-standby);
}
[data-rk] .ju367veh:active {
  border-color: var(--rk-colors-standby);
}
[data-rk] .ju367vei {
  box-shadow: var(--rk-shadows-connectButton);
}
[data-rk] .ju367vej:hover {
  box-shadow: var(--rk-shadows-connectButton);
}
[data-rk] .ju367vek:active {
  box-shadow: var(--rk-shadows-connectButton);
}
[data-rk] .ju367vel {
  box-shadow: var(--rk-shadows-dialog);
}
[data-rk] .ju367vem:hover {
  box-shadow: var(--rk-shadows-dialog);
}
[data-rk] .ju367ven:active {
  box-shadow: var(--rk-shadows-dialog);
}
[data-rk] .ju367veo {
  box-shadow: var(--rk-shadows-profileDetailsAction);
}
[data-rk] .ju367vep:hover {
  box-shadow: var(--rk-shadows-profileDetailsAction);
}
[data-rk] .ju367veq:active {
  box-shadow: var(--rk-shadows-profileDetailsAction);
}
[data-rk] .ju367ver {
  box-shadow: var(--rk-shadows-selectedOption);
}
[data-rk] .ju367ves:hover {
  box-shadow: var(--rk-shadows-selectedOption);
}
[data-rk] .ju367vet:active {
  box-shadow: var(--rk-shadows-selectedOption);
}
[data-rk] .ju367veu {
  box-shadow: var(--rk-shadows-selectedWallet);
}
[data-rk] .ju367vev:hover {
  box-shadow: var(--rk-shadows-selectedWallet);
}
[data-rk] .ju367vew:active {
  box-shadow: var(--rk-shadows-selectedWallet);
}
[data-rk] .ju367vex {
  box-shadow: var(--rk-shadows-walletLogo);
}
[data-rk] .ju367vey:hover {
  box-shadow: var(--rk-shadows-walletLogo);
}
[data-rk] .ju367vez:active {
  box-shadow: var(--rk-shadows-walletLogo);
}
[data-rk] .ju367vf0 {
  color: var(--rk-colors-accentColor);
}
[data-rk] .ju367vf1:hover {
  color: var(--rk-colors-accentColor);
}
[data-rk] .ju367vf2:active {
  color: var(--rk-colors-accentColor);
}
[data-rk] .ju367vf3 {
  color: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367vf4:hover {
  color: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367vf5:active {
  color: var(--rk-colors-accentColorForeground);
}
[data-rk] .ju367vf6 {
  color: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367vf7:hover {
  color: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367vf8:active {
  color: var(--rk-colors-actionButtonBorder);
}
[data-rk] .ju367vf9 {
  color: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367vfa:hover {
  color: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367vfb:active {
  color: var(--rk-colors-actionButtonBorderMobile);
}
[data-rk] .ju367vfc {
  color: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367vfd:hover {
  color: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367vfe:active {
  color: var(--rk-colors-actionButtonSecondaryBackground);
}
[data-rk] .ju367vff {
  color: var(--rk-colors-closeButton);
}
[data-rk] .ju367vfg:hover {
  color: var(--rk-colors-closeButton);
}
[data-rk] .ju367vfh:active {
  color: var(--rk-colors-closeButton);
}
[data-rk] .ju367vfi {
  color: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367vfj:hover {
  color: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367vfk:active {
  color: var(--rk-colors-closeButtonBackground);
}
[data-rk] .ju367vfl {
  color: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367vfm:hover {
  color: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367vfn:active {
  color: var(--rk-colors-connectButtonBackground);
}
[data-rk] .ju367vfo {
  color: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367vfp:hover {
  color: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367vfq:active {
  color: var(--rk-colors-connectButtonBackgroundError);
}
[data-rk] .ju367vfr {
  color: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vfs:hover {
  color: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vft:active {
  color: var(--rk-colors-connectButtonInnerBackground);
}
[data-rk] .ju367vfu {
  color: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vfv:hover {
  color: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vfw:active {
  color: var(--rk-colors-connectButtonText);
}
[data-rk] .ju367vfx {
  color: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vfy:hover {
  color: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vfz:active {
  color: var(--rk-colors-connectButtonTextError);
}
[data-rk] .ju367vg0 {
  color: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367vg1:hover {
  color: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367vg2:active {
  color: var(--rk-colors-connectionIndicator);
}
[data-rk] .ju367vg3 {
  color: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367vg4:hover {
  color: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367vg5:active {
  color: var(--rk-colors-downloadBottomCardBackground);
}
[data-rk] .ju367vg6 {
  color: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367vg7:hover {
  color: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367vg8:active {
  color: var(--rk-colors-downloadTopCardBackground);
}
[data-rk] .ju367vg9 {
  color: var(--rk-colors-error);
}
[data-rk] .ju367vga:hover {
  color: var(--rk-colors-error);
}
[data-rk] .ju367vgb:active {
  color: var(--rk-colors-error);
}
[data-rk] .ju367vgc {
  color: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vgd:hover {
  color: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vge:active {
  color: var(--rk-colors-generalBorder);
}
[data-rk] .ju367vgf {
  color: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vgg:hover {
  color: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vgh:active {
  color: var(--rk-colors-generalBorderDim);
}
[data-rk] .ju367vgi {
  color: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vgj:hover {
  color: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vgk:active {
  color: var(--rk-colors-menuItemBackground);
}
[data-rk] .ju367vgl {
  color: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vgm:hover {
  color: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vgn:active {
  color: var(--rk-colors-modalBackdrop);
}
[data-rk] .ju367vgo {
  color: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vgp:hover {
  color: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vgq:active {
  color: var(--rk-colors-modalBackground);
}
[data-rk] .ju367vgr {
  color: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vgs:hover {
  color: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vgt:active {
  color: var(--rk-colors-modalBorder);
}
[data-rk] .ju367vgu {
  color: var(--rk-colors-modalText);
}
[data-rk] .ju367vgv:hover {
  color: var(--rk-colors-modalText);
}
[data-rk] .ju367vgw:active {
  color: var(--rk-colors-modalText);
}
[data-rk] .ju367vgx {
  color: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367vgy:hover {
  color: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367vgz:active {
  color: var(--rk-colors-modalTextDim);
}
[data-rk] .ju367vh0 {
  color: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367vh1:hover {
  color: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367vh2:active {
  color: var(--rk-colors-modalTextSecondary);
}
[data-rk] .ju367vh3 {
  color: var(--rk-colors-profileAction);
}
[data-rk] .ju367vh4:hover {
  color: var(--rk-colors-profileAction);
}
[data-rk] .ju367vh5:active {
  color: var(--rk-colors-profileAction);
}
[data-rk] .ju367vh6 {
  color: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367vh7:hover {
  color: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367vh8:active {
  color: var(--rk-colors-profileActionHover);
}
[data-rk] .ju367vh9 {
  color: var(--rk-colors-profileForeground);
}
[data-rk] .ju367vha:hover {
  color: var(--rk-colors-profileForeground);
}
[data-rk] .ju367vhb:active {
  color: var(--rk-colors-profileForeground);
}
[data-rk] .ju367vhc {
  color: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367vhd:hover {
  color: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367vhe:active {
  color: var(--rk-colors-selectedOptionBorder);
}
[data-rk] .ju367vhf {
  color: var(--rk-colors-standby);
}
[data-rk] .ju367vhg:hover {
  color: var(--rk-colors-standby);
}
[data-rk] .ju367vhh:active {
  color: var(--rk-colors-standby);
}
@media screen and (min-width: 768px) {
  [data-rk] .ju367v1 {
    align-items: flex-start;
  }
  [data-rk] .ju367v3 {
    align-items: flex-end;
  }
  [data-rk] .ju367v5 {
    align-items: center;
  }
  [data-rk] .ju367v7 {
    display: none;
  }
  [data-rk] .ju367v9 {
    display: block;
  }
  [data-rk] .ju367vb {
    display: flex;
  }
  [data-rk] .ju367vd {
    display: inline;
  }
}

/* vanilla-extract-css-ns:src/css/touchableStyles.css.ts.vanilla.css?source=Ll8xMmNibzhpMywuXzEyY2JvOGkzOjphZnRlciB7CiAgLS1fMTJjYm84aTA6IDE7CiAgLS1fMTJjYm84aTE6IDE7Cn0KLl8xMmNibzhpMzpob3ZlciB7CiAgdHJhbnNmb3JtOiBzY2FsZSh2YXIoLS1fMTJjYm84aTApKTsKfQouXzEyY2JvOGkzOmFjdGl2ZSB7CiAgdHJhbnNmb3JtOiBzY2FsZSh2YXIoLS1fMTJjYm84aTEpKTsKfQouXzEyY2JvOGkzOmFjdGl2ZTo6YWZ0ZXIgewogIGNvbnRlbnQ6ICIiOwogIGJvdHRvbTogLTFweDsKICBkaXNwbGF5OiBibG9jazsKICBsZWZ0OiAtMXB4OwogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICByaWdodDogLTFweDsKICB0b3A6IC0xcHg7CiAgdHJhbnNmb3JtOiBzY2FsZShjYWxjKCgxIC8gdmFyKC0tXzEyY2JvOGkxKSkgKiB2YXIoLS1fMTJjYm84aTApKSk7Cn0KLl8xMmNibzhpNCwuXzEyY2JvOGk0OjphZnRlciB7CiAgLS1fMTJjYm84aTA6IDEuMDI1Owp9Ci5fMTJjYm84aTUsLl8xMmNibzhpNTo6YWZ0ZXIgewogIC0tXzEyY2JvOGkwOiAxLjE7Cn0KLl8xMmNibzhpNiwuXzEyY2JvOGk2OjphZnRlciB7CiAgLS1fMTJjYm84aTE6IDAuOTU7Cn0KLl8xMmNibzhpNywuXzEyY2JvOGk3OjphZnRlciB7CiAgLS1fMTJjYm84aTE6IDAuOTsKfQ */
[data-rk] ._12cbo8i3,
[data-rk] ._12cbo8i3::after {
  --_12cbo8i0: 1;
  --_12cbo8i1: 1;
}
[data-rk] ._12cbo8i3:hover {
  transform: scale(var(--_12cbo8i0));
}
[data-rk] ._12cbo8i3:active {
  transform: scale(var(--_12cbo8i1));
}
[data-rk] ._12cbo8i3:active::after {
  content: "";
  bottom: -1px;
  display: block;
  left: -1px;
  position: absolute;
  right: -1px;
  top: -1px;
  transform: scale(calc((1 / var(--_12cbo8i1)) * var(--_12cbo8i0)));
}
[data-rk] ._12cbo8i4,
[data-rk] ._12cbo8i4::after {
  --_12cbo8i0: 1.025;
}
[data-rk] ._12cbo8i5,
[data-rk] ._12cbo8i5::after {
  --_12cbo8i0: 1.1;
}
[data-rk] ._12cbo8i6,
[data-rk] ._12cbo8i6::after {
  --_12cbo8i1: 0.95;
}
[data-rk] ._12cbo8i7,
[data-rk] ._12cbo8i7::after {
  --_12cbo8i1: 0.9;
}

/* vanilla-extract-css-ns:src/components/Icons/Icons.css.ts.vanilla.css?source=QGtleWZyYW1lcyBfMWx1dWxlNDEgewogIDAlIHsKICAgIHRyYW5zZm9ybTogcm90YXRlKDBkZWcpOwogIH0KICAxMDAlIHsKICAgIHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7CiAgfQp9Ci5fMWx1dWxlNDIgewogIGFuaW1hdGlvbjogXzFsdXVsZTQxIDNzIGluZmluaXRlIGxpbmVhcjsKfQouXzFsdXVsZTQzIHsKICBiYWNrZ3JvdW5kOiBjb25pYy1ncmFkaWVudChmcm9tIDE4MGRlZyBhdCA1MCUgNTAlLCByZ2JhKDcyLCAxNDYsIDI1NCwgMCkgMGRlZywgY3VycmVudENvbG9yIDI4Mi4wNGRlZywgcmdiYSg3MiwgMTQ2LCAyNTQsIDApIDMxOS44NmRlZywgcmdiYSg3MiwgMTQ2LCAyNTQsIDApIDM2MGRlZyk7CiAgaGVpZ2h0OiAyMXB4OwogIHdpZHRoOiAyMXB4Owp9 */
@keyframes _1luule41 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
[data-rk] ._1luule42 {
  animation: _1luule41 3s infinite linear;
}
[data-rk] ._1luule43 {
  background:
    conic-gradient(
      from 180deg at 50% 50%,
      rgba(72, 146, 254, 0) 0deg,
      currentColor 282.04deg,
      rgba(72, 146, 254, 0) 319.86deg,
      rgba(72, 146, 254, 0) 360deg);
  height: 21px;
  width: 21px;
}

/* vanilla-extract-css-ns:src/components/Dialog/Dialog.css.ts.vanilla.css?source=QGtleWZyYW1lcyBfOXBtNGtpMCB7CiAgMCUgewogICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMCUpOwogIH0KICAxMDAlIHsKICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwKTsKICB9Cn0KQGtleWZyYW1lcyBfOXBtNGtpMSB7CiAgMCUgewogICAgb3BhY2l0eTogMDsKICB9CiAgMTAwJSB7CiAgICBvcGFjaXR5OiAxOwogIH0KfQouXzlwbTRraTMgewogIGFuaW1hdGlvbjogXzlwbTRraTEgMTUwbXMgZWFzZTsKICBib3R0b206IC0yMDBweDsKICBsZWZ0OiAtMjAwcHg7CiAgcGFkZGluZzogMjAwcHg7CiAgcmlnaHQ6IC0yMDBweDsKICB0b3A6IC0yMDBweDsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVooMCk7CiAgei1pbmRleDogMjE0NzQ4MzY0NjsKfQouXzlwbTRraTUgewogIGFuaW1hdGlvbjogXzlwbTRraTAgMzUwbXMgY3ViaWMtYmV6aWVyKC4xNSwxLjE1LDAuNiwxLjAwKSwgXzlwbTRraTEgMTUwbXMgZWFzZTsKICBtYXgtd2lkdGg6IDEwMHZ3Owp9 */
@keyframes _9pm4ki0 {
  0% {
    transform: translateY(100%);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes _9pm4ki1 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
[data-rk] ._9pm4ki3 {
  animation: _9pm4ki1 150ms ease;
  bottom: -200px;
  left: -200px;
  padding: 200px;
  right: -200px;
  top: -200px;
  transform: translateZ(0);
  z-index: 2147483646;
}
[data-rk] ._9pm4ki5 {
  animation: _9pm4ki0 350ms cubic-bezier(.15, 1.15, 0.6, 1.00), _9pm4ki1 150ms ease;
  max-width: 100vw;
}

/* vanilla-extract-css-ns:src/components/Dialog/DialogContent.css.ts.vanilla.css?source=Ll8xY2tqcG9rMSB7CiAgYm94LXNpemluZzogY29udGVudC1ib3g7CiAgbWF4LXdpZHRoOiAxMDB2dzsKICB3aWR0aDogMzYwcHg7Cn0KLl8xY2tqcG9rMiB7CiAgd2lkdGg6IDEwMHZ3Owp9Ci5fMWNranBvazMgewogIG1pbi13aWR0aDogNzIwcHg7CiAgd2lkdGg6IDcyMHB4Owp9Ci5fMWNranBvazQgewogIG1pbi13aWR0aDogMzY4cHg7CiAgd2lkdGg6IDM2OHB4Owp9Ci5fMWNranBvazYgewogIGJvcmRlci13aWR0aDogMHB4OwogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7CiAgd2lkdGg6IDEwMHZ3Owp9CkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDc2OHB4KSB7CiAgLl8xY2tqcG9rMSB7CiAgICB3aWR0aDogMzYwcHg7CiAgfQogIC5fMWNranBvazIgewogICAgd2lkdGg6IDQ4MHB4OwogIH0KICAuXzFja2pwb2s0IHsKICAgIG1pbi13aWR0aDogMzY4cHg7CiAgICB3aWR0aDogMzY4cHg7CiAgfQp9CkBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6IDc2N3B4KSB7CiAgLl8xY2tqcG9rNyB7CiAgICBib3JkZXItYm90dG9tLWxlZnQtcmFkaXVzOiAwOwogICAgYm9yZGVyLWJvdHRvbS1yaWdodC1yYWRpdXM6IDA7CiAgICBtYXJnaW4tdG9wOiAtMjAwcHg7CiAgICBwYWRkaW5nLWJvdHRvbTogMjAwcHg7CiAgICB0b3A6IDIwMHB4OwogIH0KfQ */
[data-rk] ._1ckjpok1 {
  box-sizing: content-box;
  max-width: 100vw;
  width: 360px;
}
[data-rk] ._1ckjpok2 {
  width: 100vw;
}
[data-rk] ._1ckjpok3 {
  min-width: 720px;
  width: 720px;
}
[data-rk] ._1ckjpok4 {
  min-width: 368px;
  width: 368px;
}
[data-rk] ._1ckjpok6 {
  border-width: 0px;
  box-sizing: border-box;
  width: 100vw;
}
@media screen and (min-width: 768px) {
  [data-rk] ._1ckjpok1 {
    width: 360px;
  }
  [data-rk] ._1ckjpok2 {
    width: 480px;
  }
  [data-rk] ._1ckjpok4 {
    min-width: 368px;
    width: 368px;
  }
}
@media screen and (max-width: 767px) {
  [data-rk] ._1ckjpok7 {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin-top: -200px;
    padding-bottom: 200px;
    top: 200px;
  }
}

/* vanilla-extract-css-ns:src/components/MenuButton/MenuButton.css.ts.vanilla.css?source=LnY5aG9yYjA6aG92ZXIgewogIGJhY2tncm91bmQ6IHVuc2V0Owp9 */
[data-rk] .v9horb0:hover {
  background: unset;
}

/* vanilla-extract-css-ns:src/components/ChainModal/ChainModal.css.ts.vanilla.css?source=Ll8xOGRxdzl4MCB7CiAgbWF4LWhlaWdodDogNDU2cHg7CiAgb3ZlcmZsb3cteTogYXV0bzsKICBvdmVyZmxvdy14OiBoaWRkZW47Cn0KLl8xOGRxdzl4MSB7CiAgbWF4LWhlaWdodDogNDU2cHg7CiAgb3ZlcmZsb3cteTogYXV0bzsKICBvdmVyZmxvdy14OiBoaWRkZW47CiAgc2Nyb2xsYmFyLXdpZHRoOiBub25lOwp9Ci5fMThkcXc5eDE6Oi13ZWJraXQtc2Nyb2xsYmFyIHsKICBkaXNwbGF5OiBub25lOwp9 */
[data-rk] ._18dqw9x0 {
  max-height: 456px;
  overflow-y: auto;
  overflow-x: hidden;
}
[data-rk] ._18dqw9x1 {
  max-height: 456px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;
}
[data-rk] ._18dqw9x1::-webkit-scrollbar {
  display: none;
}

/* vanilla-extract-css-ns:src/components/ModalSelection/ModalSelection.css.ts.vanilla.css?source=Lmc1a2wwbDAgewogIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0 */
[data-rk] .g5kl0l0 {
  border-color: transparent;
}

/* vanilla-extract-css-ns:src/components/ConnectOptions/DesktopOptions.css.ts.vanilla.css?source=Ll8xdnd0MGNnMCB7CiAgYmFja2dyb3VuZDogd2hpdGU7CiAgY29sb3I6IGJsYWNrOwp9Ci5fMXZ3dDBjZzIgewogIG1heC1oZWlnaHQ6IDQ1NHB4OwogIG92ZXJmbG93LXk6IGF1dG87Cn0KLl8xdnd0MGNnMyB7CiAgbWluLXdpZHRoOiAyODdweDsKfQouXzF2d3QwY2c0IHsKICBtaW4td2lkdGg6IDEwMCU7Cn0 */
[data-rk] ._1vwt0cg0 {
  background: white;
  color: black;
}
[data-rk] ._1vwt0cg2 {
  max-height: 454px;
  overflow-y: auto;
}
[data-rk] ._1vwt0cg3 {
  min-width: 287px;
}
[data-rk] ._1vwt0cg4 {
  min-width: 100%;
}

/* vanilla-extract-css-ns:src/components/ConnectOptions/MobileOptions.css.ts.vanilla.css?source=QGtleWZyYW1lcyBfMWFtMTQ0MTEgewogIDAlIHsKICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAwOwogIH0KICAxMDAlIHsKICAgIHN0cm9rZS1kYXNob2Zmc2V0OiAtMjgzOwogIH0KfQouXzFhbTE0NDEwIHsKICBvdmVyZmxvdzogYXV0bzsKICBzY3JvbGxiYXItd2lkdGg6IG5vbmU7CiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVaKDApOwp9Ci5fMWFtMTQ0MTA6Oi13ZWJraXQtc2Nyb2xsYmFyIHsKICBkaXNwbGF5OiBub25lOwp9Ci5fMWFtMTQ0MTIgewogIGFuaW1hdGlvbjogXzFhbTE0NDExIDFzIGxpbmVhciBpbmZpbml0ZTsKICBzdHJva2UtZGFzaGFycmF5OiA5OCAxOTY7CiAgZmlsbDogbm9uZTsKICBzdHJva2UtbGluZWNhcDogcm91bmQ7CiAgc3Ryb2tlLXdpZHRoOiA0Owp9Ci5fMWFtMTQ0MTMgewogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKfQ */
@keyframes _1am14411 {
  0% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: -283;
  }
}
[data-rk] ._1am14410 {
  overflow: auto;
  scrollbar-width: none;
  transform: translateZ(0);
}
[data-rk] ._1am14410::-webkit-scrollbar {
  display: none;
}
[data-rk] ._1am14412 {
  animation: _1am14411 1s linear infinite;
  stroke-dasharray: 98 196;
  fill: none;
  stroke-linecap: round;
  stroke-width: 4;
}
[data-rk] ._1am14413 {
  position: absolute;
}

/* vanilla-extract-css-ns:src/components/WalletButton/WalletButton.css.ts.vanilla.css?source=Ll8xeTJsbmZpMCB7CiAgYm9yZGVyOiAxcHggc29saWQgcmdiYSgxNiwgMjEsIDMxLCAwLjA2KTsKfQouXzF5MmxuZmkxIHsKICBtYXgtd2lkdGg6IGZpdC1jb250ZW50Owp9 */
[data-rk] ._1y2lnfi0 {
  border: 1px solid rgba(16, 21, 31, 0.06);
}
[data-rk] ._1y2lnfi1 {
  max-width: -moz-fit-content;
  max-width: fit-content;
}

:root {
  font-family:
    'DM Sans',
    'Noto Sans SC',
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    sans-serif;
  color: #241c32;
  background: #f5f1fb;
  --ink: #241c32;
  --muted: #796f88;
  --purple: #8452d6;
  --purple-deep: #6331b4;
  --purple-soft: #ede3ff;
  --glass: rgba(255, 255, 255, 0.72);
  --glass-strong: rgba(255, 255, 255, 0.9);
  --stroke: rgba(119, 83, 163, 0.13);
  --shadow-soft: 0 20px 60px rgba(86, 55, 125, 0.09);
  --shadow-card: 0 12px 34px rgba(88, 54, 132, 0.08);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --radius-control: 10px;
  --radius-card: 14px;
  --control-height-sm: 34px;
  --control-height-md: 40px;
  --control-height-touch: 44px;
  --content-user: 1180px;
  --content-admin: 1280px;
  --text-caption: 11px;
  --text-secondary: 12px;
  --text-body: 14px;
  --text-section: 18px;
  --text-page: 28px;
  --text-number: 28px;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 400;
  font-size: 14px;
  font-feature-settings: 'tnum';
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at 8% 4%, rgba(199, 173, 244, 0.42), transparent 28rem),
    radial-gradient(circle at 92% 24%, rgba(219, 198, 255, 0.42), transparent 34rem),
    linear-gradient(145deg, #faf8fd 0%, #f4effb 52%, #f8f6fc 100%);
  background-attachment: fixed;
}
button,
input,
textarea,
select {
  font: inherit;
}
button,
a,
input,
textarea,
select {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
  color: inherit;
  border: 0;
}
button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}
a {
  color: inherit;
  text-decoration: none;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid #b99bea;
  outline-offset: 3px;
}
h1,
h2,
h3,
p {
  margin: 0;
}
svg {
  flex-shrink: 0;
}
::selection {
  background: #e4d7fa;
}
.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 100;
  background: white;
  padding: 12px;
  transform: translateY(-200%);
}
.skip-link:focus {
  transform: translateY(0);
}
.team-reference-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  line-height: 1.8;
  text-align: left;
}

.copy-field {
  display: flex;
  gap: 10px;
}

.copy-field input {
  min-width: 0;
  flex: 1;
  border: 1px solid #e5dfed;
  border-radius: 8px;
  padding: 10px 12px;
  color: #5f576b;
  background: #faf9fc;
}

.form-hint {
  margin-top: 10px;
  color: #766b81;
  font-size: 12px;
  line-height: 1.7;
}

.table-scroll {
  overflow-x: auto;
}

@media (max-width: 480px) {
  .copy-field {
    flex-direction: column;
  }

  .copy-field .button {
    width: 100%;
  }
}

.team-reference-table caption {
  margin-bottom: 15px;
  color: #766b81;
  text-align: left;
}

.team-reference-table th,
.team-reference-table td {
  padding: 12px 8px;
  border-bottom: 1px solid #eee7f5;
}

.team-reference-table th {
  color: #715487;
  font-weight: 600;
}

.team-mechanisms {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 24px;
}

.team-mechanisms h3 {
  margin-bottom: 10px;
  font-size: 14px;
  font-weight: 600;
}

.team-mechanisms p {
  font-size: 12px;
  line-height: 1.9;
  color: #766b81;
}

.team-mechanisms .team-pending {
  margin-top: 10px;
  color: #715487;
}

.team-tree-button {
  width: 100%;
  margin-top: 12px;
}

.team-volume-explanation p {
  margin: 5px 0 0;
}

.team-tree-dialog {
  max-width: 560px;
}

.team-direct-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding: 10px;
  border: 1px solid #eee7f5;
  border-radius: 12px;
  background: #faf9fc;
}
.team-direct-summary > strong { width: 100%; color: #715487; font-size: 12px; }
.team-direct-chip {
  display: inline-flex;
  max-width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 7px 10px;
  border: 1px solid #e5dfed;
  border-radius: 10px;
  color: #4d3c5b;
  background: #fff;
  text-align: left;
  cursor: pointer;
}
.team-direct-chip span { overflow: hidden; max-width: 180px; text-overflow: ellipsis; white-space: nowrap; }
.team-direct-chip small { color: #766b81; font-size: 10px; }

.team-tree-list {
  display: grid;
  gap: 8px;
  max-height: min(520px, 62dvh);
  margin-top: 20px;
  overflow-y: auto;
}

.team-tree-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding: 0 12px;
  border: 1px solid #e5dfed;
  border-radius: 10px;
  color: #766b81;
  background: #faf9fc;
}

.team-tree-search input {
  min-width: 0;
  width: 100%;
  height: 42px;
  border: 0;
  outline: 0;
  color: #302638;
  background: transparent;
}

.team-tree-node {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: calc((var(--team-depth) - 1) * 22px);
  padding: 10px 12px;
  border: 1px solid #eee7f5;
  border-radius: 10px;
  background: #faf9fc;
}

.team-tree-toggle {
  display: grid;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 6px;
  color: #715487;
  background: #f0e8f7;
  cursor: pointer;
}

.team-tree-toggle:disabled {
  color: #aaa0b1;
  background: transparent;
  cursor: default;
}

.team-tree-summary {
  display: grid;
  min-width: 0;
  width: 100%;
  grid-template-columns: minmax(90px, 1fr) 42px minmax(90px, auto);
  align-items: center;
  gap: 10px;
  font-size: 12px;
}

.team-tree-summary strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.team-tree-summary span {
  color: #766b81;
  white-space: nowrap;
}

.team-tree-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 14px;
  color: #766b81;
  font-size: 12px;
}

.team-tree-node code,
.team-tree-node small {
  display: block;
}

.team-tree-node small {
  margin-top: 3px;
  color: #766b81;
}

.team-tree-line {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #935acb;
}

@media (max-width: 480px) {
  .team-tree-node {
    margin-left: calc((var(--team-depth) - 1) * 8px);
    padding: 9px 8px;
  }

  .team-tree-summary {
    grid-template-columns: minmax(72px, 1fr) 34px minmax(76px, auto);
    gap: 6px;
  }
}
/* Shared shell and primitives. Layout uses fluid grids; decorative art is isolated. */
.app-shell {
  display: grid;
  grid-template-columns: 222px minmax(0, 1fr);
  min-height: 100dvh;
}
.sidebar {
  background: #fff;
  border-right: 1px solid #ecebf2;
  padding: 32px 18px;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100dvh;
}
.brand {
  display: block;
  background: transparent;
  text-align: left;
  padding: 0 7px 34px;
  width: 100%;
}
.brand-logo {
  display: block;
  width: 150px;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  object-position: left center;
}
.nav-caption {
  font-size: 11px;
  color: #766b81;
  letter-spacing: 1.8px;
  padding: 0 14px 14px;
}
.navigation {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.nav-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  border-radius: 9px;
  background: transparent;
  width: 100%;
  font-size: 13px;
  text-align: left;
  color: #787181;
  font-weight: 500;
}
.nav-item.active {
  color: #8550ce;
  background: #f1eafa;
}
.nav-item:hover {
  background: #f7f4fb;
}
.nav-item .tiny-badge {
  margin-left: auto;
}
.tiny-badge {
  font-size: 8px;
  padding: 3px 5px;
  border: 1px solid #e1d8ee;
  color: #9b80be;
  border-radius: 4px;
  font-weight: 600;
}
.sidebar-bottom {
  margin-top: auto;
  display: grid;
  gap: 17px;
}
.network-card {
  display: flex;
  align-items: center;
  gap: 9px;
  background: #faf9fc;
  border: 1px solid #eeebf3;
  border-radius: 9px;
  padding: 13px 11px;
  font-size: 12px;
}
.network-card small {
  display: block;
  color: #766b81;
  font-size: 11px;
  margin-top: 5px;
}
.network-card > svg {
  margin-left: auto;
  color: #afa1bf;
}
.status-dot {
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background: #9a64db;
  display: inline-block;
  flex-shrink: 0;
}
.sidebar-foot {
  color: #766b81;
  font-size: 11px;
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
}
.muted {
  color: #766b81;
}
.muted > svg:last-child {
  margin-left: auto;
}
.main-shell {
  min-width: 0;
}
.topbar {
  height: 77px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 38px;
  background: #fff;
  border-bottom: 1px solid #efedf3;
}
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 12px;
  color: #766b81;
}
.breadcrumb strong {
  font-weight: 500;
  color: #5f576b;
}
.slash {
  color: #d7d2de;
}
.topbar-actions {
  display: flex;
  align-items: center;
  gap: 19px;
}
.connected-wallet-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.wallet-chain-button,
.wallet-account-button,
.wallet-connect-button {
  min-height: 38px;
}
.wallet-chain-button img {
  width: 18px;
  height: 18px;
  border-radius: 50%;
}
.demo-chip {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 10px;
  letter-spacing: 1px;
  color: #9c6fc4;
}
.demo-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 10px 24px;
  background: #f3effa;
  color: #715487;
  font-size: 12px;
  line-height: 1.6;
}
.demo-banner button {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: #75449f;
  font-size: 12px;
  background: transparent;
  padding: 0 0 0 10px;
}
.page-shell {
  max-width: 1450px;
  margin: 0 auto;
  padding: 30px 38px 20px;
}
.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 10px 17px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 500;
  transition:
    background 0.15s ease,
    transform 0.15s ease;
}
.button-primary {
  background: #8d51d6;
  color: #fff;
  box-shadow: 0 3px 7px #7040b112;
}
.button-primary:hover:not(:disabled) {
  background: #7c42c6;
}
.button-outline {
  background: white;
  border: 1px solid #e5dfed;
  color: #655674;
}
.button-outline:hover:not(:disabled) {
  background: #f7f3fc;
}
.button-ghost {
  background: transparent;
  color: #7e678f;
}
.button-ghost:hover {
  background: #efe7fa;
}
.button-small {
  min-height: 34px;
  padding: 8px 11px;
  font-size: 12px;
}
.button-full {
  width: 100%;
}
.button-icon {
  padding: 0;
  width: 35px;
  min-height: 35px;
  border-radius: 9px;
  color: #8e60c9;
  background: #f1eafa;
}
.text-muted {
  color: #766b81;
  font-size: 12px;
  line-height: 1.8;
}

.panel-heading-button {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.compact-history-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}
.compact-history-header {
  padding: 8px 0;
  color: #887b94;
  font-size: 11px;
  border-bottom: 1px solid #eee7f3;
}
.compact-history-row:not(.compact-history-header) {
  padding: 11px 0;
  border-bottom: 1px solid #f1ecf5;
  font-size: 12px;
}
.compact-history-row > * {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 16px;
}
.compact-history-row > :nth-child(2),
.compact-history-row > :nth-child(3) {
  text-align: right;
}
.compact-history-row strong {
  color: #4c4057;
}
.compact-history-row time {
  color: #887b94;
}
.asset-history-panel .compact-history-row:not(.compact-history-header) > * {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.55;
}
.history-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 14px;
  color: #887b94;
  font-size: 12px;
}
@media (max-width: 640px) {
  .compact-history-row {
    grid-template-columns: minmax(0, 30fr) minmax(0, 35fr) minmax(0, 35fr);
    gap: 4px;
  }
  .compact-history-row:not(.compact-history-header) {
    font-size: 11px;
  }
  .compact-history-row time {
    font-size: 10px;
  }
  .asset-history-panel .compact-history-header {
    display: none;
  }
  .asset-history-panel .compact-history-row:not(.compact-history-header) {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px 10px;
    padding: 13px 0;
  }
  .asset-history-panel .compact-history-row:not(.compact-history-header) > :nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 2;
    text-align: left;
  }
  .asset-history-panel .compact-history-row:not(.compact-history-header) > :nth-child(3) {
    grid-column: 2;
    grid-row: 1;
  }
}

/* Market hero and code-native decorative geometry; no bitmap dependency. */
.hero-panel {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  align-items: center;
  min-height: 320px;
  padding: 35px 38px;
  border: 1px solid #eae1f6;
  background:
    radial-gradient(ellipse at 90% 15%, #e6d5fc 0, transparent 48%),
    linear-gradient(120deg, #f2eafb, #f4eefc 58%, #f0e4fc);
  border-radius: 15px;
  overflow: hidden;
}
.eyebrow {
  display: flex;
  align-items: center;
  gap: 7px;
  letter-spacing: 2px;
  font-size: 9px;
  color: #9d77c4;
  font-weight: 600;
}
.eyebrow > span {
  height: 4px;
  width: 4px;
  border-radius: 50%;
  background: #a568de;
}
.hero-copy h1 {
  font-size: 34px;
  line-height: 1.5;
  letter-spacing: 1px;
  font-weight: 600;
  margin: 17px 0 11px;
  color: #342744;
}
.hero-copy h1 > span {
  color: #9b5ade;
}
.hero-copy p {
  font-size: 13px;
  line-height: 1.95;
  color: #786387;
}
.hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 23px;
}
.hero-caption {
  margin-top: 16px;
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #786387;
}
.hero-art {
  min-height: 260px;
  position: relative;
  display: grid;
  place-items: center;
  isolation: isolate;
}
.orbit {
  width: 260px;
  height: 150px;
  border: 1px solid #b98fe145;
  border-radius: 50%;
  position: absolute;
  transform: rotate(-30deg);
}
.orbit-two {
  width: 300px;
  height: 185px;
  transform: rotate(35deg);
  border-style: dashed;
  border-color: #bb99df40;
}
.crystal {
  position: relative;
  display: grid;
  place-items: center;
  width: 210px;
  height: 210px;
  transform: rotate(-16deg);
}
.crystal-layer {
  position: absolute;
  width: 143px;
  height: 143px;
  border-radius: 30px;
  transform: rotate(45deg);
  border: 1px solid #fff9;
  box-shadow: 15px 18px 28px #8651b817;
}
.layer-back {
  background: linear-gradient(150deg, #c6a3ed99, #ddd0f080);
  translate: 20px 13px;
}
.layer-middle {
  background: linear-gradient(150deg, #cdb1f3cc, #a175dac7);
  translate: 2px 0;
}
.layer-front {
  background: linear-gradient(135deg, #f5e8ffba, #c097ea80);
  translate: -19px -14px;
  display: grid;
  place-items: center;
  box-shadow:
    inset 0 1px 12px #fff8,
    14px 20px 34px #9660c72a;
  color: #fff;
}
.layer-front svg {
  transform: rotate(-30deg);
}
.art-star {
  position: absolute;
  color: #b58bd9;
}
.star-one {
  top: 15%;
  right: 15%;
  font-size: 25px;
}
.star-two {
  left: 13%;
  bottom: 24%;
  font-size: 32px;
}
.art-label {
  position: absolute;
  bottom: 9px;
  letter-spacing: 3px;
  font-size: 7px;
  color: #b398cf;
}
.art-mini {
  position: absolute;
  right: 7%;
  bottom: 22%;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 11px;
  border-radius: 8px;
  background: #ffffff9c;
  border: 1px solid #fff;
  color: #a777d8;
  font-size: 12px;
  box-shadow: 0 5px 15px #9d7abe15;
  transform: rotate(8deg);
}
.metrics-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
  margin: 22px 0 32px;
}
.metric-card {
  background: #fff;
  border: 1px solid #ebe8f0;
  border-radius: 11px;
  padding: 18px 21px;
  min-width: 0;
}
.metric-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #766b81;
  font-size: 12px;
}
.metric-icon {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 9px;
}
.purple {
  background: #f2ebfc;
  color: #a271d4;
}
.blue {
  background: #edf3fd;
  color: #7fa1d7;
}
.green {
  background: #eaf6f0;
  color: #6cab90;
}
.metric-value {
  margin: 4px 0 8px;
  font-size: 27px;
  font-weight: 600;
  letter-spacing: -0.7px;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  overflow-wrap: anywhere;
}
.metric-value small {
  font-size: 12px;
  color: #766b81;
  font-weight: 400;
  letter-spacing: 0;
}
.metric-note {
  font-size: 12px;
  color: #766b81;
  line-height: 1.8;
}
.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 21px;
}
.muted-eyebrow {
  font-size: 8px;
  letter-spacing: 2px;
  color: #b7a6c7;
  margin-bottom: 9px;
}
.section-heading h2 {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.5px;
}
.subtle-label {
  font-size: 12px;
  color: #766b81;
}
.market-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  align-items: center;
  margin-bottom: 22px;
}
.tabs-list {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.tab-trigger {
  background: transparent;
  padding: 9px 15px;
  border-radius: 7px;
  color: #766b81;
  font-size: 12px;
}
.tab-trigger[data-state='active'] {
  background: #ede3f8;
  color: #75449f;
  font-weight: 600;
}
.search-field {
  background: white;
  border: 1px solid #e9e5ee;
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 220px;
  padding: 9px 12px;
  border-radius: 8px;
  color: #b1a4bf;
}
.search-field input,
.search-field select {
  min-width: 0;
  width: 100%;
  border: 0;
  background: transparent;
  font-size: 12px;
  color: #62526f;
  outline-offset: 5px;
}
.search-field select {
  cursor: pointer;
}
.search-field input::placeholder {
  color: #81718d;
}
.product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.product-card {
  background: #fff;
  border: 1px solid #eae6f0;
  border-radius: 12px;
  overflow: hidden;
  transition:
    box-shadow 0.18s,
    border-color 0.18s;
}
.product-card:hover {
  border-color: #d2b9eb;
  box-shadow: 0 7px 24px #7046a00b;
}
.product-art {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1.8;
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.product-art-1 {
  --art: #916aca;
  --art-light: #efe4fc;
  background: linear-gradient(130deg, #f1e8fa, #d8c5f0);
}
.product-art-2 {
  --art: #6c89bd;
  --art-light: #e6effd;
  background: linear-gradient(130deg, #e9f1fc, #c6d8ee);
}
.product-art-3 {
  --art: #c38a64;
  --art-light: #fff0da;
  background: linear-gradient(130deg, #fcf0e1, #efd6b9);
}
.product-art-4 {
  --art: #8184bc;
  --art-light: #eeebff;
  background: linear-gradient(130deg, #edebfc, #cfcdec);
}
.product-art-5 {
  --art: #6ca99c;
  --art-light: #e4f7f0;
  background: linear-gradient(130deg, #e8f5ef, #c8e5dc);
}
.product-art-6 {
  --art: #b2779a;
  --art-light: #ffe7f3;
  background: linear-gradient(130deg, #f8eaf2, #e6c4d7);
}
.art-category {
  position: absolute;
  top: 13px;
  left: 14px;
  font-size: 8px;
  color: var(--art);
  padding: 5px 8px;
  border: 1px solid #fff6;
  border-radius: 5px;
  background: #ffffff54;
  letter-spacing: 1px;
}
.product-sculpture {
  position: relative;
  display: grid;
  place-items: center;
  width: 120px;
  height: 110px;
  margin-top: 3px;
}
.sculpture-halo {
  position: absolute;
  width: 104px;
  height: 104px;
  border-radius: 50%;
  border: 1px solid #ffffff8f;
}
.sculpture-shape {
  display: grid;
  place-items: center;
  position: relative;
  background: linear-gradient(
    135deg,
    #ffffffcc,
    var(--art-light) 45%,
    var(--art)
  );
  width: 77px;
  height: 87px;
  border-radius: 18px;
  transform: rotate(-17deg);
  box-shadow:
    10px 13px 17px #59347f19,
    inset 1px 2px 1px #fff;
  color: var(--art);
  border: 1px solid #fff8;
}
.product-art-2 .sculpture-shape {
  border-radius: 50%;
  transform: rotate(15deg);
  width: 87px;
  height: 87px;
}
.product-art-3 .sculpture-shape {
  transform: rotate(12deg);
  border-radius: 15px;
}
.product-art-4 .sculpture-shape {
  border-radius: 20px;
  transform: rotate(45deg);
  width: 77px;
  height: 77px;
}
.product-art-4 .sculpture-shape svg {
  transform: rotate(-45deg);
}
.product-art-5 .sculpture-shape {
  border-radius: 40px 40px 20px 20px;
  transform: rotate(13deg);
}
.product-art-6 .sculpture-shape {
  transform: rotate(-12deg);
  border-radius: 11px;
}
.product-art-label {
  position: absolute;
  bottom: 12px;
  left: 14px;
  letter-spacing: 1.5px;
  color: var(--art);
  font-size: 6px;
  opacity: 0.8;
}
.art-arrow {
  position: absolute;
  right: 12px;
  bottom: 12px;
  color: var(--art);
  opacity: 0.65;
}
.product-body {
  padding: 17px 18px 16px;
}
.product-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 7px;
  font-size: 11px;
  border-radius: 4px;
  line-height: 1.5;
}
.badge-purple {
  background: #f3edfb;
  color: #795099;
}
.badge-blue {
  background: #edf2fc;
  color: #496a9b;
}
.product-time {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #766b81;
  font-size: 12px;
}
.product-body h3 {
  font-weight: 600;
  font-size: 15px;
  letter-spacing: 0.3px;
  margin: 13px 0 8px;
}
.product-body > p {
  font-size: 12px;
  color: #766b81;
  line-height: 1.9;
  min-height: 46px;
}
.product-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 16px;
  padding-top: 13px;
  border-top: 1px solid #f1eef4;
  gap: 6px;
}
.product-bottom small {
  display: block;
  font-size: 12px;
  color: #766b81;
  margin-bottom: 5px;
}
.product-bottom strong {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -0.3px;
  display: flex;
  gap: 6px;
  align-items: baseline;
  flex-wrap: wrap;
}
.product-bottom strong span {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  color: #766b81;
}
.section-note {
  font-size: 12px;
  color: #766b81;
  text-align: center;
  margin: 17px 0 0;
  line-height: 1.8;
}
.journey-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 30px;
  padding: 20px 23px;
  border: 1px solid #eae6f0;
  border-radius: 10px;
  background: #fff;
}
.journey-title {
  font-size: 12px;
  font-weight: 500;
  margin-right: auto;
}
.journey-strip > div {
  display: flex;
  gap: 9px;
  align-items: center;
  font-size: 12px;
  color: #766b81;
}
.journey-strip > div > svg {
  color: #cbbfd7;
  margin-left: 3px;
}
.step-number {
  display: inline-grid;
  place-items: center;
  color: #795099;
  background: #f3edf9;
  width: 25px;
  height: 25px;
  border-radius: 7px;
  font-size: 11px;
}

/* Shared content pages. */
.page-heading {
  margin: 7px 0 26px;
}
.page-heading h1 {
  font-size: 28px;
  letter-spacing: 0.5px;
  font-weight: 600;
  margin: 10px 0;
}
.page-heading p {
  color: #766b81;
  font-size: 12px;
  line-height: 1.9;
}
.notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border-radius: 9px;
  padding: 13px 15px;
  line-height: 1.8;
  font-size: 12px;
  margin-bottom: 22px;
}
.notice svg {
  margin-top: 2px;
}
.notice-info {
  background: #f0eafa;
  color: #715487;
  border: 1px solid #e7def0;
}
.notice-error {
  background: #fff2f0;
  color: #a04a42;
  border: 1px solid #f4d8d1;
}
.notice-success {
  background: #edf8f1;
  color: #3f7654;
  border: 1px solid #d4eadb;
}
.testnet-banner {
  background: #eaf4ff;
  color: #38668e;
}
.chain-warning {
  align-items: center;
}
.chain-warning > button {
  margin-left: auto;
}
.transaction-copy {
  min-width: 0;
}
.transaction-copy strong {
  display: block;
  font-weight: 600;
}
.transaction-copy p {
  margin-top: 4px;
}
.transaction-copy a {
  display: block;
  margin-top: 5px;
  text-decoration: underline;
  overflow-wrap: anywhere;
}
.spin {
  animation: spin 0.9s linear infinite;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.contract-panel {
  overflow: hidden;
}
.contract-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.contract-grid a {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px;
  padding: 13px;
  border: 1px solid #ede8f2;
  border-radius: 9px;
  background: #fcfbfd;
}
.contract-grid a span {
  font-size: 12px;
  font-weight: 600;
}
.contract-grid a code {
  grid-column: 1/-1;
  color: #766b81;
  font-size: 11px;
  overflow-wrap: anywhere;
}
.testnet-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.chain-list {
  display: grid;
  gap: 11px;
}
.chain-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid #ece7f1;
  border-radius: 10px;
  padding: 15px;
}
.chain-card > div {
  min-width: 0;
}
.chain-card h3,
.chain-card .position-id,
.admin-break {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.chain-card > a {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 11px;
}
.chain-card h3 {
  margin: 5px 0;
  font-size: 14px;
}
.chain-card p {
  color: #766b81;
  font-size: 11px;
}
.chain-card > strong {
  font-size: 13px;
  color: #6d4d86;
}
.chain-card > .button {
  grid-column: 1/-1;
  justify-self: stretch;
}
.compact-empty {
  padding: 22px 10px;
  min-height: 0;
}
.inline-form {
  display: flex;
  align-items: end;
  gap: 12px;
}
.inline-form label {
  flex: 1;
  display: grid;
  gap: 7px;
  color: #766b81;
  font-size: 12px;
}
.inline-form input {
  width: 100%;
  border: 1px solid #e5dfed;
  border-radius: 8px;
  padding: 10px 12px;
  color: #4c4057;
  background: #fff;
}
.listing-price {
  margin: -6px 0 16px;
}
.empty-state {
  text-align: center;
  padding: 40px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 14px;
  color: #7c668d;
  grid-column: 1/-1;
}
.empty-state h2,
.empty-state h3 {
  font-size: 17px;
  font-weight: 500;
  color: #6e5c7e;
}
.empty-state p {
  font-size: 12px;
  line-height: 1.9;
}
.empty-panel {
  background: #fff;
  min-height: 300px;
  border: 1px solid #eae5f1;
  border-radius: 12px;
}
.empty-icon {
  display: grid;
  place-items: center;
  background: #f3ecfb;
  width: 66px;
  height: 66px;
  border-radius: 20px;
  color: #b28cd5;
  margin-bottom: 4px;
}
.position-list {
  display: grid;
  gap: 17px;
}
.position-card {
  background: #fff;
  border: 1px solid #e8e3ef;
  border-radius: 12px;
  padding: 24px;
}
.position-main {
  display: flex;
  align-items: center;
  gap: 14px;
}
.position-icon {
  width: 48px;
  height: 48px;
  background: #efe7f8;
  color: #a47cce;
  border-radius: 12px;
  display: grid;
  place-items: center;
}
.position-id {
  font-size: 11px;
  letter-spacing: 1px;
  color: #766b81;
}
.position-main h3 {
  font-size: 15px;
  margin-top: 5px;
  font-weight: 600;
}
.position-main > .badge {
  margin-left: auto;
}
.status-cooling {
  background: #f5eee2;
  color: #806326;
}
.status-ready,
.status-listed {
  background: #ede7fa;
  color: #704b9c;
}
.status-failed {
  background: #fcf0ed;
  color: #995c47;
}
.status-holding {
  background: #eef2fa;
  color: #496a9b;
}
.status-sold,
.status-redeemed {
  background: #edf6f0;
  color: #4e785b;
}
.position-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 23px 0;
}
.position-details > div {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.position-details span {
  font-size: 12px;
  color: #766b81;
}
.position-details strong {
  font-size: 14px;
  font-weight: 500;
}
.position-details small {
  font-size: 12px;
  color: #766b81;
  font-weight: 400;
}
.position-actions {
  display: flex;
  align-items: center;
  gap: 9px;
  padding-top: 17px;
  border-top: 1px solid #efebf3;
  flex-wrap: wrap;
}
.position-actions p {
  font-size: 12px;
  color: #766b81;
  line-height: 1.8;
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 1 1 200px;
}
.surface-panel {
  background: #fff;
  padding: 25px;
  border: 1px solid #e9e4f0;
  border-radius: 12px;
  margin-bottom: 22px;
  min-width: 0;
}
.panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}
.panel-heading h2 {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 15px;
  font-weight: 600;
}
.panel-heading h2 svg {
  color: #a685c5;
}
.reward-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.claim-amount {
  font-size: 34px;
  font-weight: 600;
  margin: 8px 0 14px;
}
.claim-amount span {
  font-size: 12px;
  color: #766b81;
  font-weight: 400;
  margin-left: 9px;
}
.claim-amount + .text-muted {
  margin-bottom: 20px;
}
.release-overview {
  display: flex;
  align-items: center;
  gap: 30px;
  justify-content: center;
}
.release-donut {
  width: 135px;
  height: 135px;
  background: conic-gradient(#9b68cf 0 30%, #e8ddf4 30% 100%);
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.release-donut > span {
  width: 104px;
  height: 104px;
  background: white;
  border-radius: 50%;
  display: grid;
  place-content: center;
  grid-auto-flow: column;
  align-items: baseline;
  font-size: 28px;
  font-weight: 600;
  color: #9868c2;
}
.release-donut small {
  font-size: 15px;
}
.release-legend {
  font-size: 12px;
  color: #766b81;
}
.release-legend > div {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 13px;
}
.release-legend strong {
  color: #80628f;
  font-size: 14px;
  font-weight: 500;
}
.legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 3px;
  display: inline-block;
}
.legend-dot.purple {
  background: #9b68cf;
}
.legend-dot.pale {
  background: #e8ddf4;
}
.release-legend p {
  font-size: 12px;
  line-height: 1.9;
  margin-top: 15px;
}
.history-row {
  display: flex;
  gap: 13px;
  align-items: center;
  padding: 17px 0;
  border-top: 1px solid #f0edf5;
}
.history-row strong {
  font-size: 12px;
  font-weight: 500;
}
.history-row p {
  font-size: 12px;
  color: #766b81;
  margin-top: 6px;
  line-height: 1.9;
}
.history-row time {
  margin-left: auto;
  white-space: nowrap;
  font-size: 11px;
  color: #766b81;
}
.history-marker {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #c6abdf;
  flex-shrink: 0;
}
.ledger-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.ledger-summary > div {
  padding: 16px;
  border-radius: 9px;
  background: #f8f5fb;
  min-width: 0;
}
.ledger-summary span,
.test-time-status span {
  display: block;
  color: #766b81;
  font-size: 12px;
}
.ledger-summary strong {
  display: block;
  margin-top: 8px;
  font-size: 20px;
  overflow-wrap: anywhere;
}
.ledger-history {
  margin-top: 18px;
}
.ledger-entry-amount {
  margin-left: auto;
  text-align: right;
  color: #795099;
  font-size: 12px;
}
.ledger-entry-amount time {
  display: block;
  margin-top: 6px;
}
.admin-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}
.admin-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.admin-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 20px;
  padding: 5px;
  border: 1px solid #e9e2f0;
  border-radius: 10px;
  background: #fbf9fd;
}
.admin-subtabs {
  display: flex;
  gap: 8px;
  margin: 0 0 16px;
  overflow-x: auto;
  padding-bottom: 2px;
}
.admin-subtabs button {
  flex: 0 0 auto;
  border: 1px solid #e5dfed;
  border-radius: 999px;
  padding: 8px 13px;
  background: #fff;
  color: #766b81;
  cursor: pointer;
}
.admin-subtabs button.active {
  border-color: #6d4d86;
  background: #6d4d86;
  color: #fff;
}
.finance-toolbar {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 12px;
}
.admin-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 0;
  border-radius: 7px;
  padding: 9px 13px;
  background: transparent;
  color: #766b81;
  font-size: 12px;
  cursor: pointer;
}
.admin-tab.active {
  background: #6d4d86;
  color: #fff;
}
.admin-auth-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}
.admin-search {
  width: 100%;
  max-width: 420px;
  margin: 4px 0 16px;
  border: 1px solid #e5dfed;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
}
.admin-filter-row {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}
.admin-filter-row .price-filter-list {
  margin: 0 auto 0 0;
}
.admin-filter-row label {
  display: grid;
  gap: 5px;
  color: #766b81;
  font-size: 11px;
}
.admin-filter-row input {
  border: 1px solid #e5dfed;
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff;
  color: #33293b;
}
.admin-table-wrap {
  overflow-x: auto;
}
.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.admin-table th,
.admin-table td {
  padding: 12px 10px;
  border-bottom: 1px solid #eee9f2;
  text-align: left;
  vertical-align: top;
}
.admin-table th {
  color: #766b81;
  font-weight: 500;
}
.admin-table code {
  overflow-wrap: anywhere;
}
.admin-user-table code {
  white-space: nowrap;
}
.admin-user-table {
  table-layout: fixed;
}
.admin-user-table th:nth-child(1) {
  width: 15%;
}
.admin-user-table th:nth-child(2) {
  width: 19%;
}
.admin-user-table th:nth-child(3) {
  width: 19%;
}
.admin-user-table th:nth-child(4) {
  width: 10%;
  white-space: nowrap;
}
.admin-user-table th:nth-child(5) {
  width: 16%;
}
.admin-user-table th:nth-child(6) {
  width: 10%;
}
.admin-user-table th:nth-child(7) {
  width: 11%;
}
.admin-user-table td:nth-child(1),
.admin-user-table td:nth-child(2),
.admin-user-table td:nth-child(3) {
  overflow: hidden;
  text-overflow: ellipsis;
}
.admin-role-icon,
.admin-icon-button {
  display: inline-grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 10px;
}
.admin-role-icon.user {
  color: #4774a4;
  background: #edf5ff;
}
.admin-role-icon.operator {
  color: #7951a5;
  background: #f3eaff;
}
.admin-icon-button {
  border: 1px solid rgba(116, 79, 155, 0.15);
  color: #7040b7;
  background: rgba(255, 255, 255, 0.8);
  cursor: pointer;
}
.admin-icon-button:hover,
.admin-icon-button:focus-visible {
  color: #fff;
  background: #7040b7;
}
.date-range-trigger {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 218px;
  padding: 8px 12px;
  border: 1px solid rgba(116, 79, 155, 0.14);
  border-radius: 13px;
  color: #7040b7;
  background: rgba(255, 255, 255, 0.74);
  cursor: pointer;
  text-align: left;
}
.date-range-trigger span {
  display: grid;
  gap: 2px;
}
.date-range-trigger small {
  color: #9586a1;
  font-size: 10px;
}
.date-range-trigger strong {
  color: #453551;
  font-size: 12px;
  font-weight: 600;
}
.date-range-popover {
  z-index: 30;
  width: max-content;
  padding: 14px;
  border: 1px solid rgba(116, 79, 155, 0.14);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 55px rgba(59, 34, 85, 0.18);
}
.date-range-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 8px;
}
.date-range-heading div {
  display: grid;
  gap: 3px;
}
.date-range-heading small {
  color: #9586a1;
  font-size: 11px;
}
.date-range-heading button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 0;
  color: #7951a5;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}
.date-range-popover .rdp-root {
  --rdp-accent-color: #7040b7;
  --rdp-accent-background-color: #f0e6ff;
  --rdp-day-height: 34px;
  --rdp-day-width: 34px;
  font-size: 12px;
}
.admin-detail-heading {
  margin-top: 24px;
}
.admin-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 18px;
  color: #766b81;
  font-size: 12px;
}
.dialog-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 18px;
}
.dialog-actions .button {
  width: 100%;
}
.admin-asset-dialog {
  width: min(620px, calc(100vw - 32px));
}
.admin-asset-dialog .ledger-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-record-list {
  margin-top: 17px;
}
.admin-record-card {
  grid-template-columns: minmax(0, 1fr) auto auto;
}
.admin-record-card > .button {
  grid-column: auto;
  justify-self: auto;
}
.admin-asset-list {
  display: grid;
  gap: 10px;
}
.admin-asset-card {
  display: grid;
  grid-template-columns: minmax(190px, 1.5fr) repeat(4, minmax(100px, 1fr));
  gap: 12px;
  align-items: center;
  border: 1px solid #ece7f1;
  border-radius: 10px;
  padding: 14px;
}
.admin-asset-card > code {
  overflow-wrap: anywhere;
  font-size: 11px;
}
.admin-asset-card span,
.admin-asset-card strong {
  display: block;
}
.admin-asset-card span {
  color: #766b81;
  font-size: 11px;
}
.admin-asset-card strong {
  margin-top: 5px;
  overflow-wrap: anywhere;
  font-size: 13px;
}
.asset-metrics,
.team-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.admin-finance-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.compact-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.price-filter-panel .panel-heading {
  margin-bottom: 14px;
}
.price-ticker {
  display: flex;
  align-items: center;
  min-width: 0;
  margin-bottom: 18px;
  overflow: hidden;
  border: 1px solid #e8e1ef;
  border-radius: 9px;
  background: #221b29;
  color: #fff;
}
.price-ticker-label {
  z-index: 1;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  align-self: stretch;
  padding: 10px 14px;
  background: #6d4d86;
  font-size: 12px;
  font-weight: 600;
}
.price-ticker-track {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  min-width: 100%;
}
.price-ticker-item {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border-right: 1px solid rgba(116, 79, 155, 0.08);
  white-space: nowrap;
  font-size: 12px;
}
.price-ticker-item:last-child {
  border-right: 0;
}
.price-ticker-item b {
  color: #d7b3ff;
}
.price-ticker-item small {
  color: #a99eb2;
}

/* Mainnet reuses the tested testnet ticker, but keeps the values moving in a
   single shared strip so all three star-network skins get the same layout. */
.price-ticker--rolling .price-ticker-track {
  display: flex;
  width: max-content;
  min-width: max-content;
  animation: astra-price-ticker 28s linear infinite;
  will-change: transform;
}
.price-ticker--rolling .price-ticker-item {
  flex: 0 0 clamp(220px, 25vw, 320px);
}
@keyframes astra-price-ticker {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .price-ticker--rolling .price-ticker-track { animation: none; }
}

.star-template-market .price-ticker {
  margin-bottom: 8px;
}
.mainnet-information-strip.mainnet-information-strip {
  display: flex;
  width: 100%;
  min-height: 36px;
  min-width: 0;
  align-items: center;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(116, 79, 155, 0.18);
  border-radius: 12px;
}
.mainnet-information-strip .mainnet-information-strip-label {
  z-index: 1;
  display: inline-flex;
  min-height: 36px;
  width: 88px;
  flex: 0 0 88px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  align-self: stretch;
  padding: 7px 12px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.mainnet-information-strip .mainnet-information-strip-viewport {
  min-width: 0;
  flex: 1;
  overflow: hidden;
}
.mainnet-announcement-ticker {
  margin: 0 0 18px;
  cursor: pointer;
  text-align: left;
}
.mainnet-announcement-ticker:focus-visible {
  outline: 2px solid #9c6fd1;
  outline-offset: 2px;
}
.mainnet-announcement-label {
  background: rgba(109, 77, 134, 0.94);
}
.mainnet-announcement-viewport {
  color: #f4edf8;
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
}
.mainnet-announcement-moving-title {
  display: inline-block;
  min-width: max-content;
  padding-left: 100%;
  animation: astra-announcement-ticker 18s linear infinite;
  font-weight: 600;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.28);
  will-change: transform;
}
@keyframes astra-announcement-ticker {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}
@media (prefers-reduced-motion: reduce) {
  .mainnet-announcement-moving-title {
    max-width: 100%;
    padding: 0 10px;
    overflow: hidden;
    animation: none;
    text-overflow: ellipsis;
  }
}
.mainnet-announcement-dialog {
  width: min(620px, calc(100vw - 32px));
}
.mainnet-announcement-dialog-heading {
  padding-right: 32px;
}
.mainnet-announcement-dialog-heading h2 {
  margin: 6px 0 8px;
}
.mainnet-announcement-dialog-heading p {
  margin: 0;
  color: var(--text-muted, #84798d);
  font-size: 12px;
}
.mainnet-announcement-content {
  max-height: min(58vh, 520px);
  margin-top: 20px;
  padding-top: 18px;
  overflow-y: auto;
  border-top: 1px solid rgba(116, 79, 155, 0.14);
  line-height: 1.8;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
.mainnet-announcement-admin {
  display: grid;
  gap: 16px;
}
.mainnet-announcement-list .panel-heading h2 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.mainnet-announcement-list-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.mainnet-announcement-list-title h2 {
  margin: 0;
}
.mainnet-announcement-add-button,
.mainnet-announcement-icon-button {
  display: inline-grid;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(116, 79, 155, 0.2);
  border-radius: 9px;
  color: #7040ad;
  background: rgba(132, 82, 214, 0.08);
  cursor: pointer;
}
.mainnet-announcement-add-button:hover:not(:disabled),
.mainnet-announcement-icon-button:hover:not(:disabled) {
  border-color: rgba(112, 64, 173, 0.42);
  background: rgba(132, 82, 214, 0.16);
}
.mainnet-announcement-add-button:focus-visible,
.mainnet-announcement-icon-button:focus-visible {
  outline: 2px solid #9c6fd1;
  outline-offset: 2px;
}
.mainnet-announcement-icon-button.publish {
  color: #287353;
  background: rgba(54, 176, 119, 0.09);
}
.mainnet-announcement-icon-button.danger {
  color: #b13c4d;
  background: rgba(194, 59, 77, 0.08);
}
.mainnet-announcement-add-button:disabled,
.mainnet-announcement-icon-button:disabled {
  cursor: not-allowed;
  opacity: 0.4;
}
.mainnet-announcement-icon-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  white-space: nowrap;
}
.mainnet-announcement-editor-dialog {
  width: min(640px, calc(100vw - 32px));
}
.mainnet-announcement-form {
  display: grid;
  margin-top: 20px;
  gap: 14px;
}
.mainnet-announcement-form label {
  display: grid;
  gap: 7px;
}
.mainnet-announcement-form label > span {
  font-size: 12px;
  font-weight: 700;
}
.mainnet-announcement-form input,
.mainnet-announcement-form textarea {
  width: 100%;
  min-width: 0;
}
.mainnet-announcement-form textarea {
  resize: vertical;
  line-height: 1.6;
}
.mainnet-announcement-table td:first-child {
  min-width: 220px;
  overflow-wrap: anywhere;
}
.mainnet-announcement-table td:last-child {
  width: 132px;
  min-width: 132px;
  white-space: nowrap;
}
.mainnet-admin-status.status-draft {
  color: #855f20;
  background: rgba(224, 170, 74, 0.14);
}
.mainnet-admin-status.status-published {
  color: #287353;
  background: rgba(54, 176, 119, 0.14);
}
.market-zone-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 5px;
  border: 1px solid #e5dfed;
  border-radius: 12px;
  background: #f8f5fb;
}
.market-zone-tabs button {
  min-height: 44px;
  border: 0;
  border-radius: 9px;
  color: #766b81;
  background: transparent;
  font-weight: 600;
}
.market-zone-tabs button.active {
  color: #fff;
  background: #72508c;
  box-shadow: 0 5px 14px rgba(75, 43, 97, 0.18);
}
.market-zone-content {
  margin-top: 14px;
}
.market-zone {
  min-width: 0;
}
.market-zone-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}
.market-zone-heading h2 {
  margin: 4px 0 6px;
}
.market-zone-heading p,
.market-zone-stock {
  color: #766b81;
  font-size: 12px;
}
.market-zone-layout {
  min-width: 0;
}
.market-zone-buy-column {
  min-width: 0;
}
.market-zone-purchase {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(112px, auto) minmax(0, 0.72fr) minmax(128px, auto);
  gap: 10px;
  align-items: center;
}
.market-price-toolbar {
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
}
.market-price-search-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.market-price-search {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 260px;
  padding: 9px 12px;
  border: 1px solid #e5dfed;
  border-radius: 12px;
  color: #8b7b95;
  background: rgba(255, 255, 255, 0.78);
}
.market-price-search-form .market-price-search {
  flex: 1 1 220px;
}
.market-price-search-form .button {
  min-width: 72px;
}
.market-price-clear {
  border: 0;
  padding: 6px 2px;
  color: #7f579d;
  background: transparent;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.market-price-search-hint {
  margin: -2px 0 0;
  color: #8b7b95;
  font-size: 11px;
  line-height: 1.5;
}
.market-price-search-hint.error {
  color: #b24b62;
}
.market-price-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
}
.market-price-chips {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 1px 5px;
  scrollbar-width: thin;
}
.market-price-chip {
  display: inline-flex;
  min-width: 86px;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 8px 11px;
  border: 1px solid #e5dfed;
  border-radius: 12px;
  color: #5d466b;
  background: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.market-price-chip small {
  color: #988ca2;
  font-size: 10px;
  font-weight: 500;
}
.market-price-chip.active {
  border-color: #8e5ac5;
  color: #fff;
  background: #8050b0;
}
.market-price-chip.active small {
  color: rgba(255, 255, 255, 0.8);
}
.market-price-more {
  align-self: center;
  color: #8f8197;
  font-size: 12px;
}
.market-selected-price {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: 7px;
}
.market-selected-price span,
.market-selected-price small {
  color: #766b81;
  font-size: 11px;
}
.market-selected-price strong {
  flex: 0 0 auto;
  font-size: 17px;
}
.market-quantity-control,
.market-zone-total {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #766b81;
  font-size: 12px;
}
.market-quantity-control > span,
.market-zone-total > span {
  flex: 0 0 auto;
  white-space: nowrap;
}
.market-quantity-stepper {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  overflow: hidden;
  border: 1px solid #e5dfed;
  border-radius: 10px;
  background: #fff;
}
.market-quantity-stepper button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  color: #76518e;
  background: transparent;
  cursor: pointer;
}
.market-quantity-stepper button:hover:not(:disabled) {
  background: #f3ebfb;
}
.market-quantity-stepper button:disabled {
  color: #c7bdce;
  cursor: not-allowed;
}
.market-quantity-stepper strong {
  min-width: 26px;
  color: #3f2c49;
  text-align: center;
}
.market-zone-total {
  justify-content: flex-start;
}
.market-zone-total span {
  color: #766b81;
  font-size: 11px;
}
.market-zone-total strong {
  color: #3f2c49;
  overflow-wrap: anywhere;
}
.market-zone-purchase .button {
  justify-self: stretch;
}
.market-zone-stock {
  margin-top: 14px;
}
@media (min-width: 900px) {
  .market-zone-heading,
  .market-zone-layout {
    width: min(100%, 1100px);
    margin-inline: auto;
  }
  .market-zone-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(640px, 1.4fr);
    gap: 22px;
    align-items: start;
  }
  .market-price-toolbar {
    margin-bottom: 0;
  }
  .asset-metrics {
    width: min(100%, 1100px);
    margin-inline: auto;
  }
}

@media (min-width: 900px) and (max-width: 1199px) {
  /* The content area is narrower than the viewport after the sidebar. Stack
     the toolbar and compact purchase row before the four cells can squeeze. */
  .market-zone-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}
.price-filter-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.price-chip {
  min-height: 34px;
  padding: 7px 13px;
  border: 1px solid #e5dfed;
  border-radius: 999px;
  background: #fff;
  color: #766b81;
  font-size: 12px;
}
.price-chip.active {
  border-color: #9b68cf;
  background: #f1eafa;
  color: #75449f;
}
.price-tier-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.price-tier-card {
  display: flex;
  flex-direction: column;
}
.price-tier-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.price-tier-head h2 {
  margin-top: 6px;
  font-size: 24px;
  font-weight: 600;
}
.quantity-purchase {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  align-items: end;
  margin: 18px 0;
}
.quantity-purchase label,
.quantity-purchase > div {
  display: grid;
  gap: 7px;
  color: #766b81;
  font-size: 12px;
}
.quantity-purchase input {
  min-width: 0;
  width: 100%;
  border: 1px solid #e5dfed;
  border-radius: 8px;
  padding: 10px 12px;
  color: #4c4057;
  background: #fff;
}
.quantity-purchase strong {
  min-height: 40px;
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #6d4d86;
}
.test-time-status {
  margin-bottom: 16px;
}
.test-time-status strong {
  display: block;
  margin-bottom: 5px;
}
.test-time-warning {
  margin: -7px 0 15px;
  color: #a04a42;
  font-size: 11px;
}
.auto-buy-summary {
  margin-bottom: 17px;
  color: #766b81;
  font-size: 12px;
}
.compact {
  padding: 22px;
}
.studio-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.form-label {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 22px;
  font-size: 12px;
  color: #715b80;
}
.form-label textarea,
.form-label select {
  width: 100%;
  background: #fdfcfe;
  border: 1px solid #e8e0ef;
  padding: 13px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.8;
  color: #736080;
  resize: vertical;
}
.form-label textarea::placeholder {
  color: #81718d;
}
.studio-result pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-family: inherit;
  font-size: 12px;
  line-height: 2;
  color: #715b80;
}
.studio-result .empty-state {
  min-height: 300px;
}
.rule-list > div {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: 20px;
  padding: 17px 0;
  border-top: 1px solid #f0ebf5;
}
.rule-list strong {
  font-size: 12px;
  font-weight: 500;
  color: #826493;
}
.rule-list p {
  color: #766b81;
  line-height: 1.9;
  font-size: 12px;
}
.integration-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
.integration-steps h3 {
  font-size: 13px;
  font-weight: 500;
  margin: 15px 0 9px;
}
.integration-steps p {
  font-size: 12px;
  line-height: 1.9;
  color: #766b81;
}
.rule-links {
  display: flex;
  gap: 20px;
  margin-top: 24px;
  padding-top: 17px;
  border-top: 1px solid #f0ebf5;
  flex-wrap: wrap;
}
.rule-links a {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: #795099;
}
.demo-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 15px;
  margin-top: 28px;
  background: #f0ecf6;
  border: 1px dashed #d6c8e5;
  padding: 15px 18px;
  border-radius: 10px;
}
.control-label {
  display: flex;
  align-items: center;
  gap: 11px;
  color: #aa8fc4;
}
.control-label strong {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: #715487;
}
.control-label span {
  display: block;
  font-size: 12px;
  color: #766b81;
  margin-top: 5px;
}
.control-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.page-footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  color: #766b81;
  font-size: 11px;
  margin-top: 22px;
  line-height: 1.8;
}

/* Radix manages focus, keyboard behavior, portals, and accessible dialogs. */
.dialog-overlay {
  position: fixed;
  inset: 0;
  background: #24143055;
  backdrop-filter: blur(5px);
  z-index: 40;
}
.invite-gate-overlay {
  z-index: 80;
}
.dialog-content.invite-gate {
  z-index: 130;
}
.invite-gate-field {
  display: grid;
  gap: 8px;
  color: #5f576b;
  font-size: 12px;
  font-weight: 600;
}
.invite-gate-field input {
  width: 100%;
  border: 1px solid #e5dfed;
  border-radius: 9px;
  padding: 12px 13px;
  color: #342c3d;
  background: #faf9fc;
  font: inherit;
  /* iOS Safari and wallet WebViews zoom focused controls below 16px. */
  font-size: 16px;
  letter-spacing: 0.04em;
}
.invite-gate-submit {
  width: 100%;
  margin-top: 16px;
}
.dialog-content {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  padding: 32px;
  border-radius: 17px;
  box-shadow: 0 20px 70px #34204933;
  width: calc(100% - 36px);
  max-width: 460px;
  max-height: calc(100dvh - 48px);
  overflow: auto;
  z-index: 41;
}
.financial-action-dialog {
  max-width: 540px;
}
.financial-action-icon {
  display: grid;
  width: 48px;
  height: 48px;
  margin-bottom: 16px;
  place-items: center;
  border: 1px solid #dcd0e8;
  border-radius: 15px;
  color: #7a4fa0;
  background: linear-gradient(145deg, #faf7fd, #eee6f6);
}
.financial-action-name {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid #e9e1f0;
  border-radius: 12px;
  background: #faf8fc;
}
.financial-action-name span,
.financial-quote-grid dt,
.financial-action-meta span {
  color: #85778f;
  font-size: 12px;
}
.financial-action-name strong {
  color: #4f3761;
  font-size: 14px;
}
.financial-quote-grid {
  display: grid;
  gap: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid #ebe4f1;
  border-radius: 12px;
}
.financial-quote-grid > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 11px 14px;
  border-bottom: 1px solid #f0eaf4;
}
.financial-quote-grid > div:last-child {
  border-bottom: 0;
}
.financial-quote-grid dd {
  margin: 0;
  color: #493257;
  font-size: 13px;
  font-weight: 650;
  text-align: right;
  overflow-wrap: anywhere;
}
.financial-quote-grid .financial-quote-emphasis {
  background: #f5effa;
}
.financial-quote-grid .financial-quote-emphasis dd {
  color: #714592;
}
.financial-quote-expiry {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 13px;
  color: #715487;
  font-size: 12px;
}
.financial-action-meta {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 7px 12px;
  align-items: baseline;
  margin-top: 14px;
}
.financial-action-meta code {
  min-width: 0;
  overflow: hidden;
  color: #5d4d68;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.financial-action-buttons {
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
  gap: 10px;
  margin-top: 22px;
}
.financial-action-buttons .button {
  min-height: 44px;
}
.badge-error {
  color: #a6385a;
  background: #fff0f4;
  border-color: #f2c9d6;
}
@media (max-width: 560px) {
  .financial-action-dialog {
    width: calc(100% - 20px);
    max-height: calc(100dvh - 20px);
    padding: 22px 18px max(18px, env(safe-area-inset-bottom));
    border-radius: 15px;
  }
  .financial-action-dialog .dialog-title {
    font-size: 19px;
  }
  .financial-action-dialog .dialog-description {
    margin-bottom: 16px;
  }
  .financial-quote-grid > div {
    align-items: flex-start;
  }
  .financial-action-buttons {
    grid-template-columns: 1fr;
  }
  .financial-action-buttons .button-primary {
    order: -1;
  }
}

.dialog-close {
  position: absolute;
  top: 15px;
  right: 15px;
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  background: #f6f2fa;
  color: #a88bbf;
  border-radius: 50%;
}
.dialog-title {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  padding-right: 14px;
}
.dialog-description {
  color: #766b81;
  font-size: 12px;
  line-height: 1.9;
  margin: 11px 0 22px;
}
.dialog-icon {
  width: 50px;
  height: 50px;
  background: #f1e7fc;
  display: grid;
  place-items: center;
  color: #a376cd;
  border-radius: 15px;
  margin-bottom: 20px;
}
.feature-list {
  padding: 0;
  margin: 0 0 20px;
  list-style: none;
  display: grid;
  gap: 11px;
}
.feature-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  line-height: 1.8;
  color: #766b81;
}
.feature-list svg {
  color: #a17dc1;
  margin-top: 2px;
}
.summary-box {
  background: #f8f5fb;
  border: 1px solid #eee5f5;
  border-radius: 9px;
  padding: 16px;
  margin: 20px 0;
  display: grid;
  gap: 15px;
}
.summary-box > div {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 15px;
  font-size: 12px;
  color: #766b81;
}
.summary-box strong {
  font-weight: 600;
  color: #8861a2;
}
.checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  font-size: 12px;
  line-height: 1.9;
  color: #766b81;
  margin: 21px 0;
}
.checkbox-label input {
  accent-color: #9461c9;
  margin-top: 4px;
}
.purchase-success {
  text-align: center;
  padding-top: 10px;
}
.success-icon {
  width: 70px;
  height: 70px;
  background: #f0e8fa;
  color: #9e70cb;
  border-radius: 50%;
  display: grid;
  place-items: center;
  margin: 0 auto 22px;
}
.purchase-success .button-ghost {
  margin-top: 10px;
}
.dialog-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}
.wallet-list {
  display: grid;
  gap: 10px;
}
.wallet-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px;
  border-radius: 8px;
  border: 1px solid #e9e0f1;
  background: #faf7fd;
  overflow-wrap: anywhere;
  text-align: left;
}
.wallet-option:hover {
  background: #f0e6fb;
}
.wallet-option img {
  width: 28px;
  height: 28px;
}
.wallet-address {
  overflow-wrap: anywhere;
  font-size: 12px;
}
.settlement-assets,
.settlement-allocation {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
  gap: 24px;
}
.settlement-asset,
.settlement-allocation article {
  min-width: 0;
}
.settlement-asset h3,
.settlement-allocation h3 {
  margin: 13px 0;
  font-size: 24px;
  font-weight: 600;
}
.settlement-asset p,
.settlement-allocation p,
.settlement-flow-details dd {
  font-size: 12px;
  line-height: 1.9;
  color: #766b81;
  overflow-wrap: anywhere;
}
.settlement-asset p + p {
  margin-top: 10px;
}
.settlement-allocation {
  margin-top: 24px;
}
.settlement-allocation h4 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 500;
}
.settlement-filters {
  margin: 20px 0;
}
.settlement-flow {
  padding: 22px 0;
  border-top: 1px solid #eee7f5;
}
.settlement-flow-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.settlement-flow-heading h3 {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.7;
}
.settlement-flow-heading .badge {
  flex-shrink: 0;
}
.settlement-flow-details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
  gap: 20px;
  margin: 17px 0 0;
}
.settlement-flow-details dt {
  color: #806097;
  font-size: 11px;
  margin-bottom: 6px;
}
.settlement-flow-details dd {
  margin: 0;
}
.settlement-source {
  font-size: 11px !important;
  color: #766b81;
  line-height: 1.8;
  margin-top: 15px;
}
.settlement-disclaimer strong {
  font-weight: 500;
}
.mobile-nav {
  display: none;
}

@media (min-width: 1500px) {
  .hero-copy h1 {
    font-size: 40px;
  }
  .hero-panel {
    padding: 42px 48px;
  }
  .hero-art {
    min-height: 290px;
  }
  .hero-art .crystal {
    transform: rotate(-16deg) scale(1.12);
  }
}
@media (max-width: 1150px) {
  .app-shell {
    grid-template-columns: 195px minmax(0, 1fr);
  }
  .sidebar {
    padding: 27px 12px;
  }
  .brand {
    font-size: 23px;
    gap: 8px;
  }
  .brand small {
    font-size: 6px;
  }
  .page-shell {
    padding: 25px;
  }
  .topbar {
    padding: 0 25px;
  }
  .hero-panel {
    padding: 28px;
  }
  .hero-copy h1 {
    font-size: 29px;
  }
  .hero-art .orbit {
    width: 215px;
    height: 135px;
  }
  .hero-art .orbit-two {
    width: 245px;
    height: 175px;
  }
  .crystal {
    transform: rotate(-16deg) scale(0.85);
  }
  .product-grid {
    gap: 14px;
  }
  .product-body {
    padding: 14px;
  }
  .metrics-grid {
    gap: 12px;
  }
  .metric-card {
    padding: 15px;
  }
  .metric-value {
    font-size: 24px;
  }
  .journey-strip {
    gap: 12px;
  }
  .release-overview {
    gap: 17px;
  }
  .release-donut {
    width: 110px;
    height: 110px;
  }
  .release-donut > span {
    width: 84px;
    height: 84px;
  }
  .price-tier-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 950px) {
  .product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .hero-panel {
    grid-template-columns: 1.35fr 0.8fr;
  }
  .hero-art {
    min-height: 220px;
  }
  .hero-art .orbit {
    width: 170px;
    height: 105px;
  }
  .hero-art .orbit-two {
    width: 195px;
    height: 145px;
  }
  .crystal {
    width: 150px;
    transform: rotate(-16deg) scale(0.72);
  }
  .hero-copy h1 {
    font-size: 27px;
  }
  .hero-art .star-two {
    left: 0;
  }
  .hero-art .art-mini {
    right: 0;
  }
  .hero-actions {
    gap: 3px;
  }
  .hero-actions .button {
    padding: 10px 12px;
  }
  .metric-value {
    font-size: 21px;
  }
  .metrics-grid {
    gap: 9px;
  }
  .metric-card {
    padding: 13px;
  }
  .metric-icon {
    width: 24px;
    height: 24px;
  }
  .reward-columns,
  .studio-layout {
    grid-template-columns: 1fr;
  }
  .ledger-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .asset-metrics,
  .team-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .integration-steps {
    gap: 15px;
  }
  .journey-title {
    flex-basis: 100%;
  }
  .surface-panel {
    padding: 21px;
  }
  .position-card {
    padding: 20px;
  }
}
@media (max-width: 720px) {
  .testnet-columns,
  .contract-grid,
  .admin-grid,
  .ledger-summary {
    grid-template-columns: 1fr;
  }
  .ledger-entry-amount {
    width: 100%;
    margin-left: 20px;
    text-align: left;
  }
  .history-row {
    flex-wrap: wrap;
  }
  .testnet-metrics {
    grid-template-columns: 1fr;
  }
  .compact-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .price-tier-grid {
    grid-template-columns: 1fr;
  }
  .admin-asset-card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-asset-card > code {
    grid-column: 1 / -1;
  }
  .admin-record-card {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .admin-record-card > a,
  .admin-record-card > .button {
    grid-column: 1 / -1;
  }
  .admin-finance-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-filter-row {
    align-items: stretch;
    flex-direction: column;
  }
  .admin-filter-row .price-filter-list {
    margin-right: 0;
  }
  .admin-pagination {
    justify-content: space-between;
  }
  .chain-warning {
    flex-wrap: wrap;
  }
  .chain-warning > button {
    width: 100%;
    margin-left: 0;
  }
  .app-shell {
    display: block;
  }
  .sidebar {
    display: none;
  }
  .topbar {
    height: 65px;
    padding: 0 21px;
  }
  .breadcrumb {
    font-size: 11px;
    gap: 9px;
  }
  .topbar-actions {
    gap: 10px;
  }
  .topbar .button {
    padding: 8px 12px;
    min-height: 35px;
  }
  .wallet-chain-button {
    display: none;
  }
  .demo-chip {
    font-size: 8px;
    gap: 5px;
  }
  .demo-banner {
    padding: 9px 16px;
    gap: 7px;
    justify-content: flex-start;
  }
  .demo-banner button {
    display: none;
  }
  .page-shell {
    padding: 21px 20px 91px;
  }
  .hero-panel {
    padding: 28px 24px;
    min-height: 285px;
  }
  .hero-copy h1 {
    font-size: 27px;
  }
  .hero-art {
    min-height: 210px;
  }
  .hero-art .crystal {
    transform: rotate(-16deg) scale(0.8);
  }
  .hero-copy .eyebrow {
    font-size: 7px;
    letter-spacing: 1.3px;
  }
  .art-label {
    font-size: 6px;
    letter-spacing: 1.5px;
  }
  .metrics-grid {
    margin: 17px 0 28px;
    gap: 9px;
  }
  .metric-card {
    padding: 12px;
  }
  .metric-value {
    font-size: 22px;
    margin: 9px 0 6px;
    gap: 4px;
  }
  .metric-icon {
    width: 22px;
    height: 22px;
  }
  .metric-icon svg {
    width: 13px;
    height: 13px;
  }
  .mobile-nav {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fffffff5;
    backdrop-filter: blur(12px);
    border-top: 1px solid #e9e3f0;
    z-index: 20;
    padding: 9px 10px calc(9px + env(safe-area-inset-bottom));
    justify-content: space-around;
  }
  .mobile-nav button {
    background: transparent;
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 4px 6px;
    color: #766b81;
    font-size: 10px;
    min-width: 0;
  }
  .mobile-nav button.active {
    color: #935acb;
  }
  .demo-controls {
    padding: 15px;
  }
  .page-heading h1 {
    font-size: 25px;
  }
  .section-heading h2 {
    font-size: 18px;
  }
  .product-art {
    aspect-ratio: 1.55;
  }
  .market-toolbar {
    gap: 10px;
  }
  .tab-trigger {
    padding: 9px 11px;
  }
  .search-field {
    max-width: 175px;
  }
  .search-field input,
  .search-field select,
  .form-label textarea,
  .form-label select {
    font-size: 16px;
  }
  .position-main {
    gap: 10px;
  }
  .position-main h3 {
    font-size: 14px;
  }
  .position-details strong {
    font-size: 12px;
  }
}
@media (max-width: 480px) {
  .demo-chip {
    display: none;
  }
  .inline-form {
    align-items: stretch;
    flex-direction: column;
  }
  .inline-form .button {
    width: 100%;
  }
  .chain-card {
    grid-template-columns: 1fr;
  }
  .price-ticker-item small {
    display: none;
  }
  .market-zone-heading {
    flex-direction: column;
  }
  .market-zone-purchase {
    grid-template-columns: 1fr;
  }
  .admin-heading,
  .admin-auth-panel {
    align-items: stretch;
    flex-direction: column;
  }
  .admin-tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .admin-tab {
    flex: 0 0 auto;
  }
  .admin-finance-metrics {
    grid-template-columns: 1fr 1fr;
  }
  .admin-finance-metrics .metric-card {
    padding: 12px;
  }
  .admin-finance-metrics .metric-value {
    font-size: 18px;
  }
  .admin-pagination {
    flex-wrap: wrap;
  }
  .dialog-actions {
    grid-template-columns: 1fr;
  }
  .admin-asset-dialog .ledger-summary {
    grid-template-columns: 1fr;
  }
  .admin-asset-card {
    grid-template-columns: 1fr 1fr;
  }
  .page-shell {
    padding: 17px 16px 94px;
  }
  .topbar {
    padding: 0 16px;
  }
  .breadcrumb > span {
    display: none;
  }
  .hero-panel {
    grid-template-columns: 1fr;
    padding: 25px;
    min-height: unset;
  }
  .hero-art {
    display: none;
  }
  .hero-copy h1 {
    font-size: 30px;
    margin-top: 16px;
    line-height: 1.45;
  }
  .hero-actions .button {
    padding: 11px 15px;
  }
  .hero-caption {
    margin-top: 17px;
  }
  .hero-copy .eyebrow {
    font-size: 7px;
    letter-spacing: 1.5px;
  }
  .metrics-grid {
    gap: 7px;
  }
  .asset-metrics,
  .team-metrics,
  .compact-metrics {
    grid-template-columns: 1fr;
  }
  .metric-card {
    padding: 12px 10px;
  }
  .metric-top {
    gap: 3px;
  }
  .metric-icon {
    display: none;
  }
  .metric-value {
    font-size: 18px;
    display: block;
  }
  .metric-value small {
    display: block;
    margin-top: 5px;
  }
  .section-heading h2 {
    font-size: 17px;
  }
  .subtle-label {
    font-size: 11px;
  }
  .muted-eyebrow {
    font-size: 6px;
    letter-spacing: 1.8px;
  }
  .market-toolbar {
    flex-wrap: wrap;
    margin-bottom: 17px;
  }
  .tabs-list {
    gap: 5px;
  }
  .search-field {
    max-width: none;
    width: 100%;
    padding: 9px 12px;
  }
  .product-grid {
    gap: 12px;
  }
  .product-body {
    padding: 13px 12px;
  }
  .product-body h3 {
    font-size: 13px;
    line-height: 1.6;
    margin: 11px 0 6px;
  }
  .product-body > p {
    min-height: 69px;
  }
  .product-meta {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 6px;
  }
  .badge {
    padding: 3px 6px;
  }
  .product-bottom strong {
    font-size: 14px;
    gap: 3px;
    display: block;
  }
  .product-bottom strong span {
    display: block;
    margin-top: 3px;
  }
  .product-bottom .button-icon {
    width: 35px;
    min-height: 35px;
    border-radius: 7px;
  }
  .product-bottom {
    margin-top: 12px;
    padding-top: 10px;
  }
  .product-art {
    aspect-ratio: 1.15;
  }
  .product-sculpture {
    width: 95px;
    height: 85px;
    transform: scale(0.85);
  }
  .art-category {
    font-size: 6px;
    top: 10px;
    left: 10px;
    padding: 4px 6px;
    letter-spacing: 0.5px;
  }
  .product-art-label {
    font-size: 5px;
    letter-spacing: 0.5px;
    bottom: 11px;
    left: 10px;
  }
  .art-arrow {
    right: 9px;
    bottom: 9px;
  }
  .art-arrow svg {
    width: 14px;
  }
  .journey-strip {
    padding: 16px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
  }
  .journey-title {
    grid-column: 1/-1;
  }
  .journey-strip > div {
    gap: 8px;
  }
  .journey-strip > div > svg {
    display: none;
  }
  .page-footer {
    flex-direction: column;
    gap: 4px;
  }
  .demo-controls {
    gap: 14px;
  }
  .control-actions {
    gap: 5px;
  }
  .control-actions .button {
    padding: 8px 9px;
    min-height: 34px;
  }
  .dialog-content {
    padding: 25px;
  }
  .dialog-title {
    font-size: 20px;
  }
  .position-card {
    padding: 16px;
  }
  .position-main {
    flex-wrap: wrap;
  }
  .position-main > .badge {
    margin-left: 0;
  }
  .position-icon {
    height: 39px;
    width: 39px;
  }
  .position-details {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .position-details > div {
    flex-direction: row;
    justify-content: space-between;
    gap: 10px;
  }
  .position-actions p {
    flex-basis: 100%;
  }
  .integration-steps {
    grid-template-columns: 1fr;
    gap: 23px;
  }
  .integration-steps h3 {
    margin-top: 10px;
  }
  .rule-list > div {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .surface-panel {
    padding: 20px;
  }
  .reward-columns {
    gap: 0;
  }
  .history-row {
    flex-wrap: wrap;
    gap: 9px;
  }
  .history-row > div {
    flex: 1;
    min-width: 0;
  }
  .history-row time {
    flex-basis: 100%;
    margin-left: 16px;
  }
  .reward-columns .release-overview {
    gap: 20px;
    flex-wrap: wrap;
  }
  .hero-actions {
    gap: 3px;
  }
  .hero-actions .button-ghost {
    padding: 10px 9px;
  }
  .studio-result .empty-state {
    min-height: 250px;
  }
}

@media (max-width: 360px) {
  .market-quantity-control {
    gap: 4px;
  }
  .market-quantity-stepper button {
    width: 30px;
  }
  .market-quantity-stepper strong {
    min-width: 22px;
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

/* V20 shared controls and compact transaction surfaces. */
.language-switch {
  display: inline-flex;
  min-width: 48px;
  height: 38px;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid rgba(116, 79, 155, 0.14);
  border-radius: 12px;
  color: #65467d;
  background: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}
.language-switch:hover { background: #fff; }

.astra-pack-cover {
  position: relative;
  display: inline-grid;
  overflow: hidden;
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  place-items: center;
  border: 1px solid rgba(124, 70, 180, 0.16);
  border-radius: 16px;
  background: radial-gradient(circle at 30% 20%, #f5eaff 0, #c992f6 48%, #684091 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.astra-pack-cover::after {
  content: '';
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(255,255,255,.48);
  border-radius: 11px;
}
.astra-pack-cover img {
  position: relative;
  z-index: 1;
  width: 72%;
  height: 72%;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.astra-pack-cover.compact {
  width: 42px;
  height: 42px;
  flex-basis: 42px;
  border-radius: 13px;
}

.financial-queue-row {
  display: grid;
  gap: 3px;
}
.financial-queue-row small,
.notice > small {
  color: #7f7189;
  font-size: 10px;
  line-height: 1.45;
}

.auto-buy-actions {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: flex;
  min-width: min(100%, 300px);
  align-items: end;
  justify-content: flex-end;
  gap: 10px;
}
.auto-buy-actions label {
  display: grid;
  gap: 5px;
  color: #756780;
  font-size: 11px;
  font-weight: 700;
}
.auto-buy-actions input {
  width: 150px;
  min-height: 38px;
  padding: 7px 10px;
  border: 1px solid rgba(115, 79, 154, 0.15);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.78);
  color: #3a2946;
  font: inherit;
}
.auto-buy-actions > .form-hint {
  margin: 0;
  align-self: center;
}
.auto-buy-switch {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 5px 12px 5px 5px;
  border: 1px solid rgba(115, 79, 154, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: #5b4967;
  font: inherit;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, opacity 160ms ease;
}
.auto-buy-switch-track {
  position: relative;
  width: 46px;
  height: 28px;
  flex: 0 0 46px;
  border-radius: 999px;
  background: rgba(115, 79, 154, 0.16);
  transition: background 180ms ease;
}
.auto-buy-switch-track i {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 7px rgba(52, 34, 67, 0.22);
  transition: transform 180ms ease;
}
.auto-buy-switch[aria-checked='true'] {
  border-color: rgba(112, 64, 183, 0.34);
  background: rgba(239, 228, 253, 0.84);
  color: #7040ad;
}
.auto-buy-switch[aria-checked='true'] .auto-buy-switch-track {
  background: linear-gradient(135deg, #9a64dc, #7040b7);
}
.auto-buy-switch[aria-checked='true'] .auto-buy-switch-track i {
  transform: translateX(18px);
}
.auto-buy-switch:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (max-width: 560px) {
  .language-switch {
    min-width: 40px;
    width: 40px;
    padding: 0;
  }
  .language-switch svg { display: none; }
  .auto-buy-actions {
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    min-width: 0;
    align-items: stretch;
    flex-direction: column;
  }
  .auto-buy-actions input,
  .auto-buy-actions .button { width: 100%; }
  .auto-buy-actions .auto-buy-switch {
    width: auto;
    align-self: flex-start;
  }

  /* Keep one offer as one compact row on phones. The row is responsive and
     does not rely on screenshot-specific positioning. */
  .market-zone {
    padding: 13px;
  }
  .market-zone-heading {
    flex-direction: row;
    align-items: center;
    margin-bottom: 10px;
  }
  .market-zone-heading .position-id,
  .market-zone-heading p {
    display: none;
  }
  .market-zone-heading h2 {
    margin: 0;
    font-size: 17px;
  }
  .market-zone-heading > .badge {
    flex: 0 0 auto;
  }
  .market-price-search-hint {
    margin-bottom: 0;
  }
  .market-zone-purchase {
    display: grid;
    grid-template-columns: minmax(58px, 1fr) auto minmax(54px, .82fr) minmax(62px, auto);
    gap: 6px;
    padding: 8px;
    border-radius: 13px;
  }
  .market-selected-price {
    display: block;
  }
  .market-selected-price > span,
  .market-selected-price > small,
  .market-quantity-control > span,
  .market-zone-total > span {
    display: none;
  }
  .market-selected-price strong,
  .market-zone-total strong {
    font-size: 13px;
    line-height: 1.2;
    white-space: nowrap;
  }
  .market-quantity-control,
  .market-zone-total {
    justify-content: center;
  }
  .market-quantity-stepper {
    min-height: 30px;
  }
  .market-quantity-stepper button {
    width: 28px;
    height: 30px;
  }
  .market-quantity-stepper strong {
    min-width: 20px;
    font-size: 12px;
  }
  .market-zone-purchase .button {
    min-height: 32px;
    padding: 6px 8px;
    border-radius: 9px;
    font-size: 10px;
    white-space: nowrap;
  }
}

@media (max-width: 360px) {
  .market-zone-purchase {
    grid-template-columns: minmax(52px, 1fr) auto minmax(48px, .75fr) minmax(56px, auto);
    gap: 4px;
  }
  .market-quantity-stepper button { width: 24px; }
}

/* V19 visual system: airy lilac glass, soft depth, mobile-first product cards. */
.ambient-layer {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.ambient-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(2px);
  opacity: 0.72;
}
.ambient-orb-one {
  width: 420px;
  height: 420px;
  top: -180px;
  right: 9%;
  background: radial-gradient(
    circle at 35% 35%,
    #fff,
    #d9c2fb 48%,
    #b98aec 100%
  );
  box-shadow:
    inset -30px -35px 70px #8b55c733,
    0 40px 100px #9c66db26;
}
.ambient-orb-two {
  width: 280px;
  height: 280px;
  left: 13%;
  bottom: -130px;
  background: radial-gradient(circle at 35% 30%, #fff, #e8dcfb 52%, #cbb0ec);
}
.ambient-grid {
  position: absolute;
  inset: 0;
  opacity: 0.2;
  background-image:
    linear-gradient(#9271ba12 1px, transparent 1px),
    linear-gradient(90deg, #9271ba12 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, #000, transparent 70%);
}
.app-shell {
  grid-template-columns: 204px minmax(0, 1fr);
  padding: 12px;
  gap: 12px;
}
.sidebar {
  top: 12px;
  height: calc(100dvh - 24px);
  padding: 22px 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.86);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(24px) saturate(145%);
  box-shadow:
    var(--shadow-soft),
    inset 0 1px 0 #fff;
}
.brand {
  padding: 2px 8px 24px;
}
.brand-logo {
  width: 118px;
  filter: drop-shadow(0 7px 14px rgba(91, 54, 135, 0.08));
}
.nav-caption {
  padding-left: 13px;
  color: #9b8cae;
  font-weight: 700;
  letter-spacing: 2.2px;
}
.navigation {
  gap: 8px;
}
.nav-item {
  position: relative;
  min-height: 44px;
  padding: 11px 12px;
  border-radius: 10px;
  color: #73677f;
  font-weight: 600;
  transition:
    transform 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}
.nav-item:hover {
  transform: translateX(2px);
  background: rgba(244, 237, 253, 0.82);
}
.nav-item.active {
  color: #6f36bf;
  background: linear-gradient(
    135deg,
    rgba(241, 231, 255, 0.96),
    rgba(255, 255, 255, 0.82)
  );
  box-shadow:
    inset 0 0 0 1px rgba(139, 91, 205, 0.09),
    0 8px 18px rgba(104, 66, 153, 0.08);
}
.nav-item.active::before {
  content: '';
  position: absolute;
  left: 5px;
  width: 3px;
  height: 20px;
  border-radius: 99px;
  background: linear-gradient(#b57cf1, #7740c1);
}
.network-card {
  padding: 14px;
  border-color: rgba(119, 83, 163, 0.1);
  border-radius: 16px;
  background: rgba(249, 246, 253, 0.78);
  box-shadow: inset 0 1px 0 #fff;
}
.main-shell {
  min-width: 0;
}
.topbar {
  height: 64px;
  margin-bottom: 4px;
  padding: 0 22px;
  border: 1px solid rgba(255, 255, 255, 0.88);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(22px) saturate(150%);
  box-shadow:
    0 10px 32px rgba(85, 55, 121, 0.06),
    inset 0 1px 0 #fff;
}
.breadcrumb {
  gap: 10px;
  color: #aa9db7;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.breadcrumb strong {
  color: #453653;
  font-size: 13px;
}
.demo-chip {
  padding: 7px 10px;
  border: 1px solid rgba(133, 82, 193, 0.1);
  border-radius: 999px;
  background: rgba(245, 238, 253, 0.72);
}
.page-shell {
  max-width: calc(var(--content-user) + 48px);
  padding: 26px 24px 22px;
}
.page-heading {
  position: relative;
  margin: 4px 0 24px;
  padding-left: 2px;
}
.page-heading::before {
  content: 'ASTRA WORKSPACE';
  display: block;
  margin-bottom: 7px;
  color: #9d7cc5;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.2em;
}
.page-heading h1 {
  margin: 0 0 7px;
  color: #2b2135;
  font-size: clamp(24px, 2vw, var(--text-page));
  font-weight: 700;
  letter-spacing: -0.04em;
}
.page-heading p {
  color: #81748e;
  font-size: 13px;
}
.button {
  min-height: var(--control-height-md);
  padding: 9px 16px;
  border-radius: var(--radius-control);
  font-weight: 600;
}
.button-primary {
  background: linear-gradient(135deg, #9963e4, #6e37bd);
  box-shadow:
    0 10px 22px rgba(114, 57, 190, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.32);
}
.button-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #a36deb, #6630b2);
  transform: translateY(-1px);
}
.button-outline {
  border-color: rgba(115, 78, 156, 0.13);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: inset 0 1px 0 #fff;
}
.button-small {
  min-height: var(--control-height-sm);
  border-radius: 9px;
}
.surface-panel,
.metric-card,
.position-card,
.empty-panel,
.chain-card {
  border-color: rgba(116, 80, 157, 0.11);
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(20px) saturate(145%);
  box-shadow:
    var(--shadow-card),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
}
.surface-panel {
  padding: 20px;
  border-radius: var(--radius-card);
  margin-bottom: 16px;
}
.metrics-grid {
  gap: 14px;
  margin: 18px 0 24px;
}
.metric-card {
  position: relative;
  overflow: hidden;
  min-height: 104px;
  padding: 16px;
  border-radius: var(--radius-card);
}
.metric-card::after {
  content: '';
  position: absolute;
  width: 110px;
  height: 110px;
  top: -62px;
  right: -42px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(197, 163, 241, 0.38),
    transparent 70%
  );
  pointer-events: none;
}
.metric-top {
  color: #7f718d;
  font-weight: 600;
}
.metric-top svg {
  color: #9565ce;
}
.metric-value {
  margin-top: 10px;
  color: #30223f;
  font-size: clamp(22px, 2vw, var(--text-number));
  font-weight: 700;
}
.panel-heading h2 {
  color: #31243e;
  font-size: 16px;
}
.badge {
  padding: 5px 9px;
  border-radius: 999px;
  font-weight: 600;
}
.badge-purple,
.badge-blue {
  border: 1px solid rgba(119, 77, 166, 0.08);
  background: rgba(239, 229, 252, 0.74);
  color: #7245a5;
}
.notice {
  border-radius: 16px;
  backdrop-filter: blur(15px);
}
.notice-info {
  border-color: rgba(120, 82, 164, 0.11);
  background: rgba(239, 231, 251, 0.72);
}
.notice-error {
  border-color: rgba(188, 102, 117, 0.12);
  background: rgba(255, 241, 245, 0.78);
}
.market-showcase {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
  min-height: 330px;
  margin-bottom: 18px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.88);
  border-radius: 30px;
  background:
    radial-gradient(
      circle at 78% 16%,
      rgba(255, 255, 255, 0.9),
      transparent 21%
    ),
    linear-gradient(135deg, rgba(250, 247, 255, 0.96), rgba(223, 204, 250, 0.9));
  box-shadow:
    0 28px 70px rgba(99, 60, 146, 0.16),
    inset 0 1px 0 #fff;
  isolation: isolate;
}
.market-showcase::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.35;
  background-image: radial-gradient(#8e63bd 0.8px, transparent 0.8px);
  background-size: 21px 21px;
  mask-image: linear-gradient(90deg, #000, transparent 72%);
}
.market-showcase-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 42px 44px;
}
.showcase-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #8658bd;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.17em;
}
.market-showcase h2 {
  margin: 14px 0 12px;
  color: #2b1f37;
  font-size: clamp(30px, 3.5vw, 48px);
  line-height: 1.22;
  letter-spacing: -0.055em;
}
.market-showcase h2 span {
  color: #7b43c5;
}
.market-showcase-copy > p {
  max-width: 590px;
  color: #746580;
  font-size: 13px;
  line-height: 1.9;
}
.showcase-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 24px;
}
.showcase-stats > div {
  min-width: 112px;
  padding: 11px 14px;
  border: 1px solid rgba(255, 255, 255, 0.76);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.47);
  box-shadow: inset 0 1px 0 #fff;
  backdrop-filter: blur(13px);
}
.showcase-stats small {
  display: block;
  margin-bottom: 4px;
  color: #8d7a9a;
  font-size: 10px;
}
.showcase-stats strong {
  color: #443052;
  font-size: 17px;
}
.showcase-stats em {
  color: #8e7b9b;
  font-size: 10px;
  font-style: normal;
  font-weight: 500;
}
.market-showcase-art {
  position: relative;
  min-height: 310px;
}
.glass-sphere {
  position: absolute;
  display: block;
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  background: radial-gradient(
    circle at 28% 22%,
    #fff 0 4%,
    rgba(255, 255, 255, 0.54) 12%,
    rgba(177, 127, 232, 0.68) 64%,
    rgba(103, 55, 171, 0.36)
  );
  box-shadow:
    inset -14px -18px 26px rgba(86, 43, 147, 0.19),
    inset 10px 9px 20px rgba(255, 255, 255, 0.67),
    0 28px 40px rgba(100, 56, 155, 0.19);
  backdrop-filter: blur(8px);
}
.sphere-large {
  width: 174px;
  height: 174px;
  right: 54px;
  top: 32px;
}
.sphere-medium {
  width: 96px;
  height: 96px;
  right: 206px;
  top: 86px;
}
.sphere-small {
  width: 62px;
  height: 62px;
  right: 38px;
  bottom: 36px;
}
.showcase-float-card {
  position: absolute;
  right: 96px;
  bottom: 38px;
  width: 166px;
  height: 112px;
  padding: 17px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.45);
  box-shadow:
    0 20px 40px rgba(83, 45, 132, 0.17),
    inset 0 1px 0 #fff;
  backdrop-filter: blur(18px);
  transform: rotate(-6deg);
}
.showcase-float-card span {
  color: #8862aa;
  font-size: 8px;
  letter-spacing: 0.16em;
}
.showcase-float-card strong {
  display: block;
  margin-top: 8px;
  color: #493257;
  font-size: 14px;
  line-height: 1.25;
}
.showcase-float-card svg {
  position: absolute;
  right: 16px;
  bottom: 16px;
  color: #8452c8;
}
.price-ticker {
  border-color: rgba(116, 79, 155, 0.1);
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.65);
  color: #594969;
  box-shadow:
    0 10px 28px rgba(83, 55, 119, 0.06),
    inset 0 1px 0 #fff;
  backdrop-filter: blur(18px);
}
.price-ticker-label {
  background: linear-gradient(135deg, #9b69dc, #7540bc);
}
.price-ticker-item b {
  color: #7040ad;
}
.price-ticker-item small {
  color: #9b8aa9;
}
.auto-buy-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0.8),
    rgba(239, 228, 253, 0.72)
  );
}
.auto-buy-panel .panel-heading {
  margin-bottom: 7px;
}
.auto-buy-panel > .button {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-width: 128px;
}
.market-zone-tabs,
.admin-tabs {
  padding: 6px;
  border-color: rgba(116, 79, 155, 0.1);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.55);
  box-shadow:
    inset 0 1px 0 #fff,
    0 10px 25px rgba(88, 55, 124, 0.05);
  backdrop-filter: blur(18px);
}
.market-zone-tabs button,
.admin-tab {
  min-height: 46px;
  border-radius: 13px;
}
.market-zone-tabs button.active,
.admin-tab.active {
  background: linear-gradient(135deg, #9a64dc, #7040b7);
  box-shadow:
    0 8px 18px rgba(90, 44, 148, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
.market-zone {
  padding: 22px;
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.8),
    rgba(247, 241, 253, 0.68)
  );
}
.market-zone-heading h2 {
  color: #35253f;
  font-size: 25px;
}
.market-zone-purchase {
  padding: 10px 12px;
  border: 1px solid rgba(117, 80, 157, 0.09);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.55);
}
.market-zone-purchase select,
.market-zone-purchase input,
.inline-form input,
.admin-search,
.admin-filter-row input {
  min-height: 46px;
  border-color: rgba(115, 79, 154, 0.13);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: inset 0 1px 3px rgba(93, 62, 128, 0.03);
}
.position-card {
  border-radius: 23px;
}
.position-icon {
  border-radius: 16px;
  background: linear-gradient(145deg, #f4ebff, #e5d4fa);
  box-shadow: inset 0 1px 0 #fff;
}
.ledger-summary > div {
  border: 1px solid rgba(116, 79, 155, 0.08);
  border-radius: 16px;
  background: linear-gradient(
    145deg,
    rgba(250, 247, 253, 0.86),
    rgba(241, 233, 250, 0.67)
  );
  box-shadow: inset 0 1px 0 #fff;
}
.admin-subtabs {
  gap: 9px;
  padding: 4px 2px 8px;
}
.admin-subtabs button {
  min-height: 40px;
  border-color: rgba(116, 79, 155, 0.11);
  background: rgba(255, 255, 255, 0.64);
  box-shadow: inset 0 1px 0 #fff;
}
.admin-subtabs button.active {
  border-color: transparent;
  background: linear-gradient(135deg, #9561d8, #7040b7);
  box-shadow: 0 8px 18px rgba(92, 49, 145, 0.18);
}
.admin-table {
  border-collapse: separate;
  border-spacing: 0 7px;
}
.admin-table th {
  border: 0;
  color: #9586a1;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.admin-table td {
  border-top: 1px solid rgba(116, 79, 155, 0.08);
  border-bottom: 1px solid rgba(116, 79, 155, 0.08);
  background: rgba(255, 255, 255, 0.56);
}
.admin-table td:first-child {
  border-left: 1px solid rgba(116, 79, 155, 0.08);
  border-radius: 13px 0 0 13px;
}
.admin-table td:last-child {
  border-right: 1px solid rgba(116, 79, 155, 0.08);
  border-radius: 0 13px 13px 0;
}
.page-footer {
  color: #95899f;
  border-color: rgba(116, 79, 155, 0.08);
}
.dialog-overlay {
  background: rgba(51, 35, 67, 0.24);
  backdrop-filter: blur(12px);
}
.dialog-content {
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.84);
  box-shadow:
    0 35px 100px rgba(59, 34, 85, 0.25),
    inset 0 1px 0 #fff;
  backdrop-filter: blur(26px);
}

@media (max-width: 1150px) {
  .app-shell {
    grid-template-columns: 215px minmax(0, 1fr);
  }
  .sidebar {
    padding-inline: 13px;
  }
  .market-showcase-copy {
    padding: 34px;
  }
  .sphere-large {
    right: 28px;
  }
  .sphere-medium {
    right: 164px;
  }
  .showcase-float-card {
    right: 54px;
  }
}
@media (max-width: 820px) {
  .market-showcase {
    grid-template-columns: 1fr minmax(210px, 0.55fr);
  }
  .market-showcase-copy {
    padding: 31px;
  }
  .market-showcase h2 {
    font-size: 34px;
  }
  .sphere-large {
    width: 142px;
    height: 142px;
  }
  .sphere-medium {
    width: 78px;
    height: 78px;
    right: 135px;
  }
  .showcase-float-card {
    width: 145px;
    right: 30px;
  }
}
@media (max-width: 720px) {
  .price-ticker-track {
    display: flex;
    width: auto;
    min-width: 0;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }
  .price-ticker--rolling .price-ticker-track {
    width: max-content;
    min-width: max-content;
    overflow: visible;
    scroll-snap-type: none;
  }
  .price-ticker-track::-webkit-scrollbar {
    display: none;
  }
  .price-ticker-item {
    min-width: max-content;
    flex: 0 0 auto;
    justify-content: flex-start;
    scroll-snap-align: start;
  }
  .app-shell {
    padding: 0;
  }
  .topbar {
    position: sticky;
    top: 8px;
    z-index: 18;
    height: 62px;
    margin: 8px 12px 0;
    border-radius: 19px;
    padding: 0 15px;
  }
  .page-shell {
    padding: 24px 16px 108px;
  }
  .page-heading {
    margin-bottom: 19px;
  }
  .market-showcase {
    grid-template-columns: 1fr;
    min-height: 0;
    border-radius: 25px;
  }
  .market-showcase-copy {
    padding: 28px 25px 23px;
  }
  .market-showcase h2 {
    font-size: clamp(30px, 9vw, 40px);
  }
  .market-showcase-art {
    min-height: 205px;
  }
  .sphere-large {
    width: 138px;
    height: 138px;
    right: 48px;
    top: 18px;
  }
  .sphere-medium {
    width: 74px;
    height: 74px;
    right: 166px;
    top: 51px;
  }
  .sphere-small {
    width: 50px;
    height: 50px;
    right: 30px;
    bottom: 21px;
  }
  .showcase-float-card {
    width: 145px;
    height: 98px;
    right: 74px;
    bottom: 15px;
  }
  .surface-panel {
    border-radius: 20px;
  }
  .metric-card {
    min-height: 118px;
    border-radius: 18px;
  }
  .auto-buy-panel {
    grid-template-columns: 1fr;
  }
  .auto-buy-panel > .button {
    grid-column: 1;
    grid-row: auto;
    margin-top: 14px;
  }
  .mobile-nav {
    left: 12px;
    right: 12px;
    bottom: 10px;
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom));
    border: 1px solid rgba(255, 255, 255, 0.88);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow:
      0 20px 50px rgba(65, 40, 91, 0.18),
      inset 0 1px 0 #fff;
    backdrop-filter: blur(24px) saturate(155%);
  }
  .mobile-nav button {
    position: relative;
    min-height: 48px;
    border-radius: 15px;
  }
  .mobile-nav button.active {
    color: #7440b5;
    background: linear-gradient(
      145deg,
      rgba(239, 229, 252, 0.96),
      rgba(255, 255, 255, 0.82)
    );
  }
  .mobile-nav button.active svg {
    filter: drop-shadow(0 4px 8px rgba(106, 62, 157, 0.22));
  }
}
@media (max-width: 480px) {
  .topbar {
    margin-inline: 9px;
  }
  .page-shell {
    padding-inline: 13px;
  }
  .market-showcase-copy {
    padding: 25px 21px 20px;
  }
  .market-showcase-copy > p {
    font-size: 12px;
  }
  .showcase-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .showcase-stats > div {
    min-width: 0;
    padding: 10px;
  }
  .showcase-stats strong {
    font-size: 14px;
    overflow-wrap: anywhere;
  }
  .surface-panel {
    padding: 18px;
  }
  .market-zone {
    padding: 15px;
  }
  .market-zone-heading {
    gap: 7px;
    margin-bottom: 14px;
  }
  .market-zone-heading h2 {
    margin-block: 2px 3px;
    font-size: 21px;
  }
  .market-price-toolbar {
    gap: 8px;
    margin-bottom: 11px;
  }
  .market-price-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .market-price-search-form .market-price-search {
    min-width: 0;
    padding: 8px 10px;
  }
  .market-price-search-form .button {
    min-width: 64px;
    min-height: 40px;
    padding-inline: 12px;
  }
  .market-price-clear,
  .market-price-search-hint {
    grid-column: 1 / -1;
  }
  .market-price-chips {
    gap: 6px;
  }
  .market-price-chip {
    min-width: 78px;
    padding: 7px 9px;
  }
  .market-zone-purchase {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 11px;
    border-radius: 15px;
  }
  .market-selected-price {
    display: grid;
    gap: 2px;
  }
  .market-quantity-control,
  .market-zone-total {
    justify-content: space-between;
  }
  .market-zone-purchase .button {
    min-height: 40px;
    padding-inline: 10px;
  }
  .market-selected-price strong {
    font-size: 17px;
  }
  .market-zone-stock {
    margin-top: 10px;
  }
  .asset-metrics,
  .team-metrics,
  .compact-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .metric-card {
    padding: 15px;
  }
  .metric-value {
    font-size: 20px;
  }
}

/* V20 must follow the V19 mobile layer so its compact one-row purchase card
   wins without fixed positioning or viewport-specific hacks. */
@media (max-width: 560px) {
  .surface-panel.market-zone { padding: 13px; }
  .market-zone .market-zone-heading {
    flex-direction: row;
    align-items: center;
    margin-bottom: 10px;
  }
  .market-zone .market-zone-heading .position-id,
  .market-zone .market-zone-heading p { display: none; }
  .market-zone .market-zone-heading h2 { margin: 0; font-size: 17px; }
  .market-zone .market-zone-purchase {
    display: grid;
    grid-template-columns: minmax(58px, 1fr) auto minmax(54px, .82fr) minmax(62px, auto);
    gap: 6px;
    padding: 8px;
    border-radius: 13px;
  }
  .market-zone .market-selected-price { display: block; }
  .market-zone .market-selected-price > span,
  .market-zone .market-selected-price > small,
  .market-zone .market-quantity-control > span,
  .market-zone .market-zone-total > span { display: none; }
  .market-zone .market-selected-price strong,
  .market-zone .market-zone-total strong {
    font-size: 13px;
    line-height: 1.2;
    white-space: nowrap;
  }
  .market-zone .market-quantity-control,
  .market-zone .market-zone-total { justify-content: center; }
  .market-zone .market-quantity-stepper { min-height: 30px; }
  .market-zone .market-quantity-stepper button { width: 28px; height: 30px; }
  .market-zone .market-quantity-stepper strong { min-width: 20px; font-size: 12px; }
  .market-zone .market-zone-purchase .button {
    min-height: 32px;
    padding: 6px 8px;
    border-radius: 9px;
    font-size: 10px;
    white-space: nowrap;
  }
}

@media (min-width: 561px) and (max-width: 720px) {
  .auto-buy-actions {
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    min-width: 0;
    align-items: flex-end;
  }
}
/*
 * Shared interaction polish.
 *
 * This file intentionally sits after App.css so overlays, popovers and native
 * controls share one visual baseline without changing their business logic.
 */

/* Native select controls: keep the browser's reliable keyboard behaviour while
 * making the closed state match the glass-card controls used across the app. */
select {
  appearance: none;
  -webkit-appearance: none;
  min-height: 42px;
  padding-right: 38px !important;
  border-color: rgba(116, 79, 155, 0.16) !important;
  color: #453551;
  background-color: rgba(255, 255, 255, 0.82) !important;
  background-image:
    linear-gradient(45deg, transparent 50%, #8b64b6 50%),
    linear-gradient(135deg, #8b64b6 50%, transparent 50%);
  background-position:
    calc(100% - 17px) 50%,
    calc(100% - 12px) 50%;
  background-repeat: no-repeat;
  background-size:
    5px 5px,
    5px 5px;
  transition:
    border-color 160ms ease,
    box-shadow 160ms ease,
    background-color 160ms ease;
}

select:hover {
  border-color: rgba(112, 64, 183, 0.36) !important;
  background-color: #fff !important;
}

select:focus-visible {
  border-color: #8e5bd0 !important;
  box-shadow: 0 0 0 4px rgba(142, 91, 208, 0.13);
}

select option {
  color: #342c3d;
  background: #fff;
}

/* Labels and actions stay horizontal; dense data falls back to cards or
 * horizontal scrolling at the component level. */
button,
.button,
.badge,
table th,
.metric-top,
.position-id {
  white-space: nowrap;
}

/* Radix dialogs are portalled to body. These rules therefore cover every
 * current dialog (invite, market, team and admin) and future dialogs too. */
.dialog-overlay {
  z-index: 120;
  background: rgba(35, 23, 50, 0.34) !important;
  backdrop-filter: blur(12px) saturate(115%);
  -webkit-backdrop-filter: blur(12px) saturate(115%);
  animation: ui-overlay-in 180ms ease-out;
}

.dialog-content {
  z-index: 121;
  isolation: isolate;
  width: min(520px, calc(100vw - 32px));
  max-height: min(720px, calc(100dvh - 40px));
  padding: 30px;
  border: 1px solid rgba(255, 255, 255, 0.88);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.93);
  box-shadow:
    0 32px 90px rgba(48, 27, 71, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(24px) saturate(115%);
  -webkit-backdrop-filter: blur(24px) saturate(115%);
  overscroll-behavior: contain;
  scrollbar-width: thin;
  animation: ui-dialog-in 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.dialog-content:focus {
  outline: none;
}

.dialog-close {
  z-index: 1;
  top: 18px;
  right: 18px;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(116, 79, 155, 0.12);
  color: #7951a5;
  background: rgba(247, 243, 252, 0.9);
  transition:
    color 160ms ease,
    background 160ms ease,
    transform 160ms ease;
}

.dialog-close:hover,
.dialog-close:focus-visible {
  color: #fff;
  background: #7040b7;
  transform: scale(1.04);
}

.dialog-title {
  max-width: calc(100% - 30px);
  color: #2e2440;
  letter-spacing: -0.01em;
}

.dialog-description {
  max-width: 58ch;
  margin-top: 9px;
  line-height: 1.75;
}

.dialog-actions {
  display: flex;
  gap: 12px;
}

.dialog-actions .button {
  min-height: 44px;
}

/* InviteGate is intentionally non-dismissible, but should still be usable on
 * short mobile screens and with the software keyboard open. */
.dialog-content.invite-gate {
  width: min(430px, calc(100vw - 28px));
  max-height: min(680px, calc(100dvh - 28px));
  padding: 28px;
  z-index: 130 !important;
}

.invite-gate {
  z-index: 130 !important;
}

.invite-gate-field input {
  min-height: 46px;
  border-color: rgba(116, 79, 155, 0.17);
  border-radius: 12px;
  background: rgba(250, 249, 252, 0.92);
  transition:
    border-color 160ms ease,
    box-shadow 160ms ease,
    background 160ms ease;
}

.invite-gate-field input:hover {
  border-color: rgba(112, 64, 183, 0.34);
  background: #fff;
}

.invite-gate-field input:focus {
  outline: none;
  border-color: #8e5bd0;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(142, 91, 208, 0.13);
}

/* Date range popover and any future Radix popover stay inside the viewport. */
.date-range-popover {
  z-index: 110;
  max-width: calc(100vw - 24px);
  max-height: calc(100dvh - 24px);
  overflow: auto;
  border-color: rgba(116, 79, 155, 0.18);
  background: rgba(255, 255, 255, 0.97);
  box-shadow:
    0 24px 70px rgba(59, 34, 85, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.96);
  overscroll-behavior: contain;
}

.date-range-trigger {
  min-height: 46px;
  transition:
    border-color 160ms ease,
    box-shadow 160ms ease,
    background 160ms ease;
}

.date-range-trigger:hover {
  border-color: rgba(112, 64, 183, 0.34);
  background: #fff;
}

.date-range-trigger:focus-visible {
  outline: none;
  border-color: #8e5bd0;
  box-shadow: 0 0 0 4px rgba(142, 91, 208, 0.13);
}

/* The table keeps a minimum readable layout instead of squeezing role and
 * asset icons into the wrong columns on narrow screens. */
.admin-table-wrap {
  min-width: 0;
  border-radius: 16px;
  scrollbar-width: thin;
}

.admin-user-table {
  min-width: 760px;
  table-layout: fixed;
}

.admin-user-table th:nth-child(1) {
  width: 15%;
}

/* Chain 56 closed profile: keep the page useful for deployment verification
 * without exposing the Chain 97 business navigation or implying that writes
 * are available. */
.mainnet-workspace {
  min-width: 0;
}

.mainnet-market-showcase {
  margin-top: 4px;
}

.mainnet-release-gate {
  align-items: flex-start;
  margin-bottom: 16px;
}

.mainnet-release-gate p {
  margin: 4px 0 0;
  line-height: 1.65;
}

.mainnet-session-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
}

.mainnet-session-panel > div:first-child {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 3px 9px;
}

.mainnet-session-panel > div:first-child small {
  grid-column: 2;
  color: #81748e;
}

.mainnet-session-panel .inline-actions {
  justify-content: flex-end;
}

.mainnet-account-metrics {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.mainnet-asset-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mainnet-package-card {
  margin-bottom: 8px;
  padding: 14px 16px;
}

.mainnet-package-card .position-main {
  gap: 12px;
}

.mainnet-package-card .astra-pack-cover {
  width: 42px;
  min-width: 42px;
}

.mainnet-package-card .position-details {
  margin-top: 12px;
  padding-top: 12px;
}

.mainnet-package-cost-label {
  display: block;
  margin-top: 3px;
  color: #8b7b95;
  font-size: 10px;
}

.mainnet-split-details {
  margin-top: 12px;
  border-top: 1px solid var(--star-line, rgba(116, 80, 157, 0.16));
  padding-top: 12px;
}

.mainnet-split-details > summary,
.mainnet-split-nested > summary {
  cursor: pointer;
  color: var(--star-ink, #2d2440);
  font-size: 13px;
  font-weight: 650;
}

.mainnet-split-children {
  display: grid;
  gap: 9px;
  margin-top: 10px;
}

.mainnet-split-child {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(92px, 0.7fr));
  gap: 8px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--star-line, rgba(116, 80, 157, 0.16));
  border-radius: 10px;
  background: color-mix(in srgb, var(--star-panel, #fff) 82%, transparent);
}

.mainnet-split-child > div:not(.position-actions) {
  min-width: 0;
}

.mainnet-split-child span {
  display: block;
  margin-bottom: 3px;
  color: var(--star-muted, #75647f);
  font-size: 10px;
}

.mainnet-split-child strong {
  display: block;
  overflow: hidden;
  color: var(--star-ink, #2d2440);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mainnet-split-child .position-actions,
.mainnet-split-nested {
  grid-column: 1 / -1;
}

.mainnet-receipt-recovery {
  margin-top: 8px;
  color: #75647f;
  font-size: 12px;
}

.mainnet-receipt-recovery summary {
  cursor: pointer;
}

.mainnet-receipt-recovery input {
  min-width: 240px;
  padding: 8px 10px;
  border: 1px solid rgba(116, 80, 157, 0.2);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.82);
}

.mainnet-market-zone .market-zone-heading {
  margin-bottom: 14px;
}

.mainnet-market-zone .market-zone-layout {
  display: block;
}

.market-range-form .market-price-search {
  max-width: 145px;
}

.market-range-separator {
  color: #8b7b95;
  font-size: 12px;
}

.mainnet-market-item-list {
  display: grid;
  max-width: 960px;
  gap: 8px;
}

.mainnet-market-item {
  overflow: hidden;
  border: 1px solid rgba(116, 80, 157, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 7px 22px rgba(83, 55, 119, 0.035);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.mainnet-market-item:hover {
  border-color: rgba(126, 75, 184, 0.3);
  box-shadow: 0 12px 28px rgba(83, 55, 119, 0.09);
  transform: translateY(-1px);
}

.mainnet-market-item-select {
  display: grid;
  width: 100%;
  min-height: 58px;
  grid-template-columns: minmax(210px, 1.4fr) minmax(120px, 0.7fr) auto;
  align-items: center;
  gap: 12px;
  padding: 7px 12px;
  border: 0;
  color: #443052;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.mainnet-market-item-select:focus-visible {
  outline: 3px solid rgba(142, 91, 208, 0.24);
  outline-offset: -3px;
}

.mainnet-market-item-select:disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.mainnet-market-item-select .astra-pack-cover {
  width: 34px;
  min-width: 34px;
}

.mainnet-market-item-select > span {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.mainnet-market-item-select small {
  color: #94859e;
  font-size: 9px;
}

.mainnet-market-item-select strong {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mainnet-market-item-id strong {
  color: #7040a8;
}

.mainnet-market-buy-label {
  display: inline-flex !important;
  grid-auto-flow: column;
  align-items: center;
  justify-content: end;
  gap: 4px !important;
  color: #7040a8;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.mainnet-market-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 14px;
  color: #81748e;
  font-size: 12px;
}

.mainnet-invite-fields {
  display: grid;
  gap: 13px;
}

.mainnet-invite-fields > label {
  display: grid;
  gap: 7px;
  color: #756681;
  font-size: 11px;
  font-weight: 700;
}

.mainnet-linked-invite {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: -6px 0 0;
  color: #4f866b;
  font-size: 11px;
}

.mainnet-registration-dialog input[readonly] {
  color: #7040a8;
  background: rgba(241, 233, 250, 0.82);
}

.mainnet-market-showcase .glass-sphere {
  animation: mainnet-sphere-drift 7s ease-in-out infinite alternate;
}

.mainnet-market-showcase .sphere-medium {
  animation-delay: -2.5s;
  animation-duration: 8.5s;
}

.mainnet-market-showcase .sphere-small {
  animation-delay: -4s;
  animation-duration: 6.5s;
}

.mainnet-market-showcase .showcase-float-card {
  animation: mainnet-card-float 6s ease-in-out infinite;
}

@keyframes mainnet-sphere-drift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(0, -7px, 0); }
}

@keyframes mainnet-card-float {
  0%, 100% { transform: translateY(0) rotate(-6deg); }
  50% { transform: translateY(-5px) rotate(-5deg); }
}

@media (max-width: 760px) {
  .market-range-form {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
  }

  .market-range-form .market-price-search {
    width: 100%;
    max-width: none;
  }

  .market-range-form .button,
  .market-range-form .market-price-clear {
    grid-column: span 1;
  }

  .mainnet-market-item-select {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 9px;
    padding: 10px;
  }

  .mainnet-market-item-select > span:nth-of-type(1) { grid-column: 1; }
  .mainnet-market-item-select > span:nth-of-type(2) { grid-column: 2; text-align: right; }
  .mainnet-market-item-select > span:nth-of-type(3) { grid-column: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .mainnet-market-showcase .glass-sphere,
  .mainnet-market-showcase .showcase-float-card {
    animation: none;
  }

  .mainnet-market-item {
    transition: none;
  }
}

.admin-user-detail-actions {
  display: grid;
  gap: 10px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(112, 64, 168, 0.14);
}

.admin-role-icon.operations {
  color: #7650a2;
  background: #f1e8fb;
}

.mainnet-copy-button {
  width: fit-content;
  margin-top: 8px;
}

.mainnet-transaction-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0 0;
}

.mainnet-transaction-summary > div {
  min-width: 0;
  padding: 10px 12px;
  border-radius: 11px;
  background: rgba(246, 242, 251, 0.82);
}

.mainnet-transaction-summary dt {
  color: #81748e;
  font-size: 10px;
}

.mainnet-transaction-summary dd {
  margin: 4px 0 0;
  overflow-wrap: anywhere;
  color: #30223f;
  font-size: 12px;
  font-weight: 700;
}

.mainnet-command-reference {
  color: #81748e;
  font-size: 10px;
  line-height: 1.6;
}

.mainnet-command-reference code {
  overflow-wrap: anywhere;
  color: #7040a8;
}

.mainnet-closed-page {
  min-height: 100dvh;
  padding-top: clamp(28px, 6vw, 72px);
}

.mainnet-closed-card {
  width: min(1080px, 100%);
  margin: 0 auto;
  padding: clamp(22px, 4vw, 42px);
}

.mainnet-closed-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.mainnet-closed-header h1 {
  margin-top: 8px;
  color: #2e2440;
  font-size: clamp(25px, 4vw, 38px);
  letter-spacing: -0.035em;
}

.mainnet-closed-card > p {
  max-width: 78ch;
  margin-top: 16px;
  color: #786387;
  line-height: 1.85;
}

.mainnet-readonly-badge,
.mainnet-window-state {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  padding: 7px 11px;
  border: 1px solid rgba(116, 79, 155, 0.14);
  border-radius: 999px;
  color: #7040a8;
  background: rgba(239, 229, 252, 0.74);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.mainnet-status-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 26px 0 20px;
}

.mainnet-status-metrics .metric-card {
  display: grid;
  align-content: space-between;
  min-height: 98px;
  gap: 12px;
}

.mainnet-status-metrics .metric-card span {
  color: #81748e;
  font-size: 12px;
  font-weight: 600;
}

.mainnet-status-metrics .metric-card strong {
  overflow-wrap: anywhere;
  color: #30223f;
  font-size: 17px;
}

.mainnet-refresh-button {
  min-height: 40px;
}

.mainnet-readonly-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 20px;
}

.mainnet-readonly-panel {
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(116, 80, 157, 0.11);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.58);
}

.mainnet-readonly-panel .panel-heading {
  margin-bottom: 16px;
}

.mainnet-readonly-panel .panel-heading > svg {
  color: #9565ce;
}

.mainnet-summary-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.mainnet-summary-list > div {
  display: grid;
  gap: 4px;
  padding: 11px;
  border-radius: 10px;
  background: rgba(246, 242, 251, 0.82);
}

.mainnet-summary-list dt {
  color: #81748e;
  font-size: 11px;
}

.mainnet-summary-list dd {
  margin: 0;
  color: #30223f;
  font-size: 18px;
  font-weight: 700;
}

.mainnet-window-state {
  border-color: rgba(73, 150, 113, 0.18);
  color: #347a5a;
  background: rgba(230, 247, 237, 0.8);
}

.mainnet-window-state:not(.is-open) {
  border-color: rgba(116, 79, 155, 0.14);
  color: #7040a8;
  background: rgba(239, 229, 252, 0.74);
}

.mainnet-readonly-note,
.mainnet-closed-reason {
  margin-top: 14px;
  color: #81748e;
  font-size: 12px;
  line-height: 1.7;
}

.mainnet-address-list {
  margin-top: 18px;
}

.mainnet-address-list dd a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #7040a8;
}

.mainnet-address-list dd a:hover {
  text-decoration: underline;
}

.mainnet-section-nav {
  display: flex;
  gap: 8px;
  margin: 22px 0 26px;
  padding: 6px;
  overflow-x: auto;
  border: 1px solid rgba(116, 80, 157, 0.12);
  border-radius: 14px;
  background: rgba(246, 242, 251, 0.8);
}
.mainnet-section-nav button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  color: #756681;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}
.mainnet-section-nav button.active {
  color: #fff;
  background: #7040a8;
  box-shadow: 0 5px 14px rgba(112, 64, 168, 0.2);
}
.mainnet-business-section { margin-top: 22px; }
.mainnet-business-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.mainnet-business-heading h2 { margin: 7px 0 0; color: #30223f; font-size: clamp(22px, 3vw, 30px); }
.mainnet-business-heading p { max-width: 72ch; margin: 9px 0 0; color: #81748e; line-height: 1.7; }
.mainnet-business-heading > svg { flex: 0 0 auto; color: #9565ce; }
.mainnet-business-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.mainnet-market-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 16px 0; }
.mainnet-round-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.mainnet-round-card { display: grid; gap: 6px; padding: 14px; border-radius: 12px; background: rgba(246, 242, 251, 0.82); color: #756681; font-size: 12px; }
.mainnet-round-card strong { color: #30223f; font-size: 16px; }
.mainnet-round-card b { color: #7040a8; font-size: 13px; }
.mainnet-round-card .button { margin-top: 5px; width: 100%; }
.mainnet-data-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.mainnet-data-table th, .mainnet-data-table td { padding: 10px 9px; border-bottom: 1px solid rgba(116, 80, 157, 0.1); text-align: left; white-space: nowrap; }
.mainnet-data-table th { color: #81748e; font-size: 11px; font-weight: 700; }
.mainnet-data-table td { color: #493a5a; }
.mainnet-data-table .button { min-height: 30px; padding: 0 8px; font-size: 11px; }
.mainnet-empty-state { margin: 0; padding: 22px 8px; color: #81748e; font-size: 13px; text-align: center; }
.mainnet-action-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 14px 0; }
.mainnet-inline-note { display: inline-flex; align-items: center; gap: 6px; color: #81748e; font-size: 12px; }
.mainnet-login-hint, .mainnet-unavailable-panel { display: flex; align-items: center; gap: 13px; margin: 18px 0; padding: 18px; border: 1px dashed rgba(116, 80, 157, 0.25); border-radius: 14px; color: #7040a8; background: rgba(246, 242, 251, 0.65); }
.mainnet-login-hint p, .mainnet-unavailable-panel p { margin: 4px 0 0; color: #81748e; font-size: 12px; line-height: 1.6; }
.mainnet-unavailable-panel { display: block; text-align: center; }
.mainnet-unavailable-panel > svg { margin-bottom: 6px; }
.mainnet-unavailable-panel h2 { margin: 4px 0; color: #30223f; font-size: 20px; }
.mainnet-unavailable-panel .button { margin-top: 12px; }
.mainnet-profile-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0;
  padding: 14px;
  border: 1px solid rgba(116, 80, 157, 0.12);
  border-radius: 14px;
  background: rgba(246, 242, 251, 0.72);
}
.mainnet-profile-summary > div { display: grid; gap: 5px; min-width: 0; }
.mainnet-profile-summary span { color: #81748e; font-size: 11px; }
.mainnet-profile-summary strong { overflow: hidden; color: #30223f; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.mainnet-team-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 16px 0; }
.mainnet-team-metrics .metric-card { min-height: 108px; }
.mainnet-team-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 14px; color: #81748e; font-size: 12px; }
.mainnet-team-pagination .button { min-height: 34px; padding: 0 12px; }
.mainnet-registration-dialog form { display: grid; gap: 16px; margin-top: 20px; }
.mainnet-registration-dialog .financial-action-buttons { justify-content: flex-end; margin-top: 4px; }
.mainnet-registration-dialog .financial-action-buttons .button { min-width: 136px; }

@media (max-width: 720px) {
  .mainnet-session-panel {
    align-items: stretch;
    flex-direction: column;
  }

  .mainnet-session-panel .inline-actions,
  .mainnet-session-panel .button {
    width: 100%;
  }

  .mainnet-transaction-summary {
    grid-template-columns: 1fr;
  }

  .mainnet-closed-header {
    flex-direction: column;
  }

  .mainnet-status-metrics,
  .mainnet-readonly-grid {
    grid-template-columns: 1fr;
  }

  .mainnet-summary-list {
    grid-template-columns: 1fr 1fr;
  }

  .mainnet-business-grid, .mainnet-market-metrics, .mainnet-profile-summary, .mainnet-team-metrics { grid-template-columns: 1fr; }
  .mainnet-asset-metrics { grid-template-columns: 1fr; }
  .mainnet-round-grid { grid-template-columns: 1fr; }
  .mainnet-business-heading { flex-direction: column; }
}
.admin-user-table th:nth-child(2) {
  width: 19%;
}
.admin-user-table th:nth-child(3) {
  width: 19%;
}
.admin-user-table th:nth-child(4) {
  width: 10%;
}
.admin-user-table th:nth-child(5) {
  width: 16%;
}
.admin-user-table th:nth-child(6) {
  width: 10%;
}
.admin-user-table th:nth-child(7) {
  width: 11%;
}

.admin-user-table th,
.admin-user-table td {
  white-space: nowrap;
  vertical-align: middle;
}

.admin-user-table td:nth-child(1),
.admin-user-table td:nth-child(2),
.admin-user-table td:nth-child(3) {
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-user-table td:nth-child(4),
.admin-user-table td:nth-child(5),
.admin-user-table td:nth-child(6),
.admin-user-table td:nth-child(7) {
  text-align: center;
}

.admin-role-icon,
.admin-icon-button {
  width: 36px;
  height: 36px;
}

.mainnet-admin-user-table {
  width: 100%;
  min-width: 560px;
  table-layout: fixed;
}

.mainnet-admin-user-table th:nth-child(1) { width: 18%; }
.mainnet-admin-user-table th:nth-child(2) { width: 17%; }
.mainnet-admin-user-table th:nth-child(3) { width: 9%; }
.mainnet-admin-user-table th:nth-child(4) { width: 20%; }
.mainnet-admin-user-table th:nth-child(5) { width: 11%; }
.mainnet-admin-user-table th:nth-child(6) { width: 13%; }
.mainnet-admin-user-table th:nth-child(7) { width: 12%; }

.mainnet-admin-user-table .admin-role-icon {
  display: inline-grid;
  place-items: center;
  color: #72518e;
  border: 1px solid rgba(116, 80, 157, 0.14);
  border-radius: 9px;
  background: #f7f2fb;
}

.mainnet-admin-user-table .admin-role-icon.governance { color: #7647a1; }
.mainnet-admin-user-table .admin-role-icon.custody { color: #346c80; }
.mainnet-admin-user-table .admin-role-icon.user { color: #766b81; }

.mainnet-admin-user-table .admin-icon-button {
  position: relative;
  z-index: 1;
  display: inline-grid;
  place-items: center;
}

/* Keep the header usable with long wallet names and narrow WebViews. */
.topbar,
.topbar-actions,
.breadcrumb {
  min-width: 0;
}

.topbar-actions {
  flex-shrink: 0;
}

.wallet-account-button span,
.wallet-chain-button span,
.breadcrumb strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wallet-account-button span {
  max-width: clamp(74px, 19vw, 150px);
}

.wallet-chain-button span {
  max-width: clamp(60px, 16vw, 118px);
}

/* Team trees can contain long addresses; wrapping is preferable to pushing
 * the dialog outside a phone viewport. */
.team-tree-dialog,
.team-tree-dialog * {
  min-width: 0;
}

.team-tree-dialog code,
.team-tree-dialog .team-node,
.team-tree-dialog .team-node * {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.admin-section-stack {
  display: grid;
  gap: 16px;
}

.admin-work-queue > summary {
  cursor: pointer;
  list-style: none;
}

.admin-work-queue > summary::-webkit-details-marker {
  display: none;
}

.notice {
  min-width: 0;
}

.notice .button,
.notice button {
  flex: 0 0 auto;
}

@keyframes ui-overlay-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes ui-dialog-in {
  from {
    opacity: 0;
    transform: translate(-50%, calc(-50% + 10px)) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@media (max-width: 640px) {
  .dialog-overlay {
    background: rgba(35, 23, 50, 0.38) !important;
  }

  .notice {
    flex-wrap: wrap;
  }

  .notice > .button,
  .notice > button {
    margin-left: auto;
  }

  .dialog-content,
  .dialog-content.invite-gate {
    width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px - env(safe-area-inset-top));
    padding: 24px 20px calc(20px + env(safe-area-inset-bottom));
    border-radius: 22px;
  }

  /* Prevent iOS/WebView from zooming focused form controls. */
  input,
  select,
  textarea {
    font-size: 16px;
  }

  .dialog-content.team-tree-dialog,
  .dialog-content.admin-asset-dialog {
    width: calc(100vw - 20px);
  }

  .dialog-title {
    font-size: 20px;
    line-height: 1.4;
  }

  .dialog-description {
    margin-bottom: 18px;
  }

  .dialog-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .dialog-actions .button {
    min-height: 46px;
  }

  .date-range-popover {
    width: min(360px, calc(100vw - 24px));
    padding: 12px;
  }

  .date-range-popover .rdp-root {
    --rdp-day-height: 32px;
    --rdp-day-width: 32px;
  }

  .admin-table-wrap {
    margin-inline: -4px;
    padding-inline: 4px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .admin-user-table {
    min-width: 760px;
  }

  .date-range-trigger {
    width: 100%;
  }

  .topbar-actions {
    gap: 6px;
  }

  .wallet-chain-button span {
    display: none;
  }

  .wallet-account-button {
    max-width: min(48vw, 190px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .dialog-overlay,
  .dialog-content {
    animation: none;
  }
}

/* Chain 56 operations use the same card and button primitives as the user
 * workspace, while keeping irreversible wallet stages visually explicit. */
.mainnet-admin-panel {
  padding-top: 8px;
  border-top: 1px solid rgba(116, 80, 157, 0.12);
}

.mainnet-admin-identity {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(116, 80, 157, 0.12);
  border-radius: 12px;
  color: #756681;
  background: rgba(246, 242, 251, 0.72);
  font-size: 12px;
}

.mainnet-admin-identity .button { margin-left: auto; }
.mainnet-admin-identity .is-ready { color: #347a5a; }
.mainnet-admin-identity .is-warning { color: #a05d22; }
.mainnet-admin-grid { align-items: stretch; }
.mainnet-admin-grid > section { height: 100%; }

.mainnet-admin-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px;
  margin-top: 16px;
}

.mainnet-admin-form-grid.one-column { grid-template-columns: 1fr; }
.mainnet-admin-form-grid label { display: grid; gap: 7px; min-width: 0; color: #756681; font-size: 12px; font-weight: 600; }
.mainnet-admin-form-grid .admin-checkbox-field,
.admin-user-detail-actions .admin-checkbox-field { display: flex; align-items: center; gap: 9px; min-height: 42px; padding: 9px 11px; border: 1px solid rgba(116, 79, 155, 0.14); border-radius: 10px; background: rgba(255, 255, 255, 0.65); }
.mainnet-admin-form-grid .admin-checkbox-field input,
.admin-user-detail-actions .admin-checkbox-field input { width: 17px; height: 17px; margin: 0; accent-color: #7040a8; }
.admin-withdrawal-restrictions { margin-top: 14px; }
.mainnet-admin-form-grid input {
  min-width: 0;
  min-height: 42px;
  padding: 9px 11px;
  border: 1px solid rgba(116, 79, 155, 0.17);
  border-radius: 10px;
  color: #30223f;
  background: rgba(255, 255, 255, 0.88);
}

.mainnet-admin-section { margin-top: 14px; }
.mainnet-admin-table { min-width: 780px; }
.mainnet-admin-table td:last-child { width: 1%; }
.mainnet-admin-table td:last-child .button { width: 100%; }

.mainnet-admin-status {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  color: #7040a8;
  background: rgba(239, 229, 252, 0.8);
  font-size: 10px;
  font-weight: 700;
}

.mainnet-admin-status.status-approved,
.mainnet-admin-status.status-routed { color: #8a5c14; background: #fff3d9; }
.mainnet-admin-status.status-settled,
.mainnet-admin-status.status-completed { color: #347a5a; background: #e6f7ed; }
.mainnet-admin-status.status-retry_pending { color: #9a3f3f; background: #fce8e8; }

.mainnet-admin-stage { color: #7040a8; background: rgba(239, 229, 252, 0.74); }
.mainnet-admin-success { color: #347a5a; background: rgba(230, 247, 237, 0.82); }
.mainnet-admin-risk { align-items: flex-start; margin-top: 12px; color: #8a5c14; background: #fff8e9; }
.mainnet-admin-risk span { line-height: 1.65; }

.mainnet-operation-gates {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.mainnet-operation-gates span {
  display: inline-flex;
  gap: 5px;
  padding: 6px 9px;
  border: 1px solid rgba(160, 93, 34, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.55);
  font-size: 11px;
}

.mainnet-package-history-grid { margin-top: 16px; }

.mainnet-account-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-height: 38px;
  margin: -8px 0 8px;
  color: #81748e;
  font-size: 12px;
}

.mainnet-asset-history { display: grid; gap: 12px; padding-top: 14px; }
.mainnet-asset-history h3 { margin: 8px 0 0; color: #4c4057; font-size: 13px; }
.agi-kline-panel { margin-top: 14px; }
.agi-kline-chart { width: 100%; min-height: 260px; }

.mainnet-admin-access-notice { align-items: flex-start; }
.mainnet-admin-access-notice p { margin: 4px 0 0; line-height: 1.6; }

.mainnet-admin-capability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.mainnet-admin-capability-grid article {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(116, 80, 157, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.65);
}

.mainnet-admin-capability-grid article > svg { color: #8e5bd0; }
.mainnet-admin-capability-grid article strong { color: #30223f; }
.mainnet-admin-capability-grid article p { margin: 0; color: #81748e; font-size: 12px; line-height: 1.65; }
.mainnet-admin-capability-grid article span { width: fit-content; padding: 4px 8px; border-radius: 999px; color: #7040a8; background: rgba(239, 229, 252, 0.8); font-size: 10px; font-weight: 700; }

.mainnet-admin-data-dashboard {
  margin: 24px 0 20px;
  padding: clamp(16px, 2.5vw, 24px);
  border: 1px solid rgba(116, 80, 157, 0.13);
  border-radius: 18px;
  background: rgba(249, 247, 252, 0.72);
}

.mainnet-admin-data-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  padding: 5px;
  overflow-x: auto;
  border: 1px solid rgba(116, 80, 157, 0.1);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.65);
  scrollbar-width: thin;
}

.mainnet-admin-data-tabs button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 12px;
  border: 0;
  border-radius: 9px;
  color: #756681;
  background: transparent;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}

.mainnet-admin-data-tabs button.active { color: #fff; background: #7040a8; box-shadow: 0 5px 14px rgba(112, 64, 168, 0.2); }
.mainnet-admin-data-stack { display: grid; gap: 14px; }
.mainnet-admin-data-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mainnet-admin-data-metrics .metric-card { min-height: 100px; }
.mainnet-admin-data-section { min-width: 0; }
.mainnet-admin-data-table-wrap { max-height: 430px; overflow: auto; }
.mainnet-admin-data-table { min-width: 720px; }
.mainnet-admin-data-table td { max-width: 280px; overflow: hidden; text-overflow: ellipsis; }

.mainnet-admin-records { margin: 16px 0 20px; }
.mainnet-admin-record-filters {
  display: grid;
  grid-template-columns: minmax(160px, 0.8fr) minmax(140px, 0.6fr) minmax(210px, 1.2fr) auto auto;
  align-items: end;
  gap: 10px;
  margin: 14px 0;
}
.mainnet-admin-record-filters label { display: grid; gap: 6px; min-width: 0; color: #756681; font-size: 11px; font-weight: 700; }
.mainnet-admin-record-filters input,
.mainnet-admin-record-filters select { width: 100%; min-width: 0; min-height: 40px; padding: 8px 10px; border: 1px solid rgba(116, 79, 155, 0.17); border-radius: 10px; color: #30223f; background: rgba(255, 255, 255, 0.9); }
.mainnet-admin-record-search > div { display: flex; align-items: center; gap: 7px; min-width: 0; padding-left: 10px; border: 1px solid rgba(116, 79, 155, 0.17); border-radius: 10px; background: rgba(255, 255, 255, 0.9); }
.mainnet-admin-record-search > div input { padding-left: 0; border: 0; background: transparent; }
.mainnet-admin-record-table-wrap { max-height: 520px; overflow: auto; }
.mainnet-admin-record-table { min-width: 900px; }
.mainnet-admin-record-table td { max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.mainnet-admin-record-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; color: #81748e; font-size: 12px; }

@media (max-width: 720px) {
  .mainnet-split-child {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mainnet-split-child > div:first-child {
    grid-column: 1 / -1;
  }

  .mainnet-admin-identity .button { width: 100%; margin-left: 0; }
  .mainnet-admin-form-grid { grid-template-columns: 1fr; }
  .mainnet-admin-form-grid .button { width: 100%; }
  .mainnet-admin-capability-grid,
  .mainnet-admin-data-metrics { grid-template-columns: 1fr; }
  .mainnet-admin-data-dashboard { margin-inline: -4px; padding: 14px 10px; }
  .mainnet-admin-data-tabs { margin-inline: -2px; }
  .mainnet-operation-gates { display: grid; grid-template-columns: 1fr; }
  .mainnet-operation-gates span { border-radius: 10px; white-space: normal; }
  .mainnet-admin-record-filters { grid-template-columns: 1fr; }
  .mainnet-admin-record-filters .button { width: 100%; }
  .mainnet-admin-record-pagination { align-items: stretch; flex-direction: column; }
  .mainnet-admin-record-pagination .inline-actions,
  .mainnet-admin-record-pagination .button { width: 100%; }

  .admin-page-scope .admin-users-panel .admin-table-wrap:has(.mainnet-admin-user-table) {
    margin-inline: 0;
    padding-inline: 0;
    overflow: visible;
  }

  .admin-page-scope .mainnet-admin-user-table,
  .admin-page-scope .mainnet-admin-user-table tbody {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .admin-page-scope .mainnet-admin-user-table thead {
    display: none;
  }

  .admin-page-scope .mainnet-admin-user-table tbody {
    display: grid;
    gap: 10px;
  }

  .admin-page-scope .mainnet-admin-user-table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px 38px;
    grid-template-areas:
      "username role detail"
      "referrer packages level"
      "registered registered registered";
    gap: 10px 8px;
    width: 100%;
    padding: 12px;
    border: 1px solid rgba(116, 80, 157, 0.12);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.76);
  }

  .admin-page-scope .mainnet-admin-user-table tbody td,
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(2),
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(5) {
    display: grid;
    min-width: 0;
    width: auto;
    height: auto;
    padding: 0;
    overflow: hidden;
    border: 0;
    text-align: left;
    white-space: nowrap;
  }

  .admin-page-scope .mainnet-admin-user-table tbody td::before {
    display: block;
    margin-bottom: 3px;
    color: #93869d;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    content: attr(data-label);
  }

  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(1) { grid-area: username; }
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(2) { grid-area: referrer; }
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(3) { grid-area: packages; }
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(4) { grid-area: registered; }
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(5) { grid-area: level; }
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(6) { grid-area: role; }
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(7) { grid-area: detail; }

  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(3),
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(4),
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(5),
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(6),
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(7) {
    justify-items: center;
    text-align: center;
  }

  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(6)::before,
  .admin-page-scope .mainnet-admin-user-table tbody td:nth-child(7)::before {
    display: none;
  }

  .admin-page-scope .mainnet-admin-user-table .admin-role-icon,
  .admin-page-scope .mainnet-admin-user-table .admin-icon-button {
    width: 38px;
    height: 38px;
    border-radius: 10px;
  }

  .admin-page-scope .mainnet-admin-user-table .admin-icon-button {
    flex: none;
    touch-action: manipulation;
  }
}
/*
 * ASTRA Starrail Network theme.
 *
 * This stylesheet is intentionally loaded after the legacy visual layers. It
 * changes shared tokens and presentation only; component structure, fields,
 * permissions and transaction actions remain owned by their feature modules.
 */

:root {
  color-scheme: dark;
  color: #edf0f5;
  background: #0b0e14;
  --ink: #edf0f5;
  --muted: #9ba2af;
  --purple: #a99ac5;
  --purple-deep: #8976ad;
  --purple-soft: rgba(169, 154, 197, 0.14);
  --glass: rgba(20, 24, 33, 0.94);
  --glass-strong: rgba(25, 30, 41, 0.98);
  --stroke: rgba(224, 228, 238, 0.11);
  --shadow-soft: 0 26px 70px rgba(0, 0, 0, 0.28);
  --shadow-card: 0 14px 40px rgba(0, 0, 0, 0.18);
  --star-bg: #0b0e14;
  --star-bg-raised: #11151d;
  --star-surface: #151a23;
  --star-surface-raised: #1a202b;
  --star-surface-soft: #202633;
  --star-platinum: #edf0f5;
  --star-platinum-soft: #c9ced8;
  --star-muted: #9ba2af;
  --star-faint: #747d8d;
  --star-lilac: #a99ac5;
  --star-lilac-strong: #c1afd9;
  --star-line: rgba(224, 228, 238, 0.11);
  --star-line-strong: rgba(185, 171, 211, 0.3);
  --star-success: #76b89f;
  --star-warning: #d3aa69;
  --star-danger: #d7838d;
  --star-info: #8ba8cd;
  --radius-control: 9px;
  --radius-card: 14px;
}

html {
  background: var(--star-bg);
}

body {
  color: var(--star-platinum);
  background:
    radial-gradient(circle at 82% -8%, rgba(137, 118, 173, 0.16), transparent 34rem),
    radial-gradient(circle at 8% 86%, rgba(96, 111, 142, 0.1), transparent 30rem),
    linear-gradient(145deg, #0b0e14 0%, #0e1118 48%, #090c11 100%);
  background-attachment: fixed;
}

::selection {
  color: #fff;
  background: rgba(169, 154, 197, 0.42);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline-color: rgba(193, 175, 217, 0.82);
}

/* Ambient network: thin orbital lines and a sparse node field. */
.ambient-layer {
  z-index: 0;
  opacity: 1;
}

.app-shell {
  position: relative;
  z-index: 1;
}

.ambient-orb {
  border: 1px solid rgba(183, 169, 208, 0.12);
  background: transparent;
  box-shadow: none;
  filter: none;
  opacity: 1;
}

.ambient-orb::before,
.ambient-orb::after {
  content: '';
  position: absolute;
  border-radius: 50%;
}

.ambient-orb::before {
  width: 7px;
  height: 7px;
  top: 18%;
  right: 12%;
  background: #b6a4d1;
  box-shadow: 0 0 0 5px rgba(182, 164, 209, 0.08);
}

.ambient-orb::after {
  inset: 14%;
  border: 1px solid rgba(128, 145, 175, 0.08);
}

.ambient-orb-one {
  width: 620px;
  height: 360px;
  top: -170px;
  right: -100px;
  transform: rotate(-18deg);
  animation: starrail-orbit-one 28s ease-in-out infinite alternate;
}

.ambient-orb-two {
  width: 460px;
  height: 260px;
  bottom: -110px;
  left: 11%;
  transform: rotate(16deg);
  animation: starrail-orbit-two 34s ease-in-out infinite alternate;
}

.ambient-grid {
  inset: 0;
  opacity: 0.52;
  background-image:
    radial-gradient(circle at 12% 17%, rgba(214, 219, 231, 0.55) 0 1px, transparent 1.5px),
    radial-gradient(circle at 72% 22%, rgba(178, 161, 207, 0.46) 0 1px, transparent 1.7px),
    radial-gradient(circle at 46% 68%, rgba(214, 219, 231, 0.32) 0 1px, transparent 1.5px),
    radial-gradient(circle at 88% 82%, rgba(137, 162, 196, 0.34) 0 1px, transparent 1.6px),
    linear-gradient(rgba(166, 176, 196, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(166, 176, 196, 0.025) 1px, transparent 1px);
  background-size: 380px 310px, 470px 390px, 430px 360px, 520px 430px, 72px 72px, 72px 72px;
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.64) 64%, transparent 100%);
  animation: starrail-field 36s linear infinite alternate;
}

@keyframes starrail-orbit-one {
  from { translate: 0 0; }
  to { translate: -18px 14px; }
}

@keyframes starrail-orbit-two {
  from { translate: 0 0; }
  to { translate: 16px -10px; }
}

@keyframes starrail-field {
  from { background-position: 0 0; }
  to { background-position: 20px 12px; }
}

/* Shell and global navigation. */
.app-shell {
  grid-template-columns: 204px minmax(0, 1fr);
  padding: 12px;
  gap: 12px;
}

.sidebar {
  border-color: var(--star-line);
  background: rgba(14, 18, 25, 0.97);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.3);
  backdrop-filter: none;
}

.brand-logo {
  filter: invert(1) hue-rotate(180deg) brightness(1.05) saturate(0.7);
}

.nav-caption,
.sidebar-foot,
.network-card small,
.breadcrumb,
.slash {
  color: var(--star-faint);
}

.nav-item {
  color: #9aa1ad;
}

.nav-item:hover {
  color: var(--star-platinum-soft);
  background: rgba(224, 228, 238, 0.055);
  transform: translateX(2px);
}

.nav-item.active {
  color: var(--star-platinum);
  background: linear-gradient(90deg, rgba(169, 154, 197, 0.16), rgba(169, 154, 197, 0.055));
  box-shadow: inset 0 0 0 1px rgba(193, 175, 217, 0.1);
}

.nav-item.active::before {
  background: linear-gradient(#ddd4e8, #8f7aae);
  box-shadow: 0 0 14px rgba(169, 154, 197, 0.34);
}

.network-card {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #121720;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.network-card > svg {
  color: #788295;
}

.status-dot {
  background: var(--star-lilac-strong);
  box-shadow: 0 0 0 4px rgba(169, 154, 197, 0.08);
  animation: starrail-status 3.8s ease-in-out infinite;
}

@keyframes starrail-status {
  0%, 100% { opacity: 0.72; box-shadow: 0 0 0 3px rgba(169, 154, 197, 0.06); }
  50% { opacity: 1; box-shadow: 0 0 0 6px rgba(169, 154, 197, 0.015); }
}

.topbar {
  border-color: var(--star-line);
  background: rgba(15, 19, 27, 0.97);
  box-shadow: 0 14px 42px rgba(0, 0, 0, 0.2);
  backdrop-filter: none;
}

.breadcrumb strong {
  color: var(--star-platinum-soft);
}

.demo-chip {
  border-color: var(--star-line);
  color: #b5a7cd;
  background: #171c26;
}

.page-shell {
  max-width: calc(var(--content-user) + 64px);
}

.admin-page-scope .page-shell,
.mainnet-admin-panel {
  max-width: var(--content-admin);
}

.page-heading {
  animation: starrail-enter 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.page-heading::before,
.eyebrow,
.muted-eyebrow,
.showcase-kicker,
.position-id {
  color: #a99ac5;
}

.page-heading h1,
.section-heading h2,
.panel-heading h2 {
  color: var(--star-platinum);
}

.page-heading p,
.text-muted,
.metric-note,
.form-hint,
.mainnet-readonly-note,
.mainnet-closed-reason,
.section-note,
.subtle-label,
.muted,
.muted-text {
  color: var(--star-muted);
}

@keyframes starrail-enter {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Shared controls. */
.button {
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.button-primary {
  color: #11141b;
  background: linear-gradient(135deg, #d6cfdf, #a99ac5);
  box-shadow: 0 9px 24px rgba(103, 84, 138, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

.button-primary:hover:not(:disabled) {
  color: #090b10;
  background: linear-gradient(135deg, #e4dee9, #b6a5d0);
  transform: translateY(-1px);
}

.button-outline,
.button-icon,
.button-ghost {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #1a202a;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.button-outline:hover:not(:disabled),
.button-icon:hover:not(:disabled),
.button-ghost:hover:not(:disabled) {
  border-color: var(--star-line-strong);
  color: #fff;
  background: #222936;
}

input,
textarea,
select,
.search-field,
.market-price-search,
.team-tree-search,
.date-range-trigger,
.mainnet-admin-record-search > div,
.mainnet-receipt-recovery input {
  border-color: var(--star-line) !important;
  color: var(--star-platinum-soft) !important;
  background-color: #111720 !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.22);
}

input::placeholder,
textarea::placeholder {
  color: #717989;
}

select {
  background-image:
    linear-gradient(45deg, transparent 50%, #aa9cc2 50%),
    linear-gradient(135deg, #aa9cc2 50%, transparent 50%);
}

select:hover,
select:focus-visible,
input:hover,
textarea:hover {
  border-color: rgba(193, 175, 217, 0.34) !important;
  background-color: #151b25 !important;
}

select option {
  color: var(--star-platinum);
  background: #151a23;
}

/* Shared surfaces. No blanket blur: depth comes from tone and fine borders. */
.surface-panel,
.metric-card,
.position-card,
.empty-panel,
.chain-card,
.product-card,
.mainnet-readonly-panel,
.mainnet-readonly-panel.mainnet-admin-records,
.mainnet-admin-data-dashboard,
.premium-batch-card {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: rgba(21, 26, 35, 0.97);
  box-shadow: var(--shadow-card), inset 0 1px 0 rgba(255, 255, 255, 0.025);
  backdrop-filter: none;
}

.surface-panel,
.metric-card,
.position-card,
.product-card,
.chain-card,
.mainnet-market-item {
  transition: border-color 180ms ease, background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

@media (hover: hover) {
  .surface-panel:hover,
  .metric-card:hover,
  .position-card:hover,
  .product-card:hover,
  .chain-card:hover {
    border-color: rgba(193, 175, 217, 0.2);
  }
}

.metric-card::after {
  width: 132px;
  height: 132px;
  top: -88px;
  right: -58px;
  background: radial-gradient(circle, rgba(169, 154, 197, 0.17), transparent 68%);
}

.metric-top,
.position-details span,
.product-time,
.product-body > p,
.compact-history-header,
.compact-history-row time,
.history-row p,
.history-row time {
  color: var(--star-muted);
}

.metric-top svg,
.panel-heading h2 svg,
.mainnet-readonly-panel .panel-heading > svg {
  color: #b3a2cc;
}

.metric-value,
.position-main h3,
.product-body h3,
.compact-history-row strong,
.ledger-summary strong,
.claim-amount {
  color: var(--star-platinum);
}

.metric-icon,
.purple,
.blue,
.green,
.position-icon,
.empty-icon {
  color: #c1afd9;
  background: rgba(169, 154, 197, 0.12);
}

.badge-purple,
.badge-blue,
.status-ready,
.status-listed,
.mainnet-readonly-badge {
  border-color: rgba(193, 175, 217, 0.16);
  color: #c1b3d6;
  background: rgba(169, 154, 197, 0.12);
}

.status-holding,
.testnet-banner {
  color: #a9bfd8;
  background: rgba(108, 139, 176, 0.13);
}

.status-cooling {
  color: #ddbd82;
  background: rgba(199, 154, 82, 0.13);
}

.status-sold,
.status-redeemed {
  color: #8fc9b1;
  background: rgba(87, 157, 128, 0.13);
}

.status-failed {
  color: #df929a;
  background: rgba(194, 91, 103, 0.13);
}

.notice {
  backdrop-filter: none;
}

.notice-info,
.demo-banner {
  border-color: rgba(169, 154, 197, 0.15);
  color: #c1b4d5;
  background: rgba(169, 154, 197, 0.095);
}

.notice-success {
  border-color: rgba(118, 184, 159, 0.18);
  color: #8ccab2;
  background: rgba(73, 139, 113, 0.12);
}

.notice-warning,
.mainnet-admin-risk {
  border-color: rgba(211, 170, 105, 0.2);
  color: #dfbd84;
  background: rgba(165, 115, 51, 0.12);
}

.notice-error,
.error-banner {
  border-color: rgba(215, 131, 141, 0.2);
  color: #e39aa2;
  background: rgba(159, 63, 75, 0.13);
}

/* Market and package presentation. */
.market-showcase,
.hero-panel {
  border-color: rgba(224, 228, 238, 0.12);
  background:
    radial-gradient(circle at 78% 16%, rgba(183, 166, 211, 0.12), transparent 23%),
    linear-gradient(135deg, #171c26, #10151d 58%, #181724);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.market-showcase::before {
  opacity: 0.52;
  background-image:
    radial-gradient(circle, rgba(219, 224, 235, 0.52) 0 1px, transparent 1.4px),
    linear-gradient(112deg, transparent 47.8%, rgba(169, 154, 197, 0.1) 48%, transparent 48.3%);
  background-size: 44px 44px, 100% 100%;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.4), #000 78%);
}

.market-showcase h2,
.hero-copy h1 {
  color: var(--star-platinum);
}

.market-showcase h2 span,
.hero-copy h1 > span {
  color: #c0afd7;
}

.market-showcase-copy > p,
.hero-copy p,
.hero-caption {
  color: #a2a8b3;
}

.showcase-stats > div {
  border-color: var(--star-line);
  background: rgba(16, 20, 28, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
  backdrop-filter: none;
}

.showcase-stats small,
.showcase-stats em {
  color: #8992a2;
}

.showcase-stats strong {
  color: var(--star-platinum);
}

.market-showcase-art::before,
.market-showcase-art::after {
  content: '';
  position: absolute;
  border: 1px solid rgba(193, 175, 217, 0.16);
  border-radius: 50%;
  pointer-events: none;
}

.market-showcase-art::before {
  width: 280px;
  height: 148px;
  top: 68px;
  right: 24px;
  transform: rotate(-26deg);
}

.market-showcase-art::after {
  width: 242px;
  height: 122px;
  top: 80px;
  right: 43px;
  border-style: dashed;
  border-color: rgba(136, 158, 193, 0.12);
  transform: rotate(24deg);
}

.glass-sphere {
  border-color: rgba(237, 240, 245, 0.62);
  background: radial-gradient(circle at 28% 22%, #fff 0 3%, #d8d3e2 7%, #9c8bb8 34%, #423a55 69%, #1d2230 100%);
  box-shadow: inset -10px -12px 24px rgba(3, 5, 8, 0.38), inset 8px 7px 17px rgba(255, 255, 255, 0.24), 0 22px 48px rgba(0, 0, 0, 0.34);
  backdrop-filter: none;
}

.mainnet-market-showcase .glass-sphere {
  animation: starrail-node-drift 12s ease-in-out infinite alternate;
}

@keyframes starrail-node-drift {
  from { translate: 0 0; }
  to { translate: 0 -5px; }
}

.showcase-float-card {
  border-color: rgba(224, 228, 238, 0.14);
  color: var(--star-platinum);
  background: linear-gradient(145deg, rgba(35, 41, 54, 0.97), rgba(20, 24, 33, 0.97));
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.055);
  backdrop-filter: none;
}

.showcase-float-card span,
.showcase-float-card svg,
.mainnet-market-item-id strong,
.mainnet-market-buy-label {
  color: #baa8d2;
}

.showcase-float-card strong {
  color: var(--star-platinum);
}

.orbit {
  border-color: rgba(193, 175, 217, 0.18);
}

.crystal-layer {
  border-color: rgba(230, 233, 241, 0.16);
  box-shadow: 15px 18px 28px rgba(0, 0, 0, 0.2);
}

.layer-back { background: linear-gradient(150deg, rgba(103, 116, 143, 0.62), rgba(51, 56, 70, 0.72)); }
.layer-middle { background: linear-gradient(150deg, rgba(155, 138, 184, 0.84), rgba(70, 60, 91, 0.88)); }
.layer-front { background: linear-gradient(135deg, rgba(222, 216, 232, 0.82), rgba(121, 103, 153, 0.72)); }

.market-zone,
.auto-buy-panel {
  background: linear-gradient(145deg, rgba(23, 28, 38, 0.98), rgba(17, 21, 29, 0.98));
}

.market-zone-purchase {
  border-color: var(--star-line);
  background: #1b212c;
}

.market-price-chip {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #111720;
}

.market-price-chip small,
.market-price-more,
.market-selected-price span,
.market-selected-price small,
.market-quantity-control,
.market-zone-total,
.market-zone-total span {
  color: var(--star-muted);
}

.market-price-chip.active {
  border-color: rgba(193, 175, 217, 0.32);
  color: var(--star-platinum);
  background: rgba(137, 112, 177, 0.74);
}

.market-price-chip.active small {
  color: #e0d8e8;
}

.price-chip {
  border-color: var(--star-line);
  color: var(--star-muted);
  background: #111720;
}

.price-chip.active {
  border-color: rgba(193, 175, 217, 0.28);
  color: var(--star-platinum);
  background: rgba(169, 154, 197, 0.16);
}

.market-quantity-stepper {
  border-color: var(--star-line);
  background: #111720;
}

.market-quantity-stepper button {
  color: #c1afd9;
}

.market-quantity-stepper button:hover:not(:disabled) {
  background: rgba(169, 154, 197, 0.12);
}

.market-quantity-stepper button:disabled {
  color: #5d6573;
}

.market-quantity-stepper strong,
.market-selected-price strong,
.market-zone-total strong {
  color: var(--star-platinum);
}

.market-zone-tabs,
.admin-tabs,
.mainnet-section-nav,
.mainnet-admin-data-tabs {
  border-color: var(--star-line);
  background: #111720;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
  backdrop-filter: none;
}

.market-zone-tabs button,
.admin-tab,
.mainnet-section-nav button,
.mainnet-admin-data-tabs button,
.tab-trigger,
.filter-pill,
.price-filter-button,
.admin-subtabs button {
  color: var(--star-muted);
  background: transparent;
}

.market-zone-tabs button.active,
.admin-tab.active,
.mainnet-section-nav button.active,
.mainnet-admin-data-tabs button.active,
.tab-trigger[data-state='active'],
.filter-pill.active,
.price-filter-button.active,
.admin-subtabs button.active {
  border-color: rgba(193, 175, 217, 0.18);
  color: var(--star-platinum);
  background: rgba(169, 154, 197, 0.16);
  box-shadow: inset 0 0 0 1px rgba(193, 175, 217, 0.08);
}

.market-zone-heading h2,
.product-bottom strong,
.mainnet-market-item-select strong {
  color: var(--star-platinum);
}

.market-zone-heading p,
.market-price-search-hint,
.market-price-clear,
.mainnet-market-item-select small {
  color: var(--star-muted);
}

.mainnet-market-item {
  border-color: var(--star-line);
  background: #151a23;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
}

.mainnet-market-item:hover {
  border-color: rgba(193, 175, 217, 0.28);
  background: #191f2a;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22);
}

.mainnet-market-item-select {
  color: var(--star-platinum-soft);
}

.product-art-1,
.product-art-2,
.product-art-3,
.product-art-4,
.product-art-5,
.product-art-6 {
  background: linear-gradient(135deg, #252b38, #171c26 62%, #2d2638);
}

.product-sculpture {
  filter: saturate(0.55) brightness(0.9);
}

.product-bottom,
.position-actions,
.compact-history-row,
.history-row {
  border-color: var(--star-line);
}

.empty-state {
  color: var(--star-muted);
}

.empty-state h2,
.empty-state h3 {
  color: #b9a9cf;
}

/* Asset, team and ledger modules. */
.release-donut {
  background: conic-gradient(#a99ac5 0 30%, #303746 30% 100%);
}

.release-donut > span {
  color: #c4b4d8;
  background: #151a23;
}

.legend-dot.purple { background: #a99ac5; }
.legend-dot.pale { background: #485061; }

.ledger-summary > div,
.mainnet-summary-list > div,
.mainnet-transaction-summary > div,
.financial-quote-grid > div,
.settlement-asset,
.settlement-flow,
.premium-pool-grid > div {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #111720;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.team-reference-table th,
.team-tree-line,
.team-direct-summary > strong {
  color: #b6a5ce;
}

.team-reference-table td,
.team-reference-table th {
  border-color: var(--star-line);
}

.team-direct-summary,
.team-tree-node,
.team-direct-chip {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #111720;
}

.team-tree-toggle {
  color: #c0afd7;
  background: rgba(169, 154, 197, 0.13);
}

.team-tree-summary span,
.team-tree-node small,
.team-direct-chip small {
  color: var(--star-muted);
}

.copy-field input {
  color: var(--star-platinum-soft);
  background: #111720;
}

/* Dense data and administration. */
.admin-table,
.mainnet-data-table,
.team-reference-table {
  color: var(--star-platinum-soft);
}

.admin-table th,
.mainnet-data-table th {
  color: #8992a2;
}

.admin-table td,
.mainnet-data-table td {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: rgba(19, 24, 33, 0.96);
}

.admin-table td:first-child {
  border-left-color: var(--star-line);
}

.admin-table td:last-child {
  border-right-color: var(--star-line);
}

.admin-user-table code,
.mainnet-data-table code,
.mainnet-command-reference code,
.team-tree-node code {
  color: #b8a7cf;
}

.admin-icon-button,
.admin-role-icon,
.mainnet-copy-button {
  border-color: var(--star-line);
  color: #b9a8d1;
  background: #202633;
}

.admin-icon-button:hover,
.admin-icon-button:focus-visible {
  color: #11141b;
  background: #c5b8d6;
}

.mainnet-admin-panel {
  border-top-color: var(--star-line);
}

.mainnet-admin-identity,
.mainnet-admin-capability-grid article,
.mainnet-admin-form-grid .admin-checkbox-field,
.admin-user-detail-actions .admin-checkbox-field {
  border-color: var(--star-line);
  color: var(--star-muted);
  background: #151a23;
}

.mainnet-admin-capability-grid article strong,
.mainnet-asset-history h3 {
  color: var(--star-platinum);
}

.mainnet-admin-capability-grid article p,
.mainnet-account-toolbar {
  color: var(--star-muted);
}

.mainnet-admin-status {
  color: #c0afd7;
  background: rgba(169, 154, 197, 0.13);
}

.mainnet-admin-status.status-approved,
.mainnet-admin-status.status-routed {
  color: #dfbd84;
  background: rgba(165, 115, 51, 0.14);
}

.mainnet-admin-status.status-settled,
.mainnet-admin-status.status-completed,
.mainnet-admin-identity .is-ready,
.mainnet-window-state {
  color: #8ccab2;
  background: rgba(73, 139, 113, 0.13);
}

.mainnet-admin-status.status-retry_pending,
.mainnet-admin-identity .is-warning {
  color: #e39aa2;
  background: rgba(159, 63, 75, 0.13);
}

.mainnet-operation-gates span {
  border-color: rgba(211, 170, 105, 0.18);
  background: rgba(211, 170, 105, 0.08);
}

.mainnet-login-hint,
.mainnet-unavailable-panel {
  border-color: rgba(193, 175, 217, 0.2);
  color: #c0afd7;
  background: rgba(169, 154, 197, 0.08);
}

.mainnet-login-hint p,
.mainnet-unavailable-panel p,
.mainnet-summary-list dt,
.mainnet-transaction-summary dt {
  color: var(--star-muted);
}

.mainnet-summary-list dd,
.mainnet-transaction-summary dd,
.mainnet-status-metrics .metric-card strong {
  color: var(--star-platinum);
}

.date-range-popover {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #171c26;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
}

.rdp-root {
  --rdp-accent-color: #b4a2cc;
  --rdp-accent-background-color: rgba(169, 154, 197, 0.16);
}

/* Dialogs and transactional overlays. */
.dialog-overlay {
  background: rgba(4, 6, 10, 0.72) !important;
  backdrop-filter: blur(9px);
}

.dialog-content,
.dialog-content.invite-gate {
  border-color: rgba(224, 228, 238, 0.14);
  color: var(--star-platinum-soft);
  background: #171c26;
  box-shadow: 0 36px 110px rgba(0, 0, 0, 0.56), inset 0 1px 0 rgba(255, 255, 255, 0.045);
  backdrop-filter: none;
}

.dialog-title {
  color: var(--star-platinum);
}

.dialog-description,
.mainnet-command-reference {
  color: var(--star-muted);
}

.dialog-close {
  border-color: var(--star-line);
  color: #b9a7d0;
  background: #202633;
}

.dialog-close:hover,
.dialog-close:focus-visible {
  color: #11141b;
  background: #c8bdd8;
}

.invite-gate-field,
.form-label {
  color: var(--star-platinum-soft);
}

/* Footer and minor chrome. */
.page-footer {
  border-color: var(--star-line);
  color: #747d8d;
}

.price-ticker,
.mainnet-announcement-ticker {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #111720;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
  backdrop-filter: none;
}

.price-ticker-label,
.mainnet-announcement-label {
  color: #151922;
  background: linear-gradient(135deg, #d4cddd, #a99ac5);
}

.price-ticker-item b { color: #c0afd7; }
.price-ticker-item small { color: var(--star-muted); }
.mainnet-announcement-moving-title { color: #f4effa; }

/* Responsive starrail treatment. Existing feature media queries continue to
   own content reflow; this layer only adjusts the shared shell and density. */
@media (max-width: 720px) {
  .ambient-orb-one {
    width: 430px;
    height: 250px;
    top: -110px;
    right: -210px;
  }

  .ambient-orb-two {
    width: 330px;
    height: 190px;
    left: -130px;
    bottom: 10%;
  }

  .ambient-grid {
    opacity: 0.36;
    animation: none;
  }

  .topbar {
    position: sticky;
    border-color: var(--star-line);
    background: rgba(15, 19, 27, 0.98);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.3);
    backdrop-filter: none;
  }

  .mobile-nav {
    position: fixed;
    border-color: var(--star-line);
    background: rgba(15, 19, 27, 0.98);
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.44);
    backdrop-filter: none;
  }

  .mobile-nav button {
    color: #838b99;
  }

  .mobile-nav button.active {
    color: var(--star-platinum);
    background: rgba(169, 154, 197, 0.14);
  }

  .mobile-nav button.active::after {
    content: '';
    position: absolute;
    right: 24%;
    bottom: 3px;
    left: 24%;
    height: 2px;
    border-radius: 99px;
    background: #b8a7cf;
  }

  .market-showcase-copy {
    padding: 26px 24px 20px;
  }

  .market-showcase-art {
    min-height: 170px;
  }

  .market-showcase-art::before {
    width: 240px;
    height: 120px;
    top: 30px;
    right: calc(50% - 120px);
  }

  .market-showcase-art::after {
    width: 210px;
    height: 104px;
    top: 42px;
    right: calc(50% - 105px);
  }

  .sphere-large { top: 8px; }
  .sphere-medium { top: 42px; }

  .mainnet-admin-data-dashboard {
    border-color: var(--star-line);
    background: #111720;
  }

  .admin-page-scope .mainnet-admin-user-table tbody tr {
    border-color: var(--star-line);
    background: #151a23;
  }
}

@media (max-width: 480px) {
  .page-heading h1 {
    font-size: 24px;
  }

  .market-showcase h2 {
    font-size: clamp(28px, 9vw, 36px);
  }

  .market-showcase-copy > p {
    line-height: 1.75;
  }

  .showcase-stats > div {
    padding: 10px 8px;
  }

  .surface-panel,
  .position-card {
    border-radius: 15px;
  }

  .metric-card {
    min-height: 112px;
    border-radius: 13px;
  }

  .dialog-content,
  .dialog-content.invite-gate {
    border-radius: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ambient-orb-one,
  .ambient-orb-two,
  .ambient-grid,
  .status-dot,
  .page-heading,
  .mainnet-market-showcase .glass-sphere,
  .mainnet-market-showcase .showcase-float-card {
    animation: none !important;
  }

  .button,
  .surface-panel,
  .metric-card,
  .position-card,
  .product-card,
  .chain-card,
  .mainnet-market-item,
  .nav-item {
    transition: none !important;
  }
}

/* --------------------------------------------------------------------------
 * 星轨网络正式布局
 *
 * 这一层不再只是换肤：它把主网页面的信息顺序、密度与组合方式对齐
 * 已确认的手机模板，同时让桌面端自然扩展。所有业务字段和按钮仍由原组件
 * 提供，本层只负责结构呈现。
 * -------------------------------------------------------------------------- */
.star-network-layout .page-shell {
  width: min(100%, 1240px);
  padding-inline: clamp(18px, 3vw, 42px);
}

@media (min-width: 721px) {
  .star-network-layout.app-shell {
    display: block;
    padding: 12px;
  }

  .star-network-layout .sidebar {
    position: sticky;
    z-index: 20;
    top: 12px;
    width: 100%;
    height: 60px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    padding: 7px 10px;
    border: 1px solid var(--star-line);
    border-radius: 14px;
  }

  .star-network-layout .brand {
    width: 116px;
    flex: 0 0 auto;
    padding: 0 8px;
  }

  .star-network-layout .brand-logo {
    width: 96px;
  }

  .star-network-layout .nav-caption,
  .star-network-layout .sidebar-foot {
    display: none;
  }

  .star-network-layout .navigation {
    display: flex;
    flex: 1 1 auto;
    flex-direction: row;
    gap: 4px;
  }

  .star-network-layout .nav-item {
    width: auto;
    min-width: 112px;
    justify-content: center;
    gap: 7px;
    padding: 10px 12px;
  }

  .star-network-layout .nav-item.active::before {
    width: 24px;
    height: 2px;
    inset: auto auto 3px 50%;
    transform: translateX(-50%);
  }

  .star-network-layout .sidebar-bottom {
    margin: 0 0 0 auto;
  }

  .star-network-layout .network-card {
    min-width: 174px;
    padding: 8px 10px;
  }

  .star-network-layout .network-card small {
    margin-top: 2px;
  }

  .star-network-layout .topbar {
    position: sticky;
    z-index: 18;
    top: 84px;
    height: 58px;
    margin-top: 8px;
    padding-inline: 18px;
  }
}

.star-network-brand {
  display: grid;
  gap: 3px;
  padding: 0;
  border: 0;
  color: inherit;
  text-align: left;
  background: transparent;
  cursor: pointer;
}

.star-network-brand small {
  color: var(--star-faint);
  font-size: 10px;
  letter-spacing: 0.12em;
}

.star-network-brand strong {
  color: var(--star-platinum);
  font-size: 17px;
  font-weight: 560;
  letter-spacing: 0.04em;
}

.star-template-page {
  display: grid;
  gap: 12px;
}

.star-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin: 2px 0 6px;
}

.star-page-heading::before {
  content: none;
}

.star-page-heading > div:first-child {
  min-width: 0;
}

.star-page-heading h1 {
  margin: 0;
  font-size: clamp(27px, 3vw, 38px);
  font-weight: 520;
  letter-spacing: -0.035em;
}

.star-page-heading p {
  margin: 7px 0 0;
}

.star-page-status {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border: 1px solid var(--star-line);
  border-radius: 999px;
  color: var(--star-muted);
  background: rgba(17, 23, 32, 0.72);
  font-size: 12px;
}

.star-page-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--star-lilac-strong);
  box-shadow: 0 0 12px rgba(193, 175, 217, 0.7);
}

.star-market-hero,
.star-balance-hero,
.star-packages-summary,
.star-team-overview {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(211, 204, 255, 0.14);
  border-radius: 16px;
  color: var(--star-platinum);
  background:
    radial-gradient(circle at 82% 10%, rgba(208, 199, 255, 0.16), transparent 28%),
    linear-gradient(135deg, rgba(28, 31, 45, 0.97), rgba(12, 15, 23, 0.98));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.star-market-hero,
.star-balance-hero {
  min-height: 154px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 26px;
}

.star-market-hero small,
.star-balance-hero small,
.star-packages-summary small {
  color: var(--star-muted);
  font-size: 12px;
}

.star-market-hero strong,
.star-balance-hero strong,
.star-packages-summary > div:first-child > strong {
  display: block;
  margin: 7px 0 4px;
  font-size: clamp(30px, 4vw, 46px);
  font-weight: 520;
  letter-spacing: -0.04em;
}

.star-market-hero strong em,
.star-balance-hero strong em,
.star-packages-summary strong em {
  color: var(--star-platinum-soft);
  font-size: 0.4em;
  font-style: normal;
  letter-spacing: 0;
}

.star-market-hero p,
.star-balance-hero p,
.star-packages-summary p {
  margin: 0;
  color: var(--star-muted);
  font-size: 13px;
}

.star-orbit-mark {
  position: relative;
  width: 210px;
  height: 104px;
  flex: 0 0 auto;
}

.star-orbit-mark i {
  position: absolute;
  border: 1px solid rgba(222, 216, 255, 0.2);
  border-radius: 50%;
}

.star-orbit-mark i:nth-child(1) {
  inset: 9px 2px 12px 7px;
  transform: rotate(-18deg);
  animation: star-template-orbit 20s linear infinite;
}

.star-orbit-mark i:nth-child(2) {
  width: 88px;
  height: 88px;
  top: 8px;
  right: 35px;
  border-color: rgba(139, 168, 205, 0.16);
  animation: star-template-orbit 26s linear infinite reverse;
}

.star-orbit-mark i:nth-child(3) {
  width: 8px;
  height: 8px;
  top: 25px;
  right: 61px;
  border: 0;
  background: #f3f0ff;
  box-shadow: 0 0 18px #c3b8ff;
  animation: star-template-node 4.8s ease-in-out infinite;
}

@keyframes star-template-orbit { to { transform: rotate(342deg); } }
@keyframes star-template-node { 50% { opacity: 0.45; transform: translateY(7px); } }

.star-market-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.star-market-metrics > div,
.star-packages-summary-facts > span,
.star-team-facts > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(239, 236, 255, 0.1);
  border-radius: 9px;
  background: rgba(19, 21, 31, 0.68);
}

.star-market-metrics span,
.star-packages-summary-facts span,
.star-team-facts span {
  display: block;
  color: var(--star-muted);
  font-size: 11px;
}

.star-market-metrics strong,
.star-packages-summary-facts strong,
.star-team-facts strong {
  display: block;
  margin-top: 5px;
  overflow-wrap: anywhere;
  color: var(--star-platinum);
  font-size: 15px;
  font-weight: 520;
}

.star-template-market .mainnet-account-toolbar {
  margin: 0;
}

.star-template-market .auto-buy-panel {
  padding: 14px 16px;
  border-radius: 10px;
  border-left: 2px solid rgba(197, 185, 255, 0.52);
}

.star-template-market .auto-buy-panel .panel-heading {
  margin-bottom: 6px;
}

.star-template-market .auto-buy-switch {
  border-color: var(--star-line);
  background: var(--star-surface-soft);
  color: var(--star-platinum-soft);
}

.star-template-market .auto-buy-switch-track {
  background: rgba(155, 162, 175, 0.22);
}

.star-template-market .auto-buy-switch-track i {
  background: var(--star-platinum);
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.34);
}

.star-template-market .auto-buy-switch[aria-checked='true'] {
  border-color: var(--star-line-strong);
  background: rgba(169, 154, 197, 0.14);
  color: var(--star-platinum);
}

.star-template-market .auto-buy-switch[aria-checked='true'] .auto-buy-switch-track {
  background: linear-gradient(135deg, var(--star-lilac-strong), var(--star-lilac));
}

.star-template-market .market-zone-tabs {
  width: fit-content;
  margin: 2px 0 0;
  padding: 4px;
  border-radius: 12px;
}

.star-template-market .market-zone-tabs button {
  min-width: 112px;
  padding: 9px 15px;
  border-radius: 9px;
}

.star-template-market .market-zone-tabs button.active {
  color: #171521;
  background: linear-gradient(135deg, #f4f3f8, #cfc7ee);
}

.star-template-market .mainnet-market-zone {
  padding: 16px;
  border-radius: 14px;
}

.star-template-market .market-zone-heading {
  display: flex;
  margin-bottom: 10px;
}

.star-template-market .market-zone-heading .position-id {
  display: none;
}

.star-template-market .market-zone-heading h2 {
  margin-bottom: 2px;
  font-size: 16px;
}

.star-template-market .market-zone-heading p {
  font-size: 11px;
}

.star-template-market .market-price-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 11px;
}

.star-template-market .market-price-search-hint {
  margin: 0;
  text-align: right;
}

.star-template-market .mainnet-market-item-list {
  max-width: none;
}

.star-template-market .mainnet-market-item {
  border-radius: 10px;
  border-left: 2px solid rgba(197, 185, 255, 0.52);
  box-shadow: none;
}

.star-template-market .mainnet-market-item-select {
  grid-template-columns: minmax(180px, 1.5fr) minmax(120px, 0.7fr) auto;
  min-height: 68px;
  padding: 9px 12px;
}

.star-template-market .mainnet-market-buy-label {
  min-width: 82px;
  justify-content: center;
  padding: 9px 11px;
  border-radius: 9px;
  color: #171521;
  background: linear-gradient(135deg, #f4f3f8, #cfc7ee);
}

.star-balance-hero {
  min-height: 142px;
}

.star-secondary-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.star-secondary-metrics .metric-card {
  min-height: 112px;
  padding: 14px;
  border-radius: 9px;
}

.star-secondary-metrics .metric-value {
  margin-top: 10px;
  font-size: clamp(22px, 2.6vw, 30px);
}

.star-asset-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.star-asset-actions > .surface-panel {
  min-width: 0;
  margin: 0;
  padding: 16px;
  border-radius: 12px;
}

.star-asset-actions .panel-heading {
  align-items: flex-start;
}

.star-asset-actions .inline-actions {
  margin-top: 12px;
}

.star-packages-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  align-items: center;
  gap: 24px;
  padding: 22px 24px;
}

.star-packages-summary-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.star-template-packages .package-list-panel {
  padding: 16px;
}

.star-template-packages .position-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.star-template-packages .mainnet-package-card {
  min-width: 0;
  margin: 0;
  border-radius: 12px;
  border-left: 2px solid rgba(197, 185, 255, 0.52);
}

.star-template-packages .position-details {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.star-team-overview {
  padding: 20px;
}

.star-team-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.star-team-level {
  width: 62px;
  height: 62px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 18px;
  color: #171521;
  background: linear-gradient(145deg, #fff, #bcb0ee);
  box-shadow: 0 0 28px rgba(193, 178, 255, 0.22);
  font-size: 21px;
  font-weight: 560;
}

.star-team-invite {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 3px 12px;
  text-align: right;
}

.star-team-invite small {
  grid-column: 1 / -1;
  color: var(--star-muted);
  font-size: 11px;
}

.star-team-invite strong {
  overflow: hidden;
  color: var(--star-platinum);
  font-size: 17px;
  text-overflow: ellipsis;
}

.star-team-level-note {
  margin: 8px 0 12px;
  color: var(--star-muted);
  font-size: 12px;
}

.star-team-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.star-inline-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
  padding: 0;
  border: 0;
  color: var(--star-lilac-strong);
  background: transparent;
  font-weight: 600;
  cursor: pointer;
}

.star-team-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
  padding: 11px 12px;
  border: 1px solid var(--star-line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.035);
}

.star-team-link > div {
  min-width: 0;
}

.star-team-link span {
  color: var(--star-muted);
  font-size: 11px;
}

.star-team-link p {
  margin: 3px 0 0;
  overflow: hidden;
  color: var(--star-platinum-soft);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.star-template-team .mainnet-readonly-panel {
  border-radius: 12px;
}

.star-template-admin .mainnet-admin-panel {
  display: grid;
  gap: 10px;
}

.star-template-admin .mainnet-admin-identity {
  margin: 0;
  padding: 11px 13px;
  border-radius: 10px;
}

.star-template-admin .admin-tabs,
.star-template-admin .mainnet-admin-data-tabs {
  position: sticky;
  top: 76px;
  z-index: 5;
  margin: 0;
  padding: 4px;
  border-radius: 11px;
}

.star-template-admin .mainnet-admin-data-dashboard,
.star-template-admin .mainnet-admin-section,
.star-template-admin .admin-panel {
  border-radius: 12px;
}

.star-template-admin .mainnet-admin-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.star-template-admin .metrics-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.star-template-admin .metric-card {
  min-height: 104px;
  padding: 13px;
  border-radius: 10px;
}

@media (max-width: 980px) {
  .star-template-packages .position-list,
  .star-asset-actions,
  .star-template-admin .mainnet-admin-grid {
    grid-template-columns: 1fr;
  }

  .star-template-admin .metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .star-network-layout {
    padding: 0;
  }

  .star-network-layout .main-shell {
    min-width: 0;
  }

  .star-network-layout .topbar {
    height: 76px;
    padding: 14px 16px 10px;
    border: 0;
    border-radius: 0;
    background: rgba(13, 16, 24, 0.86);
    backdrop-filter: blur(18px);
  }

  .star-network-layout .topbar-actions {
    gap: 6px;
  }

  .star-network-layout .demo-chip {
    display: none;
  }

  .star-network-layout .language-switch {
    min-width: 34px;
  }

  .star-network-layout .page-shell {
    width: 100%;
    padding: 6px 16px calc(92px + env(safe-area-inset-bottom));
  }

  .star-template-page {
    gap: 10px;
  }

  .star-page-heading {
    align-items: flex-end;
    margin: 2px 0 5px;
  }

  .star-page-heading h1 {
    font-size: 26px;
    font-weight: 520;
  }

  .star-page-heading p {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.45;
  }

  .star-page-status {
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 11px;
  }

  .star-market-hero,
  .star-balance-hero {
    min-height: 126px;
    padding: 16px;
  }

  .star-market-hero strong,
  .star-balance-hero strong,
  .star-packages-summary > div:first-child > strong {
    font-size: 30px;
  }

  .star-orbit-mark {
    width: 118px;
    height: 82px;
    margin-right: -18px;
  }

  .star-market-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-template-market .auto-buy-panel {
    padding: 12px;
  }

  .star-template-market .auto-buy-panel .mainnet-readonly-note,
  .star-template-market .auto-buy-panel .mainnet-inline-note {
    font-size: 11px;
  }

  .star-template-market .market-zone-tabs {
    width: 100%;
  }

  .star-template-market .market-zone-tabs button {
    flex: 1;
    min-width: 0;
  }

  .star-template-market .mainnet-market-zone {
    padding: 11px;
  }

  .star-template-market .market-price-toolbar {
    display: block;
  }

  .star-template-market .market-price-search-hint {
    margin-top: 8px;
    text-align: left;
  }

  .star-template-market .mainnet-market-item-select {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 64px;
    gap: 4px 10px;
    padding: 10px 11px;
  }

  .star-template-market .mainnet-market-item-select > span:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .star-template-market .mainnet-market-item-select > span:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
  }

  .star-template-market .mainnet-market-buy-label {
    grid-column: 2;
    grid-row: 2;
    min-width: 68px;
    padding: 7px 9px;
  }

  .star-secondary-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .star-secondary-metrics .metric-card {
    min-height: 94px;
    padding: 10px 9px;
  }

  .star-secondary-metrics .metric-top {
    font-size: 10px;
  }

  .star-secondary-metrics .metric-top svg {
    display: none;
  }

  .star-secondary-metrics .metric-note {
    margin-top: 6px;
    font-size: 9px;
    line-height: 1.35;
  }

  .star-secondary-metrics .metric-value {
    font-size: 18px;
  }

  .star-secondary-metrics .metric-value small {
    display: block;
    margin: 3px 0 0;
    font-size: 9px;
  }

  .star-asset-actions {
    grid-template-columns: 1fr;
  }

  .star-asset-actions > .surface-panel {
    padding: 13px;
    border-radius: 10px;
    border-left: 2px solid rgba(197, 185, 255, 0.42);
  }

  .star-packages-summary {
    grid-template-columns: 1fr;
    gap: 13px;
    padding: 16px;
  }

  .star-packages-summary-facts,
  .star-template-packages .position-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-template-packages .mainnet-package-card {
    grid-column: 1 / -1;
  }

  .star-template-packages .position-details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-team-overview {
    padding: 15px;
  }

  .star-team-level {
    width: 56px;
    height: 56px;
  }

  .star-team-invite {
    grid-template-columns: 1fr;
  }

  .star-team-invite small {
    grid-column: auto;
  }

  .star-team-invite .button {
    justify-self: end;
  }

  .star-team-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-team-link {
    align-items: flex-end;
  }

  .star-template-team .mainnet-data-table {
    min-width: 620px;
  }

  .star-template-admin .admin-tabs,
  .star-template-admin .mainnet-admin-data-tabs {
    top: 76px;
    overflow-x: auto;
  }

  .star-template-admin .metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-network-layout .mobile-nav {
    left: 10px;
    right: 10px;
    bottom: calc(8px + env(safe-area-inset-bottom));
    height: 66px;
    padding: 7px 8px;
    border: 1px solid var(--star-line);
    border-radius: 18px;
  }

  .star-network-layout .page-footer {
    display: none;
  }
}

@media (max-width: 420px) {
  .star-network-layout .topbar {
    padding-inline: 14px;
  }

  .star-network-layout .page-shell {
    padding-inline: 14px;
  }

  .star-network-brand small {
    font-size: 9px;
  }

  .star-network-brand strong {
    font-size: 15px;
  }

  .star-team-link {
    display: grid;
  }

  .star-team-link .button {
    width: 100%;
  }
}

.appearance-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 0 7px 0 10px;
  border: 1px solid var(--star-line);
  border-radius: 10px;
  color: var(--star-muted);
  background: var(--star-surface);
}

.appearance-switch > svg {
  color: var(--star-lilac-strong);
}

.appearance-switch > span {
  font-size: 12px;
}

.appearance-switch select {
  min-width: 88px;
  height: 30px;
  padding: 0 22px 0 7px;
  border: 0 !important;
  color: var(--star-platinum-soft) !important;
  background-color: transparent !important;
  box-shadow: none;
  font-size: 12px;
}

@media (max-width: 720px) {
  .appearance-switch {
    width: 38px;
    min-width: 38px;
    padding: 0;
    justify-content: center;
  }

  .appearance-switch > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .appearance-switch select {
    position: absolute;
    inset: 0;
    width: 100%;
    min-width: 0;
    opacity: 0;
    cursor: pointer;
  }
}
/*
  Purple / lavender / blue selectable skin. Layout rules mirror star-network.css and are scoped so the platinum skin remains the default. 
 */

/*
 * ASTRA Starrail Network theme.
 *
 * This stylesheet is intentionally loaded after the legacy visual layers. It
 * changes shared tokens and presentation only; component structure, fields,
 * permissions and transaction actions remain owned by their feature modules.
 */

:root[data-astra-skin="violet"] {
  color-scheme: dark;
  color: #f1f3ff;
  background: #080b17;
  --ink: #f1f3ff;
  --muted: #a0aac4;
  --purple: #9b7cf6;
  --purple-deep: #7355c8;
  --purple-soft: rgba(155, 124, 246, 0.15);
  --glass: rgba(15, 20, 38, 0.94);
  --glass-strong: rgba(19, 26, 48, 0.98);
  --stroke: rgba(176, 186, 226, 0.14);
  --shadow-soft: 0 26px 70px rgba(0, 0, 0, 0.28);
  --shadow-card: 0 14px 40px rgba(0, 0, 0, 0.18);
  --star-bg: #080b17;
  --star-bg-raised: #0d1224;
  --star-surface: #11182b;
  --star-surface-raised: #16203a;
  --star-surface-soft: #1b2745;
  --star-platinum: #f1f3ff;
  --star-platinum-soft: #d9def5;
  --star-muted: #a0aac4;
  --star-faint: #7684a7;
  --star-lilac: #9b7cf6;
  --star-lilac-strong: #c7b4ff;
  --star-blue: #69a6ff;
  --star-blue-soft: #9ec5ff;
  --star-line: rgba(176, 186, 226, 0.14);
  --star-line-strong: rgba(155, 124, 246, 0.4);
  --star-success: #76b89f;
  --star-warning: #d3aa69;
  --star-danger: #d7838d;
  --star-info: #8ba8cd;
  --radius-control: 9px;
  --radius-card: 14px;
}

html[data-astra-skin="violet"] {
  background: var(--star-bg);
}

html[data-astra-skin="violet"] body {
  color: var(--star-platinum);
  background:
    radial-gradient(circle at 82% -8%, rgba(121, 82, 218, 0.22), transparent 34rem),
    radial-gradient(circle at 8% 86%, rgba(60, 120, 224, 0.16), transparent 30rem),
    linear-gradient(145deg, #080b17 0%, #0b1020 48%, #070a13 100%);
  background-attachment: fixed;
}

html[data-astra-skin="violet"] ::selection {
  color: #fff;
  background: rgba(155, 124, 246, 0.48);
}

html[data-astra-skin="violet"] button:focus-visible,
html[data-astra-skin="violet"] a:focus-visible,
html[data-astra-skin="violet"] input:focus-visible,
html[data-astra-skin="violet"] textarea:focus-visible,
html[data-astra-skin="violet"] select:focus-visible {
  outline-color: rgba(174, 145, 255, 0.9);
}

/* Ambient network: thin orbital lines and a sparse node field. */
html[data-astra-skin="violet"] .ambient-layer {
  z-index: 0;
  opacity: 1;
}

html[data-astra-skin="violet"] .app-shell {
  position: relative;
  z-index: 1;
}

html[data-astra-skin="violet"] .ambient-orb {
  border: 1px solid rgba(169, 145, 242, 0.18);
  background: transparent;
  box-shadow: none;
  filter: none;
  opacity: 1;
}

html[data-astra-skin="violet"] .ambient-orb::before,
html[data-astra-skin="violet"] .ambient-orb::after {
  content: '';
  position: absolute;
  border-radius: 50%;
}

html[data-astra-skin="violet"] .ambient-orb::before {
  width: 7px;
  height: 7px;
  top: 18%;
  right: 12%;
  background: linear-gradient(135deg, var(--star-lilac-strong), var(--star-blue));
  box-shadow: 0 0 0 5px rgba(155, 124, 246, 0.1), 0 0 20px rgba(105, 166, 255, 0.16);
}

html[data-astra-skin="violet"] .ambient-orb::after {
  inset: 14%;
  border: 1px solid rgba(105, 166, 255, 0.1);
}

html[data-astra-skin="violet"] .ambient-orb-one {
  width: 620px;
  height: 360px;
  top: -170px;
  right: -100px;
  transform: rotate(-18deg);
  animation: starrail-orbit-one-violet 28s ease-in-out infinite alternate;
}

html[data-astra-skin="violet"] .ambient-orb-two {
  width: 460px;
  height: 260px;
  bottom: -110px;
  left: 11%;
  transform: rotate(16deg);
  animation: starrail-orbit-two-violet 34s ease-in-out infinite alternate;
}

html[data-astra-skin="violet"] .ambient-grid {
  inset: 0;
  opacity: 0.52;
  background-image:
    radial-gradient(circle at 12% 17%, rgba(218, 210, 255, 0.62) 0 1px, transparent 1.5px),
    radial-gradient(circle at 72% 22%, rgba(166, 139, 246, 0.54) 0 1px, transparent 1.7px),
    radial-gradient(circle at 46% 68%, rgba(160, 198, 255, 0.44) 0 1px, transparent 1.5px),
    radial-gradient(circle at 88% 82%, rgba(105, 166, 255, 0.44) 0 1px, transparent 1.6px),
    linear-gradient(rgba(130, 151, 205, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(130, 151, 205, 0.035) 1px, transparent 1px);
  background-size: 380px 310px, 470px 390px, 430px 360px, 520px 430px, 72px 72px, 72px 72px;
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.64) 64%, transparent 100%);
  animation: starrail-field-violet 36s linear infinite alternate;
}

@keyframes starrail-orbit-one-violet {
  from { translate: 0 0; }
  to { translate: -18px 14px; }
}

@keyframes starrail-orbit-two-violet {
  from { translate: 0 0; }
  to { translate: 16px -10px; }
}

@keyframes starrail-field-violet {
  from { background-position: 0 0; }
  to { background-position: 20px 12px; }
}

/* Shell and global navigation. */
html[data-astra-skin="violet"] .app-shell {
  grid-template-columns: 204px minmax(0, 1fr);
  padding: 12px;
  gap: 12px;
}

html[data-astra-skin="violet"] .sidebar {
  border-color: var(--star-line);
  background: rgba(10, 15, 31, 0.97);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.3);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .brand-logo {
  filter: invert(1) hue-rotate(180deg) brightness(1.05) saturate(0.7);
}

html[data-astra-skin="violet"] .nav-caption,
html[data-astra-skin="violet"] .sidebar-foot,
html[data-astra-skin="violet"] .network-card small,
html[data-astra-skin="violet"] .breadcrumb,
html[data-astra-skin="violet"] .slash {
  color: var(--star-faint);
}

html[data-astra-skin="violet"] .nav-item {
  color: #9aa1ad;
}

html[data-astra-skin="violet"] .nav-item:hover {
  color: var(--star-platinum-soft);
  background: rgba(224, 228, 238, 0.055);
  transform: translateX(2px);
}

html[data-astra-skin="violet"] .nav-item.active {
  color: var(--star-platinum);
  background: linear-gradient(90deg, rgba(155, 124, 246, 0.22), rgba(105, 166, 255, 0.07));
  box-shadow: inset 0 0 0 1px rgba(190, 169, 255, 0.12);
}

html[data-astra-skin="violet"] .nav-item.active::before {
  background: linear-gradient(#dcd1ff, #8c6bed 56%, #69a6ff);
  box-shadow: 0 0 16px rgba(155, 124, 246, 0.42);
}

html[data-astra-skin="violet"] .network-card {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #10182c;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

html[data-astra-skin="violet"] .network-card > svg {
  color: var(--star-blue-soft);
}

html[data-astra-skin="violet"] .status-dot {
  background: linear-gradient(135deg, var(--star-lilac-strong), var(--star-blue));
  box-shadow: 0 0 0 4px rgba(155, 124, 246, 0.1);
  animation: starrail-status-violet 3.8s ease-in-out infinite;
}

@keyframes starrail-status-violet {
  0%, 100% { opacity: 0.72; box-shadow: 0 0 0 3px rgba(155, 124, 246, 0.08); }
  50% { opacity: 1; box-shadow: 0 0 0 6px rgba(105, 166, 255, 0.025); }
}

html[data-astra-skin="violet"] .topbar {
  border-color: var(--star-line);
  background: rgba(11, 17, 34, 0.97);
  box-shadow: 0 14px 42px rgba(0, 0, 0, 0.2);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .breadcrumb strong {
  color: var(--star-platinum-soft);
}

html[data-astra-skin="violet"] .demo-chip {
  border-color: var(--star-line);
  color: #c6b7f4;
  background: #141d34;
}

html[data-astra-skin="violet"] .page-shell {
  max-width: calc(var(--content-user) + 64px);
}

html[data-astra-skin="violet"] .admin-page-scope .page-shell,
html[data-astra-skin="violet"] .mainnet-admin-panel {
  max-width: var(--content-admin);
}

html[data-astra-skin="violet"] .page-heading {
  animation: starrail-enter-violet 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

html[data-astra-skin="violet"] .page-heading::before,
html[data-astra-skin="violet"] .eyebrow,
html[data-astra-skin="violet"] .muted-eyebrow,
html[data-astra-skin="violet"] .showcase-kicker,
html[data-astra-skin="violet"] .position-id {
  color: #aa8cff;
}

html[data-astra-skin="violet"] .page-heading h1,
html[data-astra-skin="violet"] .section-heading h2,
html[data-astra-skin="violet"] .panel-heading h2 {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .page-heading p,
html[data-astra-skin="violet"] .text-muted,
html[data-astra-skin="violet"] .metric-note,
html[data-astra-skin="violet"] .form-hint,
html[data-astra-skin="violet"] .mainnet-readonly-note,
html[data-astra-skin="violet"] .mainnet-closed-reason,
html[data-astra-skin="violet"] .section-note,
html[data-astra-skin="violet"] .subtle-label,
html[data-astra-skin="violet"] .muted,
html[data-astra-skin="violet"] .muted-text {
  color: var(--star-muted);
}

@keyframes starrail-enter-violet {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Shared controls. */
html[data-astra-skin="violet"] .button {
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

html[data-astra-skin="violet"] .button-primary {
  color: #0a0d19;
  background: linear-gradient(135deg, #d8ccff, #a98bf5 54%, #78adff);
  box-shadow: 0 9px 24px rgba(92, 64, 178, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

html[data-astra-skin="violet"] .button-primary:hover:not(:disabled) {
  color: #070912;
  background: linear-gradient(135deg, #e5ddff, #b89cff 54%, #8bbaff);
  transform: translateY(-1px);
}

html[data-astra-skin="violet"] .button-outline,
html[data-astra-skin="violet"] .button-icon,
html[data-astra-skin="violet"] .button-ghost {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #18233d;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

html[data-astra-skin="violet"] .button-outline:hover:not(:disabled),
html[data-astra-skin="violet"] .button-icon:hover:not(:disabled),
html[data-astra-skin="violet"] .button-ghost:hover:not(:disabled) {
  border-color: var(--star-line-strong);
  color: #fff;
  background: #202f50;
}

html[data-astra-skin="violet"] input,
html[data-astra-skin="violet"] textarea,
html[data-astra-skin="violet"] select,
html[data-astra-skin="violet"] .search-field,
html[data-astra-skin="violet"] .market-price-search,
html[data-astra-skin="violet"] .team-tree-search,
html[data-astra-skin="violet"] .date-range-trigger,
html[data-astra-skin="violet"] .mainnet-admin-record-search > div,
html[data-astra-skin="violet"] .mainnet-receipt-recovery input {
  border-color: var(--star-line) !important;
  color: var(--star-platinum-soft) !important;
  background-color: #0f172b !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.22);
}

html[data-astra-skin="violet"] input::placeholder,
html[data-astra-skin="violet"] textarea::placeholder {
  color: #717989;
}

html[data-astra-skin="violet"] select {
  background-image:
    linear-gradient(45deg, transparent 50%, #b8a4f2 50%),
    linear-gradient(135deg, #87b4f4 50%, transparent 50%);
}

html[data-astra-skin="violet"] select:hover,
html[data-astra-skin="violet"] select:focus-visible,
html[data-astra-skin="violet"] input:hover,
html[data-astra-skin="violet"] textarea:hover {
  border-color: rgba(174, 145, 255, 0.44) !important;
  background-color: #141f38 !important;
}

html[data-astra-skin="violet"] select option {
  color: var(--star-platinum);
  background: #11182b;
}

/* Shared surfaces. No blanket blur: depth comes from tone and fine borders. */
html[data-astra-skin="violet"] .surface-panel,
html[data-astra-skin="violet"] .metric-card,
html[data-astra-skin="violet"] .position-card,
html[data-astra-skin="violet"] .empty-panel,
html[data-astra-skin="violet"] .chain-card,
html[data-astra-skin="violet"] .product-card,
html[data-astra-skin="violet"] .mainnet-readonly-panel,
html[data-astra-skin="violet"] .mainnet-readonly-panel.mainnet-admin-records,
html[data-astra-skin="violet"] .mainnet-admin-data-dashboard,
html[data-astra-skin="violet"] .premium-batch-card {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: rgba(17, 24, 43, 0.97);
  box-shadow: var(--shadow-card), inset 0 1px 0 rgba(255, 255, 255, 0.025);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .surface-panel,
html[data-astra-skin="violet"] .metric-card,
html[data-astra-skin="violet"] .position-card,
html[data-astra-skin="violet"] .product-card,
html[data-astra-skin="violet"] .chain-card,
html[data-astra-skin="violet"] .mainnet-market-item {
  transition: border-color 180ms ease, background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

@media (hover: hover) {
  html[data-astra-skin="violet"] .surface-panel:hover,
html[data-astra-skin="violet"] .metric-card:hover,
html[data-astra-skin="violet"] .position-card:hover,
html[data-astra-skin="violet"] .product-card:hover,
html[data-astra-skin="violet"] .chain-card:hover {
    border-color: rgba(174, 145, 255, 0.28);
  }
}

html[data-astra-skin="violet"] .metric-card::after {
  width: 132px;
  height: 132px;
  top: -88px;
  right: -58px;
  background: radial-gradient(circle, rgba(155, 124, 246, 0.24), rgba(105, 166, 255, 0.08) 38%, transparent 70%);
}

html[data-astra-skin="violet"] .metric-top,
html[data-astra-skin="violet"] .position-details span,
html[data-astra-skin="violet"] .product-time,
html[data-astra-skin="violet"] .product-body > p,
html[data-astra-skin="violet"] .compact-history-header,
html[data-astra-skin="violet"] .compact-history-row time,
html[data-astra-skin="violet"] .history-row p,
html[data-astra-skin="violet"] .history-row time {
  color: var(--star-muted);
}

html[data-astra-skin="violet"] .metric-top svg,
html[data-astra-skin="violet"] .panel-heading h2 svg,
html[data-astra-skin="violet"] .mainnet-readonly-panel .panel-heading > svg {
  color: #b9a1ff;
}

html[data-astra-skin="violet"] .metric-value,
html[data-astra-skin="violet"] .position-main h3,
html[data-astra-skin="violet"] .product-body h3,
html[data-astra-skin="violet"] .compact-history-row strong,
html[data-astra-skin="violet"] .ledger-summary strong,
html[data-astra-skin="violet"] .claim-amount {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .metric-icon,
html[data-astra-skin="violet"] .purple,
html[data-astra-skin="violet"] .blue,
html[data-astra-skin="violet"] .green,
html[data-astra-skin="violet"] .position-icon,
html[data-astra-skin="violet"] .empty-icon {
  color: #c7b4ff;
  background: linear-gradient(145deg, rgba(155, 124, 246, 0.18), rgba(105, 166, 255, 0.1));
}

html[data-astra-skin="violet"] .badge-purple,
html[data-astra-skin="violet"] .badge-blue,
html[data-astra-skin="violet"] .status-ready,
html[data-astra-skin="violet"] .status-listed,
html[data-astra-skin="violet"] .mainnet-readonly-badge {
  border-color: rgba(174, 145, 255, 0.22);
  color: #d0c2ff;
  background: linear-gradient(135deg, rgba(155, 124, 246, 0.16), rgba(105, 166, 255, 0.08));
}

html[data-astra-skin="violet"] .status-holding,
html[data-astra-skin="violet"] .testnet-banner {
  color: #a8ccff;
  background: rgba(86, 145, 227, 0.15);
}

html[data-astra-skin="violet"] .status-cooling {
  color: #ddbd82;
  background: rgba(199, 154, 82, 0.13);
}

html[data-astra-skin="violet"] .status-sold,
html[data-astra-skin="violet"] .status-redeemed {
  color: #8fc9b1;
  background: rgba(87, 157, 128, 0.13);
}

html[data-astra-skin="violet"] .status-failed {
  color: #df929a;
  background: rgba(194, 91, 103, 0.13);
}

html[data-astra-skin="violet"] .notice {
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .notice-info,
html[data-astra-skin="violet"] .demo-banner {
  border-color: rgba(155, 124, 246, 0.2);
  color: #cdbfff;
  background: linear-gradient(135deg, rgba(155, 124, 246, 0.12), rgba(105, 166, 255, 0.06));
}

html[data-astra-skin="violet"] .notice-success {
  border-color: rgba(118, 184, 159, 0.18);
  color: #8ccab2;
  background: rgba(73, 139, 113, 0.12);
}

html[data-astra-skin="violet"] .notice-warning,
html[data-astra-skin="violet"] .mainnet-admin-risk {
  border-color: rgba(211, 170, 105, 0.2);
  color: #dfbd84;
  background: rgba(165, 115, 51, 0.12);
}

html[data-astra-skin="violet"] .notice-error,
html[data-astra-skin="violet"] .error-banner {
  border-color: rgba(215, 131, 141, 0.2);
  color: #e39aa2;
  background: rgba(159, 63, 75, 0.13);
}

/* Market and package presentation. */
html[data-astra-skin="violet"] .market-showcase,
html[data-astra-skin="violet"] .hero-panel {
  border-color: rgba(176, 186, 226, 0.16);
  background:
    radial-gradient(circle at 78% 16%, rgba(169, 139, 255, 0.2), transparent 24%),
    radial-gradient(circle at 88% 76%, rgba(80, 148, 255, 0.13), transparent 30%),
    linear-gradient(135deg, #151b34, #0d1428 58%, #17152f);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

html[data-astra-skin="violet"] .market-showcase::before {
  opacity: 0.52;
  background-image:
    radial-gradient(circle, rgba(222, 214, 255, 0.58) 0 1px, transparent 1.4px),
    linear-gradient(112deg, transparent 47.8%, rgba(105, 166, 255, 0.13) 48%, transparent 48.3%);
  background-size: 44px 44px, 100% 100%;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.4), #000 78%);
}

html[data-astra-skin="violet"] .market-showcase h2,
html[data-astra-skin="violet"] .hero-copy h1 {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .market-showcase h2 span,
html[data-astra-skin="violet"] .hero-copy h1 > span {
  color: #c5b3ff;
}

html[data-astra-skin="violet"] .market-showcase-copy > p,
html[data-astra-skin="violet"] .hero-copy p,
html[data-astra-skin="violet"] .hero-caption {
  color: #a2a8b3;
}

html[data-astra-skin="violet"] .showcase-stats > div {
  border-color: var(--star-line);
  background: rgba(13, 21, 40, 0.76);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .showcase-stats small,
html[data-astra-skin="violet"] .showcase-stats em {
  color: #8992a2;
}

html[data-astra-skin="violet"] .showcase-stats strong {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .market-showcase-art::before,
html[data-astra-skin="violet"] .market-showcase-art::after {
  content: '';
  position: absolute;
  border: 1px solid rgba(180, 153, 255, 0.24);
  border-radius: 50%;
  pointer-events: none;
}

html[data-astra-skin="violet"] .market-showcase-art::before {
  width: 280px;
  height: 148px;
  top: 68px;
  right: 24px;
  transform: rotate(-26deg);
}

html[data-astra-skin="violet"] .market-showcase-art::after {
  width: 242px;
  height: 122px;
  top: 80px;
  right: 43px;
  border-style: dashed;
  border-color: rgba(105, 166, 255, 0.18);
  transform: rotate(24deg);
}

html[data-astra-skin="violet"] .glass-sphere {
  border-color: rgba(228, 224, 255, 0.68);
  background: radial-gradient(circle at 28% 22%, #fff 0 3%, #dcd3ff 7%, #987be8 34%, #3c4380 69%, #15203a 100%);
  box-shadow: inset -10px -12px 24px rgba(3, 5, 8, 0.38), inset 8px 7px 17px rgba(255, 255, 255, 0.24), 0 22px 48px rgba(0, 0, 0, 0.34);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .mainnet-market-showcase .glass-sphere {
  animation: starrail-node-drift-violet 12s ease-in-out infinite alternate;
}

@keyframes starrail-node-drift-violet {
  from { translate: 0 0; }
  to { translate: 0 -5px; }
}

html[data-astra-skin="violet"] .showcase-float-card {
  border-color: rgba(179, 164, 234, 0.2);
  color: var(--star-platinum);
  background: linear-gradient(145deg, rgba(32, 40, 72, 0.97), rgba(16, 23, 43, 0.97));
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.055);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .showcase-float-card span,
html[data-astra-skin="violet"] .showcase-float-card svg,
html[data-astra-skin="violet"] .mainnet-market-item-id strong,
html[data-astra-skin="violet"] .mainnet-market-buy-label {
  color: #bca8ff;
}

html[data-astra-skin="violet"] .showcase-float-card strong {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .orbit {
  border-color: rgba(193, 175, 217, 0.18);
}

html[data-astra-skin="violet"] .crystal-layer {
  border-color: rgba(230, 233, 241, 0.16);
  box-shadow: 15px 18px 28px rgba(0, 0, 0, 0.2);
}

html[data-astra-skin="violet"] .layer-back { background: linear-gradient(150deg, rgba(103, 116, 143, 0.62), rgba(51, 56, 70, 0.72)); }
html[data-astra-skin="violet"] .layer-middle { background: linear-gradient(150deg, rgba(155, 138, 184, 0.84), rgba(70, 60, 91, 0.88)); }
html[data-astra-skin="violet"] .layer-front { background: linear-gradient(135deg, rgba(222, 216, 232, 0.82), rgba(121, 103, 153, 0.72)); }

html[data-astra-skin="violet"] .market-zone,
html[data-astra-skin="violet"] .auto-buy-panel {
  background: linear-gradient(145deg, rgba(19, 28, 51, 0.98), rgba(13, 20, 38, 0.98));
}

html[data-astra-skin="violet"] .market-zone-purchase {
  border-color: var(--star-line);
  background: #17223d;
}

html[data-astra-skin="violet"] .market-price-chip {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #0f172b;
}

html[data-astra-skin="violet"] .market-price-chip small,
html[data-astra-skin="violet"] .market-price-more,
html[data-astra-skin="violet"] .market-selected-price span,
html[data-astra-skin="violet"] .market-selected-price small,
html[data-astra-skin="violet"] .market-quantity-control,
html[data-astra-skin="violet"] .market-zone-total,
html[data-astra-skin="violet"] .market-zone-total span {
  color: var(--star-muted);
}

html[data-astra-skin="violet"] .market-price-chip.active {
  border-color: rgba(181, 154, 255, 0.42);
  color: var(--star-platinum);
  background: linear-gradient(135deg, rgba(123, 87, 216, 0.9), rgba(76, 126, 213, 0.82));
}

html[data-astra-skin="violet"] .market-price-chip.active small {
  color: #e0d8e8;
}

html[data-astra-skin="violet"] .price-chip {
  border-color: var(--star-line);
  color: var(--star-muted);
  background: #0f172b;
}

html[data-astra-skin="violet"] .price-chip.active {
  border-color: rgba(174, 145, 255, 0.36);
  color: var(--star-platinum);
  background: linear-gradient(135deg, rgba(155, 124, 246, 0.22), rgba(105, 166, 255, 0.11));
}

html[data-astra-skin="violet"] .market-quantity-stepper {
  border-color: var(--star-line);
  background: #0f172b;
}

html[data-astra-skin="violet"] .market-quantity-stepper button {
  color: #c7b4ff;
}

html[data-astra-skin="violet"] .market-quantity-stepper button:hover:not(:disabled) {
  background: rgba(155, 124, 246, 0.17);
}

html[data-astra-skin="violet"] .market-quantity-stepper button:disabled {
  color: #5d6573;
}

html[data-astra-skin="violet"] .market-quantity-stepper strong,
html[data-astra-skin="violet"] .market-selected-price strong,
html[data-astra-skin="violet"] .market-zone-total strong {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .market-zone-tabs,
html[data-astra-skin="violet"] .admin-tabs,
html[data-astra-skin="violet"] .mainnet-section-nav,
html[data-astra-skin="violet"] .mainnet-admin-data-tabs {
  border-color: var(--star-line);
  background: #0f172b;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .market-zone-tabs button,
html[data-astra-skin="violet"] .admin-tab,
html[data-astra-skin="violet"] .mainnet-section-nav button,
html[data-astra-skin="violet"] .mainnet-admin-data-tabs button,
html[data-astra-skin="violet"] .tab-trigger,
html[data-astra-skin="violet"] .filter-pill,
html[data-astra-skin="violet"] .price-filter-button,
html[data-astra-skin="violet"] .admin-subtabs button {
  color: var(--star-muted);
  background: transparent;
}

html[data-astra-skin="violet"] .market-zone-tabs button.active,
html[data-astra-skin="violet"] .admin-tab.active,
html[data-astra-skin="violet"] .mainnet-section-nav button.active,
html[data-astra-skin="violet"] .mainnet-admin-data-tabs button.active,
html[data-astra-skin="violet"] .tab-trigger[data-state='active'],
html[data-astra-skin="violet"] .filter-pill.active,
html[data-astra-skin="violet"] .price-filter-button.active,
html[data-astra-skin="violet"] .admin-subtabs button.active {
  border-color: rgba(174, 145, 255, 0.25);
  color: var(--star-platinum);
  background: linear-gradient(135deg, rgba(155, 124, 246, 0.24), rgba(105, 166, 255, 0.12));
  box-shadow: inset 0 0 0 1px rgba(196, 179, 255, 0.1);
}

html[data-astra-skin="violet"] .market-zone-heading h2,
html[data-astra-skin="violet"] .product-bottom strong,
html[data-astra-skin="violet"] .mainnet-market-item-select strong {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .market-zone-heading p,
html[data-astra-skin="violet"] .market-price-search-hint,
html[data-astra-skin="violet"] .market-price-clear,
html[data-astra-skin="violet"] .mainnet-market-item-select small {
  color: var(--star-muted);
}

html[data-astra-skin="violet"] .mainnet-market-item {
  border-color: var(--star-line);
  background: #11182b;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
}

html[data-astra-skin="violet"] .mainnet-market-item:hover {
  border-color: rgba(174, 145, 255, 0.36);
  background: #17213a;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22);
}

html[data-astra-skin="violet"] .mainnet-market-item-select {
  color: var(--star-platinum-soft);
}

html[data-astra-skin="violet"] .product-art-1,
html[data-astra-skin="violet"] .product-art-2,
html[data-astra-skin="violet"] .product-art-3,
html[data-astra-skin="violet"] .product-art-4,
html[data-astra-skin="violet"] .product-art-5,
html[data-astra-skin="violet"] .product-art-6 {
  background: linear-gradient(135deg, #252b38, #171c26 62%, #2d2638);
}

html[data-astra-skin="violet"] .product-sculpture {
  filter: saturate(0.55) brightness(0.9);
}

html[data-astra-skin="violet"] .product-bottom,
html[data-astra-skin="violet"] .position-actions,
html[data-astra-skin="violet"] .compact-history-row,
html[data-astra-skin="violet"] .history-row {
  border-color: var(--star-line);
}

html[data-astra-skin="violet"] .empty-state {
  color: var(--star-muted);
}

html[data-astra-skin="violet"] .empty-state h2,
html[data-astra-skin="violet"] .empty-state h3 {
  color: #b9a9cf;
}

/* Asset, team and ledger modules. */
html[data-astra-skin="violet"] .release-donut {
  background: conic-gradient(#9b7cf6 0 22%, #69a6ff 22% 30%, #293552 30% 100%);
}

html[data-astra-skin="violet"] .release-donut > span {
  color: #cfbeff;
  background: #11182b;
}

html[data-astra-skin="violet"] .legend-dot.purple { background: #9b7cf6; }
html[data-astra-skin="violet"] .legend-dot.pale { background: #69a6ff; }

html[data-astra-skin="violet"] .ledger-summary > div,
html[data-astra-skin="violet"] .mainnet-summary-list > div,
html[data-astra-skin="violet"] .mainnet-transaction-summary > div,
html[data-astra-skin="violet"] .financial-quote-grid > div,
html[data-astra-skin="violet"] .settlement-asset,
html[data-astra-skin="violet"] .settlement-flow,
html[data-astra-skin="violet"] .premium-pool-grid > div {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #0f172b;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

html[data-astra-skin="violet"] .team-reference-table th,
html[data-astra-skin="violet"] .team-tree-line,
html[data-astra-skin="violet"] .team-direct-summary > strong {
  color: #c5b1ff;
}

html[data-astra-skin="violet"] .team-reference-table td,
html[data-astra-skin="violet"] .team-reference-table th {
  border-color: var(--star-line);
}

html[data-astra-skin="violet"] .team-direct-summary,
html[data-astra-skin="violet"] .team-tree-node,
html[data-astra-skin="violet"] .team-direct-chip {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #0f172b;
}

html[data-astra-skin="violet"] .team-tree-toggle {
  color: #c9b7ff;
  background: linear-gradient(145deg, rgba(155, 124, 246, 0.2), rgba(105, 166, 255, 0.11));
}

html[data-astra-skin="violet"] .team-tree-summary span,
html[data-astra-skin="violet"] .team-tree-node small,
html[data-astra-skin="violet"] .team-direct-chip small {
  color: var(--star-muted);
}

html[data-astra-skin="violet"] .copy-field input {
  color: var(--star-platinum-soft);
  background: #0f172b;
}

/* Dense data and administration. */
html[data-astra-skin="violet"] .admin-table,
html[data-astra-skin="violet"] .mainnet-data-table,
html[data-astra-skin="violet"] .team-reference-table {
  color: var(--star-platinum-soft);
}

html[data-astra-skin="violet"] .admin-table th,
html[data-astra-skin="violet"] .mainnet-data-table th {
  color: #8992a2;
}

html[data-astra-skin="violet"] .admin-table td,
html[data-astra-skin="violet"] .mainnet-data-table td {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: rgba(15, 23, 43, 0.96);
}

html[data-astra-skin="violet"] .admin-table td:first-child {
  border-left-color: var(--star-line);
}

html[data-astra-skin="violet"] .admin-table td:last-child {
  border-right-color: var(--star-line);
}

html[data-astra-skin="violet"] .admin-user-table code,
html[data-astra-skin="violet"] .mainnet-data-table code,
html[data-astra-skin="violet"] .mainnet-command-reference code,
html[data-astra-skin="violet"] .team-tree-node code {
  color: #c2afff;
}

html[data-astra-skin="violet"] .admin-icon-button,
html[data-astra-skin="violet"] .admin-role-icon,
html[data-astra-skin="violet"] .mainnet-copy-button {
  border-color: var(--star-line);
  color: #c7b4ff;
  background: #1b2745;
}

html[data-astra-skin="violet"] .admin-icon-button:hover,
html[data-astra-skin="violet"] .admin-icon-button:focus-visible {
  color: #0a0d19;
  background: linear-gradient(135deg, #cdbdff, #8bbaff);
}

html[data-astra-skin="violet"] .mainnet-admin-panel {
  border-top-color: var(--star-line);
}

html[data-astra-skin="violet"] .mainnet-admin-identity,
html[data-astra-skin="violet"] .mainnet-admin-capability-grid article,
html[data-astra-skin="violet"] .mainnet-admin-form-grid .admin-checkbox-field,
html[data-astra-skin="violet"] .admin-user-detail-actions .admin-checkbox-field {
  border-color: var(--star-line);
  color: var(--star-muted);
  background: #11182b;
}

html[data-astra-skin="violet"] .mainnet-admin-capability-grid article strong,
html[data-astra-skin="violet"] .mainnet-asset-history h3 {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .mainnet-admin-capability-grid article p,
html[data-astra-skin="violet"] .mainnet-account-toolbar {
  color: var(--star-muted);
}

html[data-astra-skin="violet"] .mainnet-admin-status {
  color: #cbbaff;
  background: linear-gradient(135deg, rgba(155, 124, 246, 0.17), rgba(105, 166, 255, 0.08));
}

html[data-astra-skin="violet"] .mainnet-admin-status.status-approved,
html[data-astra-skin="violet"] .mainnet-admin-status.status-routed {
  color: #dfbd84;
  background: rgba(165, 115, 51, 0.14);
}

html[data-astra-skin="violet"] .mainnet-admin-status.status-settled,
html[data-astra-skin="violet"] .mainnet-admin-status.status-completed,
html[data-astra-skin="violet"] .mainnet-admin-identity .is-ready,
html[data-astra-skin="violet"] .mainnet-window-state {
  color: #8ccab2;
  background: rgba(73, 139, 113, 0.13);
}

html[data-astra-skin="violet"] .mainnet-admin-status.status-retry_pending,
html[data-astra-skin="violet"] .mainnet-admin-identity .is-warning {
  color: #e39aa2;
  background: rgba(159, 63, 75, 0.13);
}

html[data-astra-skin="violet"] .mainnet-operation-gates span {
  border-color: rgba(211, 170, 105, 0.18);
  background: rgba(211, 170, 105, 0.08);
}

html[data-astra-skin="violet"] .mainnet-login-hint,
html[data-astra-skin="violet"] .mainnet-unavailable-panel {
  border-color: rgba(174, 145, 255, 0.26);
  color: #cbbaff;
  background: linear-gradient(135deg, rgba(155, 124, 246, 0.11), rgba(105, 166, 255, 0.055));
}

html[data-astra-skin="violet"] .mainnet-login-hint p,
html[data-astra-skin="violet"] .mainnet-unavailable-panel p,
html[data-astra-skin="violet"] .mainnet-summary-list dt,
html[data-astra-skin="violet"] .mainnet-transaction-summary dt {
  color: var(--star-muted);
}

html[data-astra-skin="violet"] .mainnet-summary-list dd,
html[data-astra-skin="violet"] .mainnet-transaction-summary dd,
html[data-astra-skin="violet"] .mainnet-status-metrics .metric-card strong {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .date-range-popover {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #141d34;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
}

html[data-astra-skin="violet"] .rdp-root {
  --rdp-accent-color: #b89fff;
  --rdp-accent-background-color: rgba(155, 124, 246, 0.2);
}

/* Dialogs and transactional overlays. */
html[data-astra-skin="violet"] .dialog-overlay {
  background: rgba(4, 6, 10, 0.72) !important;
  backdrop-filter: blur(9px);
}

html[data-astra-skin="violet"] .dialog-content,
html[data-astra-skin="violet"] .dialog-content.invite-gate {
  border-color: rgba(184, 174, 232, 0.2);
  color: var(--star-platinum-soft);
  background: #131c33;
  box-shadow: 0 36px 110px rgba(0, 0, 0, 0.56), inset 0 1px 0 rgba(255, 255, 255, 0.045);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .dialog-title {
  color: var(--star-platinum);
}

html[data-astra-skin="violet"] .dialog-description,
html[data-astra-skin="violet"] .mainnet-command-reference {
  color: var(--star-muted);
}

html[data-astra-skin="violet"] .dialog-close {
  border-color: var(--star-line);
  color: #c5b1ff;
  background: #1b2745;
}

html[data-astra-skin="violet"] .dialog-close:hover,
html[data-astra-skin="violet"] .dialog-close:focus-visible {
  color: #0a0d19;
  background: linear-gradient(135deg, #d3c6ff, #94bdff);
}

html[data-astra-skin="violet"] .invite-gate-field,
html[data-astra-skin="violet"] .form-label {
  color: var(--star-platinum-soft);
}

/* Footer and minor chrome. */
html[data-astra-skin="violet"] .page-footer {
  border-color: var(--star-line);
  color: #747d8d;
}

html[data-astra-skin="violet"] .price-ticker,
html[data-astra-skin="violet"] .mainnet-announcement-ticker {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #0f172b;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
  backdrop-filter: none;
}

html[data-astra-skin="violet"] .price-ticker-label,
html[data-astra-skin="violet"] .mainnet-announcement-label {
  color: #0b0e19;
  background: linear-gradient(135deg, #d8ccff, #a88af5 56%, #7aafff);
}

html[data-astra-skin="violet"] .price-ticker-item b { color: #c7b4ff; }
html[data-astra-skin="violet"] .price-ticker-item small { color: var(--star-muted); }
html[data-astra-skin="violet"] .mainnet-announcement-moving-title { color: #f2ecff; }

/* Responsive starrail treatment. Existing feature media queries continue to
   own content reflow; this layer only adjusts the shared shell and density. */
@media (max-width: 720px) {
  html[data-astra-skin="violet"] .ambient-orb-one {
    width: 430px;
    height: 250px;
    top: -110px;
    right: -210px;
  }

  html[data-astra-skin="violet"] .ambient-orb-two {
    width: 330px;
    height: 190px;
    left: -130px;
    bottom: 10%;
  }

  html[data-astra-skin="violet"] .ambient-grid {
    opacity: 0.36;
    animation: none;
  }

  html[data-astra-skin="violet"] .topbar {
    position: sticky;
    border-color: var(--star-line);
    background: rgba(10, 16, 33, 0.98);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.3);
    backdrop-filter: none;
  }

  html[data-astra-skin="violet"] .mobile-nav {
    position: fixed;
    border-color: var(--star-line);
    background: rgba(10, 16, 33, 0.98);
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.44);
    backdrop-filter: none;
  }

  html[data-astra-skin="violet"] .mobile-nav button {
    color: #838b99;
  }

  html[data-astra-skin="violet"] .mobile-nav button.active {
    color: var(--star-platinum);
    background: linear-gradient(145deg, rgba(155, 124, 246, 0.2), rgba(105, 166, 255, 0.1));
  }

  html[data-astra-skin="violet"] .mobile-nav button.active::after {
    content: '';
    position: absolute;
    right: 24%;
    bottom: 3px;
    left: 24%;
    height: 2px;
    border-radius: 99px;
    background: linear-gradient(90deg, #ad91ff, #69a6ff);
    box-shadow: 0 0 10px rgba(139, 111, 230, 0.28);
  }

  html[data-astra-skin="violet"] .market-showcase-copy {
    padding: 26px 24px 20px;
  }

  html[data-astra-skin="violet"] .market-showcase-art {
    min-height: 170px;
  }

  html[data-astra-skin="violet"] .market-showcase-art::before {
    width: 240px;
    height: 120px;
    top: 30px;
    right: calc(50% - 120px);
  }

  html[data-astra-skin="violet"] .market-showcase-art::after {
    width: 210px;
    height: 104px;
    top: 42px;
    right: calc(50% - 105px);
  }

  html[data-astra-skin="violet"] .sphere-large { top: 8px; }
  html[data-astra-skin="violet"] .sphere-medium { top: 42px; }

  html[data-astra-skin="violet"] .mainnet-admin-data-dashboard {
    border-color: var(--star-line);
    background: #0f172b;
  }

  html[data-astra-skin="violet"] .admin-page-scope .mainnet-admin-user-table tbody tr {
    border-color: var(--star-line);
    background: #11182b;
  }
}

@media (max-width: 480px) {
  html[data-astra-skin="violet"] .page-heading h1 {
    font-size: 24px;
  }

  html[data-astra-skin="violet"] .market-showcase h2 {
    font-size: clamp(28px, 9vw, 36px);
  }

  html[data-astra-skin="violet"] .market-showcase-copy > p {
    line-height: 1.75;
  }

  html[data-astra-skin="violet"] .showcase-stats > div {
    padding: 10px 8px;
  }

  html[data-astra-skin="violet"] .surface-panel,
html[data-astra-skin="violet"] .position-card {
    border-radius: 15px;
  }

  html[data-astra-skin="violet"] .metric-card {
    min-height: 112px;
    border-radius: 13px;
  }

  html[data-astra-skin="violet"] .dialog-content,
html[data-astra-skin="violet"] .dialog-content.invite-gate {
    border-radius: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-astra-skin="violet"] .ambient-orb-one,
html[data-astra-skin="violet"] .ambient-orb-two,
html[data-astra-skin="violet"] .ambient-grid,
html[data-astra-skin="violet"] .status-dot,
html[data-astra-skin="violet"] .page-heading,
html[data-astra-skin="violet"] .mainnet-market-showcase .glass-sphere,
html[data-astra-skin="violet"] .mainnet-market-showcase .showcase-float-card {
    animation: none !important;
  }

  html[data-astra-skin="violet"] .button,
html[data-astra-skin="violet"] .surface-panel,
html[data-astra-skin="violet"] .metric-card,
html[data-astra-skin="violet"] .position-card,
html[data-astra-skin="violet"] .product-card,
html[data-astra-skin="violet"] .chain-card,
html[data-astra-skin="violet"] .mainnet-market-item,
html[data-astra-skin="violet"] .nav-item {
    transition: none !important;
  }
}

/* --------------------------------------------------------------------------
 * 星轨网络正式布局
 *
 * 这一层不再只是换肤：它把主网页面的信息顺序、密度与组合方式对齐
 * 已确认的手机模板，同时让桌面端自然扩展。所有业务字段和按钮仍由原组件
 * 提供，本层只负责结构呈现。
 * -------------------------------------------------------------------------- */
html[data-astra-skin="violet"] .star-network-layout .page-shell {
  width: min(100%, 1240px);
  padding-inline: clamp(18px, 3vw, 42px);
}

@media (min-width: 721px) {
  html[data-astra-skin="violet"] .star-network-layout.app-shell {
    display: block;
    padding: 12px;
  }

  html[data-astra-skin="violet"] .star-network-layout .sidebar {
    position: sticky;
    z-index: 20;
    top: 12px;
    width: 100%;
    height: 60px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    padding: 7px 10px;
    border: 1px solid var(--star-line);
    border-radius: 14px;
  }

  html[data-astra-skin="violet"] .star-network-layout .brand {
    width: 116px;
    flex: 0 0 auto;
    padding: 0 8px;
  }

  html[data-astra-skin="violet"] .star-network-layout .brand-logo {
    width: 96px;
  }

  html[data-astra-skin="violet"] .star-network-layout .nav-caption,
html[data-astra-skin="violet"] .star-network-layout .sidebar-foot {
    display: none;
  }

  html[data-astra-skin="violet"] .star-network-layout .navigation {
    display: flex;
    flex: 1 1 auto;
    flex-direction: row;
    gap: 4px;
  }

  html[data-astra-skin="violet"] .star-network-layout .nav-item {
    width: auto;
    min-width: 112px;
    justify-content: center;
    gap: 7px;
    padding: 10px 12px;
  }

  html[data-astra-skin="violet"] .star-network-layout .nav-item.active::before {
    width: 24px;
    height: 2px;
    inset: auto auto 3px 50%;
    transform: translateX(-50%);
  }

  html[data-astra-skin="violet"] .star-network-layout .sidebar-bottom {
    margin: 0 0 0 auto;
  }

  html[data-astra-skin="violet"] .star-network-layout .network-card {
    min-width: 174px;
    padding: 8px 10px;
  }

  html[data-astra-skin="violet"] .star-network-layout .network-card small {
    margin-top: 2px;
  }

  html[data-astra-skin="violet"] .star-network-layout .topbar {
    position: sticky;
    z-index: 18;
    top: 84px;
    height: 58px;
    margin-top: 8px;
    padding-inline: 18px;
  }
}

html[data-astra-skin="violet"] .star-network-brand {
  display: grid;
  gap: 3px;
  padding: 0;
  border: 0;
  color: inherit;
  text-align: left;
  background: transparent;
  cursor: pointer;
}

html[data-astra-skin="violet"] .star-network-brand small {
  color: var(--star-faint);
  font-size: 10px;
  letter-spacing: 0.12em;
}

html[data-astra-skin="violet"] .star-network-brand strong {
  color: var(--star-platinum);
  font-size: 17px;
  font-weight: 560;
  letter-spacing: 0.04em;
}

html[data-astra-skin="violet"] .star-template-page {
  display: grid;
  gap: 12px;
}

html[data-astra-skin="violet"] .star-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin: 2px 0 6px;
}

html[data-astra-skin="violet"] .star-page-heading::before {
  content: none;
}

html[data-astra-skin="violet"] .star-page-heading > div:first-child {
  min-width: 0;
}

html[data-astra-skin="violet"] .star-page-heading h1 {
  margin: 0;
  font-size: clamp(27px, 3vw, 38px);
  font-weight: 520;
  letter-spacing: -0.035em;
}

html[data-astra-skin="violet"] .star-page-heading p {
  margin: 7px 0 0;
}

html[data-astra-skin="violet"] .star-page-status {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border: 1px solid var(--star-line);
  border-radius: 999px;
  color: var(--star-muted);
  background: rgba(15, 23, 43, 0.76);
  font-size: 12px;
}

html[data-astra-skin="violet"] .star-page-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--star-lilac-strong), var(--star-blue));
  box-shadow: 0 0 12px rgba(155, 124, 246, 0.46);
}

html[data-astra-skin="violet"] .star-market-hero,
html[data-astra-skin="violet"] .star-balance-hero,
html[data-astra-skin="violet"] .star-packages-summary,
html[data-astra-skin="violet"] .star-team-overview {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(181, 169, 235, 0.2);
  border-radius: 16px;
  color: var(--star-platinum);
  background:
    radial-gradient(circle at 82% 10%, rgba(173, 143, 255, 0.22), transparent 28%),
    radial-gradient(circle at 92% 80%, rgba(105, 166, 255, 0.11), transparent 30%),
    linear-gradient(135deg, rgba(22, 29, 56, 0.97), rgba(10, 15, 31, 0.98));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

html[data-astra-skin="violet"] .star-market-hero,
html[data-astra-skin="violet"] .star-balance-hero {
  min-height: 154px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 26px;
}

html[data-astra-skin="violet"] .star-market-hero small,
html[data-astra-skin="violet"] .star-balance-hero small,
html[data-astra-skin="violet"] .star-packages-summary small {
  color: var(--star-muted);
  font-size: 12px;
}

html[data-astra-skin="violet"] .star-market-hero strong,
html[data-astra-skin="violet"] .star-balance-hero strong,
html[data-astra-skin="violet"] .star-packages-summary > div:first-child > strong {
  display: block;
  margin: 7px 0 4px;
  font-size: clamp(30px, 4vw, 46px);
  font-weight: 520;
  letter-spacing: -0.04em;
}

html[data-astra-skin="violet"] .star-market-hero strong em,
html[data-astra-skin="violet"] .star-balance-hero strong em,
html[data-astra-skin="violet"] .star-packages-summary strong em {
  color: var(--star-platinum-soft);
  font-size: 0.4em;
  font-style: normal;
  letter-spacing: 0;
}

html[data-astra-skin="violet"] .star-market-hero p,
html[data-astra-skin="violet"] .star-balance-hero p,
html[data-astra-skin="violet"] .star-packages-summary p {
  margin: 0;
  color: var(--star-muted);
  font-size: 13px;
}

html[data-astra-skin="violet"] .star-orbit-mark {
  position: relative;
  width: 210px;
  height: 104px;
  flex: 0 0 auto;
}

html[data-astra-skin="violet"] .star-orbit-mark i {
  position: absolute;
  border: 1px solid rgba(199, 180, 255, 0.28);
  border-radius: 50%;
}

html[data-astra-skin="violet"] .star-orbit-mark i:nth-child(1) {
  inset: 9px 2px 12px 7px;
  transform: rotate(-18deg);
  animation: star-template-orbit-violet 20s linear infinite;
}

html[data-astra-skin="violet"] .star-orbit-mark i:nth-child(2) {
  width: 88px;
  height: 88px;
  top: 8px;
  right: 35px;
  border-color: rgba(105, 166, 255, 0.24);
  animation: star-template-orbit-violet 26s linear infinite reverse;
}

html[data-astra-skin="violet"] .star-orbit-mark i:nth-child(3) {
  width: 8px;
  height: 8px;
  top: 25px;
  right: 61px;
  border: 0;
  background: #eee9ff;
  box-shadow: 0 0 18px rgba(155, 124, 246, 0.9), 0 0 28px rgba(105, 166, 255, 0.3);
  animation: star-template-node-violet 4.8s ease-in-out infinite;
}

@keyframes star-template-orbit-violet { to { transform: rotate(342deg); } }
@keyframes star-template-node-violet { 50% { opacity: 0.45; transform: translateY(7px); } }

html[data-astra-skin="violet"] .star-market-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="violet"] .star-market-metrics > div,
html[data-astra-skin="violet"] .star-packages-summary-facts > span,
html[data-astra-skin="violet"] .star-team-facts > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(189, 180, 235, 0.14);
  border-radius: 9px;
  background: rgba(13, 21, 41, 0.72);
}

html[data-astra-skin="violet"] .star-market-metrics span,
html[data-astra-skin="violet"] .star-packages-summary-facts span,
html[data-astra-skin="violet"] .star-team-facts span {
  display: block;
  color: var(--star-muted);
  font-size: 11px;
}

html[data-astra-skin="violet"] .star-market-metrics strong,
html[data-astra-skin="violet"] .star-packages-summary-facts strong,
html[data-astra-skin="violet"] .star-team-facts strong {
  display: block;
  margin-top: 5px;
  overflow-wrap: anywhere;
  color: var(--star-platinum);
  font-size: 15px;
  font-weight: 520;
}

html[data-astra-skin="violet"] .star-template-market .mainnet-account-toolbar {
  margin: 0;
}

html[data-astra-skin="violet"] .star-template-market .auto-buy-panel {
  padding: 14px 16px;
  border-radius: 10px;
  border-left: 2px solid rgba(166, 135, 255, 0.68);
}

html[data-astra-skin="violet"] .star-template-market .auto-buy-panel .panel-heading {
  margin-bottom: 6px;
}

html[data-astra-skin="violet"] .star-template-market .market-zone-tabs {
  width: fit-content;
  margin: 2px 0 0;
  padding: 4px;
  border-radius: 12px;
}

html[data-astra-skin="violet"] .star-template-market .market-zone-tabs button {
  min-width: 112px;
  padding: 9px 15px;
  border-radius: 9px;
}

html[data-astra-skin="violet"] .star-template-market .market-zone-tabs button.active {
  color: #0b0e19;
  background: linear-gradient(135deg, #e3d9ff, #b79cff 55%, #8ab9ff);
}

html[data-astra-skin="violet"] .star-template-market .mainnet-market-zone {
  padding: 16px;
  border-radius: 14px;
}

html[data-astra-skin="violet"] .star-template-market .market-zone-heading {
  display: flex;
  margin-bottom: 10px;
}

html[data-astra-skin="violet"] .star-template-market .market-zone-heading .position-id {
  display: none;
}

html[data-astra-skin="violet"] .star-template-market .market-zone-heading h2 {
  margin-bottom: 2px;
  font-size: 16px;
}

html[data-astra-skin="violet"] .star-template-market .market-zone-heading p {
  font-size: 11px;
}

html[data-astra-skin="violet"] .star-template-market .market-price-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 11px;
}

html[data-astra-skin="violet"] .star-template-market .market-price-search-hint {
  margin: 0;
  text-align: right;
}

html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-list {
  max-width: none;
}

html[data-astra-skin="violet"] .star-template-market .mainnet-market-item {
  border-radius: 10px;
  border-left: 2px solid rgba(166, 135, 255, 0.68);
  box-shadow: none;
}

html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-select {
  grid-template-columns: minmax(180px, 1.5fr) minmax(120px, 0.7fr) auto;
  min-height: 68px;
  padding: 9px 12px;
}

html[data-astra-skin="violet"] .star-template-market .mainnet-market-buy-label {
  min-width: 82px;
  justify-content: center;
  padding: 9px 11px;
  border-radius: 9px;
  color: #0b0e19;
  background: linear-gradient(135deg, #e3d9ff, #b79cff 55%, #8ab9ff);
}

html[data-astra-skin="violet"] .star-balance-hero {
  min-height: 142px;
}

html[data-astra-skin="violet"] .star-secondary-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="violet"] .star-secondary-metrics .metric-card {
  min-height: 112px;
  padding: 14px;
  border-radius: 9px;
}

html[data-astra-skin="violet"] .star-secondary-metrics .metric-value {
  margin-top: 10px;
  font-size: clamp(22px, 2.6vw, 30px);
}

html[data-astra-skin="violet"] .star-asset-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

html[data-astra-skin="violet"] .star-asset-actions > .surface-panel {
  min-width: 0;
  margin: 0;
  padding: 16px;
  border-radius: 12px;
}

html[data-astra-skin="violet"] .star-asset-actions .panel-heading {
  align-items: flex-start;
}

html[data-astra-skin="violet"] .star-asset-actions .inline-actions {
  margin-top: 12px;
}

html[data-astra-skin="violet"] .star-packages-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  align-items: center;
  gap: 24px;
  padding: 22px 24px;
}

html[data-astra-skin="violet"] .star-packages-summary-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="violet"] .star-template-packages .package-list-panel {
  padding: 16px;
}

html[data-astra-skin="violet"] .star-template-packages .position-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card {
  min-width: 0;
  margin: 0;
  border-radius: 12px;
  border-left: 2px solid rgba(166, 135, 255, 0.68);
}

html[data-astra-skin="violet"] .star-template-packages .position-details {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-astra-skin="violet"] .star-team-overview {
  padding: 20px;
}

html[data-astra-skin="violet"] .star-team-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

html[data-astra-skin="violet"] .star-team-level {
  width: 62px;
  height: 62px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 18px;
  color: #0b0e19;
  background: linear-gradient(145deg, #f5f1ff, #c7b4ff 58%, #9fc7ff);
  box-shadow: 0 0 28px rgba(155, 124, 246, 0.25);
  font-size: 21px;
  font-weight: 560;
}

html[data-astra-skin="violet"] .star-team-invite {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 3px 12px;
  text-align: right;
}

html[data-astra-skin="violet"] .star-team-invite small {
  grid-column: 1 / -1;
  color: var(--star-muted);
  font-size: 11px;
}

html[data-astra-skin="violet"] .star-team-invite strong {
  overflow: hidden;
  color: var(--star-platinum);
  font-size: 17px;
  text-overflow: ellipsis;
}

html[data-astra-skin="violet"] .star-team-level-note {
  margin: 8px 0 12px;
  color: var(--star-muted);
  font-size: 12px;
}

html[data-astra-skin="violet"] .star-team-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="violet"] .star-inline-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
  padding: 0;
  border: 0;
  color: var(--star-lilac-strong);
  background: transparent;
  font-weight: 600;
  cursor: pointer;
}

html[data-astra-skin="violet"] .star-team-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
  padding: 11px 12px;
  border: 1px solid var(--star-line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.035);
}

html[data-astra-skin="violet"] .star-team-link > div {
  min-width: 0;
}

html[data-astra-skin="violet"] .star-team-link span {
  color: var(--star-muted);
  font-size: 11px;
}

html[data-astra-skin="violet"] .star-team-link p {
  margin: 3px 0 0;
  overflow: hidden;
  color: var(--star-platinum-soft);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-astra-skin="violet"] .star-template-team .mainnet-readonly-panel {
  border-radius: 12px;
}

html[data-astra-skin="violet"] .star-template-admin .mainnet-admin-panel {
  display: grid;
  gap: 10px;
}

html[data-astra-skin="violet"] .star-template-admin .mainnet-admin-identity {
  margin: 0;
  padding: 11px 13px;
  border-radius: 10px;
}

html[data-astra-skin="violet"] .star-template-admin .admin-tabs,
html[data-astra-skin="violet"] .star-template-admin .mainnet-admin-data-tabs {
  position: sticky;
  top: 76px;
  z-index: 5;
  margin: 0;
  padding: 4px;
  border-radius: 11px;
}

html[data-astra-skin="violet"] .star-template-admin .mainnet-admin-data-dashboard,
html[data-astra-skin="violet"] .star-template-admin .mainnet-admin-section,
html[data-astra-skin="violet"] .star-template-admin .admin-panel {
  border-radius: 12px;
}

html[data-astra-skin="violet"] .star-template-admin .mainnet-admin-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

html[data-astra-skin="violet"] .star-template-admin .metrics-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="violet"] .star-template-admin .metric-card {
  min-height: 104px;
  padding: 13px;
  border-radius: 10px;
}

@media (max-width: 980px) {
  html[data-astra-skin="violet"] .star-template-packages .position-list,
html[data-astra-skin="violet"] .star-asset-actions,
html[data-astra-skin="violet"] .star-template-admin .mainnet-admin-grid {
    grid-template-columns: 1fr;
  }

  html[data-astra-skin="violet"] .star-template-admin .metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  html[data-astra-skin="violet"] .star-network-layout {
    padding: 0;
  }

  html[data-astra-skin="violet"] .star-network-layout .main-shell {
    min-width: 0;
  }

  html[data-astra-skin="violet"] .star-network-layout .topbar {
    height: 76px;
    padding: 14px 16px 10px;
    border: 0;
    border-radius: 0;
    background: rgba(9, 14, 30, 0.9);
    backdrop-filter: blur(18px);
  }

  html[data-astra-skin="violet"] .star-network-layout .topbar-actions {
    gap: 6px;
  }

  html[data-astra-skin="violet"] .star-network-layout .demo-chip {
    display: none;
  }

  html[data-astra-skin="violet"] .star-network-layout .language-switch {
    min-width: 34px;
  }

  html[data-astra-skin="violet"] .star-network-layout .page-shell {
    width: 100%;
    padding: 6px 16px calc(92px + env(safe-area-inset-bottom));
  }

  html[data-astra-skin="violet"] .star-template-page {
    gap: 10px;
  }

  html[data-astra-skin="violet"] .star-page-heading {
    align-items: flex-end;
    margin: 2px 0 5px;
  }

  html[data-astra-skin="violet"] .star-page-heading h1 {
    font-size: 26px;
    font-weight: 520;
  }

  html[data-astra-skin="violet"] .star-page-heading p {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.45;
  }

  html[data-astra-skin="violet"] .star-page-status {
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 11px;
  }

  html[data-astra-skin="violet"] .star-market-hero,
html[data-astra-skin="violet"] .star-balance-hero {
    min-height: 126px;
    padding: 16px;
  }

  html[data-astra-skin="violet"] .star-market-hero strong,
html[data-astra-skin="violet"] .star-balance-hero strong,
html[data-astra-skin="violet"] .star-packages-summary > div:first-child > strong {
    font-size: 30px;
  }

  html[data-astra-skin="violet"] .star-orbit-mark {
    width: 118px;
    height: 82px;
    margin-right: -18px;
  }

  html[data-astra-skin="violet"] .star-market-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="violet"] .star-template-market .auto-buy-panel {
    padding: 12px;
  }

  html[data-astra-skin="violet"] .star-template-market .auto-buy-panel .mainnet-readonly-note,
html[data-astra-skin="violet"] .star-template-market .auto-buy-panel .mainnet-inline-note {
    font-size: 11px;
  }

  html[data-astra-skin="violet"] .star-template-market .market-zone-tabs {
    width: 100%;
  }

  html[data-astra-skin="violet"] .star-template-market .market-zone-tabs button {
    flex: 1;
    min-width: 0;
  }

  html[data-astra-skin="violet"] .star-template-market .mainnet-market-zone {
    padding: 11px;
  }

  html[data-astra-skin="violet"] .star-template-market .market-price-toolbar {
    display: block;
  }

  html[data-astra-skin="violet"] .star-template-market .market-price-search-hint {
    margin-top: 8px;
    text-align: left;
  }

  html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-select {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 64px;
    gap: 4px 10px;
    padding: 10px 11px;
  }

  html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-select > span:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1;
  }

  html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-select > span:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
  }

  html[data-astra-skin="violet"] .star-template-market .mainnet-market-buy-label {
    grid-column: 2;
    grid-row: 2;
    min-width: 68px;
    padding: 7px 9px;
  }

  html[data-astra-skin="violet"] .star-secondary-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html[data-astra-skin="violet"] .star-secondary-metrics .metric-card {
    min-height: 94px;
    padding: 10px 9px;
  }

  html[data-astra-skin="violet"] .star-secondary-metrics .metric-top {
    font-size: 10px;
  }

  html[data-astra-skin="violet"] .star-secondary-metrics .metric-top svg {
    display: none;
  }

  html[data-astra-skin="violet"] .star-secondary-metrics .metric-note {
    margin-top: 6px;
    font-size: 9px;
    line-height: 1.35;
  }

  html[data-astra-skin="violet"] .star-secondary-metrics .metric-value {
    font-size: 18px;
  }

  html[data-astra-skin="violet"] .star-secondary-metrics .metric-value small {
    display: block;
    margin: 3px 0 0;
    font-size: 9px;
  }

  html[data-astra-skin="violet"] .star-asset-actions {
    grid-template-columns: 1fr;
  }

  html[data-astra-skin="violet"] .star-asset-actions > .surface-panel {
    padding: 13px;
    border-radius: 10px;
    border-left: 2px solid rgba(166, 135, 255, 0.58);
  }

  html[data-astra-skin="violet"] .star-packages-summary {
    grid-template-columns: 1fr;
    gap: 13px;
    padding: 16px;
  }

  html[data-astra-skin="violet"] .star-packages-summary-facts,
html[data-astra-skin="violet"] .star-template-packages .position-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card {
    grid-column: 1 / -1;
  }

  html[data-astra-skin="violet"] .star-template-packages .position-details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="violet"] .star-team-overview {
    padding: 15px;
  }

  html[data-astra-skin="violet"] .star-team-level {
    width: 56px;
    height: 56px;
  }

  html[data-astra-skin="violet"] .star-team-invite {
    grid-template-columns: 1fr;
  }

  html[data-astra-skin="violet"] .star-team-invite small {
    grid-column: auto;
  }

  html[data-astra-skin="violet"] .star-team-invite .button {
    justify-self: end;
  }

  html[data-astra-skin="violet"] .star-team-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="violet"] .star-team-link {
    align-items: flex-end;
  }

  html[data-astra-skin="violet"] .star-template-team .mainnet-data-table {
    min-width: 620px;
  }

  html[data-astra-skin="violet"] .star-template-admin .admin-tabs,
html[data-astra-skin="violet"] .star-template-admin .mainnet-admin-data-tabs {
    top: 76px;
    overflow-x: auto;
  }

  html[data-astra-skin="violet"] .star-template-admin .metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="violet"] .star-network-layout .mobile-nav {
    left: 10px;
    right: 10px;
    bottom: calc(8px + env(safe-area-inset-bottom));
    height: 66px;
    padding: 7px 8px;
    border: 1px solid var(--star-line);
    border-radius: 18px;
  }

  html[data-astra-skin="violet"] .star-network-layout .page-footer {
    display: none;
  }
}

@media (max-width: 420px) {
  html[data-astra-skin="violet"] .star-network-layout .topbar {
    padding-inline: 14px;
  }

  html[data-astra-skin="violet"] .star-network-layout .page-shell {
    padding-inline: 14px;
  }

  html[data-astra-skin="violet"] .star-network-brand small {
    font-size: 9px;
  }

  html[data-astra-skin="violet"] .star-network-brand strong {
    font-size: 15px;
  }

  html[data-astra-skin="violet"] .star-team-link {
    display: grid;
  }

  html[data-astra-skin="violet"] .star-team-link .button {
    width: 100%;
  }
}
/* Shared structure for both selectable Starrail skins. */

/* The mobile skin select is an invisible control stretched over this label.
   Give it an explicit containing block so it cannot cover the wallet button. */
.star-network-layout .appearance-switch {
  position: relative;
  isolation: isolate;
  flex: 0 0 auto;
  overflow: hidden;
}

.star-market-metrics > div {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* Compact mainnet masthead: the wallet stays inside the viewport at every width. */
.star-network-layout .star-network-brand {
  min-width: 0;
  flex: 0 0 auto;
}

.star-network-layout .star-network-brand strong,
html[data-astra-skin="violet"] .star-network-brand strong {
  color: transparent;
  background: linear-gradient(112deg, #d5b9ff 4%, #9f7bea 46%, #65a9ff 96%);
  background-clip: text;
  -webkit-background-clip: text;
  font-size: 18px;
  font-weight: 720;
  letter-spacing: .12em;
  text-shadow: 0 0 24px rgba(137, 102, 231, .18);
}

.star-network-layout .topbar {
  min-width: 0;
}

.star-network-layout .topbar-actions {
  min-width: 0;
  max-width: calc(100% - 92px);
  margin-left: auto;
  justify-content: flex-end;
}

.star-network-layout .connected-wallet-actions,
.star-network-layout .wallet-account-button {
  min-width: 0;
}

.star-network-layout .wallet-account-button {
  max-width: min(230px, 34vw);
}

.star-network-layout .wallet-account-button > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .star-network-layout .topbar-actions {
    width: auto;
    max-width: calc(100% - 80px);
  }

  .star-network-layout .connected-wallet-actions {
    flex: 1 1 auto;
    justify-content: flex-end;
  }

  .star-network-layout .wallet-account-button,
  .star-network-layout .wallet-connect-button {
    max-width: min(190px, calc(100vw - 148px));
  }
}

@media (max-width: 390px) {
  .star-network-layout .star-network-brand strong,
  html[data-astra-skin="violet"] .star-network-brand strong {
    font-size: 16px;
    letter-spacing: .08em;
  }

  .star-network-layout .wallet-account-button,
  .star-network-layout .wallet-connect-button {
    max-width: calc(100vw - 138px);
    padding-inline: 9px;
  }
}

.star-market-metrics > div > span:not(.star-metric-orbit),
.star-market-metrics > div > strong {
  position: relative;
  z-index: 2;
}

.star-metric-orbit {
  position: absolute;
  z-index: 1;
  right: 7px;
  bottom: 5px;
  width: 88px;
  height: 52px;
  pointer-events: none;
  opacity: 0.7;
}

.star-metric-orbit i {
  position: absolute;
  display: block;
  border: 1px solid var(--star-line-strong);
  border-radius: 50%;
}

.star-metric-orbit i:nth-child(1) {
  width: 78px;
  height: 32px;
  left: 3px;
  top: 10px;
  transform: rotate(-18deg);
  animation: market-metric-line-pulse 6.4s ease-in-out infinite;
}

.star-metric-orbit i:nth-child(2) {
  width: 42px;
  height: 42px;
  top: 5px;
  right: 7px;
  border-color: var(--star-line);
  animation: market-metric-line-pulse 7.8s ease-in-out infinite reverse;
}

.star-metric-orbit i:nth-child(3) {
  width: 44px;
  height: 32px;
  top: 10px;
  right: 11px;
  border: 0;
  border-radius: 0;
  animation: market-metric-node-orbit 7.2s linear infinite;
}

.star-metric-orbit i:nth-child(3)::after {
  content: '';
  position: absolute;
  top: 0;
  right: 4px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--star-lilac-strong);
  box-shadow: 0 0 12px var(--star-lilac-strong);
}

.star-market-metrics > div:nth-child(2) .star-metric-orbit i:nth-child(3) {
  animation-direction: reverse;
}

@keyframes market-metric-line-pulse {
  50% { opacity: 0.46; }
}

@keyframes market-metric-node-orbit {
  to { transform: rotate(360deg); }
}

.star-template-market .market-range-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.star-template-market .market-range-form .market-price-search {
  width: auto;
  min-width: 0;
}

.star-template-market .market-range-form .market-price-search input {
  width: 100%;
  min-width: 0;
}

.star-template-market .market-range-form .button,
.star-template-market .market-range-form .market-price-clear,
.star-template-market .market-range-separator {
  white-space: nowrap;
}

/* Reference-UI orbital motion, kept visual-only so it cannot add a
   business field, market value, or transaction control to the real DApp. */
.mainnet-cosmic-hero {
  position: relative;
  min-height: 248px;
  margin: -2px 0 0;
  overflow: hidden;
  border: 1px solid var(--star-line);
  border-radius: var(--radius-card);
  background:
    radial-gradient(circle at 50% 52%, color-mix(in srgb, var(--star-lilac) 14%, transparent), transparent 24%),
    linear-gradient(135deg, color-mix(in srgb, var(--star-surface) 94%, transparent), color-mix(in srgb, var(--star-surface-raised) 78%, transparent));
  box-shadow: var(--shadow-card);
  isolation: isolate;
}

.mainnet-cosmic-hero::before,
.mainnet-cosmic-hero::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 82%;
  height: 1px;
  z-index: 0;
  background: linear-gradient(90deg, transparent, var(--star-line-strong), var(--star-info), transparent);
  opacity: .56;
  transform: translate(-50%, -50%) rotate(24deg);
}

.mainnet-cosmic-hero::after {
  transform: translate(-50%, -50%) rotate(-31deg);
  opacity: .38;
}

.mainnet-cosmic-orbit-system {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 214px;
  height: 214px;
  z-index: 1;
  transform: translate(-50%, -50%);
}

.mainnet-cosmic-ring {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  border: 1px solid var(--star-line-strong);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(0deg);
  background: conic-gradient(from 0deg, transparent, var(--star-lilac-strong), transparent 32%, var(--star-info), transparent 66%, var(--star-lilac));
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 1px), #000 calc(100% - 1px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 1px), #000 calc(100% - 1px));
}

.mainnet-cosmic-ring-outer { width: 214px; height: 214px; animation: mainnet-cosmic-spin 26s linear infinite; opacity: .54; }
.mainnet-cosmic-ring-middle { width: 146px; height: 146px; animation: mainnet-cosmic-spin 18s linear infinite reverse; opacity: .78; }
.mainnet-cosmic-ring-inner { width: 82px; height: 82px; animation: mainnet-cosmic-spin 11s linear infinite; opacity: .88; }

.mainnet-cosmic-core {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: 66px;
  height: 66px;
  z-index: 3;
  overflow: hidden;
  border: 1px solid var(--star-line-strong);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 28%, var(--star-platinum), color-mix(in srgb, var(--star-lilac) 56%, var(--star-surface)) 74%);
  box-shadow: 0 0 0 10px color-mix(in srgb, var(--star-lilac) 10%, transparent), 0 0 35px color-mix(in srgb, var(--star-info) 36%, transparent);
  transform: translate(-50%, -50%);
  animation: mainnet-cosmic-pulse 3.8s ease-in-out infinite;
}

.mainnet-cosmic-core img { width: 48px; height: 48px; object-fit: contain; filter: drop-shadow(0 0 9px color-mix(in srgb, var(--star-info) 65%, transparent)); }

.mainnet-cosmic-planet {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  z-index: 2;
  border-radius: 50%;
  transform-origin: 0 0;
}

.mainnet-cosmic-planet-one { width: 9px; height: 9px; background: var(--star-lilac-strong); box-shadow: 0 0 14px var(--star-lilac-strong); transform: rotate(12deg) translateX(72px); animation: mainnet-cosmic-planet-one 8s linear infinite; }
.mainnet-cosmic-planet-two { width: 7px; height: 7px; background: var(--star-info); box-shadow: 0 0 12px var(--star-info); transform: rotate(140deg) translateX(104px); animation: mainnet-cosmic-planet-two 13s linear infinite reverse; }
.mainnet-cosmic-planet-three { width: 6px; height: 6px; background: var(--star-success); box-shadow: 0 0 11px var(--star-success); transform: rotate(250deg) translateX(104px); animation: mainnet-cosmic-planet-three 17s linear infinite; }
.mainnet-cosmic-planet-four { width: 8px; height: 8px; background: var(--star-warning); box-shadow: 0 0 12px var(--star-warning); transform: rotate(314deg) translateX(72px); animation: mainnet-cosmic-planet-four 10s linear infinite reverse; }

.mainnet-cosmic-orbit-labels { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.mainnet-cosmic-orbit-labels span { position: absolute; display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border: 1px solid var(--star-line); border-radius: 999px; color: var(--star-muted); background: color-mix(in srgb, var(--star-surface) 82%, transparent); box-shadow: 0 7px 18px color-mix(in srgb, var(--star-bg) 22%, transparent); font-size: 10px; font-weight: 680; letter-spacing: .04em; animation: mainnet-cosmic-label-float 4.2s ease-in-out infinite; }
.mainnet-cosmic-orbit-labels i { color: var(--star-lilac-strong); font-style: normal; }
.mainnet-cosmic-orbit-labels span:nth-child(1) { top: 20%; left: 10%; }
.mainnet-cosmic-orbit-labels span:nth-child(2) { top: 17%; right: 10%; animation-delay: -.8s; }
.mainnet-cosmic-orbit-labels span:nth-child(3) { bottom: 18%; left: 11%; animation-delay: -1.7s; }
.mainnet-cosmic-orbit-labels span:nth-child(4) { bottom: 17%; right: 11%; animation-delay: -2.6s; }
.mainnet-cosmic-orbit-labels span:nth-child(5) { top: 7%; left: 50%; transform: translateX(-50%); animation-delay: -3.5s; }

@keyframes mainnet-cosmic-spin { to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes mainnet-cosmic-pulse { 50% { box-shadow: 0 0 0 15px color-mix(in srgb, var(--star-lilac) 14%, transparent), 0 0 52px color-mix(in srgb, var(--star-info) 48%, transparent); } }
@keyframes mainnet-cosmic-label-float { 50% { margin-top: -6px; } }
@keyframes mainnet-cosmic-planet-one { to { transform: rotate(372deg) translateX(72px); } }
@keyframes mainnet-cosmic-planet-two { to { transform: rotate(-220deg) translateX(104px); } }
@keyframes mainnet-cosmic-planet-three { to { transform: rotate(610deg) translateX(104px); } }
@keyframes mainnet-cosmic-planet-four { to { transform: rotate(-46deg) translateX(72px); } }

@media (max-width: 720px) {
  .mainnet-cosmic-hero { min-height: 206px; }
  .mainnet-cosmic-orbit-system { transform: translate(-50%, -50%) scale(.78); }
  .mainnet-cosmic-orbit-labels span { font-size: 9px; padding: 4px 7px; }
  .mainnet-cosmic-orbit-labels span:nth-child(1) { left: 5%; }
  .mainnet-cosmic-orbit-labels span:nth-child(2) { right: 5%; }
  .mainnet-cosmic-orbit-labels span:nth-child(3) { left: 5%; }
  .mainnet-cosmic-orbit-labels span:nth-child(4) { right: 5%; }
}

@media (prefers-reduced-motion: reduce) {
  .mainnet-cosmic-ring,
  .mainnet-cosmic-core,
  .mainnet-cosmic-planet,
  .mainnet-cosmic-orbit-labels span { animation: none !important; }
}

/* Cosmic Forge reference composition: a visual hero card followed by the
   real market cards. No mock values or additional actions are introduced. */
.star-template-market .mainnet-cosmic-hero {
  min-height: 430px;
  padding: 36px 20px 0;
  background:
    radial-gradient(circle at 50% 75%, color-mix(in srgb, var(--star-lilac) 15%, transparent), transparent 31%),
    linear-gradient(135deg, color-mix(in srgb, var(--star-surface) 95%, transparent), color-mix(in srgb, var(--star-surface-raised) 82%, transparent));
}

.mainnet-cosmic-hero-copy {
  position: relative;
  z-index: 5;
  max-width: 690px;
  margin: 0 auto;
  text-align: center;
}

.mainnet-cosmic-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 14px;
  border: 1px solid var(--star-line-strong);
  border-radius: 999px;
  color: var(--star-lilac-strong);
  background: color-mix(in srgb, var(--star-lilac) 12%, transparent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .05em;
}

.mainnet-cosmic-hero-tag::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--star-info);
  box-shadow: 0 0 11px var(--star-info);
  animation: mainnet-cosmic-dot-pulse 1.7s ease-in-out infinite;
}

.mainnet-cosmic-hero-copy h2 {
  margin: 18px 0 9px;
  color: transparent;
  background: linear-gradient(135deg, var(--star-lilac-strong), var(--star-info));
  background-clip: text;
  -webkit-background-clip: text;
  font-size: clamp(30px, 4.7vw, 52px);
  line-height: 1.12;
  letter-spacing: .02em;
}

.mainnet-cosmic-hero-copy p {
  max-width: 680px;
  margin: 0 auto;
  color: var(--star-muted);
  font-size: 13px;
  line-height: 1.7;
}

.mainnet-cosmic-orbit-wrap {
  position: relative;
  height: 266px;
  max-width: 600px;
  margin: 10px auto 0;
}

.mainnet-cosmic-orbit-system {
  width: 360px;
  height: 360px;
}

.mainnet-cosmic-ring-outer { width: 360px; height: 360px; }
.mainnet-cosmic-ring-middle { width: 240px; height: 240px; }
.mainnet-cosmic-ring-inner { width: 126px; height: 126px; }

.mainnet-cosmic-core {
  width: 112px;
  height: 112px;
  border-color: color-mix(in srgb, var(--star-lilac) 44%, var(--star-line-strong));
  background: radial-gradient(circle at 35% 28%, color-mix(in srgb, var(--star-platinum) 98%, transparent), color-mix(in srgb, var(--star-lilac) 38%, var(--star-surface)) 64%, color-mix(in srgb, var(--star-info) 22%, var(--star-surface)));
  box-shadow: 0 0 0 14px color-mix(in srgb, var(--star-lilac) 9%, transparent), 0 0 50px color-mix(in srgb, var(--star-info) 40%, transparent), inset 0 0 26px color-mix(in srgb, var(--star-lilac) 18%, transparent);
}

.mainnet-cosmic-core::before {
  content: '✦';
  position: absolute;
  top: 20px;
  color: var(--star-lilac);
  font-size: 27px;
  text-shadow: 0 0 16px color-mix(in srgb, var(--star-lilac) 72%, transparent);
}

.mainnet-cosmic-core > span {
  position: relative;
  z-index: 1;
  color: var(--star-platinum);
  font-size: 13px;
  font-weight: 760;
  letter-spacing: .12em;
  transform: translateY(18px);
}

.mainnet-cosmic-core img { display: none; }
.mainnet-cosmic-orbit-labels span { background: color-mix(in srgb, var(--star-surface) 86%, transparent); }
.mainnet-cosmic-orbit-labels span:nth-child(1) { top: 28%; left: 7%; }
.mainnet-cosmic-orbit-labels span:nth-child(2) { top: 27%; right: 7%; }
.mainnet-cosmic-orbit-labels span:nth-child(3) { bottom: 22%; left: 5%; }
.mainnet-cosmic-orbit-labels span:nth-child(4) { bottom: 20%; right: 5%; }
.mainnet-cosmic-orbit-labels span:nth-child(5) { top: 4%; }

@keyframes mainnet-cosmic-dot-pulse { 50% { opacity: .48; transform: scale(.8); } }

/* Reference market-package-card structure, using only current DApp values. */
.star-template-market .mainnet-market-item-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  max-width: none;
}

.star-template-market .mainnet-market-item {
  position: relative;
  min-height: 276px;
  overflow: hidden;
  border: 1px solid var(--star-line);
  border-radius: 16px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--star-surface-raised) 96%, transparent), color-mix(in srgb, var(--star-surface) 96%, transparent));
  box-shadow: 0 10px 28px color-mix(in srgb, var(--star-bg) 18%, transparent);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.star-template-market .mainnet-market-item::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, var(--star-lilac), var(--star-info), var(--star-lilac));
  background-size: 200% 100%;
  animation: mainnet-market-flow-line 3.4s linear infinite;
}

.star-template-market .mainnet-market-item::after {
  content: '';
  position: absolute;
  left: -30%;
  top: 0;
  width: 22%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--star-info) 15%, transparent), transparent);
  transform: skewX(-18deg);
  animation: mainnet-market-scan 5.5s ease-in-out infinite;
}

.star-template-market .mainnet-market-item:hover {
  transform: translateY(-5px);
  border-color: var(--star-line-strong);
  box-shadow: 0 18px 40px color-mix(in srgb, var(--star-bg) 26%, transparent);
}

.star-template-market .mainnet-market-item-select {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto auto auto auto;
  align-content: start;
  width: 100%;
  min-height: 276px;
  gap: 8px 12px;
  padding: 20px;
  border: 0;
  color: var(--star-platinum-soft);
  background: transparent;
  text-align: left;
}

.star-template-market .mainnet-market-item-select:disabled { opacity: .82; }
.mainnet-market-item-topline { display: flex !important; grid-column: 1 / -1; align-items: center; justify-content: space-between; min-height: 13px; }
.mainnet-market-item-topline small { font-size: 10px; letter-spacing: .04em; }
.star-template-market .mainnet-market-item-id { grid-column: 1 / -1; min-width: 0; overflow: hidden; color: var(--star-platinum); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 17px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.mainnet-market-item-price { display: flex !important; grid-column: 1 / -1; align-items: baseline; gap: 7px; padding-top: 13px; border-top: 1px dashed var(--star-line); }
.mainnet-market-item-price small { font-size: 11px; }
.mainnet-market-item-price strong { color: var(--star-info) !important; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 27px; text-shadow: 0 0 14px color-mix(in srgb, var(--star-info) 28%, transparent); }
.mainnet-market-item-price em { color: var(--star-muted); font-size: 11px; font-style: normal; }
.mainnet-market-item-spark { display: block !important; grid-column: 1 / -1; height: 40px; margin-top: 4px; opacity: .72; background: linear-gradient(153deg, transparent 0 11%, var(--star-lilac) 12% 13%, transparent 14% 25%, var(--star-info) 26% 27%, transparent 28% 41%, var(--star-lilac) 42% 43%, transparent 44% 62%, var(--star-info) 63% 64%, transparent 65%); mask-image: linear-gradient(to right, #000 0 96%, transparent 100%); }
.star-template-market .mainnet-market-buy-label { display: inline-flex !important; grid-column: 1 / -1; align-items: center; justify-content: space-between; gap: 6px !important; min-height: 36px; margin-top: 3px; padding: 9px 11px; border: 1px solid var(--star-line); border-radius: 10px; color: var(--star-platinum) !important; background: color-mix(in srgb, var(--star-lilac) 15%, var(--star-surface)); font-size: 12px; font-weight: 720; }

@keyframes mainnet-market-flow-line { to { background-position: 200% 0; } }
@keyframes mainnet-market-scan { 0%, 23% { left: -30%; opacity: 0; } 45% { opacity: .72; } 76%, 100% { left: 112%; opacity: 0; } }

@media (max-width: 1080px) {
  .star-template-market .mainnet-market-item-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .star-template-market .mainnet-cosmic-hero { min-height: 352px; padding: 26px 13px 0; }
  .mainnet-cosmic-hero-copy h2 { margin-top: 14px; font-size: 31px; }
  .mainnet-cosmic-hero-copy p { font-size: 11px; }
  .mainnet-cosmic-orbit-wrap { height: 218px; margin-top: 5px; }
  .mainnet-cosmic-orbit-system { transform: translate(-50%, -50%) scale(.72); }
  .mainnet-cosmic-orbit-labels span:nth-child(1) { top: 27%; left: 0; }
  .mainnet-cosmic-orbit-labels span:nth-child(2) { top: 26%; right: 0; }
  .mainnet-cosmic-orbit-labels span:nth-child(3) { bottom: 18%; left: 0; }
  .mainnet-cosmic-orbit-labels span:nth-child(4) { bottom: 17%; right: 0; }
  .star-template-market .mainnet-market-item-list { grid-template-columns: 1fr; gap: 12px; }
  .star-template-market .mainnet-market-item,
  .star-template-market .mainnet-market-item-select { min-height: 258px; }
}

@media (prefers-reduced-motion: reduce) {
  .mainnet-cosmic-hero-tag::before,
  .star-template-market .mainnet-market-item::before,
  .star-template-market .mainnet-market-item::after { animation: none !important; }
}

/* Theme files are loaded after this shared sheet. Keep these reference
   composition rules scoped with the skin selector so the selectable skins do
   not turn the visual Hero back into a framed panel or compact list. */
html[data-astra-skin] .star-template-market .mainnet-cosmic-hero,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-hero {
  min-height: 520px;
  padding: 48px 20px 28px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* The reference uses the global cosmic canvas for motion. Keep the Hero free
   of decorative cross-lines and add three short, isolated meteor trails. */
html[data-astra-skin] .star-template-market .mainnet-cosmic-hero::before,
html[data-astra-skin] .star-template-market .mainnet-cosmic-hero::after,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-hero::before,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-hero::after { content: none; }

.mainnet-cosmic-meteors { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.mainnet-cosmic-meteors i { position: absolute; display: block; width: 112px; height: 2px; border-radius: 999px; opacity: 0; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--star-info) 82%, transparent), transparent); filter: drop-shadow(0 0 5px color-mix(in srgb, var(--star-info) 65%, transparent)); transform: rotate(32deg); animation: mainnet-cosmic-meteor 6.8s ease-in infinite; }
.mainnet-cosmic-meteors i:nth-child(1) { top: 18%; left: 9%; animation-delay: -1.3s; }
.mainnet-cosmic-meteors i:nth-child(2) { top: 38%; left: 72%; width: 90px; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--star-lilac) 82%, transparent), transparent); animation-delay: -4.6s; animation-duration: 8.2s; }
.mainnet-cosmic-meteors i:nth-child(3) { top: 66%; left: 24%; width: 76px; animation-delay: -6.1s; animation-duration: 9.6s; }
@keyframes mainnet-cosmic-meteor { 0%, 64% { opacity: 0; transform: translate3d(-30px, -18px, 0) rotate(32deg); } 70% { opacity: .9; } 86% { opacity: .38; } 100% { opacity: 0; transform: translate3d(170px, 98px, 0) rotate(32deg); } }

html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-wrap,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-wrap {
  height: 390px;
  max-width: 620px;
  margin: 20px auto 0;
}

html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-system,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-system {
  width: 480px;
  height: 480px;
}

html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-outer,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-outer { width: 480px; height: 480px; }
html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-middle,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-middle { width: 320px; height: 320px; }
html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-inner,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-inner { width: 160px; height: 160px; }

html[data-astra-skin] .star-template-market .mainnet-cosmic-core,
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-core {
  width: 126px;
  height: 126px;
  background: radial-gradient(circle at 35% 28%, var(--star-platinum), color-mix(in srgb, var(--star-lilac) 38%, var(--star-surface)) 58%, color-mix(in srgb, var(--star-info) 20%, var(--star-surface)));
}

html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(1),
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(1) { top: 14%; left: 6%; }
html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(2),
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(2) { top: 20%; right: 6%; }
html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(3),
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(3) { bottom: 30%; left: 4%; }
html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(4),
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(4) { bottom: 22%; right: 4%; }
html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(5),
html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(5) { top: 2%; left: 42%; transform: none; }

html[data-astra-skin] .star-template-market .mainnet-market-item-list,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
html[data-astra-skin] .star-template-market .mainnet-market-item,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item { min-height: 300px; border-radius: 16px; }
html[data-astra-skin] .star-template-market .mainnet-market-item-select,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select { min-height: 300px; padding: 20px; }

/* The selectable skin files contain their own compact-list rules with the
   same specificity. Repeat the component class once so the reference card
   shape remains authoritative without changing those skin files. */
html[data-astra-skin] .star-template-market .mainnet-market-item.mainnet-market-item,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item.mainnet-market-item { min-height: 300px; border-radius: 16px; }
html[data-astra-skin] .star-template-market .mainnet-market-item-select.mainnet-market-item-select,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select.mainnet-market-item-select { min-height: 300px; padding: 20px; display: flex !important; flex-direction: column !important; align-items: stretch; gap: 14px; }

html[data-astra-skin] .star-template-market .mainnet-market-item-select.mainnet-market-item-select,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select.mainnet-market-item-select { display: flex !important; flex-direction: column !important; align-items: stretch; gap: 14px; }
html[data-astra-skin] .star-template-market .mainnet-market-item-select .mainnet-market-item-topline,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select .mainnet-market-item-topline { display: flex !important; grid-column: auto; }
html[data-astra-skin] .star-template-market .mainnet-market-item-select .mainnet-market-item-id,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select .mainnet-market-item-id { display: block; grid-column: auto; }
html[data-astra-skin] .star-template-market .mainnet-market-item-select .mainnet-market-item-price,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select .mainnet-market-item-price { display: flex !important; grid-column: auto; }
html[data-astra-skin] .star-template-market .mainnet-market-item-select .mainnet-market-item-spark,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select .mainnet-market-item-spark { display: block !important; grid-column: auto; }
html[data-astra-skin] .star-template-market .mainnet-market-item-select .mainnet-market-buy-label,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select .mainnet-market-buy-label { display: inline-flex !important; grid-column: auto; margin-top: auto; }

/* Exact reference-card surface: white paper-like body, lavender hairline,
   cyan price emphasis, and an unboxed status line at the bottom. */
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item.mainnet-market-item {
  background: #fff;
  border-color: rgba(132, 82, 214, .18);
  box-shadow: 0 8px 26px rgba(99, 49, 180, .08);
}

html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item.mainnet-market-item:hover {
  border-color: rgba(132, 82, 214, .4);
  box-shadow: 0 18px 42px rgba(99, 49, 180, .16);
}

html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-select.mainnet-market-item-select,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-select.mainnet-market-item-select,
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-select.mainnet-market-item-select:disabled,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-select.mainnet-market-item-select:disabled { opacity: 1; }

html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-id,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-id { color: #5f4f82; font-size: 18px; letter-spacing: .06em; }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-topline small,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-topline small { color: #b7aecc; font-size: 11px; letter-spacing: .06em; }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-price,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-price { border-top-color: rgba(132, 82, 214, .12); }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-price strong,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-price strong { color: #5598ae !important; font-size: 30px; text-shadow: 0 0 13px rgba(8, 145, 178, .2); }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-price small,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-price small { color: #b7aecc; font-size: 13px; }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-price em,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-price em { color: #7c91a0; font-size: 12px; }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-spark,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-item-spark { display: block !important; width: 100%; height: 42px; margin-top: 2px; opacity: .64; background: none; mask-image: none; }
html[data-astra-skin="platinum"] .star-template-market .mainnet-market-item-spark,
html:not([data-astra-skin]) .star-template-market .mainnet-market-item-spark { display: block !important; width: 100%; height: 42px; margin-top: 2px; opacity: .64; background: none; mask-image: none; }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-buy-label,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-buy-label { min-height: 20px; padding: 0; border: 0; border-radius: 0; color: #f58d9c !important; background: transparent; font-size: 13px; font-weight: 700; }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-buy-label svg,
html[data-astra-skin="violet"] .star-template-market .mainnet-market-buy-label svg { color: #f58d9c; }

@media (max-width: 900px) {
  html[data-astra-skin] .star-template-market .mainnet-cosmic-hero,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-hero { min-height: 440px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-wrap,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-wrap { height: 330px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-outer,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-outer { width: 360px; height: 360px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-middle,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-middle { width: 240px; height: 240px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-inner,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-inner { width: 120px; height: 120px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-system,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-system { width: 360px; height: 360px; }
  html[data-astra-skin] .star-template-market .mainnet-market-item-list,
  html:not([data-astra-skin]) .star-template-market .mainnet-market-item-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
  html[data-astra-skin] .star-template-market .mainnet-cosmic-hero,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-hero { min-height: 350px; padding: 30px 4px 20px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-hero-copy h2,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-hero-copy h2 { font-size: 34px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-hero-copy p,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-hero-copy p { font-size: 13px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-wrap,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-wrap { height: 300px; transform: scale(.9); transform-origin: top center; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-system,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-system { transform: translate(-50%, -50%) scale(.68); transform-origin: center; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-outer,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-outer { width: 270px; height: 270px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-middle,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-middle { width: 190px; height: 190px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-ring-inner,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-ring-inner { width: 104px; height: 104px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-system,
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-system { width: 270px; height: 270px; }
  html[data-astra-skin] .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(5),
  html:not([data-astra-skin]) .star-template-market .mainnet-cosmic-orbit-labels span:nth-child(5) { left: 36%; }
  html[data-astra-skin] .star-template-market .mainnet-market-item-list,
  html:not([data-astra-skin]) .star-template-market .mainnet-market-item-list { grid-template-columns: 1fr; }
  html[data-astra-skin] .star-template-market .mainnet-market-item,
  html:not([data-astra-skin]) .star-template-market .mainnet-market-item,
  html[data-astra-skin] .star-template-market .mainnet-market-item-select,
  html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select { min-height: 300px; }
  html[data-astra-skin] .star-template-market .mainnet-market-item.mainnet-market-item,
  html:not([data-astra-skin]) .star-template-market .mainnet-market-item.mainnet-market-item,
  html[data-astra-skin] .star-template-market .mainnet-market-item-select.mainnet-market-item-select,
  html:not([data-astra-skin]) .star-template-market .mainnet-market-item-select.mainnet-market-item-select { min-height: 300px; }
}

/* Assets: one shared responsive composition for both Starrail skins. */
.ambient-meteor {
  position: absolute;
  display: block;
  width: 126px;
  height: 2px;
  border-radius: 999px;
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--star-info) 82%, transparent), transparent);
  filter: drop-shadow(0 0 6px color-mix(in srgb, var(--star-info) 70%, transparent));
  transform: rotate(32deg);
  animation: ambient-meteor-fly 9s ease-in infinite;
}

.ambient-meteor-one { top: 13%; left: 8%; animation-delay: -2.2s; }
.ambient-meteor-two { top: 29%; left: 74%; width: 92px; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--star-lilac) 82%, transparent), transparent); animation-delay: -5.8s; animation-duration: 11s; }
.ambient-meteor-three { top: 58%; left: 22%; width: 78px; animation-delay: -7.4s; animation-duration: 12.5s; }
.ambient-meteor-four { top: 76%; left: 82%; width: 106px; animation-delay: -9.1s; animation-duration: 14s; }

@keyframes ambient-meteor-fly {
  0%, 67% { opacity: 0; transform: translate3d(-34px, -20px, 0) rotate(32deg); }
  73% { opacity: .72; }
  84% { opacity: .28; }
  100% { opacity: 0; transform: translate3d(220px, 128px, 0) rotate(32deg); }
}

@media (prefers-reduced-motion: reduce) {
  .ambient-meteor { animation: none !important; }
}

/* Shared Cosmic Forge presentation for non-market pages. Components keep
   their existing data/actions; this only supplies the reference card rhythm. */
.star-network-layout .star-template-page > .surface-panel,
.star-network-layout .star-template-page > .star-team-overview,
.star-network-layout .star-template-page .admin-panel,
.star-network-layout .star-template-page .mainnet-admin-section,
.star-network-layout .star-template-page .mainnet-readonly-panel {
  position: relative;
  border-radius: 16px;
  box-shadow: var(--shadow-card);
}

.star-network-layout .star-template-page > .surface-panel::before,
.star-network-layout .star-template-page .admin-panel::before,
.star-network-layout .star-template-page .mainnet-admin-section::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  border-radius: 16px 16px 0 0;
  background: linear-gradient(90deg, var(--star-lilac), var(--star-info), var(--star-lilac));
  background-size: 200% 100%;
  opacity: .72;
  animation: mainnet-market-flow-line 3.4s linear infinite;
}

.star-network-layout .star-template-page .panel-heading,
.star-network-layout .star-template-page .mainnet-admin-section > summary,
.star-network-layout .star-template-page .admin-section-heading {
  min-height: 54px;
  padding-inline: 18px;
}

.star-network-layout .star-template-page .panel-heading h2,
.star-network-layout .star-template-page .mainnet-admin-section > summary h2,
.star-network-layout .star-template-page .admin-section-heading h2 {
  letter-spacing: .01em;
}

.star-network-layout .star-template-page .mainnet-data-table,
.star-network-layout .star-template-page .admin-table {
  border-collapse: separate;
  border-spacing: 0;
}

.star-network-layout .star-template-page .mainnet-data-table th,
.star-network-layout .star-template-page .admin-table th {
  background: color-mix(in srgb, var(--star-lilac) 8%, var(--star-surface));
  color: var(--star-muted);
  font-size: 11px;
  letter-spacing: .03em;
}

.star-network-layout .star-template-page .mainnet-data-table td,
.star-network-layout .star-template-page .admin-table td {
  border-bottom-color: var(--star-line);
}

.star-network-layout .star-template-page .mainnet-data-table tbody tr:hover td,
.star-network-layout .star-template-page .admin-table tbody tr:hover td {
  background: color-mix(in srgb, var(--star-info) 5%, transparent);
}

.star-network-layout .star-template-page .position-list,
.star-network-layout .star-template-page .star-team-facts,
.star-network-layout .star-template-page .admin-grid {
  gap: 14px;
}

.star-network-layout .star-template-page .position-card,
.star-network-layout .star-template-page .star-team-facts > div,
.star-network-layout .star-template-page .admin-grid > div {
  border-radius: 14px;
  box-shadow: 0 8px 22px color-mix(in srgb, var(--star-bg) 12%, transparent);
}

/* My creative packs: reference HTML holding-card treatment. */
html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card {
  position: relative;
  overflow: hidden;
  min-height: 300px;
  padding: 0;
  border: 1px solid rgba(132, 82, 214, .18);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 26px rgba(99, 49, 180, .08);
}

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card::before,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card::before,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: linear-gradient(90deg, #8452d6, #0891b2, #8452d6);
  background-size: 200% 100%;
  animation: mainnet-market-flow-line 3.4s linear infinite;
}

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .position-main,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .position-main,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .position-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 20px 0;
}

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .position-id,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .position-id,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .position-id { color: #5f4f82; font-size: 18px; letter-spacing: .06em; }

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .position-main h3,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .position-main h3,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .position-main h3 { margin: 7px 0 0; color: #5598ae; font-size: 28px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .mainnet-package-cost-label,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .mainnet-package-cost-label,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .mainnet-package-cost-label { color: #b7aecc; font-size: 11px; }

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .position-details,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .position-details,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .position-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; margin: 18px 20px 0; padding-top: 14px; border-top: 1px dashed rgba(132, 82, 214, .12); }

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .position-details > div,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .position-details > div,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .position-details > div { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 8px 0; border-bottom: 1px dashed rgba(132, 82, 214, .1); }

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .position-details span,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .position-details span,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .position-details span { color: #b7aecc; font-size: 11px; }

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .position-details strong,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .position-details strong,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .position-details strong { color: #5f4f82; font-size: 12px; }

.mainnet-package-sparkline { display: block; width: calc(100% - 40px); height: 40px; margin: 10px 20px 0; opacity: .68; }

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card .position-actions,
html[data-astra-skin="violet"] .star-template-packages .mainnet-package-card .position-actions,
html:not([data-astra-skin]) .star-template-packages .mainnet-package-card .position-actions { display: flex; align-items: center; gap: 8px; margin: 14px 20px 18px; padding: 0; color: #f58d9c; }

@media (max-width: 720px) {
  html[data-astra-skin] .star-template-packages .mainnet-package-card,
  html:not([data-astra-skin]) .star-template-packages .mainnet-package-card { min-height: 300px; }
}

@media (max-width: 720px) {
  .ambient-meteor { transform: scale(.75) rotate(32deg); }
  .star-network-layout .star-template-page > .surface-panel,
  .star-network-layout .star-template-page .admin-panel,
  .star-network-layout .star-template-page .mainnet-admin-section { border-radius: 14px; }
}

.star-template-assets .star-balance-hero.asset-balance-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  padding: 22px;
}

.asset-balance-primary,
.asset-balance-facts,
.asset-balance-facts > div,
.asset-frozen-values > div {
  min-width: 0;
}

.asset-balance-primary {
  position: relative;
  z-index: 2;
  padding-right: 190px;
}

.asset-balance-primary-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.asset-kline-trigger {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--star-line-strong);
  border-radius: 10px;
  color: var(--star-platinum);
  background: linear-gradient(135deg, rgba(126, 155, 213, .18), rgba(154, 123, 207, .12));
  font: inherit;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}

.asset-kline-trigger:hover {
  border-color: var(--star-lilac-strong);
  transform: translateY(-1px);
}

.asset-balance-primary > strong {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.asset-balance-facts {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.asset-balance-facts > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-content: center;
  gap: 7px 8px;
  padding: 13px;
  min-height: 92px;
  border: 1px solid var(--star-line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .025);
}

.asset-balance-facts svg {
  align-self: center;
  color: var(--star-lilac-strong);
}

.asset-balance-facts span {
  align-self: center;
  color: var(--star-muted);
  font-size: 11px;
}

.star-template-assets .asset-balance-hero .asset-balance-facts strong {
  grid-column: 1 / -1;
  margin: 2px 0 0;
  font-size: clamp(15px, 1.7vw, 20px);
  letter-spacing: -.02em;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  word-break: normal;
}

.star-template-assets .asset-balance-hero .star-orbit-mark {
  position: absolute;
  z-index: 1;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .76;
  pointer-events: none;
}

.asset-quick-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.asset-quick-actions > button,
.asset-quick-actions [data-radix-collection-item] {
  min-width: 0;
  min-height: 48px;
  border: 1px solid var(--star-line-strong);
  border-radius: 12px;
  color: var(--star-platinum);
  background: linear-gradient(135deg, rgba(193, 175, 217, .14), rgba(139, 168, 205, .07));
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}

.asset-quick-actions button:hover:not(:disabled) {
  border-color: var(--star-lilac-strong);
  transform: translateY(-1px);
}

.asset-quick-actions button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.asset-withdraw-menu {
  z-index: 160;
  display: grid;
  gap: 6px;
  min-width: 180px;
  padding: 8px;
  border: 1px solid var(--star-line-strong);
  border-radius: 12px;
  background: var(--star-surface-raised);
  box-shadow: 0 20px 48px rgba(0, 0, 0, .34);
}

.asset-withdraw-menu button {
  min-height: 40px;
  border: 0;
  border-radius: 8px;
  color: var(--star-platinum);
  background: transparent;
  text-align: left;
  padding: 0 12px;
  font: inherit;
  cursor: pointer;
}

.agi-kline-overlay { backdrop-filter: blur(7px); }

.dialog-content.agi-kline-dialog {
  width: min(760px, calc(100vw - 32px));
  max-width: 760px;
  padding: 22px;
  border-color: var(--star-line-strong);
  color: var(--star-platinum);
  background: var(--star-surface-raised);
  box-shadow: 0 32px 90px rgba(12, 23, 45, .34);
}

.agi-kline-dialog-head,
.agi-kline-quote,
.agi-kline-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.agi-kline-dialog-head { align-items: flex-start; }
.agi-kline-dialog-head h2 { margin: 3px 0 0; font-size: 21px; }
.agi-kline-dialog-head p { margin: 5px 0 0; color: var(--star-muted); font-size: 12px; }

.agi-kline-close {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border: 1px solid var(--star-line);
  border-radius: 10px;
  color: var(--star-muted);
  background: rgba(255, 255, 255, .045);
  cursor: pointer;
}

.agi-kline-quote { align-items: flex-end; padding: 18px 0 10px; }
.agi-kline-quote > div { display: flex; align-items: baseline; gap: 10px; }
.agi-kline-quote > div strong { font-size: clamp(24px, 4vw, 32px); letter-spacing: -.035em; }
.agi-kline-quote > div strong small {
  margin-left: 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
}
.agi-kline-quote > div span { font-size: 12px; font-weight: 700; }
.agi-kline-quote .is-up { color: #25b59a; }
.agi-kline-quote .is-down { color: #ef6b82; }
.agi-kline-quote dl { display: grid; grid-template-columns: repeat(4, auto); gap: 12px; margin: 0; }
.agi-kline-quote dl > div { display: flex; gap: 5px; font-size: 11px; }
.agi-kline-quote dt { color: var(--star-muted); }
.agi-kline-quote dd { margin: 0; color: var(--star-platinum); font-variant-numeric: tabular-nums; }

.agi-kline-toolbar { margin: 5px 0 8px; color: var(--star-muted); font-size: 11px; }
.agi-kline-period { padding: 6px 10px; border-radius: 8px; color: var(--star-platinum); background: linear-gradient(135deg, rgba(79, 119, 202, .9), rgba(105, 91, 199, .86)); }
.agi-kline-chart-shell { overflow: hidden; border: 1px solid var(--star-line); border-radius: 14px; background: rgba(255, 255, 255, .025); }
.agi-kline-chart { width: 100%; min-height: 260px; }
.agi-kline-note { margin: 12px 0 0; color: var(--star-muted); font-size: 11px; line-height: 1.6; }
.agi-kline-license { margin: 5px 0 0; color: var(--star-muted); font-size: 10px; line-height: 1.5; opacity: .72; }
.agi-kline-license a { color: inherit; text-underline-offset: 2px; }

.asset-withdraw-menu button:hover {
  background: rgba(193, 175, 217, .13);
}

.asset-withdraw-arrow {
  fill: var(--star-surface-raised);
}

.asset-policy-strip {
  display: grid;
  gap: 5px;
  padding: 14px 16px;
  border: 1px solid var(--star-line);
  border-left: 2px solid var(--star-lilac);
  border-radius: 11px;
  background: rgba(255, 255, 255, .025);
}

.asset-policy-strip p,
.asset-policy-strip small {
  margin: 0;
  line-height: 1.65;
}

.asset-policy-strip p {
  color: var(--star-platinum-soft);
  font-size: 13px;
}

.asset-policy-strip small {
  color: var(--star-muted);
  overflow-wrap: anywhere;
}

.asset-frozen-panel,
.asset-ticket-panel,
.asset-history-panel {
  margin: 0;
}

.asset-frozen-values {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.asset-frozen-values > div {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--star-line);
  border-radius: 10px;
  background: rgba(255, 255, 255, .025);
}

.asset-frozen-values span {
  color: var(--star-muted);
  font-size: 12px;
}

.asset-frozen-values strong {
  color: var(--star-platinum);
  font-size: 18px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  word-break: normal;
}

.asset-ticket-panel .table-scroll,
.asset-history-panel .table-scroll {
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.asset-ticket-panel .mainnet-data-table,
.asset-history-panel .mainnet-data-table {
  min-width: 680px;
}

.asset-history-panel {
  margin-bottom: 0;
}

@media (max-width: 520px) {
  .star-metric-orbit {
    right: 5px;
    bottom: 5px;
    width: 78px;
    height: 48px;
    transform: scale(0.9);
    transform-origin: right bottom;
  }

  .star-template-market .market-range-form {
    grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1fr) auto auto;
    gap: 4px;
  }

  .star-template-market .market-range-form .market-price-search {
    padding-inline: 8px;
  }

  .star-template-market .market-range-form .market-price-search input {
    font-size: 13px;
  }

  .star-template-market .market-range-form .button,
  .star-template-market .market-range-form .market-price-clear {
    min-width: 0;
    padding-inline: 7px;
    font-size: 12px;
  }
}

@media (max-width: 720px) {
  .star-template-assets .star-balance-hero.asset-balance-hero {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
    width: 100%;
    max-width: 100%;
    min-height: 0;
    padding: 17px;
  }

  .star-template-assets .asset-balance-hero .star-orbit-mark {
    right: -12px;
    top: 12px;
    width: 132px;
    height: 78px;
    margin: 0;
    transform: none;
    opacity: .44;
  }

  .asset-balance-primary {
    padding-right: 0;
  }

  .asset-kline-trigger {
    position: relative;
    min-height: 34px;
    padding: 0 9px;
  }

  .dialog-content.agi-kline-dialog {
    width: calc(100vw - 20px);
    padding: 16px;
  }

  .agi-kline-quote { align-items: flex-start; }
  .agi-kline-quote dl { grid-template-columns: repeat(2, auto); gap: 5px 10px; }
  .agi-kline-chart { min-height: 300px; }

  .asset-balance-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .asset-balance-facts > div:nth-child(3) {
    grid-column: 1 / -1;
  }

  .asset-quick-actions {
    gap: 7px;
  }

  .asset-quick-actions > button,
  .asset-quick-actions [data-radix-collection-item] {
    min-height: 44px;
    border-radius: 10px;
  }

  .asset-policy-strip {
    padding: 12px 13px;
  }

  .asset-frozen-values {
    grid-template-columns: 1fr;
  }

  .star-network-layout .star-network-brand {
    min-width: 0;
    flex: 0 1 92px;
  }

  .star-network-layout .topbar-actions {
    min-width: 0;
    max-width: calc(100% - 104px);
    flex: 1 1 auto;
    justify-content: flex-end;
  }

  .star-network-layout .connected-wallet-actions {
    min-width: 0;
    max-width: calc(100% - 44px);
    flex: 1 1 auto;
  }

  .star-network-layout .wallet-account-button,
  .star-network-layout .wallet-connect-button {
    min-width: 0;
    max-width: 100%;
    padding-inline: 10px;
  }

  .star-network-layout .wallet-account-button span {
    min-width: 0;
    max-width: none;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

@media (max-width: 420px) {
  .asset-balance-facts > div {
    padding: 11px;
  }

  .star-template-assets .asset-balance-hero .asset-balance-facts strong {
    font-size: 14px;
  }

  .asset-ticket-panel,
  .asset-frozen-panel,
  .asset-history-panel {
    padding: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .star-metric-orbit i {
    animation: none !important;
  }
}
/*
  Blue-white selectable skin. Layout rules mirror star-network.css and are scoped so the platinum skin remains the default. 
 */

/*
 * ASTRA Starrail Network theme.
 *
 * This stylesheet is intentionally loaded after the legacy visual layers. It
 * changes shared tokens and presentation only; component structure, fields,
 * permissions and transaction actions remain owned by their feature modules.
 */

:root[data-astra-skin="blue-white"] {
  color-scheme: light;
  color: #2a1850;
  background: #f6f2fc;
  --ink: #2a1850;
  --muted: #665580;
  --purple: #8452d6;
  --purple-deep: #6331b4;
  --purple-soft: rgba(132, 82, 214, 0.15);
  --glass: rgba(255, 255, 255, 0.94);
  --glass-strong: rgba(255, 255, 255, 0.98);
  --stroke: rgba(132, 82, 214, 0.18);
  --shadow-soft: 0 26px 70px rgba(99, 49, 180, 0.28);
  --shadow-card: 0 14px 40px rgba(99, 49, 180, 0.18);
  --star-bg: #f6f2fc;
  --star-bg-raised: #efe8fa;
  --star-surface: #ffffff;
  --star-surface-raised: #efe8fa;
  --star-surface-soft: #e8dff6;
  --star-platinum: #2a1850;
  --star-platinum-soft: #5b4a85;
  --star-muted: #665580;
  --star-faint: #76668b;
  --star-lilac: #8452d6;
  --star-lilac-strong: #6331b4;
  --star-blue: #0891b2;
  --star-blue-soft: #0e7490;
  --star-line: rgba(132, 82, 214, 0.18);
  --star-line-strong: rgba(132, 82, 214, 0.44);
  --star-success: #147d59;
  --star-warning: #80500d;
  --star-danger: #a52f48;
  --star-info: #0e7490;
  --radius-control: 9px;
  --radius-card: 14px;
}

html[data-astra-skin="blue-white"] {
  background: var(--star-bg);
}

html[data-astra-skin="blue-white"] body {
  color: var(--star-platinum);
  background:
    radial-gradient(circle at 82% -8%, rgba(132, 82, 214, 0.26), transparent 34rem),
    radial-gradient(circle at 8% 86%, rgba(8, 145, 178, 0.2), transparent 30rem),
    linear-gradient(145deg, #f6f2fc 0%, #f6f2fc 48%, #f6f2fc 100%);
  background-attachment: fixed;
}

html[data-astra-skin="blue-white"] ::selection {
  color: #fff;
  background: rgba(132, 82, 214, 0.48);
}

html[data-astra-skin="blue-white"] button:focus-visible,
html[data-astra-skin="blue-white"] a:focus-visible,
html[data-astra-skin="blue-white"] input:focus-visible,
html[data-astra-skin="blue-white"] textarea:focus-visible,
html[data-astra-skin="blue-white"] select:focus-visible {
  outline-color: rgba(8, 145, 178, 0.9);
}

/* Ambient network: thin orbital lines and a sparse node field. */
html[data-astra-skin="blue-white"] .ambient-layer {
  z-index: 0;
  opacity: 1;
}

html[data-astra-skin="blue-white"] .app-shell {
  position: relative;
  z-index: 1;
}

html[data-astra-skin="blue-white"] .ambient-orb {
  border: 1px solid rgba(88, 192, 233, 0.18);
  background: transparent;
  box-shadow: none;
  filter: none;
  opacity: 1;
}

html[data-astra-skin="blue-white"] .ambient-orb::before,
html[data-astra-skin="blue-white"] .ambient-orb::after {
  content: '';
  position: absolute;
  border-radius: 50%;
}

html[data-astra-skin="blue-white"] .ambient-orb::before {
  width: 7px;
  height: 7px;
  top: 18%;
  right: 12%;
  background: linear-gradient(135deg, var(--star-lilac-strong), var(--star-blue));
  box-shadow: 0 0 0 5px rgba(132, 82, 214, 0.1), 0 0 20px rgba(8, 145, 178, 0.16);
}

html[data-astra-skin="blue-white"] .ambient-orb::after {
  inset: 14%;
  border: 1px solid rgba(8, 145, 178, 0.1);
}

html[data-astra-skin="blue-white"] .ambient-orb-one {
  width: 620px;
  height: 360px;
  top: -170px;
  right: -100px;
  transform: rotate(-18deg);
  animation: starrail-orbit-one-blue-white 28s ease-in-out infinite alternate;
}

html[data-astra-skin="blue-white"] .ambient-orb-two {
  width: 460px;
  height: 260px;
  bottom: -110px;
  left: 11%;
  transform: rotate(16deg);
  animation: starrail-orbit-two-blue-white 34s ease-in-out infinite alternate;
}

html[data-astra-skin="blue-white"] .ambient-grid {
  inset: 0;
  opacity: 0.52;
  background-image:
    radial-gradient(circle at 12% 17%, rgba(219, 246, 253, 0.62) 0 1px, transparent 1.5px),
    radial-gradient(circle at 72% 22%, rgba(8, 145, 178, 0.54) 0 1px, transparent 1.7px),
    radial-gradient(circle at 46% 68%, rgba(116, 207, 240, 0.44) 0 1px, transparent 1.5px),
    radial-gradient(circle at 88% 82%, rgba(8, 145, 178, 0.44) 0 1px, transparent 1.6px),
    linear-gradient(rgba(132, 82, 214, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(132, 82, 214, 0.035) 1px, transparent 1px);
  background-size: 380px 310px, 470px 390px, 430px 360px, 520px 430px, 72px 72px, 72px 72px;
  mask-image: linear-gradient(to bottom, #ffffff 0%, rgba(99, 49, 180, 0.64) 64%, transparent 100%);
  animation: starrail-field-blue-white 36s linear infinite alternate;
}

@keyframes starrail-orbit-one-blue-white {
  from { translate: 0 0; }
  to { translate: -18px 14px; }
}

@keyframes starrail-orbit-two-blue-white {
  from { translate: 0 0; }
  to { translate: 16px -10px; }
}

@keyframes starrail-field-blue-white {
  from { background-position: 0 0; }
  to { background-position: 20px 12px; }
}

/* Shell and global navigation. */
html[data-astra-skin="blue-white"] .app-shell {
  grid-template-columns: 204px minmax(0, 1fr);
  padding: 12px;
  gap: 12px;
}

html[data-astra-skin="blue-white"] .sidebar {
  border-color: var(--star-line);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 24px 70px rgba(99, 49, 180, 0.3);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .brand-logo {
  filter: none;
}

html[data-astra-skin="blue-white"] .nav-caption,
html[data-astra-skin="blue-white"] .sidebar-foot,
html[data-astra-skin="blue-white"] .network-card small,
html[data-astra-skin="blue-white"] .breadcrumb,
html[data-astra-skin="blue-white"] .slash {
  color: var(--star-faint);
}

html[data-astra-skin="blue-white"] .nav-item {
  color: #76668b;
}

html[data-astra-skin="blue-white"] .nav-item:hover {
  color: var(--star-platinum-soft);
  background: rgba(132, 82, 214, 0.055);
  transform: translateX(2px);
}

html[data-astra-skin="blue-white"] .nav-item.active {
  color: var(--star-platinum);
  background: linear-gradient(90deg, rgba(132, 82, 214, 0.22), rgba(8, 145, 178, 0.07));
  box-shadow: inset 0 0 0 1px rgba(8, 145, 178, 0.12);
}

html[data-astra-skin="blue-white"] .nav-item.active::before {
  background: linear-gradient(#6331b4, #8452d6 56%, #0891b2);
  box-shadow: 0 0 16px rgba(132, 82, 214, 0.42);
}

html[data-astra-skin="blue-white"] .network-card {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #f6f2fc;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

html[data-astra-skin="blue-white"] .network-card > svg {
  color: var(--star-blue-soft);
}

html[data-astra-skin="blue-white"] .status-dot {
  background: linear-gradient(135deg, var(--star-lilac-strong), var(--star-blue));
  box-shadow: 0 0 0 4px rgba(132, 82, 214, 0.1);
  animation: starrail-status-blue-white 3.8s ease-in-out infinite;
}

@keyframes starrail-status-blue-white {
  0%, 100% { opacity: 0.72; box-shadow: 0 0 0 3px rgba(132, 82, 214, 0.08); }
  50% { opacity: 1; box-shadow: 0 0 0 6px rgba(8, 145, 178, 0.025); }
}

html[data-astra-skin="blue-white"] .topbar {
  border-color: var(--star-line);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 14px 42px rgba(99, 49, 180, 0.2);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .breadcrumb strong {
  color: var(--star-platinum-soft);
}

html[data-astra-skin="blue-white"] .demo-chip {
  border-color: var(--star-line);
  color: #6331b4;
  background: #f6f2fc;
}

html[data-astra-skin="blue-white"] .page-shell {
  max-width: calc(var(--content-user) + 64px);
}

html[data-astra-skin="blue-white"] .admin-page-scope .page-shell,
html[data-astra-skin="blue-white"] .mainnet-admin-panel {
  max-width: var(--content-admin);
}

html[data-astra-skin="blue-white"] .page-heading {
  animation: starrail-enter-blue-white 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

html[data-astra-skin="blue-white"] .page-heading::before,
html[data-astra-skin="blue-white"] .eyebrow,
html[data-astra-skin="blue-white"] .muted-eyebrow,
html[data-astra-skin="blue-white"] .showcase-kicker,
html[data-astra-skin="blue-white"] .position-id {
  color: #a878e8;
}

html[data-astra-skin="blue-white"] .page-heading h1,
html[data-astra-skin="blue-white"] .section-heading h2,
html[data-astra-skin="blue-white"] .panel-heading h2 {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .page-heading p,
html[data-astra-skin="blue-white"] .text-muted,
html[data-astra-skin="blue-white"] .metric-note,
html[data-astra-skin="blue-white"] .form-hint,
html[data-astra-skin="blue-white"] .mainnet-readonly-note,
html[data-astra-skin="blue-white"] .mainnet-closed-reason,
html[data-astra-skin="blue-white"] .section-note,
html[data-astra-skin="blue-white"] .subtle-label,
html[data-astra-skin="blue-white"] .muted,
html[data-astra-skin="blue-white"] .muted-text {
  color: var(--star-muted);
}

@keyframes starrail-enter-blue-white {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Shared controls. */
html[data-astra-skin="blue-white"] .button {
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

html[data-astra-skin="blue-white"] .button-primary {
  color: #ffffff;
  background: linear-gradient(135deg, #8452d6, #8452d6 54%, #a878e8);
  box-shadow: 0 9px 24px rgba(92, 64, 178, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

html[data-astra-skin="blue-white"] .button-primary:hover:not(:disabled) {
  color: #ffffff;
  background: linear-gradient(135deg, #6331b4, #8452d6 54%, #8452d6);
  transform: translateY(-1px);
}

html[data-astra-skin="blue-white"] .button-outline,
html[data-astra-skin="blue-white"] .button-icon,
html[data-astra-skin="blue-white"] .button-ghost {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

html[data-astra-skin="blue-white"] .button-outline:hover:not(:disabled),
html[data-astra-skin="blue-white"] .button-icon:hover:not(:disabled),
html[data-astra-skin="blue-white"] .button-ghost:hover:not(:disabled) {
  border-color: var(--star-line-strong);
  color: #fff;
  background: #efe8fa;
}

html[data-astra-skin="blue-white"] input,
html[data-astra-skin="blue-white"] textarea,
html[data-astra-skin="blue-white"] select,
html[data-astra-skin="blue-white"] .search-field,
html[data-astra-skin="blue-white"] .market-price-search,
html[data-astra-skin="blue-white"] .team-tree-search,
html[data-astra-skin="blue-white"] .date-range-trigger,
html[data-astra-skin="blue-white"] .mainnet-admin-record-search > div,
html[data-astra-skin="blue-white"] .mainnet-receipt-recovery input {
  border-color: var(--star-line) !important;
  color: var(--star-platinum-soft) !important;
  background-color: #faf7ff !important;
  box-shadow: inset 0 1px 2px rgba(99, 49, 180, 0.22);
}

html[data-astra-skin="blue-white"] input::placeholder,
html[data-astra-skin="blue-white"] textarea::placeholder {
  color: #76668b;
}

html[data-astra-skin="blue-white"] select {
  background-image:
    linear-gradient(45deg, transparent 50%, #6331b4 50%),
    linear-gradient(135deg, #6331b4 50%, transparent 50%);
}

html[data-astra-skin="blue-white"] select:hover,
html[data-astra-skin="blue-white"] select:focus-visible,
html[data-astra-skin="blue-white"] input:hover,
html[data-astra-skin="blue-white"] textarea:hover {
  border-color: rgba(8, 145, 178, 0.44) !important;
  background-color: #f6f2fc !important;
}

html[data-astra-skin="blue-white"] select option {
  color: var(--star-platinum);
  background: #ffffff;
}

/* Shared surfaces. No blanket blur: depth comes from tone and fine borders. */
html[data-astra-skin="blue-white"] .surface-panel,
html[data-astra-skin="blue-white"] .metric-card,
html[data-astra-skin="blue-white"] .position-card,
html[data-astra-skin="blue-white"] .empty-panel,
html[data-astra-skin="blue-white"] .chain-card,
html[data-astra-skin="blue-white"] .product-card,
html[data-astra-skin="blue-white"] .mainnet-readonly-panel,
html[data-astra-skin="blue-white"] .mainnet-readonly-panel.mainnet-admin-records,
html[data-astra-skin="blue-white"] .mainnet-admin-data-dashboard,
html[data-astra-skin="blue-white"] .premium-batch-card {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: var(--shadow-card), inset 0 1px 0 rgba(255, 255, 255, 0.025);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .surface-panel,
html[data-astra-skin="blue-white"] .metric-card,
html[data-astra-skin="blue-white"] .position-card,
html[data-astra-skin="blue-white"] .product-card,
html[data-astra-skin="blue-white"] .chain-card,
html[data-astra-skin="blue-white"] .mainnet-market-item {
  transition: border-color 180ms ease, background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

@media (hover: hover) {
  html[data-astra-skin="blue-white"] .surface-panel:hover,
html[data-astra-skin="blue-white"] .metric-card:hover,
html[data-astra-skin="blue-white"] .position-card:hover,
html[data-astra-skin="blue-white"] .product-card:hover,
html[data-astra-skin="blue-white"] .chain-card:hover {
    border-color: rgba(8, 145, 178, 0.28);
  }
}

html[data-astra-skin="blue-white"] .metric-card::after {
  width: 132px;
  height: 132px;
  top: -88px;
  right: -58px;
  background: radial-gradient(circle, rgba(132, 82, 214, 0.24), rgba(8, 145, 178, 0.08) 38%, transparent 70%);
}

html[data-astra-skin="blue-white"] .metric-top,
html[data-astra-skin="blue-white"] .position-details span,
html[data-astra-skin="blue-white"] .product-time,
html[data-astra-skin="blue-white"] .product-body > p,
html[data-astra-skin="blue-white"] .compact-history-header,
html[data-astra-skin="blue-white"] .compact-history-row time,
html[data-astra-skin="blue-white"] .history-row p,
html[data-astra-skin="blue-white"] .history-row time {
  color: var(--star-muted);
}

html[data-astra-skin="blue-white"] .metric-top svg,
html[data-astra-skin="blue-white"] .panel-heading h2 svg,
html[data-astra-skin="blue-white"] .mainnet-readonly-panel .panel-heading > svg {
  color: #6331b4;
}

html[data-astra-skin="blue-white"] .metric-value,
html[data-astra-skin="blue-white"] .position-main h3,
html[data-astra-skin="blue-white"] .product-body h3,
html[data-astra-skin="blue-white"] .compact-history-row strong,
html[data-astra-skin="blue-white"] .ledger-summary strong,
html[data-astra-skin="blue-white"] .claim-amount {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .metric-icon,
html[data-astra-skin="blue-white"] .purple,
html[data-astra-skin="blue-white"] .blue,
html[data-astra-skin="blue-white"] .green,
html[data-astra-skin="blue-white"] .position-icon,
html[data-astra-skin="blue-white"] .empty-icon {
  color: #0e7490;
  background: linear-gradient(145deg, rgba(132, 82, 214, 0.18), rgba(8, 145, 178, 0.1));
}

html[data-astra-skin="blue-white"] .badge-purple,
html[data-astra-skin="blue-white"] .badge-blue,
html[data-astra-skin="blue-white"] .status-ready,
html[data-astra-skin="blue-white"] .status-listed,
html[data-astra-skin="blue-white"] .mainnet-readonly-badge {
  border-color: rgba(8, 145, 178, 0.22);
  color: #6331b4;
  background: linear-gradient(135deg, rgba(132, 82, 214, 0.16), rgba(8, 145, 178, 0.08));
}

html[data-astra-skin="blue-white"] .status-holding,
html[data-astra-skin="blue-white"] .testnet-banner {
  color: #6331b4;
  background: rgba(86, 145, 227, 0.15);
}

html[data-astra-skin="blue-white"] .status-cooling {
  color: #80500d;
  background: rgba(199, 154, 82, 0.13);
}

html[data-astra-skin="blue-white"] .status-sold,
html[data-astra-skin="blue-white"] .status-redeemed {
  color: #147d59;
  background: rgba(87, 157, 128, 0.13);
}

html[data-astra-skin="blue-white"] .status-failed {
  color: #a52f48;
  background: rgba(194, 91, 103, 0.13);
}

html[data-astra-skin="blue-white"] .notice {
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .notice-info,
html[data-astra-skin="blue-white"] .demo-banner {
  border-color: rgba(132, 82, 214, 0.2);
  color: #0e7490;
  background: linear-gradient(135deg, rgba(132, 82, 214, 0.12), rgba(8, 145, 178, 0.06));
}

html[data-astra-skin="blue-white"] .notice-success {
  border-color: rgba(118, 184, 159, 0.18);
  color: #147d59;
  background: rgba(73, 139, 113, 0.12);
}

html[data-astra-skin="blue-white"] .notice-warning,
html[data-astra-skin="blue-white"] .mainnet-admin-risk {
  border-color: rgba(211, 170, 105, 0.2);
  color: #80500d;
  background: rgba(165, 115, 51, 0.12);
}

html[data-astra-skin="blue-white"] .notice-error,
html[data-astra-skin="blue-white"] .error-banner {
  border-color: rgba(215, 131, 141, 0.2);
  color: #a52f48;
  background: rgba(159, 63, 75, 0.13);
}

/* Market and package presentation. */
html[data-astra-skin="blue-white"] .market-showcase,
html[data-astra-skin="blue-white"] .hero-panel {
  border-color: rgba(132, 82, 214, 0.16);
  background:
    radial-gradient(circle at 78% 16%, rgba(8, 145, 178, 0.2), transparent 24%),
    radial-gradient(circle at 88% 76%, rgba(80, 148, 255, 0.13), transparent 30%),
    linear-gradient(135deg, #ffffff, #f6f2fc 58%, #faf7ff);
  box-shadow: 0 30px 80px rgba(99, 49, 180, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

html[data-astra-skin="blue-white"] .market-showcase::before {
  opacity: 0.52;
  background-image:
    radial-gradient(circle, rgba(222, 214, 255, 0.58) 0 1px, transparent 1.4px),
    linear-gradient(112deg, transparent 47.8%, rgba(8, 145, 178, 0.13) 48%, transparent 48.3%);
  background-size: 44px 44px, 100% 100%;
  mask-image: linear-gradient(90deg, rgba(99, 49, 180, 0.4), #ffffff 78%);
}

html[data-astra-skin="blue-white"] .market-showcase h2,
html[data-astra-skin="blue-white"] .hero-copy h1 {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .market-showcase h2 span,
html[data-astra-skin="blue-white"] .hero-copy h1 > span {
  color: #6331b4;
}

html[data-astra-skin="blue-white"] .market-showcase-copy > p,
html[data-astra-skin="blue-white"] .hero-copy p,
html[data-astra-skin="blue-white"] .hero-caption {
  color: #76668b;
}

html[data-astra-skin="blue-white"] .showcase-stats > div {
  border-color: var(--star-line);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .showcase-stats small,
html[data-astra-skin="blue-white"] .showcase-stats em {
  color: #76668b;
}

html[data-astra-skin="blue-white"] .showcase-stats strong {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .market-showcase-art::before,
html[data-astra-skin="blue-white"] .market-showcase-art::after {
  content: '';
  position: absolute;
  border: 1px solid rgba(8, 145, 178, 0.24);
  border-radius: 50%;
  pointer-events: none;
}

html[data-astra-skin="blue-white"] .market-showcase-art::before {
  width: 280px;
  height: 148px;
  top: 68px;
  right: 24px;
  transform: rotate(-26deg);
}

html[data-astra-skin="blue-white"] .market-showcase-art::after {
  width: 242px;
  height: 122px;
  top: 80px;
  right: 43px;
  border-style: dashed;
  border-color: rgba(8, 145, 178, 0.18);
  transform: rotate(24deg);
}

html[data-astra-skin="blue-white"] .glass-sphere {
  border-color: rgba(228, 224, 255, 0.68);
  background: radial-gradient(circle at 28% 22%, #fff 0 3%, #6331b4 7%, #4c99e1 34%, #4b7ba8 69%, #efe8fa 100%);
  box-shadow: inset -10px -12px 24px rgba(99, 49, 180, 0.14), inset 8px 7px 17px rgba(255, 255, 255, 0.24), 0 22px 48px rgba(99, 49, 180, 0.34);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .mainnet-market-showcase .glass-sphere {
  animation: starrail-node-drift-blue-white 12s ease-in-out infinite alternate;
}

@keyframes starrail-node-drift-blue-white {
  from { translate: 0 0; }
  to { translate: 0 -5px; }
}

html[data-astra-skin="blue-white"] .showcase-float-card {
  border-color: rgba(8, 145, 178, 0.2);
  color: var(--star-platinum);
  background: linear-gradient(145deg, rgba(245, 251, 255, 0.97), rgba(255, 255, 255, 0.97));
  box-shadow: 0 22px 48px rgba(99, 49, 180, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.055);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .showcase-float-card span,
html[data-astra-skin="blue-white"] .showcase-float-card svg,
html[data-astra-skin="blue-white"] .mainnet-market-item-id strong,
html[data-astra-skin="blue-white"] .mainnet-market-buy-label {
  color: #6331b4;
}

html[data-astra-skin="blue-white"] .showcase-float-card strong {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .orbit {
  border-color: rgba(96, 184, 231, 0.18);
}

html[data-astra-skin="blue-white"] .crystal-layer {
  border-color: rgba(230, 233, 241, 0.16);
  box-shadow: 15px 18px 28px rgba(99, 49, 180, 0.2);
}

html[data-astra-skin="blue-white"] .layer-back { background: linear-gradient(150deg, rgba(103, 116, 143, 0.62), rgba(177, 220, 241, 0.72)); }
html[data-astra-skin="blue-white"] .layer-middle { background: linear-gradient(150deg, rgba(142, 207, 234, 0.84), rgba(101, 181, 220, 0.72)); }
html[data-astra-skin="blue-white"] .layer-front { background: linear-gradient(135deg, rgba(222, 244, 252, 0.92), rgba(121, 196, 231, 0.72)); }

html[data-astra-skin="blue-white"] .market-zone,
html[data-astra-skin="blue-white"] .auto-buy-panel {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.98));
}

html[data-astra-skin="blue-white"] .market-zone-purchase {
  border-color: var(--star-line);
  background: #efe8fa;
}

html[data-astra-skin="blue-white"] .market-price-chip {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #faf7ff;
}

html[data-astra-skin="blue-white"] .market-price-chip small,
html[data-astra-skin="blue-white"] .market-price-more,
html[data-astra-skin="blue-white"] .market-selected-price span,
html[data-astra-skin="blue-white"] .market-selected-price small,
html[data-astra-skin="blue-white"] .market-quantity-control,
html[data-astra-skin="blue-white"] .market-zone-total,
html[data-astra-skin="blue-white"] .market-zone-total span {
  color: var(--star-muted);
}

html[data-astra-skin="blue-white"] .market-price-chip.active {
  border-color: rgba(132, 82, 214, 0.42);
  color: var(--star-platinum);
  background: linear-gradient(135deg, rgba(132, 82, 214, 0.9), rgba(76, 126, 213, 0.82));
}

html[data-astra-skin="blue-white"] .market-price-chip.active small {
  color: #ffffff;
}

html[data-astra-skin="blue-white"] .price-chip {
  border-color: var(--star-line);
  color: var(--star-muted);
  background: #faf7ff;
}

html[data-astra-skin="blue-white"] .price-chip.active {
  border-color: rgba(8, 145, 178, 0.36);
  color: var(--star-platinum);
  background: linear-gradient(135deg, rgba(132, 82, 214, 0.22), rgba(8, 145, 178, 0.11));
}

html[data-astra-skin="blue-white"] .market-quantity-stepper {
  border-color: var(--star-line);
  background: #faf7ff;
}

html[data-astra-skin="blue-white"] .market-quantity-stepper button {
  color: #0e7490;
}

html[data-astra-skin="blue-white"] .market-quantity-stepper button:hover:not(:disabled) {
  background: rgba(132, 82, 214, 0.17);
}

html[data-astra-skin="blue-white"] .market-quantity-stepper button:disabled {
  color: #76668b;
}

html[data-astra-skin="blue-white"] .market-quantity-stepper strong,
html[data-astra-skin="blue-white"] .market-selected-price strong,
html[data-astra-skin="blue-white"] .market-zone-total strong {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .market-zone-tabs,
html[data-astra-skin="blue-white"] .admin-tabs,
html[data-astra-skin="blue-white"] .mainnet-section-nav,
html[data-astra-skin="blue-white"] .mainnet-admin-data-tabs {
  border-color: var(--star-line);
  background: #faf7ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .market-zone-tabs button,
html[data-astra-skin="blue-white"] .admin-tab,
html[data-astra-skin="blue-white"] .mainnet-section-nav button,
html[data-astra-skin="blue-white"] .mainnet-admin-data-tabs button,
html[data-astra-skin="blue-white"] .tab-trigger,
html[data-astra-skin="blue-white"] .filter-pill,
html[data-astra-skin="blue-white"] .price-filter-button,
html[data-astra-skin="blue-white"] .admin-subtabs button {
  color: var(--star-muted);
  background: transparent;
}

html[data-astra-skin="blue-white"] .market-zone-tabs button.active,
html[data-astra-skin="blue-white"] .admin-tab.active,
html[data-astra-skin="blue-white"] .mainnet-section-nav button.active,
html[data-astra-skin="blue-white"] .mainnet-admin-data-tabs button.active,
html[data-astra-skin="blue-white"] .tab-trigger[data-state='active'],
html[data-astra-skin="blue-white"] .filter-pill.active,
html[data-astra-skin="blue-white"] .price-filter-button.active,
html[data-astra-skin="blue-white"] .admin-subtabs button.active {
  border-color: rgba(8, 145, 178, 0.25);
  color: var(--star-platinum);
  background: linear-gradient(135deg, rgba(132, 82, 214, 0.24), rgba(8, 145, 178, 0.12));
  box-shadow: inset 0 0 0 1px rgba(8, 145, 178, 0.1);
}

html[data-astra-skin="blue-white"] .market-zone-heading h2,
html[data-astra-skin="blue-white"] .product-bottom strong,
html[data-astra-skin="blue-white"] .mainnet-market-item-select strong {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .market-zone-heading p,
html[data-astra-skin="blue-white"] .market-price-search-hint,
html[data-astra-skin="blue-white"] .market-price-clear,
html[data-astra-skin="blue-white"] .mainnet-market-item-select small {
  color: var(--star-muted);
}

html[data-astra-skin="blue-white"] .mainnet-market-item {
  border-color: var(--star-line);
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(99, 49, 180, 0.16);
}

html[data-astra-skin="blue-white"] .mainnet-market-item:hover {
  border-color: rgba(8, 145, 178, 0.36);
  background: #faf7ff;
  box-shadow: 0 12px 32px rgba(99, 49, 180, 0.22);
}

html[data-astra-skin="blue-white"] .mainnet-market-item-select {
  color: var(--star-platinum-soft);
}

html[data-astra-skin="blue-white"] .product-art-1,
html[data-astra-skin="blue-white"] .product-art-2,
html[data-astra-skin="blue-white"] .product-art-3,
html[data-astra-skin="blue-white"] .product-art-4,
html[data-astra-skin="blue-white"] .product-art-5,
html[data-astra-skin="blue-white"] .product-art-6 {
  background: linear-gradient(135deg, #efe8fa, #f1f8ff 62%, #faf7ff);
}

html[data-astra-skin="blue-white"] .product-sculpture {
  filter: saturate(0.55) brightness(0.9);
}

html[data-astra-skin="blue-white"] .product-bottom,
html[data-astra-skin="blue-white"] .position-actions,
html[data-astra-skin="blue-white"] .compact-history-row,
html[data-astra-skin="blue-white"] .history-row {
  border-color: var(--star-line);
}

html[data-astra-skin="blue-white"] .empty-state {
  color: var(--star-muted);
}

html[data-astra-skin="blue-white"] .empty-state h2,
html[data-astra-skin="blue-white"] .empty-state h3 {
  color: #6331b4;
}

/* Asset, team and ledger modules. */
html[data-astra-skin="blue-white"] .release-donut {
  background: conic-gradient(#8452d6 0 22%, #0891b2 22% 30%, #efe8fa 30% 100%);
}

html[data-astra-skin="blue-white"] .release-donut > span {
  color: #6331b4;
  background: #ffffff;
}

html[data-astra-skin="blue-white"] .legend-dot.purple { background: #8452d6; }
html[data-astra-skin="blue-white"] .legend-dot.pale { background: #0891b2; }

html[data-astra-skin="blue-white"] .ledger-summary > div,
html[data-astra-skin="blue-white"] .mainnet-summary-list > div,
html[data-astra-skin="blue-white"] .mainnet-transaction-summary > div,
html[data-astra-skin="blue-white"] .financial-quote-grid > div,
html[data-astra-skin="blue-white"] .settlement-asset,
html[data-astra-skin="blue-white"] .settlement-flow,
html[data-astra-skin="blue-white"] .premium-pool-grid > div {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #faf7ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

html[data-astra-skin="blue-white"] .team-reference-table th,
html[data-astra-skin="blue-white"] .team-tree-line,
html[data-astra-skin="blue-white"] .team-direct-summary > strong {
  color: #6331b4;
}

html[data-astra-skin="blue-white"] .team-reference-table td,
html[data-astra-skin="blue-white"] .team-reference-table th {
  border-color: var(--star-line);
}

html[data-astra-skin="blue-white"] .team-direct-summary,
html[data-astra-skin="blue-white"] .team-tree-node,
html[data-astra-skin="blue-white"] .team-direct-chip {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #faf7ff;
}

html[data-astra-skin="blue-white"] .team-tree-toggle {
  color: #6331b4;
  background: linear-gradient(145deg, rgba(132, 82, 214, 0.2), rgba(8, 145, 178, 0.11));
}

html[data-astra-skin="blue-white"] .team-tree-summary span,
html[data-astra-skin="blue-white"] .team-tree-node small,
html[data-astra-skin="blue-white"] .team-direct-chip small {
  color: var(--star-muted);
}

html[data-astra-skin="blue-white"] .copy-field input {
  color: var(--star-platinum-soft);
  background: #faf7ff;
}

/* Dense data and administration. */
html[data-astra-skin="blue-white"] .admin-table,
html[data-astra-skin="blue-white"] .mainnet-data-table,
html[data-astra-skin="blue-white"] .team-reference-table {
  color: var(--star-platinum-soft);
}

html[data-astra-skin="blue-white"] .admin-table th,
html[data-astra-skin="blue-white"] .mainnet-data-table th {
  color: #76668b;
}

html[data-astra-skin="blue-white"] .admin-table td,
html[data-astra-skin="blue-white"] .mainnet-data-table td {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: rgba(255, 255, 255, 0.96);
}

html[data-astra-skin="blue-white"] .admin-table td:first-child {
  border-left-color: var(--star-line);
}

html[data-astra-skin="blue-white"] .admin-table td:last-child {
  border-right-color: var(--star-line);
}

html[data-astra-skin="blue-white"] .admin-user-table code,
html[data-astra-skin="blue-white"] .mainnet-data-table code,
html[data-astra-skin="blue-white"] .mainnet-command-reference code,
html[data-astra-skin="blue-white"] .team-tree-node code {
  color: #6331b4;
}

html[data-astra-skin="blue-white"] .admin-icon-button,
html[data-astra-skin="blue-white"] .admin-role-icon,
html[data-astra-skin="blue-white"] .mainnet-copy-button {
  border-color: var(--star-line);
  color: #0e7490;
  background: #efe8fa;
}

html[data-astra-skin="blue-white"] .admin-icon-button:hover,
html[data-astra-skin="blue-white"] .admin-icon-button:focus-visible {
  color: #ffffff;
  background: linear-gradient(135deg, #efe8fa, #e8dff6);
}

html[data-astra-skin="blue-white"] .mainnet-admin-panel {
  border-top-color: var(--star-line);
}

html[data-astra-skin="blue-white"] .mainnet-admin-identity,
html[data-astra-skin="blue-white"] .mainnet-admin-capability-grid article,
html[data-astra-skin="blue-white"] .mainnet-admin-form-grid .admin-checkbox-field,
html[data-astra-skin="blue-white"] .admin-user-detail-actions .admin-checkbox-field {
  border-color: var(--star-line);
  color: var(--star-muted);
  background: #ffffff;
}

html[data-astra-skin="blue-white"] .mainnet-admin-capability-grid article strong,
html[data-astra-skin="blue-white"] .mainnet-asset-history h3 {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .mainnet-admin-capability-grid article p,
html[data-astra-skin="blue-white"] .mainnet-account-toolbar {
  color: var(--star-muted);
}

html[data-astra-skin="blue-white"] .mainnet-admin-status {
  color: #6331b4;
  background: linear-gradient(135deg, rgba(132, 82, 214, 0.17), rgba(8, 145, 178, 0.08));
}

html[data-astra-skin="blue-white"] .mainnet-admin-status.status-approved,
html[data-astra-skin="blue-white"] .mainnet-admin-status.status-routed {
  color: #80500d;
  background: rgba(165, 115, 51, 0.14);
}

html[data-astra-skin="blue-white"] .mainnet-admin-status.status-settled,
html[data-astra-skin="blue-white"] .mainnet-admin-status.status-completed,
html[data-astra-skin="blue-white"] .mainnet-admin-identity .is-ready,
html[data-astra-skin="blue-white"] .mainnet-window-state {
  color: #147d59;
  background: rgba(73, 139, 113, 0.13);
}

html[data-astra-skin="blue-white"] .mainnet-admin-status.status-retry_pending,
html[data-astra-skin="blue-white"] .mainnet-admin-identity .is-warning {
  color: #a52f48;
  background: rgba(159, 63, 75, 0.13);
}

html[data-astra-skin="blue-white"] .mainnet-operation-gates span {
  border-color: rgba(211, 170, 105, 0.18);
  background: rgba(211, 170, 105, 0.08);
}

html[data-astra-skin="blue-white"] .mainnet-login-hint,
html[data-astra-skin="blue-white"] .mainnet-unavailable-panel {
  border-color: rgba(8, 145, 178, 0.26);
  color: #6331b4;
  background: linear-gradient(135deg, rgba(132, 82, 214, 0.11), rgba(8, 145, 178, 0.055));
}

html[data-astra-skin="blue-white"] .mainnet-login-hint p,
html[data-astra-skin="blue-white"] .mainnet-unavailable-panel p,
html[data-astra-skin="blue-white"] .mainnet-summary-list dt,
html[data-astra-skin="blue-white"] .mainnet-transaction-summary dt {
  color: var(--star-muted);
}

html[data-astra-skin="blue-white"] .mainnet-summary-list dd,
html[data-astra-skin="blue-white"] .mainnet-transaction-summary dd,
html[data-astra-skin="blue-white"] .mainnet-status-metrics .metric-card strong {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .date-range-popover {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #f6f2fc;
  box-shadow: 0 24px 70px rgba(99, 49, 180, 0.42);
}

html[data-astra-skin="blue-white"] .rdp-root {
  --rdp-accent-color: #8452d6;
  --rdp-accent-background-color: rgba(132, 82, 214, 0.2);
}

/* Dialogs and transactional overlays. */
html[data-astra-skin="blue-white"] .dialog-overlay {
  background: rgba(99, 49, 180, 0.18) !important;
  backdrop-filter: blur(9px);
}

html[data-astra-skin="blue-white"] .dialog-content,
html[data-astra-skin="blue-white"] .dialog-content.invite-gate {
  border-color: rgba(8, 145, 178, 0.2);
  color: var(--star-platinum-soft);
  background: #ffffff;
  box-shadow: 0 36px 110px rgba(99, 49, 180, 0.56), inset 0 1px 0 rgba(255, 255, 255, 0.045);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .dialog-title {
  color: var(--star-platinum);
}

html[data-astra-skin="blue-white"] .dialog-description,
html[data-astra-skin="blue-white"] .mainnet-command-reference {
  color: var(--star-muted);
}

html[data-astra-skin="blue-white"] .dialog-close {
  border-color: var(--star-line);
  color: #6331b4;
  background: #efe8fa;
}

html[data-astra-skin="blue-white"] .dialog-close:hover,
html[data-astra-skin="blue-white"] .dialog-close:focus-visible {
  color: #ffffff;
  background: linear-gradient(135deg, #efe8fa, #8452d6);
}

html[data-astra-skin="blue-white"] .invite-gate-field,
html[data-astra-skin="blue-white"] .form-label {
  color: var(--star-platinum-soft);
}

/* Footer and minor chrome. */
html[data-astra-skin="blue-white"] .page-footer {
  border-color: var(--star-line);
  color: #76668b;
}

html[data-astra-skin="blue-white"] .price-ticker,
html[data-astra-skin="blue-white"] .mainnet-announcement-ticker {
  border-color: var(--star-line);
  color: var(--star-platinum-soft);
  background: #faf7ff;
  box-shadow: 0 10px 28px rgba(99, 49, 180, 0.16);
  backdrop-filter: none;
}

html[data-astra-skin="blue-white"] .price-ticker-label,
html[data-astra-skin="blue-white"] .mainnet-announcement-label {
  color: #2a1850;
  background: linear-gradient(135deg, #efe8fa, #8452d6 56%, #a878e8);
}

html[data-astra-skin="blue-white"] .price-ticker-item b { color: #0e7490; }
html[data-astra-skin="blue-white"] .price-ticker-item small { color: var(--star-muted); }
html[data-astra-skin="blue-white"] .mainnet-announcement-moving-title {
  color: #34214f;
  text-shadow: none;
}

/* Responsive starrail treatment. Existing feature media queries continue to
   own content reflow; this layer only adjusts the shared shell and density. */
@media (max-width: 720px) {
  html[data-astra-skin="blue-white"] .ambient-orb-one {
    width: 430px;
    height: 250px;
    top: -110px;
    right: -210px;
  }

  html[data-astra-skin="blue-white"] .ambient-orb-two {
    width: 330px;
    height: 190px;
    left: -130px;
    bottom: 10%;
  }

  html[data-astra-skin="blue-white"] .ambient-grid {
    opacity: 0.36;
    animation: none;
  }

  html[data-astra-skin="blue-white"] .topbar {
    position: sticky;
    border-color: var(--star-line);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 16px 38px rgba(99, 49, 180, 0.3);
    backdrop-filter: none;
  }

  html[data-astra-skin="blue-white"] .mobile-nav {
    position: fixed;
    border-color: var(--star-line);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 22px 54px rgba(99, 49, 180, 0.44);
    backdrop-filter: none;
  }

  html[data-astra-skin="blue-white"] .mobile-nav button {
    color: #76668b;
  }

  html[data-astra-skin="blue-white"] .mobile-nav button.active {
    color: var(--star-platinum);
    background: linear-gradient(145deg, rgba(132, 82, 214, 0.2), rgba(8, 145, 178, 0.1));
  }

  html[data-astra-skin="blue-white"] .mobile-nav button.active::after {
    content: '';
    position: absolute;
    right: 24%;
    bottom: 3px;
    left: 24%;
    height: 2px;
    border-radius: 99px;
    background: linear-gradient(90deg, #a878e8, #0891b2);
    box-shadow: 0 0 10px rgba(132, 82, 214, 0.28);
  }

  html[data-astra-skin="blue-white"] .market-showcase-copy {
    padding: 26px 24px 20px;
  }

  html[data-astra-skin="blue-white"] .market-showcase-art {
    min-height: 170px;
  }

  html[data-astra-skin="blue-white"] .market-showcase-art::before {
    width: 240px;
    height: 120px;
    top: 30px;
    right: calc(50% - 120px);
  }

  html[data-astra-skin="blue-white"] .market-showcase-art::after {
    width: 210px;
    height: 104px;
    top: 42px;
    right: calc(50% - 105px);
  }

  html[data-astra-skin="blue-white"] .sphere-large { top: 8px; }
  html[data-astra-skin="blue-white"] .sphere-medium { top: 42px; }

  html[data-astra-skin="blue-white"] .mainnet-admin-data-dashboard {
    border-color: var(--star-line);
    background: #faf7ff;
  }

  html[data-astra-skin="blue-white"] .admin-page-scope .mainnet-admin-user-table tbody tr {
    border-color: var(--star-line);
    background: #ffffff;
  }
}

@media (max-width: 480px) {
  html[data-astra-skin="blue-white"] .page-heading h1 {
    font-size: 24px;
  }

  html[data-astra-skin="blue-white"] .market-showcase h2 {
    font-size: clamp(28px, 9vw, 36px);
  }

  html[data-astra-skin="blue-white"] .market-showcase-copy > p {
    line-height: 1.75;
  }

  html[data-astra-skin="blue-white"] .showcase-stats > div {
    padding: 10px 8px;
  }

  html[data-astra-skin="blue-white"] .surface-panel,
html[data-astra-skin="blue-white"] .position-card {
    border-radius: 15px;
  }

  html[data-astra-skin="blue-white"] .metric-card {
    min-height: 112px;
    border-radius: 13px;
  }

  html[data-astra-skin="blue-white"] .dialog-content,
html[data-astra-skin="blue-white"] .dialog-content.invite-gate {
    border-radius: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-astra-skin="blue-white"] .ambient-orb-one,
html[data-astra-skin="blue-white"] .ambient-orb-two,
html[data-astra-skin="blue-white"] .ambient-grid,
html[data-astra-skin="blue-white"] .status-dot,
html[data-astra-skin="blue-white"] .page-heading,
html[data-astra-skin="blue-white"] .mainnet-market-showcase .glass-sphere,
html[data-astra-skin="blue-white"] .mainnet-market-showcase .showcase-float-card {
    animation: none !important;
  }

  html[data-astra-skin="blue-white"] .button,
html[data-astra-skin="blue-white"] .surface-panel,
html[data-astra-skin="blue-white"] .metric-card,
html[data-astra-skin="blue-white"] .position-card,
html[data-astra-skin="blue-white"] .product-card,
html[data-astra-skin="blue-white"] .chain-card,
html[data-astra-skin="blue-white"] .mainnet-market-item,
html[data-astra-skin="blue-white"] .nav-item {
    transition: none !important;
  }
}

/* --------------------------------------------------------------------------
 * 星轨网络正式布局
 *
 * 这一层不再只是换肤：它把主网页面的信息顺序、密度与组合方式对齐
 * 已确认的手机模板，同时让桌面端自然扩展。所有业务字段和按钮仍由原组件
 * 提供，本层只负责结构呈现。
 * -------------------------------------------------------------------------- */
html[data-astra-skin="blue-white"] .star-network-layout .page-shell {
  width: min(100%, 1240px);
  padding-inline: clamp(18px, 3vw, 42px);
}

@media (min-width: 721px) {
  html[data-astra-skin="blue-white"] .star-network-layout.app-shell {
    display: block;
    padding: 12px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .sidebar {
    position: sticky;
    z-index: 20;
    top: 12px;
    width: 100%;
    height: 60px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    padding: 7px 10px;
    border: 1px solid var(--star-line);
    border-radius: 14px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .brand {
    width: 116px;
    flex: 0 0 auto;
    padding: 0 8px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .brand-logo {
    width: 96px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .nav-caption,
html[data-astra-skin="blue-white"] .star-network-layout .sidebar-foot {
    display: none;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .navigation {
    display: flex;
    flex: 1 1 auto;
    flex-direction: row;
    gap: 4px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .nav-item {
    width: auto;
    min-width: 112px;
    justify-content: center;
    gap: 7px;
    padding: 10px 12px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .nav-item.active::before {
    width: 24px;
    height: 2px;
    inset: auto auto 3px 50%;
    transform: translateX(-50%);
  }

  html[data-astra-skin="blue-white"] .star-network-layout .sidebar-bottom {
    margin: 0 0 0 auto;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .network-card {
    min-width: 174px;
    padding: 8px 10px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .network-card small {
    margin-top: 2px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .topbar {
    position: sticky;
    z-index: 18;
    top: 84px;
    height: 58px;
    margin-top: 8px;
    padding-inline: 18px;
  }
}

html[data-astra-skin="blue-white"] .star-network-brand {
  display: grid;
  gap: 3px;
  padding: 0;
  border: 0;
  color: inherit;
  text-align: left;
  background: transparent;
  cursor: pointer;
}

html[data-astra-skin="blue-white"] .star-network-brand small {
  color: var(--star-faint);
  font-size: 10px;
  letter-spacing: 0.12em;
}

html[data-astra-skin="blue-white"] .star-network-brand strong {
  color: transparent;
  background: linear-gradient(112deg, #6331b4 4%, #8452d6 46%, #a878e8 96%);
  background-clip: text;
  -webkit-background-clip: text;
  font-size: 17px;
  font-weight: 560;
  letter-spacing: 0.04em;
  text-shadow: 0 0 24px rgba(132, 82, 214, 0.18);
}

html[data-astra-skin="blue-white"] .star-template-page {
  display: grid;
  gap: 12px;
}

html[data-astra-skin="blue-white"] .star-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin: 2px 0 6px;
}

html[data-astra-skin="blue-white"] .star-page-heading::before {
  content: none;
}

html[data-astra-skin="blue-white"] .star-page-heading > div:first-child {
  min-width: 0;
}

html[data-astra-skin="blue-white"] .star-page-heading h1 {
  margin: 0;
  font-size: clamp(27px, 3vw, 38px);
  font-weight: 520;
  letter-spacing: -0.035em;
}

html[data-astra-skin="blue-white"] .star-page-heading p {
  margin: 7px 0 0;
}

html[data-astra-skin="blue-white"] .star-page-status {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border: 1px solid var(--star-line);
  border-radius: 999px;
  color: var(--star-muted);
  background: rgba(255, 255, 255, 0.88);
  font-size: 12px;
}

html[data-astra-skin="blue-white"] .star-page-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--star-lilac-strong), var(--star-blue));
  box-shadow: 0 0 12px rgba(132, 82, 214, 0.46);
}

html[data-astra-skin="blue-white"] .star-market-hero,
html[data-astra-skin="blue-white"] .star-balance-hero,
html[data-astra-skin="blue-white"] .star-packages-summary,
html[data-astra-skin="blue-white"] .star-team-overview {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(8, 145, 178, 0.2);
  border-radius: 16px;
  color: var(--star-platinum);
  background:
    radial-gradient(circle at 82% 10%, rgba(8, 145, 178, 0.22), transparent 28%),
    radial-gradient(circle at 92% 80%, rgba(8, 145, 178, 0.11), transparent 30%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(255, 255, 255, 0.98));
  box-shadow: 0 18px 44px rgba(99, 49, 180, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

html[data-astra-skin="blue-white"] .star-market-hero,
html[data-astra-skin="blue-white"] .star-balance-hero {
  min-height: 154px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 26px;
}

html[data-astra-skin="blue-white"] .star-market-hero small,
html[data-astra-skin="blue-white"] .star-balance-hero small,
html[data-astra-skin="blue-white"] .star-packages-summary small {
  color: var(--star-muted);
  font-size: 12px;
}

html[data-astra-skin="blue-white"] .star-market-hero strong,
html[data-astra-skin="blue-white"] .star-balance-hero strong,
html[data-astra-skin="blue-white"] .star-packages-summary > div:first-child > strong {
  display: block;
  margin: 7px 0 4px;
  font-size: clamp(30px, 4vw, 46px);
  font-weight: 520;
  letter-spacing: -0.04em;
}

html[data-astra-skin="blue-white"] .star-market-hero strong em,
html[data-astra-skin="blue-white"] .star-balance-hero strong em,
html[data-astra-skin="blue-white"] .star-packages-summary strong em {
  color: var(--star-platinum-soft);
  font-size: 0.4em;
  font-style: normal;
  letter-spacing: 0;
}

html[data-astra-skin="blue-white"] .star-market-hero p,
html[data-astra-skin="blue-white"] .star-balance-hero p,
html[data-astra-skin="blue-white"] .star-packages-summary p {
  margin: 0;
  color: var(--star-muted);
  font-size: 13px;
}

html[data-astra-skin="blue-white"] .star-orbit-mark {
  position: relative;
  width: 210px;
  height: 104px;
  flex: 0 0 auto;
}

html[data-astra-skin="blue-white"] .star-orbit-mark i {
  position: absolute;
  border: 1px solid rgba(199, 180, 255, 0.28);
  border-radius: 50%;
}

html[data-astra-skin="blue-white"] .star-orbit-mark i:nth-child(1) {
  inset: 9px 2px 12px 7px;
  transform: rotate(-18deg);
  animation: star-template-orbit-blue-white 20s linear infinite;
}

html[data-astra-skin="blue-white"] .star-orbit-mark i:nth-child(2) {
  width: 88px;
  height: 88px;
  top: 8px;
  right: 35px;
  border-color: rgba(8, 145, 178, 0.24);
  animation: star-template-orbit-blue-white 26s linear infinite reverse;
}

html[data-astra-skin="blue-white"] .star-orbit-mark i:nth-child(3) {
  width: 8px;
  height: 8px;
  top: 25px;
  right: 61px;
  border: 0;
  background: #faf7ff;
  box-shadow: 0 0 18px rgba(132, 82, 214, 0.9), 0 0 28px rgba(8, 145, 178, 0.3);
  animation: star-template-node-blue-white 4.8s ease-in-out infinite;
}

@keyframes star-template-orbit-blue-white { to { transform: rotate(342deg); } }
@keyframes star-template-node-blue-white { 50% { opacity: 0.45; transform: translateY(7px); } }

html[data-astra-skin="blue-white"] .star-market-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="blue-white"] .star-market-metrics > div,
html[data-astra-skin="blue-white"] .star-packages-summary-facts > span,
html[data-astra-skin="blue-white"] .star-team-facts > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(189, 180, 235, 0.14);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.86);
}

html[data-astra-skin="blue-white"] .star-market-metrics span,
html[data-astra-skin="blue-white"] .star-packages-summary-facts span,
html[data-astra-skin="blue-white"] .star-team-facts span {
  display: block;
  color: var(--star-muted);
  font-size: 11px;
}

html[data-astra-skin="blue-white"] .star-market-metrics strong,
html[data-astra-skin="blue-white"] .star-packages-summary-facts strong,
html[data-astra-skin="blue-white"] .star-team-facts strong {
  display: block;
  margin-top: 5px;
  overflow-wrap: anywhere;
  color: var(--star-platinum);
  font-size: 15px;
  font-weight: 520;
}

html[data-astra-skin="blue-white"] .star-template-market .mainnet-account-toolbar {
  margin: 0;
}

html[data-astra-skin="blue-white"] .star-template-market .auto-buy-panel {
  padding: 14px 16px;
  border-radius: 10px;
  border-left: 2px solid rgba(8, 145, 178, 0.68);
}

html[data-astra-skin="blue-white"] .star-template-market .auto-buy-panel .panel-heading {
  margin-bottom: 6px;
}

html[data-astra-skin="blue-white"] .star-template-market .market-zone-tabs {
  width: fit-content;
  margin: 2px 0 0;
  padding: 4px;
  border-radius: 12px;
}

html[data-astra-skin="blue-white"] .star-template-market .market-zone-tabs button {
  min-width: 112px;
  padding: 9px 15px;
  border-radius: 9px;
}

html[data-astra-skin="blue-white"] .star-template-market .market-zone-tabs button.active {
  color: #f1f8ff;
  background: linear-gradient(135deg, #efe8fa, #8452d6 55%, #a878e8);
}

html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-zone {
  padding: 16px;
  border-radius: 14px;
}

html[data-astra-skin="blue-white"] .star-template-market .market-zone-heading {
  display: flex;
  margin-bottom: 10px;
}

html[data-astra-skin="blue-white"] .star-template-market .market-zone-heading .position-id {
  display: none;
}

html[data-astra-skin="blue-white"] .star-template-market .market-zone-heading h2 {
  margin-bottom: 2px;
  font-size: 16px;
}

html[data-astra-skin="blue-white"] .star-template-market .market-zone-heading p {
  font-size: 11px;
}

html[data-astra-skin="blue-white"] .star-template-market .market-price-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 11px;
}

html[data-astra-skin="blue-white"] .star-template-market .market-price-search-hint {
  margin: 0;
  text-align: right;
}

html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-list {
  max-width: none;
}

html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item {
  border-radius: 10px;
  border-left: 2px solid rgba(8, 145, 178, 0.68);
  box-shadow: none;
}

html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-select {
  grid-template-columns: minmax(180px, 1.5fr) minmax(120px, 0.7fr) auto;
  min-height: 68px;
  padding: 9px 12px;
}

html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-buy-label {
  min-width: 82px;
  justify-content: center;
  padding: 9px 11px;
  border-radius: 9px;
  color: #f1f8ff;
  background: linear-gradient(135deg, #efe8fa, #8452d6 55%, #a878e8);
}

html[data-astra-skin="blue-white"] .star-balance-hero {
  min-height: 142px;
}

html[data-astra-skin="blue-white"] .star-secondary-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="blue-white"] .star-secondary-metrics .metric-card {
  min-height: 112px;
  padding: 14px;
  border-radius: 9px;
}

html[data-astra-skin="blue-white"] .star-secondary-metrics .metric-value {
  margin-top: 10px;
  font-size: clamp(22px, 2.6vw, 30px);
}

html[data-astra-skin="blue-white"] .star-asset-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

html[data-astra-skin="blue-white"] .star-asset-actions > .surface-panel {
  min-width: 0;
  margin: 0;
  padding: 16px;
  border-radius: 12px;
}

html[data-astra-skin="blue-white"] .star-asset-actions .panel-heading {
  align-items: flex-start;
}

html[data-astra-skin="blue-white"] .star-asset-actions .inline-actions {
  margin-top: 12px;
}

html[data-astra-skin="blue-white"] .star-packages-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  align-items: center;
  gap: 24px;
  padding: 22px 24px;
}

html[data-astra-skin="blue-white"] .star-packages-summary-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="blue-white"] .star-template-packages .package-list-panel {
  padding: 16px;
}

html[data-astra-skin="blue-white"] .star-template-packages .position-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card {
  min-width: 0;
  margin: 0;
  border-radius: 12px;
  border-left: 2px solid rgba(8, 145, 178, 0.68);
}

html[data-astra-skin="blue-white"] .star-template-packages .position-details {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-astra-skin="blue-white"] .star-team-overview {
  padding: 20px;
}

html[data-astra-skin="blue-white"] .star-team-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

html[data-astra-skin="blue-white"] .star-team-level {
  width: 62px;
  height: 62px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 18px;
  color: #f1f8ff;
  background: linear-gradient(145deg, #ffffff, #6331b4 58%, #c9a8ff);
  box-shadow: 0 0 28px rgba(132, 82, 214, 0.25);
  font-size: 21px;
  font-weight: 560;
}

html[data-astra-skin="blue-white"] .star-team-invite {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 3px 12px;
  text-align: right;
}

html[data-astra-skin="blue-white"] .star-team-invite small {
  grid-column: 1 / -1;
  color: var(--star-muted);
  font-size: 11px;
}

html[data-astra-skin="blue-white"] .star-team-invite strong {
  overflow: hidden;
  color: var(--star-platinum);
  font-size: 17px;
  text-overflow: ellipsis;
}

html[data-astra-skin="blue-white"] .star-team-level-note {
  margin: 8px 0 12px;
  color: var(--star-muted);
  font-size: 12px;
}

html[data-astra-skin="blue-white"] .star-team-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="blue-white"] .star-inline-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
  padding: 0;
  border: 0;
  color: var(--star-lilac-strong);
  background: transparent;
  font-weight: 600;
  cursor: pointer;
}

html[data-astra-skin="blue-white"] .star-team-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
  padding: 11px 12px;
  border: 1px solid var(--star-line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.035);
}

html[data-astra-skin="blue-white"] .star-team-link > div {
  min-width: 0;
}

html[data-astra-skin="blue-white"] .star-team-link span {
  color: var(--star-muted);
  font-size: 11px;
}

html[data-astra-skin="blue-white"] .star-team-link p {
  margin: 3px 0 0;
  overflow: hidden;
  color: var(--star-platinum-soft);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-astra-skin="blue-white"] .star-template-team .mainnet-readonly-panel {
  border-radius: 12px;
}

html[data-astra-skin="blue-white"] .star-template-admin .mainnet-admin-panel {
  display: grid;
  gap: 10px;
}

html[data-astra-skin="blue-white"] .star-template-admin .mainnet-admin-identity {
  margin: 0;
  padding: 11px 13px;
  border-radius: 10px;
}

html[data-astra-skin="blue-white"] .star-template-admin .admin-tabs,
html[data-astra-skin="blue-white"] .star-template-admin .mainnet-admin-data-tabs {
  position: sticky;
  top: 76px;
  z-index: 5;
  margin: 0;
  padding: 4px;
  border-radius: 11px;
}

html[data-astra-skin="blue-white"] .star-template-admin .mainnet-admin-data-dashboard,
html[data-astra-skin="blue-white"] .star-template-admin .mainnet-admin-section,
html[data-astra-skin="blue-white"] .star-template-admin .admin-panel {
  border-radius: 12px;
}

html[data-astra-skin="blue-white"] .star-template-admin .mainnet-admin-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

html[data-astra-skin="blue-white"] .star-template-admin .metrics-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

html[data-astra-skin="blue-white"] .star-template-admin .metric-card {
  min-height: 104px;
  padding: 13px;
  border-radius: 10px;
}

@media (max-width: 980px) {
  html[data-astra-skin="blue-white"] .star-template-packages .position-list,
html[data-astra-skin="blue-white"] .star-asset-actions,
html[data-astra-skin="blue-white"] .star-template-admin .mainnet-admin-grid {
    grid-template-columns: 1fr;
  }

  html[data-astra-skin="blue-white"] .star-template-admin .metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  html[data-astra-skin="blue-white"] .star-network-layout {
    padding: 0;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .main-shell {
    min-width: 0;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .topbar {
    height: 76px;
    padding: 14px 16px 10px;
    border: 0;
    border-radius: 0;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(18px);
  }

  html[data-astra-skin="blue-white"] .star-network-layout .topbar-actions {
    gap: 6px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .demo-chip {
    display: none;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .language-switch {
    min-width: 34px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .page-shell {
    width: 100%;
    padding: 6px 16px calc(92px + env(safe-area-inset-bottom));
  }

  html[data-astra-skin="blue-white"] .star-template-page {
    gap: 10px;
  }

  html[data-astra-skin="blue-white"] .star-page-heading {
    align-items: flex-end;
    margin: 2px 0 5px;
  }

  html[data-astra-skin="blue-white"] .star-page-heading h1 {
    font-size: 26px;
    font-weight: 520;
  }

  html[data-astra-skin="blue-white"] .star-page-heading p {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.45;
  }

  html[data-astra-skin="blue-white"] .star-page-status {
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 11px;
  }

  html[data-astra-skin="blue-white"] .star-market-hero,
html[data-astra-skin="blue-white"] .star-balance-hero {
    min-height: 126px;
    padding: 16px;
  }

  html[data-astra-skin="blue-white"] .star-market-hero strong,
html[data-astra-skin="blue-white"] .star-balance-hero strong,
html[data-astra-skin="blue-white"] .star-packages-summary > div:first-child > strong {
    font-size: 30px;
  }

  html[data-astra-skin="blue-white"] .star-orbit-mark {
    width: 118px;
    height: 82px;
    margin-right: -18px;
  }

  html[data-astra-skin="blue-white"] .star-market-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="blue-white"] .star-template-market .auto-buy-panel {
    padding: 12px;
  }

  html[data-astra-skin="blue-white"] .star-template-market .auto-buy-panel .mainnet-readonly-note,
html[data-astra-skin="blue-white"] .star-template-market .auto-buy-panel .mainnet-inline-note {
    font-size: 11px;
  }

  html[data-astra-skin="blue-white"] .star-template-market .market-zone-tabs {
    width: 100%;
  }

  html[data-astra-skin="blue-white"] .star-template-market .market-zone-tabs button {
    flex: 1;
    min-width: 0;
  }

  html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-zone {
    padding: 11px;
  }

  html[data-astra-skin="blue-white"] .star-template-market .market-price-toolbar {
    display: block;
  }

  html[data-astra-skin="blue-white"] .star-template-market .market-price-search-hint {
    margin-top: 8px;
    text-align: left;
  }

  html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-select {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 64px;
    gap: 4px 10px;
    padding: 10px 11px;
  }

  html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-select > span:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1;
  }

  html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-select > span:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
  }

  html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-buy-label {
    grid-column: 2;
    grid-row: 2;
    min-width: 68px;
    padding: 7px 9px;
  }

  html[data-astra-skin="blue-white"] .star-secondary-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html[data-astra-skin="blue-white"] .star-secondary-metrics .metric-card {
    min-height: 94px;
    padding: 10px 9px;
  }

  html[data-astra-skin="blue-white"] .star-secondary-metrics .metric-top {
    font-size: 10px;
  }

  html[data-astra-skin="blue-white"] .star-secondary-metrics .metric-top svg {
    display: none;
  }

  html[data-astra-skin="blue-white"] .star-secondary-metrics .metric-note {
    margin-top: 6px;
    font-size: 9px;
    line-height: 1.35;
  }

  html[data-astra-skin="blue-white"] .star-secondary-metrics .metric-value {
    font-size: 18px;
  }

  html[data-astra-skin="blue-white"] .star-secondary-metrics .metric-value small {
    display: block;
    margin: 3px 0 0;
    font-size: 9px;
  }

  html[data-astra-skin="blue-white"] .star-asset-actions {
    grid-template-columns: 1fr;
  }

  html[data-astra-skin="blue-white"] .star-asset-actions > .surface-panel {
    padding: 13px;
    border-radius: 10px;
    border-left: 2px solid rgba(8, 145, 178, 0.58);
  }

  html[data-astra-skin="blue-white"] .star-packages-summary {
    grid-template-columns: 1fr;
    gap: 13px;
    padding: 16px;
  }

  html[data-astra-skin="blue-white"] .star-packages-summary-facts,
html[data-astra-skin="blue-white"] .star-template-packages .position-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card {
    grid-column: 1 / -1;
  }

  html[data-astra-skin="blue-white"] .star-template-packages .position-details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="blue-white"] .star-team-overview {
    padding: 15px;
  }

  html[data-astra-skin="blue-white"] .star-team-level {
    width: 56px;
    height: 56px;
  }

  html[data-astra-skin="blue-white"] .star-team-invite {
    grid-template-columns: 1fr;
  }

  html[data-astra-skin="blue-white"] .star-team-invite small {
    grid-column: auto;
  }

  html[data-astra-skin="blue-white"] .star-team-invite .button {
    justify-self: end;
  }

  html[data-astra-skin="blue-white"] .star-team-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="blue-white"] .star-team-link {
    align-items: flex-end;
  }

  html[data-astra-skin="blue-white"] .star-template-team .mainnet-data-table {
    min-width: 620px;
  }

  html[data-astra-skin="blue-white"] .star-template-admin .admin-tabs,
html[data-astra-skin="blue-white"] .star-template-admin .mainnet-admin-data-tabs {
    top: 76px;
    overflow-x: auto;
  }

  html[data-astra-skin="blue-white"] .star-template-admin .metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-astra-skin="blue-white"] .star-network-layout .mobile-nav {
    left: 10px;
    right: 10px;
    bottom: calc(8px + env(safe-area-inset-bottom));
    height: 66px;
    padding: 7px 8px;
    border: 1px solid var(--star-line);
    border-radius: 18px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .page-footer {
    display: none;
  }
}

@media (max-width: 420px) {
  html[data-astra-skin="blue-white"] .star-network-layout .topbar {
    padding-inline: 14px;
  }

  html[data-astra-skin="blue-white"] .star-network-layout .page-shell {
    padding-inline: 14px;
  }

  html[data-astra-skin="blue-white"] .star-network-brand small {
    font-size: 9px;
  }

  html[data-astra-skin="blue-white"] .star-network-brand strong {
    font-size: 15px;
  }

  html[data-astra-skin="blue-white"] .star-team-link {
    display: grid;
  }

  html[data-astra-skin="blue-white"] .star-team-link .button {
    width: 100%;
  }
}
/* Shared mainnet window adaptation for every ASTRA skin. */
.desktop-top-navigation {
  display: none;
}

/* A phone keeps the mobile shell even when its browser reports a wide layout
   viewport (desktop-site mode, landscape, or an unfolded display). Content
   density still follows the compatible width queries below. */
html[data-astra-device="mobile"] .star-network-layout.app-shell {
  display: block;
  min-width: 0;
  padding: 0;
}

html[data-astra-device="mobile"] .star-network-layout .sidebar,
html[data-astra-device="mobile"] .star-network-layout .desktop-top-navigation {
  display: none;
}

html[data-astra-device="mobile"] .star-network-layout .main-shell,
html[data-astra-device="mobile"] .star-network-layout .page-shell,
html[data-astra-device="mobile"] .star-network-layout .star-template-page {
  min-width: 0;
  max-width: 100%;
}

html[data-astra-device="mobile"] .star-network-layout .page-shell {
  padding-bottom: 108px;
}

html[data-astra-device="mobile"] .star-network-layout .mobile-nav {
  display: flex;
  position: fixed;
  z-index: 20;
  right: 10px;
  bottom: calc(8px + env(safe-area-inset-bottom));
  left: 10px;
  justify-content: space-around;
}

html[data-astra-device="mobile"] .admin-user-dialog,
html[data-astra-device="mobile"] .admin-order-dialog {
  width: calc(100vw - 20px);
  max-width: calc(100vw - 20px);
  max-height: calc(100dvh - 20px);
}

html[data-astra-device="mobile"] .admin-dialog-grid,
html[data-astra-device="mobile"] .admin-governance-grid {
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 721px) {
  /* On PC the navigation belongs to the lower action bar. The former upper
     shell row is hidden to avoid presenting two competing navigation bars. */
  html[data-astra-skin] .star-network-layout .sidebar {
    display: none;
  }

  html[data-astra-skin] .star-network-layout .topbar {
    position: sticky;
    top: 12px;
    margin-top: 0;
    min-height: 64px;
    height: auto;
    padding-inline: clamp(18px, 2.2vw, 30px);
  }

  .star-network-layout .desktop-top-navigation {
    display: flex;
    align-items: stretch;
    gap: 4px;
    min-width: 0;
    margin-left: clamp(16px, 2.4vw, 34px);
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .star-network-layout .desktop-top-navigation .nav-item {
    flex: 0 0 auto;
    width: auto;
    min-width: 108px;
    justify-content: center;
    gap: 7px;
    padding: 10px 14px;
  }

  .star-network-layout .topbar-actions {
    flex: 0 0 auto;
    margin-left: auto;
  }
}

.star-market-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.star-template-market .market-price-toolbar {
  flex-wrap: wrap;
}

.star-template-market .market-quick-price-list {
  flex: 1 1 100%;
  order: 3;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  width: 100%;
  gap: 6px;
}

.star-template-market .market-quick-price-list .price-chip {
  min-width: 0;
  padding-inline: 8px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.star-template-admin,
.star-template-admin .mainnet-admin-panel,
.star-template-admin .mainnet-admin-section,
.star-template-admin .mainnet-admin-data-dashboard,
.star-template-admin .surface-panel {
  min-width: 0;
}

.star-template-admin .table-scroll,
.star-template-admin .admin-table-wrap {
  max-width: 100%;
  overflow-x: auto;
}

.star-template-admin td,
.star-template-admin code,
.star-template-admin .admin-dialog-grid strong {
  overflow-wrap: anywhere;
}

@media (max-width: 1120px) and (min-width: 721px) {
  /* The desktop shell becomes a horizontal rail at tablet widths. Let the
     nav scroll inside the rail instead of allowing the network card to push
     the document wider than the viewport. */
  .star-network-layout .sidebar {
    min-width: 0;
    overflow: hidden;
  }

  .star-network-layout .navigation {
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .star-network-layout .sidebar-bottom {
    min-width: 0;
    width: clamp(132px, 18vw, 174px);
  }

  .star-network-layout .network-card {
    width: 100%;
    min-width: 0;
  }

  .star-market-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-template-admin .admin-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .star-template-admin .mainnet-admin-data-tabs,
  .star-template-admin .admin-subtabs {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .star-template-admin .mainnet-admin-data-tabs button,
  .star-template-admin .admin-subtabs button {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .star-template-admin .admin-dialog-grid,
  .star-template-admin .admin-governance-grid,
  .star-template-admin .admin-policy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-template-admin .mainnet-admin-data-metrics,
  .star-template-admin .mainnet-admin-record-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-template-admin .mainnet-admin-record-filters .button {
    width: 100%;
  }

  .star-template-admin .admin-filter-row {
    align-items: stretch;
  }

  .star-template-admin .admin-filter-row > * {
    min-width: min(260px, 100%);
  }

  .star-template-admin .mainnet-announcement-table td:last-child {
    min-width: 132px;
  }
}

@media (max-width: 720px) {
  html[data-astra-skin] {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  /* iOS Safari and wallet WebViews zoom focused controls below 16px and keep
     that visual zoom after navigation. Keep controls at the native threshold
     while preserving the user's ability to pinch zoom. */
  html[data-astra-skin] .star-network-layout .star-template-page :is(input, select, textarea),
  html[data-astra-skin] .star-network-layout .appearance-switch select {
    font-size: 16px;
  }

  .star-network-layout,
  .star-network-layout .main-shell,
  .star-network-layout .page-shell,
  .star-network-layout .star-template-page {
    min-width: 0;
    max-width: 100%;
  }

  .star-market-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .star-template-market .market-quick-price-list {
    gap: 4px;
  }

  .star-template-market .market-quick-price-list .price-chip {
    min-height: 30px;
    padding-inline: 4px;
    font-size: 11px;
  }

  .mainnet-announcement-label {
    padding-inline: 9px;
  }

  .mainnet-announcement-dialog,
  .mainnet-announcement-editor-dialog {
    width: calc(100vw - 24px);
    max-height: calc(100dvh - 32px);
  }

  .mainnet-announcement-content {
    max-height: 55dvh;
  }

  .mainnet-announcement-table td:first-child,
  .mainnet-announcement-table td:last-child {
    min-width: 0;
  }

  .mainnet-announcement-icon-actions {
    justify-content: flex-end;
  }
}

@media (max-width: 900px) and (min-width: 721px) {
  .star-template-admin .mainnet-admin-grid,
  .star-template-admin .admin-market-controls,
  .star-template-admin .admin-governance-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .star-template-admin .admin-section-overview,
  .star-template-admin .mainnet-admin-identity {
    align-items: flex-start;
    flex-wrap: wrap;
  }
}
.star-page-heading-actions {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.star-page-heading-actions .mainnet-account-toolbar {
  min-height: 0;
  margin: 0;
}

.star-page-heading-actions .mainnet-account-toolbar > span {
  overflow: hidden;
  max-inline-size: 18rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .star-page-heading-actions {
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
  }

  .star-page-heading-actions .mainnet-account-toolbar {
    gap: 5px;
    font-size: 11px;
  }

  .star-page-heading-actions .mainnet-account-toolbar > span {
    max-inline-size: 32vw;
  }
}
/* Colour-only finish for the existing light skin. Keep the persisted skin ID
   and all layout/transaction behaviour; match astra-variant-2-cosmic.html.
   Muted text is deliberately darker than the mockup for readable small text.
   Root-scoped selectors also reach Radix dialogs rendered outside app-shell. */
html[data-astra-skin="blue-white"] body {
  color: #2a1850;
  background: #f6f2fc;
}

html[data-astra-skin="blue-white"] .ambient-layer {
  background:
    radial-gradient(circle at 95% 0%, rgba(132,82,214,.22), transparent 34%),
    radial-gradient(circle at 0% 100%, rgba(34,211,238,.12), transparent 30%),
    radial-gradient(circle at 60% 55%, rgba(168,120,232,.15), transparent 28%);
}
html[data-astra-skin="blue-white"] .ambient-grid {
  background-image: linear-gradient(rgba(132,82,214,.04) 1px,transparent 1px), linear-gradient(90deg,rgba(132,82,214,.04) 1px,transparent 1px);
  background-size: 48px 48px;
  opacity: 1;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 40%,#000 30%,transparent 80%);
}
html[data-astra-skin="blue-white"] .mainnet-cosmic-ring {
  background: conic-gradient(from 0deg,rgba(132,82,214,.12),rgba(132,82,214,.95) 18%,rgba(8,145,178,.95) 50%,rgba(168,120,232,.95) 82%,rgba(132,82,214,.12));
}
html[data-astra-skin="blue-white"] .star-template-market .mainnet-cosmic-core {
  background: radial-gradient(circle at 35% 28%,#fff,#f3ecff 58%,#d6c5fa);
}
html[data-astra-skin="blue-white"] .mainnet-cosmic-hero-copy h2,
html[data-astra-skin="blue-white"] .star-network-brand strong {
  background-image: linear-gradient(135deg,#6331b4,#8452d6 50%,#0891b2);
}

html[data-astra-skin="blue-white"] :is(.dialog-content,.dialog-content.invite-gate,.asset-withdraw-menu,.admin-user-dialog) {
  color: #2a1850;
  background: #fff;
  border-color: rgba(132,82,214,.18);
  box-shadow: 0 16px 48px rgba(99,49,180,.18);
}
html[data-astra-skin="blue-white"] .dialog-overlay {
  background: rgba(42,24,80,.24) !important;
}
html[data-astra-skin="blue-white"] :is(.notice-info,.demo-banner) {
  color: #0e7490;
  background: #ecf8fb;
  border-color: rgba(8,145,178,.25);
}
html[data-astra-skin="blue-white"] :is(.notice-info,.notice-success,.notice-warning,.notice-error) :is(strong,span,p) {
  color: inherit;
}
html[data-astra-skin="blue-white"] :is(.dialog-close,.admin-icon-button,.button-outline,.button-icon,.button-ghost):is(:hover,:focus-visible) {
  color: #6331b4;
  background: #efe8fa;
}
html[data-astra-skin="blue-white"] :is(.dialog-close,.admin-icon-button) {
  color: #6331b4;
  background: #f6f2fc;
}
html[data-astra-skin="blue-white"] .button-primary {
  color: #fff;
  background: linear-gradient(135deg,#6331b4,#8452d6);
}
html[data-astra-skin="blue-white"] .button-primary:hover:not(:disabled) {
  background: #6331b4;
}
html[data-astra-skin="blue-white"] :is(.button:disabled,.dialog-close:disabled,.admin-icon-button:disabled) {
  opacity: 1;
  color: #665580;
  background: #e8dff6;
  border-color: #d3c4e8;
  box-shadow: none;
}
html[data-astra-skin="blue-white"] :is(input,textarea,select):disabled {
  opacity: 1;
  -webkit-text-fill-color: #665580;
}
html[data-astra-skin="blue-white"] :is(.admin-section-kicker,.admin-dialog-hero > div > span,.admin-dialog-section-heading > div > span,.form-hint,.mainnet-inline-note,.mainnet-readonly-note) {
  color: #665580;
}
html[data-astra-skin="blue-white"] .admin-section-access { color: #147d59; }
html[data-astra-skin="blue-white"] .star-template-admin .admin-work-queue > .panel-heading::after { color: #665580; }
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-topline small,
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-price small,
html[data-astra-skin="blue-white"] .star-template-packages .mainnet-package-card :is(.mainnet-package-cost-label,.position-details span) {
  color: #76668b;
}
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-item-price strong {
  color: #0e7490 !important;
}
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-buy-label {
  color: #a52f48 !important;
}
html[data-astra-skin="blue-white"] .star-template-market .mainnet-market-buy-label svg { color: inherit; }
/* Reference HTML logo treatments. Decoration only; existing navigation and
   persisted appearance choices remain owned by their original components. */
html .star-network-layout .topbar .star-network-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}
.cosmic-brand-mark {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: clamp(32px, 3vw, 40px);
  height: clamp(32px, 3vw, 40px);
  overflow: hidden;
  border-radius: 12px;
  background: transparent;
  box-shadow: -5px 5px 20px rgba(132,82,214,.28), 5px -5px 20px rgba(8,145,178,.22);
}
.cosmic-brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  max-width: 100%;
  max-height: 100%;
  border-radius: inherit;
}
html .star-network-layout .topbar .topbar-actions {
  flex: 1 1 0;
  max-width: none;
  min-width: 0;
  justify-content: flex-end;
}
html .star-template-market .mainnet-cosmic-core.cosmic-logo-core {
  width: 100px;
  height: 100px;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
  animation: none;
  isolation: isolate;
}
html .star-template-market .mainnet-cosmic-core.cosmic-logo-core img {
  display: block;
  position: relative;
  z-index: 3;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: contain;
  filter: none;
}
html .star-template-market .mainnet-cosmic-core.cosmic-logo-core::before {
  content: '';
  inset: -14px;
  border-radius: 50%;
  background: conic-gradient(#8452d6,#a878e8,#22d3ee,#c9a8ff,#8452d6);
  filter: blur(12px);
  opacity: .7;
  z-index: -1;
  animation: cosmic-brand-spin 6s linear infinite;
}
html .star-template-market .mainnet-cosmic-core.cosmic-logo-core::after {
  content: '';
  position: absolute;
  inset: -28px;
  border-radius: 50%;
  border: 1px dashed rgba(8,145,178,.25);
  animation: cosmic-brand-spin 30s linear infinite reverse;
}
@keyframes cosmic-brand-spin { to { transform: rotate(360deg); } }
@media (max-width: 520px) {
  html .star-network-layout .topbar .star-network-brand { gap: 8px; }
  .cosmic-brand-mark { width: 32px; height: 32px; border-radius: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html .star-template-market .mainnet-cosmic-core.cosmic-logo-core::before,
  html .star-template-market .mainnet-cosmic-core.cosmic-logo-core::after { animation: none; }
}