/* 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 { -webkit-backdrop-filter: var(--rk-blurs-modalOverlay); 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; } .address-avatar { display: inline-block; width: 40px; height: 40px; border-radius: 50%; } img.jazzicon { width: 40px; height: 40px; border-radius: 50%; } .chat-component { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; .header { padding: 12px; } .message-list { /* 여기만 살짝 강화 */ flex: 1 1 auto; /* 기존 flex:1 -> flex-basis 명시 */ min-height: 0; /* ★ 스크롤 컨테이너에서 중요 */ overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; /* 스크롤 점프 방지에 도움 */ overscroll-behavior: contain; } .message { display: flex; align-items: flex-start; gap: 8px; &.pending { opacity: 0.8; } &.failed { opacity: 0.6; } .avatar { width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0; } .msg-body { border-radius: 8px; padding: 8px 12px; max-width: 60%; word-wrap: break-word; .attachments { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; img.img-msg { max-width: 180px; border-radius: 8px; } } } .meta { font-size: 12px; margin-bottom: 4px; .name { font-weight: bold; } .time { margin-left: 8px; font-size: 11px; } } .text { font-size: 14px; } .msg-link { color: var(--sl-color-primary-600); text-decoration: underline; word-break: break-word; } } .thumb-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; .thumb-wrapper { position: relative; width: 64px; height: 64px; border: 1px solid #ddd; border-radius: 4px; overflow: hidden; img.thumb { width: 100%; height: 100%; object-fit: cover; } .remove { position: absolute; top: 2px; right: 2px; background: rgba(0, 0, 0, 0.6); color: #fff; border: none; border-radius: 50%; width: 16px; height: 16px; font-size: 12px; line-height: 14px; text-align: center; cursor: pointer; } } } .composer { display: flex; flex-wrap: wrap; padding: 12px; padding-bottom: calc(env(safe-area-inset-bottom) + 12px); gap: 8px; width: 100%; box-sizing: border-box; sl-input { flex: 1; min-width: 0; } sl-button { flex-shrink: 0; } } } .img-loading { background: repeating-linear-gradient(-45deg, #444 0 10px, #333 10px 20px); animation: pulse 1s infinite linear; min-width: 180px; min-height: 120px; } @keyframes pulse { 0% { opacity: .7; } 50% { opacity: .4; } 100% { opacity: .7; } } .address-avatar { display: inline-block; width: 40px; height: 40px; border-radius: 50%; } img.jazzicon { width: 40px; height: 40px; border-radius: 50%; } :root{--ion-color-primary:#0054e9;--ion-color-primary-rgb:0,84,233;--ion-color-primary-contrast:#fff;--ion-color-primary-contrast-rgb:255,255,255;--ion-color-primary-shade:#004acd;--ion-color-primary-tint:#1a65eb;--ion-color-secondary:#0163aa;--ion-color-secondary-rgb:1,99,170;--ion-color-secondary-contrast:#fff;--ion-color-secondary-contrast-rgb:255,255,255;--ion-color-secondary-shade:#015796;--ion-color-secondary-tint:#1a73b3;--ion-color-tertiary:#6030ff;--ion-color-tertiary-rgb:96,48,255;--ion-color-tertiary-contrast:#fff;--ion-color-tertiary-contrast-rgb:255,255,255;--ion-color-tertiary-shade:#542ae0;--ion-color-tertiary-tint:#7045ff;--ion-color-success:#2dd55b;--ion-color-success-rgb:45,213,91;--ion-color-success-contrast:#000;--ion-color-success-contrast-rgb:0,0,0;--ion-color-success-shade:#28bb50;--ion-color-success-tint:#42d96b;--ion-color-warning:#ffc409;--ion-color-warning-rgb:255,196,9;--ion-color-warning-contrast:#000;--ion-color-warning-contrast-rgb:0,0,0;--ion-color-warning-shade:#e0ac08;--ion-color-warning-tint:#ffca22;--ion-color-danger:#c5000f;--ion-color-danger-rgb:197,0,15;--ion-color-danger-contrast:#fff;--ion-color-danger-contrast-rgb:255,255,255;--ion-color-danger-shade:#ad000d;--ion-color-danger-tint:#cb1a27;--ion-color-light:#f4f5f8;--ion-color-light-rgb:244,245,248;--ion-color-light-contrast:#000;--ion-color-light-contrast-rgb:0,0,0;--ion-color-light-shade:#d7d8da;--ion-color-light-tint:#f5f6f9;--ion-color-medium:#636469;--ion-color-medium-rgb:99,100,105;--ion-color-medium-contrast:#fff;--ion-color-medium-contrast-rgb:255,255,255;--ion-color-medium-shade:#57585c;--ion-color-medium-tint:#737478;--ion-color-dark:#222428;--ion-color-dark-rgb:34,36,40;--ion-color-dark-contrast:#fff;--ion-color-dark-contrast-rgb:255,255,255;--ion-color-dark-shade:#1e2023;--ion-color-dark-tint:#383a3e}html.ios{--ion-default-font:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Roboto",sans-serif}html.md{--ion-default-font:"Roboto","Helvetica Neue",sans-serif}body.backdrop-no-scroll{overflow:hidden}html.ios ion-footer.modal-footer-moving ion-toolbar:first-of-type,html.ios ion-modal ion-footer ion-toolbar:first-of-type,html.ios ion-modal.modal-card ion-header ion-toolbar:first-of-type,html.ios ion-modal.modal-sheet ion-header ion-toolbar:first-of-type{padding-top:6px}html.ios ion-modal.modal-card ion-header ion-toolbar:last-of-type,html.ios ion-modal.modal-sheet ion-header ion-toolbar:last-of-type{padding-bottom:6px}html.ios .modal-footer-moving ion-toolbar,html.ios ion-modal ion-toolbar{padding-right:calc(var(--ion-safe-area-right) + 8px);padding-left:calc(var(--ion-safe-area-left) + 8px)}@media screen and (min-width:768px){html.ios ion-modal.modal-card:first-of-type{--backdrop-opacity:0.18}}ion-modal.modal-default.show-modal~ion-modal.modal-default{--backdrop-opacity:0;--box-shadow:none}html.ios ion-modal.modal-card .ion-page{border-top-left-radius:var(--border-radius)}.ion-color-primary{--ion-color-base:var(--ion-color-primary, #0054e9)!important;--ion-color-base-rgb:var(--ion-color-primary-rgb, 0, 84, 233)!important;--ion-color-contrast:var(--ion-color-primary-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-primary-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-primary-shade, #004acd)!important;--ion-color-tint:var(--ion-color-primary-tint, #1a65eb)!important}.ion-color-secondary{--ion-color-base:var(--ion-color-secondary, #0163aa)!important;--ion-color-base-rgb:var(--ion-color-secondary-rgb, 1, 99, 170)!important;--ion-color-contrast:var(--ion-color-secondary-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-secondary-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-secondary-shade, #015796)!important;--ion-color-tint:var(--ion-color-secondary-tint, #1a73b3)!important}.ion-color-tertiary{--ion-color-base:var(--ion-color-tertiary, #6030ff)!important;--ion-color-base-rgb:var(--ion-color-tertiary-rgb, 96, 48, 255)!important;--ion-color-contrast:var(--ion-color-tertiary-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-tertiary-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-tertiary-shade, #542ae0)!important;--ion-color-tint:var(--ion-color-tertiary-tint, #7045ff)!important}.ion-color-success{--ion-color-base:var(--ion-color-success, #2dd55b)!important;--ion-color-base-rgb:var(--ion-color-success-rgb, 45, 213, 91)!important;--ion-color-contrast:var(--ion-color-success-contrast, #000)!important;--ion-color-contrast-rgb:var(--ion-color-success-contrast-rgb, 0, 0, 0)!important;--ion-color-shade:var(--ion-color-success-shade, #28bb50)!important;--ion-color-tint:var(--ion-color-success-tint, #42d96b)!important}.ion-color-warning{--ion-color-base:var(--ion-color-warning, #ffc409)!important;--ion-color-base-rgb:var(--ion-color-warning-rgb, 255, 196, 9)!important;--ion-color-contrast:var(--ion-color-warning-contrast, #000)!important;--ion-color-contrast-rgb:var(--ion-color-warning-contrast-rgb, 0, 0, 0)!important;--ion-color-shade:var(--ion-color-warning-shade, #e0ac08)!important;--ion-color-tint:var(--ion-color-warning-tint, #ffca22)!important}.ion-color-danger{--ion-color-base:var(--ion-color-danger, #c5000f)!important;--ion-color-base-rgb:var(--ion-color-danger-rgb, 197, 0, 15)!important;--ion-color-contrast:var(--ion-color-danger-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-danger-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-danger-shade, #ad000d)!important;--ion-color-tint:var(--ion-color-danger-tint, #cb1a27)!important}.ion-color-light{--ion-color-base:var(--ion-color-light, #f4f5f8)!important;--ion-color-base-rgb:var(--ion-color-light-rgb, 244, 245, 248)!important;--ion-color-contrast:var(--ion-color-light-contrast, #000)!important;--ion-color-contrast-rgb:var(--ion-color-light-contrast-rgb, 0, 0, 0)!important;--ion-color-shade:var(--ion-color-light-shade, #d7d8da)!important;--ion-color-tint:var(--ion-color-light-tint, #f5f6f9)!important}.ion-color-medium{--ion-color-base:var(--ion-color-medium, #636469)!important;--ion-color-base-rgb:var(--ion-color-medium-rgb, 99, 100, 105)!important;--ion-color-contrast:var(--ion-color-medium-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-medium-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-medium-shade, #57585c)!important;--ion-color-tint:var(--ion-color-medium-tint, #737478)!important}.ion-color-dark{--ion-color-base:var(--ion-color-dark, #222428)!important;--ion-color-base-rgb:var(--ion-color-dark-rgb, 34, 36, 40)!important;--ion-color-contrast:var(--ion-color-dark-contrast, #fff)!important;--ion-color-contrast-rgb:var(--ion-color-dark-contrast-rgb, 255, 255, 255)!important;--ion-color-shade:var(--ion-color-dark-shade, #1e2023)!important;--ion-color-tint:var(--ion-color-dark-tint, #383a3e)!important}.ion-page{left:0;right:0;top:0;bottom:0;display:flex;position:absolute;flex-direction:column;justify-content:space-between;contain:layout size style;z-index:0}ion-modal>.ion-page{position:relative;contain:layout style;height:100%}.split-pane-visible>.ion-page.split-pane-main{position:relative}.ion-page-hidden,ion-action-sheet-controller,ion-alert-controller,ion-loading-controller,ion-menu-controller,ion-modal-controller,ion-nav-controller,ion-picker-controller,ion-popover-controller,ion-route,ion-route-redirect,ion-router,ion-select-option,ion-toast-controller{display:none!important}.ion-page-invisible{opacity:0}.can-go-back>ion-header ion-back-button{display:block}html.plt-ios.plt-hybrid,html.plt-ios.plt-pwa{--ion-statusbar-padding:20px}@supports(padding-top:20px){html{--ion-safe-area-top:var(--ion-statusbar-padding)}}@supports(padding-top:env(safe-area-inset-top)){html{--ion-safe-area-top:env(safe-area-inset-top);--ion-safe-area-bottom:env(safe-area-inset-bottom);--ion-safe-area-left:env(safe-area-inset-left);--ion-safe-area-right:env(safe-area-inset-right)}}ion-card-header.ion-color .ion-inherit-color,ion-card.ion-color .ion-inherit-color{color:inherit}.menu-content{transform:translate3d(0,0,0)}.menu-content-open{cursor:pointer;touch-action:manipulation;pointer-events:none;overflow-y:hidden}.menu-content-open ion-content{--overflow:hidden}.menu-content-open .ion-content-scroll-host{overflow:hidden}.ios .menu-content-reveal{box-shadow:-8px 0 42px rgba(0,0,0,.08)}[dir=rtl].ios .menu-content-reveal{box-shadow:8px 0 42px rgba(0,0,0,.08)}.md .menu-content-push,.md .menu-content-reveal{box-shadow:4px 0 16px rgba(0,0,0,.18)}ion-accordion-group.accordion-group-expand-inset>ion-accordion:first-of-type{border-top-left-radius:8px;border-top-right-radius:8px}ion-accordion-group.accordion-group-expand-inset>ion-accordion:last-of-type{border-bottom-left-radius:8px;border-bottom-right-radius:8px}ion-accordion-group>ion-accordion:last-of-type ion-item[slot=header]{--border-width:0px}ion-accordion.accordion-animated>[slot=header] .ion-accordion-toggle-icon{transition:transform .3s cubic-bezier(.25, .8, .5, 1)}@media(prefers-reduced-motion:reduce){ion-accordion .ion-accordion-toggle-icon{transition:none!important}}ion-accordion.accordion-expanded>[slot=header] .ion-accordion-toggle-icon,ion-accordion.accordion-expanding>[slot=header] .ion-accordion-toggle-icon{transform:rotate(180deg)}ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-previous ion-item[slot=header]{--border-width:0px;--inner-border-width:0px}ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-expanded:first-of-type,ion-accordion-group.accordion-group-expand-inset.md>ion-accordion.accordion-expanding:first-of-type{margin-top:0}ion-input input::-webkit-date-and-time-value{text-align:start}.ion-datetime-button-overlay{--width:fit-content;--height:fit-content}.ion-datetime-button-overlay ion-datetime.datetime-grid{width:320px;min-height:320px}[ion-last-focus],[role=banner][tabindex="-1"]:focus,[role=heading][aria-level="1"][tabindex="-1"]:focus,[role=main][tabindex="-1"]:focus,h1[tabindex="-1"]:focus,header[tabindex="-1"]:focus,main[tabindex="-1"]:focus{outline:0}.popover-viewport:has(>ion-content){overflow:hidden}@supports not selector(:has(> ion-content)){.popover-viewport{overflow:hidden}}audio,canvas,progress,video{vertical-align:baseline}audio:not([controls]){display:none;height:0}b,strong{font-weight:700}img{max-width:100%}hr{height:1px;border-width:0;box-sizing:content-box}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}input,label,select,textarea{font-family:inherit;line-height:normal}textarea{overflow:auto;height:auto;font:inherit;color:inherit}textarea::placeholder{padding-left:2px}form,input,optgroup,select{margin:0;font:inherit;color:inherit}html input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button}.ion-tappable,[tappable],[tappable] div,[tappable] ion-icon,[tappable] ion-label,[tappable] span,a,a div,a ion-icon,a ion-label,a span,button,button div,button ion-icon,button ion-label,button span,input,textarea{touch-action:manipulation}a ion-label,button ion-label{pointer-events:none}button{padding:0;border:0;border-radius:0;font-family:inherit;font-style:inherit;font-variant:inherit;line-height:1;text-transform:none;cursor:pointer;-webkit-appearance:button}[tappable]{cursor:pointer}a[disabled],button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}html{--ion-dynamic-font:-apple-system-body;--ion-font-family:var(--ion-default-font);width:100%;height:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%;font-family:var(--ion-font-family)}html.ion-ce body{display:block}html.plt-pwa{height:100vh}body{background:var(--ion-background-color);color:var(--ion-text-color);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin:0;padding:0;position:fixed;width:100%;max-width:100%;height:100%;max-height:100%;transform:translateZ(0);text-rendering:optimizeLegibility;overflow:hidden;touch-action:manipulation;-webkit-user-drag:none;-ms-content-zooming:none;word-wrap:break-word;overscroll-behavior-y:none;-webkit-text-size-adjust:none;text-size-adjust:none}@supports(-webkit-touch-callout:none){html{font:var(--ion-dynamic-font, 16px var(--ion-font-family))}}a{background-color:transparent;color:var(--ion-color-primary,#0054e9)}h1,h2,h3,h4,h5,h6{margin-top:16px;margin-bottom:10px;font-weight:500;line-height:1.2}h1{margin-top:20px;font-size:1.625rem}h2{margin-top:18px;font-size:1.5rem}h3{font-size:1.375rem}h4{font-size:1.25rem}h5{font-size:1.125rem}h6{font-size:1rem}small{font-size:75%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}.ion-no-padding{--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;padding:0}.ion-padding{--padding-start:var(--ion-padding, 16px);--padding-end:var(--ion-padding, 16px);--padding-top:var(--ion-padding, 16px);--padding-bottom:var(--ion-padding, 16px);-webkit-padding-start:var(--ion-padding,16px);padding-inline-start:var(--ion-padding,16px);-webkit-padding-end:var(--ion-padding,16px);padding-inline-end:var(--ion-padding,16px);padding-top:var(--ion-padding,16px);padding-bottom:var(--ion-padding,16px)}.ion-padding-top{--padding-top:var(--ion-padding, 16px);padding-top:var(--ion-padding,16px)}.ion-padding-start{--padding-start:var(--ion-padding, 16px);-webkit-padding-start:var(--ion-padding,16px);padding-inline-start:var(--ion-padding,16px)}.ion-padding-end{--padding-end:var(--ion-padding, 16px);-webkit-padding-end:var(--ion-padding,16px);padding-inline-end:var(--ion-padding,16px)}.ion-padding-bottom{--padding-bottom:var(--ion-padding, 16px);padding-bottom:var(--ion-padding,16px)}.ion-padding-vertical{--padding-top:var(--ion-padding, 16px);--padding-bottom:var(--ion-padding, 16px);padding-top:var(--ion-padding,16px);padding-bottom:var(--ion-padding,16px)}.ion-padding-horizontal{--padding-start:var(--ion-padding, 16px);--padding-end:var(--ion-padding, 16px);-webkit-padding-start:var(--ion-padding,16px);padding-inline-start:var(--ion-padding,16px);-webkit-padding-end:var(--ion-padding,16px);padding-inline-end:var(--ion-padding,16px)}.ion-no-margin{--margin-start:0;--margin-end:0;--margin-top:0;--margin-bottom:0;margin:0}.ion-margin{--margin-start:var(--ion-margin, 16px);--margin-end:var(--ion-margin, 16px);--margin-top:var(--ion-margin, 16px);--margin-bottom:var(--ion-margin, 16px);-webkit-margin-start:var(--ion-margin,16px);margin-inline-start:var(--ion-margin,16px);-webkit-margin-end:var(--ion-margin,16px);margin-inline-end:var(--ion-margin,16px);margin-top:var(--ion-margin,16px);margin-bottom:var(--ion-margin,16px)}.ion-margin-top{--margin-top:var(--ion-margin, 16px);margin-top:var(--ion-margin,16px)}.ion-margin-start{--margin-start:var(--ion-margin, 16px);-webkit-margin-start:var(--ion-margin,16px);margin-inline-start:var(--ion-margin,16px)}.ion-margin-end{--margin-end:var(--ion-margin, 16px);-webkit-margin-end:var(--ion-margin,16px);margin-inline-end:var(--ion-margin,16px)}.ion-margin-bottom{--margin-bottom:var(--ion-margin, 16px);margin-bottom:var(--ion-margin,16px)}.ion-margin-vertical{--margin-top:var(--ion-margin, 16px);--margin-bottom:var(--ion-margin, 16px);margin-top:var(--ion-margin,16px);margin-bottom:var(--ion-margin,16px)}.ion-margin-horizontal{--margin-start:var(--ion-margin, 16px);--margin-end:var(--ion-margin, 16px);-webkit-margin-start:var(--ion-margin,16px);margin-inline-start:var(--ion-margin,16px);-webkit-margin-end:var(--ion-margin,16px);margin-inline-end:var(--ion-margin,16px)}.ion-float-left{float:left!important}.ion-float-right{float:right!important}.ion-float-start{float:left!important}:host-context([dir=rtl]) .ion-float-start{float:right!important}[dir=rtl] .ion-float-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-start:dir(rtl){float:right!important}.ion-float-end:dir(rtl){float:left!important}}.ion-float-end{float:right!important}:host-context([dir=rtl]) .ion-float-end{float:left!important}[dir=rtl] .ion-float-end{float:left!important}.ion-text-center{text-align:center!important}.ion-text-justify{text-align:justify!important}.ion-text-start{text-align:start!important}.ion-text-end{text-align:end!important}.ion-text-left{text-align:left!important}.ion-text-right{text-align:right!important}.ion-text-nowrap{white-space:nowrap!important}.ion-text-wrap{white-space:normal!important}.ion-text-uppercase{text-transform:uppercase!important}.ion-text-lowercase{text-transform:lowercase!important}.ion-text-capitalize{text-transform:capitalize!important}.ion-align-content-start{align-content:flex-start!important}.ion-align-content-end{align-content:flex-end!important}.ion-align-content-center{align-content:center!important}.ion-align-content-between{align-content:space-between!important}.ion-align-content-around{align-content:space-around!important}.ion-align-content-stretch{align-content:stretch!important}.ion-align-items-start{align-items:start!important}.ion-align-items-end{align-items:end!important}.ion-align-items-center{align-items:center!important}.ion-align-items-stretch{align-items:stretch!important}.ion-align-items-baseline{align-items:baseline!important}.ion-align-self-start{align-self:start!important}.ion-align-self-end{align-self:end!important}.ion-align-self-center{align-self:center!important}.ion-align-self-stretch{align-self:stretch!important}.ion-align-self-baseline{align-self:baseline!important}.ion-align-self-auto{align-self:auto!important}@media(min-width:576px){.ion-float-sm-left{float:left!important}.ion-float-sm-right{float:right!important}.ion-float-sm-start{float:left!important}:host-context([dir=rtl]) .ion-float-sm-start{float:right!important}[dir=rtl] .ion-float-sm-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-sm-start:dir(rtl){float:right!important}.ion-float-sm-end:dir(rtl){float:left!important}}.ion-float-sm-end{float:right!important}:host-context([dir=rtl]) .ion-float-sm-end{float:left!important}[dir=rtl] .ion-float-sm-end{float:left!important}.ion-text-sm-center{text-align:center!important}.ion-text-sm-justify{text-align:justify!important}.ion-text-sm-start{text-align:start!important}.ion-text-sm-end{text-align:end!important}.ion-text-sm-left{text-align:left!important}.ion-text-sm-right{text-align:right!important}.ion-text-sm-nowrap{white-space:nowrap!important}.ion-text-sm-wrap{white-space:normal!important}.ion-text-sm-uppercase{text-transform:uppercase!important}.ion-text-sm-lowercase{text-transform:lowercase!important}.ion-text-sm-capitalize{text-transform:capitalize!important}.ion-align-content-sm-start{align-content:flex-start!important}.ion-align-content-sm-end{align-content:flex-end!important}.ion-align-content-sm-center{align-content:center!important}.ion-align-content-sm-between{align-content:space-between!important}.ion-align-content-sm-around{align-content:space-around!important}.ion-align-content-sm-stretch{align-content:stretch!important}.ion-align-items-sm-start{align-items:start!important}.ion-align-items-sm-end{align-items:end!important}.ion-align-items-sm-center{align-items:center!important}.ion-align-items-sm-stretch{align-items:stretch!important}.ion-align-items-sm-baseline{align-items:baseline!important}.ion-align-self-sm-start{align-self:start!important}.ion-align-self-sm-end{align-self:end!important}.ion-align-self-sm-center{align-self:center!important}.ion-align-self-sm-stretch{align-self:stretch!important}.ion-align-self-sm-baseline{align-self:baseline!important}.ion-align-self-sm-auto{align-self:auto!important}}@media(min-width:768px){.ion-float-md-left{float:left!important}.ion-float-md-right{float:right!important}.ion-float-md-start{float:left!important}:host-context([dir=rtl]) .ion-float-md-start{float:right!important}[dir=rtl] .ion-float-md-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-md-start:dir(rtl){float:right!important}.ion-float-md-end:dir(rtl){float:left!important}}.ion-float-md-end{float:right!important}:host-context([dir=rtl]) .ion-float-md-end{float:left!important}[dir=rtl] .ion-float-md-end{float:left!important}.ion-text-md-center{text-align:center!important}.ion-text-md-justify{text-align:justify!important}.ion-text-md-start{text-align:start!important}.ion-text-md-end{text-align:end!important}.ion-text-md-left{text-align:left!important}.ion-text-md-right{text-align:right!important}.ion-text-md-nowrap{white-space:nowrap!important}.ion-text-md-wrap{white-space:normal!important}.ion-text-md-uppercase{text-transform:uppercase!important}.ion-text-md-lowercase{text-transform:lowercase!important}.ion-text-md-capitalize{text-transform:capitalize!important}.ion-align-content-md-start{align-content:flex-start!important}.ion-align-content-md-end{align-content:flex-end!important}.ion-align-content-md-center{align-content:center!important}.ion-align-content-md-between{align-content:space-between!important}.ion-align-content-md-around{align-content:space-around!important}.ion-align-content-md-stretch{align-content:stretch!important}.ion-align-items-md-start{align-items:start!important}.ion-align-items-md-end{align-items:end!important}.ion-align-items-md-center{align-items:center!important}.ion-align-items-md-stretch{align-items:stretch!important}.ion-align-items-md-baseline{align-items:baseline!important}.ion-align-self-md-start{align-self:start!important}.ion-align-self-md-end{align-self:end!important}.ion-align-self-md-center{align-self:center!important}.ion-align-self-md-stretch{align-self:stretch!important}.ion-align-self-md-baseline{align-self:baseline!important}.ion-align-self-md-auto{align-self:auto!important}}@media(min-width:992px){.ion-float-lg-left{float:left!important}.ion-float-lg-right{float:right!important}.ion-float-lg-start{float:left!important}:host-context([dir=rtl]) .ion-float-lg-start{float:right!important}[dir=rtl] .ion-float-lg-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-lg-start:dir(rtl){float:right!important}.ion-float-lg-end:dir(rtl){float:left!important}}.ion-float-lg-end{float:right!important}:host-context([dir=rtl]) .ion-float-lg-end{float:left!important}[dir=rtl] .ion-float-lg-end{float:left!important}.ion-text-lg-center{text-align:center!important}.ion-text-lg-justify{text-align:justify!important}.ion-text-lg-start{text-align:start!important}.ion-text-lg-end{text-align:end!important}.ion-text-lg-left{text-align:left!important}.ion-text-lg-right{text-align:right!important}.ion-text-lg-nowrap{white-space:nowrap!important}.ion-text-lg-wrap{white-space:normal!important}.ion-text-lg-uppercase{text-transform:uppercase!important}.ion-text-lg-lowercase{text-transform:lowercase!important}.ion-text-lg-capitalize{text-transform:capitalize!important}.ion-align-content-lg-start{align-content:flex-start!important}.ion-align-content-lg-end{align-content:flex-end!important}.ion-align-content-lg-center{align-content:center!important}.ion-align-content-lg-between{align-content:space-between!important}.ion-align-content-lg-around{align-content:space-around!important}.ion-align-content-lg-stretch{align-content:stretch!important}.ion-align-items-lg-start{align-items:start!important}.ion-align-items-lg-end{align-items:end!important}.ion-align-items-lg-center{align-items:center!important}.ion-align-items-lg-stretch{align-items:stretch!important}.ion-align-items-lg-baseline{align-items:baseline!important}.ion-align-self-lg-start{align-self:start!important}.ion-align-self-lg-end{align-self:end!important}.ion-align-self-lg-center{align-self:center!important}.ion-align-self-lg-stretch{align-self:stretch!important}.ion-align-self-lg-baseline{align-self:baseline!important}.ion-align-self-lg-auto{align-self:auto!important}}@media(min-width:1200px){.ion-float-xl-left{float:left!important}.ion-float-xl-right{float:right!important}.ion-float-xl-start{float:left!important}:host-context([dir=rtl]) .ion-float-xl-start{float:right!important}[dir=rtl] .ion-float-xl-start{float:right!important}@supports selector(:dir(rtl)){.ion-float-xl-start:dir(rtl){float:right!important}.ion-float-xl-end:dir(rtl){float:left!important}}.ion-float-xl-end{float:right!important}:host-context([dir=rtl]) .ion-float-xl-end{float:left!important}[dir=rtl] .ion-float-xl-end{float:left!important}.ion-text-xl-center{text-align:center!important}.ion-text-xl-justify{text-align:justify!important}.ion-text-xl-start{text-align:start!important}.ion-text-xl-end{text-align:end!important}.ion-text-xl-left{text-align:left!important}.ion-text-xl-right{text-align:right!important}.ion-text-xl-nowrap{white-space:nowrap!important}.ion-text-xl-wrap{white-space:normal!important}.ion-text-xl-uppercase{text-transform:uppercase!important}.ion-text-xl-lowercase{text-transform:lowercase!important}.ion-text-xl-capitalize{text-transform:capitalize!important}.ion-align-content-xl-start{align-content:flex-start!important}.ion-align-content-xl-end{align-content:flex-end!important}.ion-align-content-xl-center{align-content:center!important}.ion-align-content-xl-between{align-content:space-between!important}.ion-align-content-xl-around{align-content:space-around!important}.ion-align-content-xl-stretch{align-content:stretch!important}.ion-align-items-xl-start{align-items:start!important}.ion-align-items-xl-end{align-items:end!important}.ion-align-items-xl-center{align-items:center!important}.ion-align-items-xl-stretch{align-items:stretch!important}.ion-align-items-xl-baseline{align-items:baseline!important}.ion-align-self-xl-start{align-self:start!important}.ion-align-self-xl-end{align-self:end!important}.ion-align-self-xl-center{align-self:center!important}.ion-align-self-xl-stretch{align-self:stretch!important}.ion-align-self-xl-baseline{align-self:baseline!important}.ion-align-self-xl-auto{align-self:auto!important}}.ion-justify-content-start{justify-content:flex-start!important}.ion-justify-content-end{justify-content:flex-end!important}.ion-justify-content-center{justify-content:center!important}.ion-justify-content-between{justify-content:space-between!important}.ion-justify-content-around{justify-content:space-around!important}.ion-justify-content-evenly{justify-content:space-evenly!important}@media(min-width:576px){.ion-justify-content-sm-start{justify-content:flex-start!important}.ion-justify-content-sm-end{justify-content:flex-end!important}.ion-justify-content-sm-center{justify-content:center!important}.ion-justify-content-sm-between{justify-content:space-between!important}.ion-justify-content-sm-around{justify-content:space-around!important}.ion-justify-content-sm-evenly{justify-content:space-evenly!important}}@media(min-width:768px){.ion-justify-content-md-start{justify-content:flex-start!important}.ion-justify-content-md-end{justify-content:flex-end!important}.ion-justify-content-md-center{justify-content:center!important}.ion-justify-content-md-between{justify-content:space-between!important}.ion-justify-content-md-around{justify-content:space-around!important}.ion-justify-content-md-evenly{justify-content:space-evenly!important}}@media(min-width:992px){.ion-justify-content-lg-start{justify-content:flex-start!important}.ion-justify-content-lg-end{justify-content:flex-end!important}.ion-justify-content-lg-center{justify-content:center!important}.ion-justify-content-lg-between{justify-content:space-between!important}.ion-justify-content-lg-around{justify-content:space-around!important}.ion-justify-content-lg-evenly{justify-content:space-evenly!important}}@media(min-width:1200px){.ion-justify-content-xl-start{justify-content:flex-start!important}.ion-justify-content-xl-end{justify-content:flex-end!important}.ion-justify-content-xl-center{justify-content:center!important}.ion-justify-content-xl-between{justify-content:space-between!important}.ion-justify-content-xl-around{justify-content:space-around!important}.ion-justify-content-xl-evenly{justify-content:space-evenly!important}}.ion-flex-row{flex-direction:row!important}.ion-flex-row-reverse{flex-direction:row-reverse!important}.ion-flex-column{flex-direction:column!important}.ion-flex-column-reverse{flex-direction:column-reverse!important}@media(min-width:576px){.ion-flex-sm-row{flex-direction:row!important}.ion-flex-sm-row-reverse{flex-direction:row-reverse!important}.ion-flex-sm-column{flex-direction:column!important}.ion-flex-sm-column-reverse{flex-direction:column-reverse!important}}@media(min-width:768px){.ion-flex-md-row{flex-direction:row!important}.ion-flex-md-row-reverse{flex-direction:row-reverse!important}.ion-flex-md-column{flex-direction:column!important}.ion-flex-md-column-reverse{flex-direction:column-reverse!important}}@media(min-width:992px){.ion-flex-lg-row{flex-direction:row!important}.ion-flex-lg-row-reverse{flex-direction:row-reverse!important}.ion-flex-lg-column{flex-direction:column!important}.ion-flex-lg-column-reverse{flex-direction:column-reverse!important}}@media(min-width:1200px){.ion-flex-xl-row{flex-direction:row!important}.ion-flex-xl-row-reverse{flex-direction:row-reverse!important}.ion-flex-xl-column{flex-direction:column!important}.ion-flex-xl-column-reverse{flex-direction:column-reverse!important}}.ion-wrap{flex-wrap:wrap!important}.ion-nowrap{flex-wrap:nowrap!important}.ion-wrap-reverse{flex-wrap:wrap-reverse!important}.ion-flex-wrap{flex-wrap:wrap!important}.ion-flex-nowrap{flex-wrap:nowrap!important}.ion-flex-wrap-reverse{flex-wrap:wrap-reverse!important}@media(min-width:576px){.ion-flex-sm-wrap{flex-wrap:wrap!important}.ion-flex-sm-nowrap{flex-wrap:nowrap!important}.ion-flex-sm-wrap-reverse{flex-wrap:wrap-reverse!important}}@media(min-width:768px){.ion-flex-md-wrap{flex-wrap:wrap!important}.ion-flex-md-nowrap{flex-wrap:nowrap!important}.ion-flex-md-wrap-reverse{flex-wrap:wrap-reverse!important}}@media(min-width:992px){.ion-flex-lg-wrap{flex-wrap:wrap!important}.ion-flex-lg-nowrap{flex-wrap:nowrap!important}.ion-flex-lg-wrap-reverse{flex-wrap:wrap-reverse!important}}@media(min-width:1200px){.ion-flex-xl-wrap{flex-wrap:wrap!important}.ion-flex-xl-nowrap{flex-wrap:nowrap!important}.ion-flex-xl-wrap-reverse{flex-wrap:wrap-reverse!important}}.ion-flex-1{flex:1!important}.ion-flex-auto{flex:auto!important}.ion-flex-initial{flex:initial!important}.ion-flex-none{flex:none!important}@media(min-width:576px){.ion-flex-sm-1{flex:1!important}.ion-flex-sm-auto{flex:auto!important}.ion-flex-sm-initial{flex:initial!important}.ion-flex-sm-none{flex:none!important}}@media(min-width:768px){.ion-flex-md-1{flex:1!important}.ion-flex-md-auto{flex:auto!important}.ion-flex-md-initial{flex:initial!important}.ion-flex-md-none{flex:none!important}}@media(min-width:992px){.ion-flex-lg-1{flex:1!important}.ion-flex-lg-auto{flex:auto!important}.ion-flex-lg-initial{flex:initial!important}.ion-flex-lg-none{flex:none!important}}@media(min-width:1200px){.ion-flex-xl-1{flex:1!important}.ion-flex-xl-auto{flex:auto!important}.ion-flex-xl-initial{flex:initial!important}.ion-flex-xl-none{flex:none!important}}.ion-flex-grow-0{flex-grow:0!important}.ion-flex-grow-1{flex-grow:1!important}.ion-flex-shrink-0{flex-shrink:0!important}.ion-flex-shrink-1{flex-shrink:1!important}.ion-order-first{order:-1!important}.ion-order-0{order:0!important}.ion-order-1{order:1!important}.ion-order-2{order:2!important}.ion-order-3{order:3!important}.ion-order-4{order:4!important}.ion-order-5{order:5!important}.ion-order-6{order:6!important}.ion-order-7{order:7!important}.ion-order-8{order:8!important}.ion-order-9{order:9!important}.ion-order-10{order:10!important}.ion-order-11{order:11!important}.ion-order-12{order:12!important}.ion-order-last{order:13!important}.ion-hide,.ion-hide-down,.ion-hide-up{display:none!important}@media(max-width:575.98px){.ion-hide-sm-down{display:none!important}}@media(max-width:767.98px){.ion-hide-md-down{display:none!important}}@media(max-width:991.98px){.ion-hide-lg-down{display:none!important}}@media(max-width:1199.98px){.ion-hide-xl-down{display:none!important}}.ion-display-none{display:none!important}@media(min-width:576px){.ion-flex-sm-grow-0{flex-grow:0!important}.ion-flex-sm-grow-1{flex-grow:1!important}.ion-flex-sm-shrink-0{flex-shrink:0!important}.ion-flex-sm-shrink-1{flex-shrink:1!important}.ion-order-sm-first{order:-1!important}.ion-order-sm-0{order:0!important}.ion-order-sm-1{order:1!important}.ion-order-sm-2{order:2!important}.ion-order-sm-3{order:3!important}.ion-order-sm-4{order:4!important}.ion-order-sm-5{order:5!important}.ion-order-sm-6{order:6!important}.ion-order-sm-7{order:7!important}.ion-order-sm-8{order:8!important}.ion-order-sm-9{order:9!important}.ion-order-sm-10{order:10!important}.ion-order-sm-11{order:11!important}.ion-order-sm-12{order:12!important}.ion-order-sm-last{order:13!important}.ion-display-sm-none,.ion-hide-sm-up{display:none!important}}@media(min-width:768px){.ion-flex-md-grow-0{flex-grow:0!important}.ion-flex-md-grow-1{flex-grow:1!important}.ion-flex-md-shrink-0{flex-shrink:0!important}.ion-flex-md-shrink-1{flex-shrink:1!important}.ion-order-md-first{order:-1!important}.ion-order-md-0{order:0!important}.ion-order-md-1{order:1!important}.ion-order-md-2{order:2!important}.ion-order-md-3{order:3!important}.ion-order-md-4{order:4!important}.ion-order-md-5{order:5!important}.ion-order-md-6{order:6!important}.ion-order-md-7{order:7!important}.ion-order-md-8{order:8!important}.ion-order-md-9{order:9!important}.ion-order-md-10{order:10!important}.ion-order-md-11{order:11!important}.ion-order-md-12{order:12!important}.ion-order-md-last{order:13!important}.ion-display-md-none,.ion-hide-md-up{display:none!important}}@media(min-width:992px){.ion-flex-lg-grow-0{flex-grow:0!important}.ion-flex-lg-grow-1{flex-grow:1!important}.ion-flex-lg-shrink-0{flex-shrink:0!important}.ion-flex-lg-shrink-1{flex-shrink:1!important}.ion-order-lg-first{order:-1!important}.ion-order-lg-0{order:0!important}.ion-order-lg-1{order:1!important}.ion-order-lg-2{order:2!important}.ion-order-lg-3{order:3!important}.ion-order-lg-4{order:4!important}.ion-order-lg-5{order:5!important}.ion-order-lg-6{order:6!important}.ion-order-lg-7{order:7!important}.ion-order-lg-8{order:8!important}.ion-order-lg-9{order:9!important}.ion-order-lg-10{order:10!important}.ion-order-lg-11{order:11!important}.ion-order-lg-12{order:12!important}.ion-order-lg-last{order:13!important}.ion-display-lg-none,.ion-hide-lg-up{display:none!important}}@media(min-width:1200px){.ion-flex-xl-grow-0{flex-grow:0!important}.ion-flex-xl-grow-1{flex-grow:1!important}.ion-flex-xl-shrink-0{flex-shrink:0!important}.ion-flex-xl-shrink-1{flex-shrink:1!important}.ion-order-xl-first{order:-1!important}.ion-order-xl-0{order:0!important}.ion-order-xl-1{order:1!important}.ion-order-xl-2{order:2!important}.ion-order-xl-3{order:3!important}.ion-order-xl-4{order:4!important}.ion-order-xl-5{order:5!important}.ion-order-xl-6{order:6!important}.ion-order-xl-7{order:7!important}.ion-order-xl-8{order:8!important}.ion-order-xl-9{order:9!important}.ion-order-xl-10{order:10!important}.ion-order-xl-11{order:11!important}.ion-order-xl-12{order:12!important}.ion-order-xl-last{order:13!important}.ion-display-xl-none,.ion-hide-xl-up{display:none!important}.ion-display-xl-inline{display:inline!important}}.ion-display-inline{display:inline!important}@media(min-width:576px){.ion-display-sm-inline{display:inline!important}}@media(min-width:768px){.ion-display-md-inline{display:inline!important}}@media(min-width:992px){.ion-display-lg-inline{display:inline!important}.ion-display-lg-inline-block{display:inline-block!important}}.ion-display-inline-block{display:inline-block!important}@media(min-width:576px){.ion-display-sm-inline-block{display:inline-block!important}}@media(min-width:768px){.ion-display-md-inline-block{display:inline-block!important}}@media(min-width:1200px){.ion-display-xl-inline-block{display:inline-block!important}.ion-display-xl-block{display:block!important}}.ion-display-block{display:block!important}@media(min-width:576px){.ion-display-sm-block{display:block!important}}@media(min-width:768px){.ion-display-md-block{display:block!important}}@media(min-width:992px){.ion-display-lg-block{display:block!important}.ion-display-lg-flex{display:flex!important}}.ion-display-flex{display:flex!important}@media(min-width:576px){.ion-display-sm-flex{display:flex!important}}@media(min-width:768px){.ion-display-md-flex{display:flex!important}}@media(min-width:1200px){.ion-display-xl-flex{display:flex!important}.ion-display-xl-inline-flex{display:inline-flex!important}}.ion-display-inline-flex{display:inline-flex!important}@media(min-width:576px){.ion-display-sm-inline-flex{display:inline-flex!important}}@media(min-width:768px){.ion-display-md-inline-flex{display:inline-flex!important}}@media(min-width:992px){.ion-display-lg-inline-flex{display:inline-flex!important}.ion-display-lg-grid{display:grid!important}}.ion-display-grid{display:grid!important}@media(min-width:576px){.ion-display-sm-grid{display:grid!important}}@media(min-width:768px){.ion-display-md-grid{display:grid!important}}@media(min-width:1200px){.ion-display-xl-grid{display:grid!important}.ion-display-xl-inline-grid{display:inline-grid!important}}.ion-display-inline-grid{display:inline-grid!important}@media(min-width:576px){.ion-display-sm-inline-grid{display:inline-grid!important}}@media(min-width:768px){.ion-display-md-inline-grid{display:inline-grid!important}}@media(min-width:992px){.ion-display-lg-inline-grid{display:inline-grid!important}.ion-display-lg-table{display:table!important}}.ion-display-table{display:table!important}@media(min-width:576px){.ion-display-sm-table{display:table!important}}@media(min-width:768px){.ion-display-md-table{display:table!important}}@media(min-width:1200px){.ion-display-xl-table{display:table!important}.ion-display-xl-table-cell{display:table-cell!important}}.ion-display-table-cell{display:table-cell!important}@media(min-width:576px){.ion-display-sm-table-cell{display:table-cell!important}}@media(min-width:768px){.ion-display-md-table-cell{display:table-cell!important}}@media(min-width:992px){.ion-display-lg-table-cell{display:table-cell!important}.ion-display-lg-table-row{display:table-row!important}}.ion-display-table-row{display:table-row!important}@media(min-width:576px){.ion-display-sm-table-row{display:table-row!important}}@media(min-width:768px){.ion-display-md-table-row{display:table-row!important}}@media(min-width:1200px){.ion-display-xl-table-row{display:table-row!important}} :root{--ion-color-primary: #4d8dff;--ion-color-primary-rgb: 77, 141, 255;--ion-color-primary-contrast: #000;--ion-color-primary-contrast-rgb: 0, 0, 0;--ion-color-primary-shade: #447ce0;--ion-color-primary-tint: #5f98ff;--ion-color-secondary: #46b1ff;--ion-color-secondary-rgb: 70, 177, 255;--ion-color-secondary-contrast: #000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #3e9ce0;--ion-color-secondary-tint: #59b9ff;--ion-color-tertiary: #8482fb;--ion-color-tertiary-rgb: 132, 130, 251;--ion-color-tertiary-contrast: #000;--ion-color-tertiary-contrast-rgb: 0, 0, 0;--ion-color-tertiary-shade: #7472dd;--ion-color-tertiary-tint: #908ffb;--ion-color-success: #2dd55b;--ion-color-success-rgb: 45, 213, 91;--ion-color-success-contrast: #000;--ion-color-success-contrast-rgb: 0, 0, 0;--ion-color-success-shade: #28bb50;--ion-color-success-tint: #42d96b;--ion-color-warning: #ffce31;--ion-color-warning-rgb: 255, 206, 49;--ion-color-warning-contrast: #000;--ion-color-warning-contrast-rgb: 0, 0, 0;--ion-color-warning-shade: #e0b52b;--ion-color-warning-tint: #ffd346;--ion-color-danger: #f24c58;--ion-color-danger-rgb: 242, 76, 88;--ion-color-danger-contrast: #000;--ion-color-danger-contrast-rgb: 0, 0, 0;--ion-color-danger-shade: #d5434d;--ion-color-danger-tint: #f35e69;--ion-color-light: #222428;--ion-color-light-rgb: 34, 36, 40;--ion-color-light-contrast: #fff;--ion-color-light-contrast-rgb: 255, 255, 255;--ion-color-light-shade: #1e2023;--ion-color-light-tint: #383a3e;--ion-color-medium: #989aa2;--ion-color-medium-rgb: 152, 154, 162;--ion-color-medium-contrast: #000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #86888f;--ion-color-medium-tint: #a2a4ab;--ion-color-dark: #f4f5f8;--ion-color-dark-rgb: 244, 245, 248;--ion-color-dark-contrast: #000;--ion-color-dark-contrast-rgb: 0, 0, 0;--ion-color-dark-shade: #d7d8da;--ion-color-dark-tint: #f5f6f9}:root.ios{--ion-background-color: #000000;--ion-background-color-rgb: 0, 0, 0;--ion-text-color: #ffffff;--ion-text-color-rgb: 255, 255, 255;--ion-background-color-step-50: #0d0d0d;--ion-background-color-step-100: #1a1a1a;--ion-background-color-step-150: #262626;--ion-background-color-step-200: #333333;--ion-background-color-step-250: #404040;--ion-background-color-step-300: #4d4d4d;--ion-background-color-step-350: #595959;--ion-background-color-step-400: #666666;--ion-background-color-step-450: #737373;--ion-background-color-step-500: #808080;--ion-background-color-step-550: #8c8c8c;--ion-background-color-step-600: #999999;--ion-background-color-step-650: #a6a6a6;--ion-background-color-step-700: #b3b3b3;--ion-background-color-step-750: #bfbfbf;--ion-background-color-step-800: #cccccc;--ion-background-color-step-850: #d9d9d9;--ion-background-color-step-900: #e6e6e6;--ion-background-color-step-950: #f2f2f2;--ion-text-color-step-50: #f2f2f2;--ion-text-color-step-100: #e6e6e6;--ion-text-color-step-150: #d9d9d9;--ion-text-color-step-200: #cccccc;--ion-text-color-step-250: #bfbfbf;--ion-text-color-step-300: #b3b3b3;--ion-text-color-step-350: #a6a6a6;--ion-text-color-step-400: #999999;--ion-text-color-step-450: #8c8c8c;--ion-text-color-step-500: #808080;--ion-text-color-step-550: #737373;--ion-text-color-step-600: #666666;--ion-text-color-step-650: #595959;--ion-text-color-step-700: #4d4d4d;--ion-text-color-step-750: #404040;--ion-text-color-step-800: #333333;--ion-text-color-step-850: #262626;--ion-text-color-step-900: #1a1a1a;--ion-text-color-step-950: #0d0d0d;--ion-item-background: #000000;--ion-card-background: #1c1c1d}:root.ios ion-modal{--ion-background-color: var(--ion-color-step-100, var(--ion-background-color-step-100));--ion-toolbar-background: var(--ion-color-step-150, var(--ion-background-color-step-150));--ion-toolbar-border-color: var(--ion-color-step-250, var(--ion-background-color-step-250))}:root.md{--ion-background-color: #121212;--ion-background-color-rgb: 18, 18, 18;--ion-text-color: #ffffff;--ion-text-color-rgb: 255, 255, 255;--ion-background-color-step-50: #1e1e1e;--ion-background-color-step-100: #2a2a2a;--ion-background-color-step-150: #363636;--ion-background-color-step-200: #414141;--ion-background-color-step-250: #4d4d4d;--ion-background-color-step-300: #595959;--ion-background-color-step-350: #656565;--ion-background-color-step-400: #717171;--ion-background-color-step-450: #7d7d7d;--ion-background-color-step-500: #898989;--ion-background-color-step-550: #949494;--ion-background-color-step-600: #a0a0a0;--ion-background-color-step-650: #acacac;--ion-background-color-step-700: #b8b8b8;--ion-background-color-step-750: #c4c4c4;--ion-background-color-step-800: #d0d0d0;--ion-background-color-step-850: #dbdbdb;--ion-background-color-step-900: #e7e7e7;--ion-background-color-step-950: #f3f3f3;--ion-text-color-step-50: #f3f3f3;--ion-text-color-step-100: #e7e7e7;--ion-text-color-step-150: #dbdbdb;--ion-text-color-step-200: #d0d0d0;--ion-text-color-step-250: #c4c4c4;--ion-text-color-step-300: #b8b8b8;--ion-text-color-step-350: #acacac;--ion-text-color-step-400: #a0a0a0;--ion-text-color-step-450: #949494;--ion-text-color-step-500: #898989;--ion-text-color-step-550: #7d7d7d;--ion-text-color-step-600: #717171;--ion-text-color-step-650: #656565;--ion-text-color-step-700: #595959;--ion-text-color-step-750: #4d4d4d;--ion-text-color-step-800: #414141;--ion-text-color-step-850: #363636;--ion-text-color-step-900: #2a2a2a;--ion-text-color-step-950: #1e1e1e;--ion-item-background: #1e1e1e;--ion-toolbar-background: #1f1f1f;--ion-tab-bar-background: #1f1f1f;--ion-card-background: #1e1e1e} :host, .sl-theme-dark { color-scheme: dark; /* 검은 배경을 위한 그레이 스케일 조정 (더 어둡게) */ --sl-color-gray-50: hsl(0, 0%, 10%); /* 거의 검은색 */ --sl-color-gray-100: hsl(0, 0%, 15%); --sl-color-gray-200: hsl(0, 0%, 20%); --sl-color-gray-300: hsl(0, 0%, 25%); --sl-color-gray-400: hsl(0, 0%, 30%); --sl-color-gray-500: hsl(0, 0%, 35%); --sl-color-gray-600: hsl(0, 0%, 45%); --sl-color-gray-700: hsl(0, 0%, 60%); --sl-color-gray-800: hsl(0, 0%, 75%); --sl-color-gray-900: hsl(0, 0%, 85%); --sl-color-gray-950: hsl(0, 0%, 95%); --sl-color-red-50: hsl(0 56% 23.9%); --sl-color-red-100: hsl(0.6 60% 33.9%); --sl-color-red-200: hsl(0.9 67.2% 37.1%); --sl-color-red-300: hsl(1.1 71.3% 43.7%); --sl-color-red-400: hsl(1 76% 52.5%); --sl-color-red-500: hsl(0.7 89.6% 57.2%); --sl-color-red-600: hsl(0 98.6% 67.9%); --sl-color-red-700: hsl(0 100% 72.3%); --sl-color-red-800: hsl(0 100% 85.6%); --sl-color-red-900: hsl(0 100% 90.3%); --sl-color-red-950: hsl(0 100% 95.9%); --sl-color-orange-50: hsl(15 64.2% 23.3%); --sl-color-orange-100: hsl(15.1 70.9% 31.1%); --sl-color-orange-200: hsl(15.3 75.7% 35.5%); --sl-color-orange-300: hsl(17.1 83.5% 42.7%); --sl-color-orange-400: hsl(20.1 88% 50.8%); --sl-color-orange-500: hsl(24.3 100% 50.5%); --sl-color-orange-600: hsl(27.2 100% 57.7%); --sl-color-orange-700: hsl(31.3 100% 68.7%); --sl-color-orange-800: hsl(33.8 100% 79.3%); --sl-color-orange-900: hsl(38.9 100% 87.7%); --sl-color-orange-950: hsl(46.2 100% 95%); --sl-color-amber-50: hsl(21.9 66.3% 21.1%); --sl-color-amber-100: hsl(21.5 73.6% 29.7%); --sl-color-amber-200: hsl(22.3 77.6% 33.3%); --sl-color-amber-300: hsl(25.4 84.2% 39.6%); --sl-color-amber-400: hsl(31.4 87.4% 46.7%); --sl-color-amber-500: hsl(37 96.6% 48.3%); --sl-color-amber-600: hsl(43.3 100% 53.4%); --sl-color-amber-700: hsl(46.5 100% 61.1%); --sl-color-amber-800: hsl(49.3 100% 73%); --sl-color-amber-900: hsl(51.8 100% 85%); --sl-color-amber-950: hsl(60 100% 94.6%); --sl-color-yellow-50: hsl(32.5 60% 18.2%); --sl-color-yellow-100: hsl(28.1 68.6% 29%); --sl-color-yellow-200: hsl(31.3 75.8% 30.8%); --sl-color-yellow-300: hsl(34.7 84.4% 35.3%); --sl-color-yellow-400: hsl(40.1 87.3% 43.3%); --sl-color-yellow-500: hsl(44.7 88% 46%); --sl-color-yellow-600: hsl(47.7 100% 50.9%); --sl-color-yellow-700: hsl(51.3 100% 59.9%); --sl-color-yellow-800: hsl(54.6 100% 73%); --sl-color-yellow-900: hsl(58.9 100% 84.2%); --sl-color-yellow-950: hsl(60 100% 94%); --sl-color-lime-50: hsl(86.5 54.4% 18%); --sl-color-lime-100: hsl(87.6 56.8% 23.3%); --sl-color-lime-200: hsl(85.8 63.2% 24.5%); --sl-color-lime-300: hsl(86.1 72% 29.4%); --sl-color-lime-400: hsl(85.5 76.8% 37.3%); --sl-color-lime-500: hsl(84.3 74.2% 42.1%); --sl-color-lime-600: hsl(82.8 81.5% 52.6%); --sl-color-lime-700: hsl(82 89.9% 64%); --sl-color-lime-800: hsl(80.9 97.9% 76.6%); --sl-color-lime-900: hsl(77.9 100% 85.8%); --sl-color-lime-950: hsl(69.5 100% 93.8%); --sl-color-green-50: hsl(144.3 53.6% 16%); --sl-color-green-100: hsl(143.2 55.4% 23.5%); --sl-color-green-200: hsl(141.5 58.2% 26.3%); --sl-color-green-300: hsl(140.8 64.2% 31.8%); --sl-color-green-400: hsl(140.3 68% 39.2%); --sl-color-green-500: hsl(141.1 64.9% 43%); --sl-color-green-600: hsl(141.6 72.4% 55.2%); --sl-color-green-700: hsl(141.7 82.7% 70.1%); --sl-color-green-800: hsl(141 90.9% 82.1%); --sl-color-green-900: hsl(142 100% 89.1%); --sl-color-green-950: hsl(144 100% 95.5%); --sl-color-emerald-50: hsl(164.3 75% 13.5%); --sl-color-emerald-100: hsl(163.5 72.6% 20.1%); --sl-color-emerald-200: hsl(162.1 73.7% 22.4%); --sl-color-emerald-300: hsl(161.3 77.3% 27.6%); --sl-color-emerald-400: hsl(159.6 77.1% 34.3%); --sl-color-emerald-500: hsl(159.1 73.5% 37.9%); --sl-color-emerald-600: hsl(157.8 66.8% 48.9%); --sl-color-emerald-700: hsl(156.2 76.1% 63.8%); --sl-color-emerald-800: hsl(152.4 84.4% 77.4%); --sl-color-emerald-900: hsl(149.3 100% 87%); --sl-color-emerald-950: hsl(158.6 100% 94.8%); --sl-color-teal-50: hsl(176.5 51.5% 15.4%); --sl-color-teal-100: hsl(175.9 54.7% 22.3%); --sl-color-teal-200: hsl(175.9 60.7% 23.9%); --sl-color-teal-300: hsl(174.5 67.3% 28.8%); --sl-color-teal-400: hsl(174.4 71.9% 34.9%); --sl-color-teal-500: hsl(173.1 71% 38.3%); --sl-color-teal-600: hsl(172.3 68.2% 48.1%); --sl-color-teal-700: hsl(170.5 81.3% 61.5%); --sl-color-teal-800: hsl(168.4 92.1% 75.2%); --sl-color-teal-900: hsl(168.3 100% 86%); --sl-color-teal-950: hsl(180 100% 95.5%); --sl-color-cyan-50: hsl(197.1 53.8% 20.3%); --sl-color-cyan-100: hsl(196.8 57.3% 27.2%); --sl-color-cyan-200: hsl(195.3 62.7% 29.4%); --sl-color-cyan-300: hsl(193.5 71.3% 34.1%); --sl-color-cyan-400: hsl(192.5 76.8% 40.6%); --sl-color-cyan-500: hsl(189.4 78.6% 42.6%); --sl-color-cyan-600: hsl(188.2 89.1% 51.7%); --sl-color-cyan-700: hsl(187 98.6% 66.2%); --sl-color-cyan-800: hsl(184.9 100% 78.3%); --sl-color-cyan-900: hsl(180 100% 86.6%); --sl-color-cyan-950: hsl(180 100% 94.8%); --sl-color-sky-50: hsl(203 63.8% 20.9%); --sl-color-sky-100: hsl(203.4 70.4% 28%); --sl-color-sky-200: hsl(202.7 75.8% 30.8%); --sl-color-sky-300: hsl(203.1 80.4% 36.1%); --sl-color-sky-400: hsl(202.1 80.5% 44.3%); --sl-color-sky-500: hsl(199.7 85.9% 47.7%); --sl-color-sky-600: hsl(198.7 97.9% 57.2%); --sl-color-sky-700: hsl(198.7 100% 70.5%); --sl-color-sky-800: hsl(198.8 100% 82.5%); --sl-color-sky-900: hsl(198.5 100% 89.9%); --sl-color-sky-950: hsl(186 100% 95.5%); --sl-color-blue-50: hsl(227.1 49.5% 22.7%); --sl-color-blue-100: hsl(225.8 58.9% 36.8%); --sl-color-blue-200: hsl(227.7 64.4% 42.9%); --sl-color-blue-300: hsl(226.1 72.7% 51.2%); --sl-color-blue-400: hsl(222.6 86.5% 56.3%); --sl-color-blue-500: hsl(217.8 95.8% 57.4%); --sl-color-blue-600: hsl(213.3 100% 65%); --sl-color-blue-700: hsl(210.9 100% 74.8%); --sl-color-blue-800: hsl(211.5 100% 83.4%); --sl-color-blue-900: hsl(211 100% 88.9%); --sl-color-blue-950: hsl(201.8 100% 95.3%); --sl-color-indigo-50: hsl(243.5 40.8% 27%); --sl-color-indigo-100: hsl(242.9 45.7% 37.6%); --sl-color-indigo-200: hsl(244.7 52.7% 43.1%); --sl-color-indigo-300: hsl(245.3 60.5% 52.4%); --sl-color-indigo-400: hsl(244.1 79.2% 60.4%); --sl-color-indigo-500: hsl(239.6 88.7% 63.8%); --sl-color-indigo-600: hsl(234.5 96.7% 70.9%); --sl-color-indigo-700: hsl(229.4 100% 78.3%); --sl-color-indigo-800: hsl(227.1 100% 85%); --sl-color-indigo-900: hsl(223.8 100% 89.9%); --sl-color-indigo-950: hsl(220 100% 95.1%); --sl-color-violet-50: hsl(265.1 57.3% 25.4%); --sl-color-violet-100: hsl(263.5 63.8% 39.4%); --sl-color-violet-200: hsl(263.4 66.2% 44.1%); --sl-color-violet-300: hsl(263.7 72.8% 52.4%); --sl-color-violet-400: hsl(262.5 87.3% 59.8%); --sl-color-violet-500: hsl(258.3 95.1% 63.2%); --sl-color-violet-600: hsl(255.1 100% 67.2%); --sl-color-violet-700: hsl(253 100% 81.5%); --sl-color-violet-800: hsl(251.7 100% 87.9%); --sl-color-violet-900: hsl(254.1 100% 91.7%); --sl-color-violet-950: hsl(257.1 100% 96.1%); --sl-color-purple-50: hsl(276 54.3% 20.5%); --sl-color-purple-100: hsl(273.6 61.8% 35.4%); --sl-color-purple-200: hsl(272.9 64% 41.4%); --sl-color-purple-300: hsl(271.9 68.1% 49.2%); --sl-color-purple-400: hsl(271.5 85.1% 57.8%); --sl-color-purple-500: hsl(270.7 96.4% 62.1%); --sl-color-purple-600: hsl(270.5 100% 71.9%); --sl-color-purple-700: hsl(270.9 100% 81.3%); --sl-color-purple-800: hsl(272.4 100% 87.7%); --sl-color-purple-900: hsl(276.7 100% 91.5%); --sl-color-purple-950: hsl(300 100% 96.5%); --sl-color-fuchsia-50: hsl(297.1 51.2% 18.6%); --sl-color-fuchsia-100: hsl(296.7 59.5% 31.5%); --sl-color-fuchsia-200: hsl(295.4 65.4% 35.1%); --sl-color-fuchsia-300: hsl(294.6 67.4% 42.2%); --sl-color-fuchsia-400: hsl(293.3 68.7% 51.2%); --sl-color-fuchsia-500: hsl(292.1 88.4% 57.7%); --sl-color-fuchsia-600: hsl(292 98.5% 59.5%); --sl-color-fuchsia-700: hsl(292.4 100% 79.5%); --sl-color-fuchsia-800: hsl(292.9 100% 86.8%); --sl-color-fuchsia-900: hsl(300 100% 91.5%); --sl-color-fuchsia-950: hsl(300 100% 96.3%); --sl-color-pink-50: hsl(336.2 59.6% 20%); --sl-color-pink-100: hsl(336.8 63.9% 34%); --sl-color-pink-200: hsl(336.8 68.7% 37.6%); --sl-color-pink-300: hsl(336.1 71.8% 44.5%); --sl-color-pink-400: hsl(333.9 74.9% 53.1%); --sl-color-pink-500: hsl(330.7 86.3% 57.7%); --sl-color-pink-600: hsl(328.6 91.5% 67.2%); --sl-color-pink-700: hsl(327.4 97.6% 78.7%); --sl-color-pink-800: hsl(325.1 100% 86.6%); --sl-color-pink-900: hsl(322.1 100% 91.3%); --sl-color-pink-950: hsl(315 100% 95.9%); --sl-color-rose-50: hsl(342.3 62.9% 21.5%); --sl-color-rose-100: hsl(342.8 68.9% 34.2%); --sl-color-rose-200: hsl(344.8 72.6% 37.3%); --sl-color-rose-300: hsl(346.9 75.8% 43.7%); --sl-color-rose-400: hsl(348.2 80.1% 52.7%); --sl-color-rose-500: hsl(350.4 94.8% 57.5%); --sl-color-rose-600: hsl(351.2 100% 58.1%); --sl-color-rose-700: hsl(352.3 100% 78.1%); --sl-color-rose-800: hsl(352 100% 86.2%); --sl-color-rose-900: hsl(354.5 100% 90.7%); --sl-color-rose-950: hsl(353.3 100% 95.7%); /* 메인 색상 (#C1A87D) 적용 */ --sl-color-primary-50: hsl(38, 20%, 15%); --sl-color-primary-100: hsl(38, 22%, 25%); --sl-color-primary-200: hsl(38, 25%, 35%); --sl-color-primary-300: hsl(38, 28%, 45%); --sl-color-primary-400: hsl(38, 30%, 55%); --sl-color-primary-500: hsl(38, 34%, 63%); /* #C1A87D */ --sl-color-primary-600: hsl(38, 40%, 70%); --sl-color-primary-700: hsl(38, 45%, 78%); --sl-color-primary-800: hsl(38, 50%, 85%); --sl-color-primary-900: hsl(38, 55%, 90%); --sl-color-primary-950: hsl(38, 60%, 95%); --sl-color-success-50: var(--sl-color-green-50); --sl-color-success-100: var(--sl-color-green-100); --sl-color-success-200: var(--sl-color-green-200); --sl-color-success-300: var(--sl-color-green-300); --sl-color-success-400: var(--sl-color-green-400); --sl-color-success-500: var(--sl-color-green-500); --sl-color-success-600: var(--sl-color-green-600); --sl-color-success-700: var(--sl-color-green-700); --sl-color-success-800: var(--sl-color-green-800); --sl-color-success-900: var(--sl-color-green-900); --sl-color-success-950: var(--sl-color-green-950); --sl-color-warning-50: var(--sl-color-amber-50); --sl-color-warning-100: var(--sl-color-amber-100); --sl-color-warning-200: var(--sl-color-amber-200); --sl-color-warning-300: var(--sl-color-amber-300); --sl-color-warning-400: var(--sl-color-amber-400); --sl-color-warning-500: var(--sl-color-amber-500); --sl-color-warning-600: var(--sl-color-amber-600); --sl-color-warning-700: var(--sl-color-amber-700); --sl-color-warning-800: var(--sl-color-amber-800); --sl-color-warning-900: var(--sl-color-amber-900); --sl-color-warning-950: var(--sl-color-amber-950); --sl-color-danger-50: var(--sl-color-red-50); --sl-color-danger-100: var(--sl-color-red-100); --sl-color-danger-200: var(--sl-color-red-200); --sl-color-danger-300: var(--sl-color-red-300); --sl-color-danger-400: var(--sl-color-red-400); --sl-color-danger-500: var(--sl-color-red-500); --sl-color-danger-600: var(--sl-color-red-600); --sl-color-danger-700: var(--sl-color-red-700); --sl-color-danger-800: var(--sl-color-red-800); --sl-color-danger-900: var(--sl-color-red-900); --sl-color-danger-950: var(--sl-color-red-950); --sl-color-neutral-50: var(--sl-color-gray-50); --sl-color-neutral-100: var(--sl-color-gray-100); --sl-color-neutral-200: var(--sl-color-gray-200); --sl-color-neutral-300: var(--sl-color-gray-300); --sl-color-neutral-400: var(--sl-color-gray-400); --sl-color-neutral-500: var(--sl-color-gray-500); --sl-color-neutral-600: var(--sl-color-gray-600); --sl-color-neutral-700: var(--sl-color-gray-700); --sl-color-neutral-800: var(--sl-color-gray-800); --sl-color-neutral-900: var(--sl-color-gray-900); --sl-color-neutral-950: var(--sl-color-gray-950); --sl-color-neutral-0: hsl(0, 0%, 5%); /* 거의 검은색 */ --sl-color-neutral-1000: hsl(0, 0%, 100%); /* 흰색 */ --sl-border-radius-small: 0.1875rem; --sl-border-radius-medium: 0.25rem; --sl-border-radius-large: 0.5rem; --sl-border-radius-x-large: 1rem; --sl-border-radius-circle: 50%; --sl-border-radius-pill: 9999px; --sl-shadow-x-small: 0 1px 2px rgb(0 0 0 / 18%); --sl-shadow-small: 0 1px 2px rgb(0 0 0 / 24%); --sl-shadow-medium: 0 2px 4px rgb(0 0 0 / 24%); --sl-shadow-large: 0 2px 8px rgb(0 0 0 / 24%); --sl-shadow-x-large: 0 4px 16px rgb(0 0 0 / 24%); --sl-spacing-3x-small: 0.125rem; --sl-spacing-2x-small: 0.25rem; --sl-spacing-x-small: 0.5rem; --sl-spacing-small: 0.75rem; --sl-spacing-medium: 1rem; --sl-spacing-large: 1.25rem; --sl-spacing-x-large: 1.75rem; --sl-spacing-2x-large: 2.25rem; --sl-spacing-3x-large: 3rem; --sl-spacing-4x-large: 4.5rem; --sl-transition-x-slow: 1000ms; --sl-transition-slow: 500ms; --sl-transition-medium: 250ms; --sl-transition-fast: 150ms; --sl-transition-x-fast: 50ms; --sl-font-mono: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace; --sl-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; --sl-font-serif: Georgia, "Times New Roman", serif; --sl-font-size-2x-small: 0.625rem; --sl-font-size-x-small: 0.75rem; --sl-font-size-small: 0.875rem; --sl-font-size-medium: 1rem; --sl-font-size-large: 1.25rem; --sl-font-size-x-large: 1.5rem; --sl-font-size-2x-large: 2.25rem; --sl-font-size-3x-large: 3rem; --sl-font-size-4x-large: 4.5rem; --sl-font-weight-light: 300; --sl-font-weight-normal: 400; --sl-font-weight-semibold: 500; --sl-font-weight-bold: 700; --sl-letter-spacing-denser: -0.03em; --sl-letter-spacing-dense: -0.015em; --sl-letter-spacing-normal: normal; --sl-letter-spacing-loose: 0.075em; --sl-letter-spacing-looser: 0.15em; --sl-line-height-denser: 1; --sl-line-height-dense: 1.4; --sl-line-height-normal: 1.8; --sl-line-height-loose: 2.2; --sl-line-height-looser: 2.6; --sl-focus-ring-color: var(--sl-color-primary-700); /* 메인 색상에 맞춤 */ --sl-focus-ring-style: solid; --sl-focus-ring-width: 3px; --sl-focus-ring: var(--sl-focus-ring-style) var(--sl-focus-ring-width) var(--sl-focus-ring-color); --sl-focus-ring-offset: 1px; --sl-button-font-size-small: var(--sl-font-size-x-small); --sl-button-font-size-medium: var(--sl-font-size-small); --sl-button-font-size-large: var(--sl-font-size-medium); --sl-input-height-small: 1.875rem; --sl-input-height-medium: 2.5rem; --sl-input-height-large: 3.125rem; --sl-input-background-color: var(--sl-color-neutral-0); --sl-input-background-color-hover: var(--sl-input-background-color); --sl-input-background-color-focus: var(--sl-input-background-color); --sl-input-background-color-disabled: var(--sl-color-neutral-100); --sl-input-border-color: var(--sl-color-neutral-400); --sl-input-border-color-hover: var(--sl-color-neutral-500); --sl-input-border-color-focus: var(--sl-color-primary-600); --sl-input-border-color-disabled: var(--sl-color-neutral-400); --sl-input-border-width: 1px; --sl-input-required-content: "*"; --sl-input-required-content-offset: -2px; --sl-input-required-content-color: var(--sl-input-label-color); --sl-input-border-radius-small: var(--sl-border-radius-medium); --sl-input-border-radius-medium: var(--sl-border-radius-medium); --sl-input-border-radius-large: var(--sl-border-radius-medium); --sl-input-font-family: var(--sl-font-sans); --sl-input-font-weight: var(--sl-font-weight-normal); --sl-input-font-size-small: var(--sl-font-size-small); --sl-input-font-size-medium: var(--sl-font-size-medium); --sl-input-font-size-large: var(--sl-font-size-large); --sl-input-letter-spacing: var(--sl-letter-spacing-normal); --sl-input-color: var(--sl-color-neutral-900); /* 텍스트 색상 밝게 조정 */ --sl-input-color-hover: var(--sl-color-neutral-900); --sl-input-color-focus: var(--sl-color-neutral-900); --sl-input-color-disabled: var(--sl-color-neutral-700); --sl-input-icon-color: var(--sl-color-neutral-600); --sl-input-icon-color-hover: var(--sl-color-neutral-700); --sl-input-icon-color-focus: var(--sl-color-neutral-700); --sl-input-placeholder-color: var(--sl-color-neutral-600); /* 플레이스홀더 색상 조정 */ --sl-input-placeholder-color-disabled: var(--sl-color-neutral-700); --sl-input-spacing-small: var(--sl-spacing-small); --sl-input-spacing-medium: var(--sl-spacing-medium); --sl-input-spacing-large: var(--sl-spacing-large); --sl-input-focus-ring-color: hsl(38, 45%, 78% / 40%); /* 메인 색상에 맞춤 */ --sl-input-focus-ring-offset: 0; --sl-input-filled-background-color: var(--sl-color-neutral-100); --sl-input-filled-background-color-hover: var(--sl-color-neutral-100); --sl-input-filled-background-color-focus: var(--sl-color-neutral-100); --sl-input-filled-background-color-disabled: var(--sl-color-neutral-100); --sl-input-filled-color: var(--sl-color-neutral-900); /* 텍스트 색상 밝게 조정 */ --sl-input-filled-color-hover: var(--sl-color-neutral-900); --sl-input-filled-color-focus: var(--sl-color-neutral-900); --sl-input-filled-color-disabled: var(--sl-color-neutral-800); --sl-input-label-font-size-small: var(--sl-font-size-small); --sl-input-label-font-size-medium: var(--sl-font-size-medium); --sl-input-label-font-size-large: var(--sl-font-size-large); --sl-input-label-color: inherit; --sl-input-help-text-font-size-small: var(--sl-font-size-x-small); --sl-input-help-text-font-size-medium: var(--sl-font-size-small); --sl-input-help-text-font-size-large: var(--sl-font-size-medium); --sl-input-help-text-color: var(--sl-color-neutral-700); /* 도움말 텍스트 색상 조정 */ --sl-toggle-size-small: 0.875rem; --sl-toggle-size-medium: 1.125rem; --sl-toggle-size-large: 1.375rem; --sl-overlay-background-color: hsl(0 0% 0% / 43%); --sl-panel-background-color: var(--sl-color-neutral-50); --sl-panel-border-color: var(--sl-color-neutral-200); --sl-panel-border-width: 1px; --sl-tooltip-border-radius: var(--sl-border-radius-medium); --sl-tooltip-background-color: var(--sl-color-neutral-700); /* 툴팁 배경색 어둡게 조정 */ --sl-tooltip-color: var(--sl-color-neutral-900); /* 툴팁 텍스트 색상 밝게 조정 */ --sl-tooltip-font-family: var(--sl-font-sans); --sl-tooltip-font-weight: var(--sl-font-weight-normal); --sl-tooltip-font-size: var(--sl-font-size-small); --sl-tooltip-line-height: var(--sl-line-height-dense); --sl-tooltip-padding: var(--sl-spacing-2x-small) var(--sl-spacing-x-small); --sl-tooltip-arrow-size: 6px; --sl-z-index-drawer: 700; --sl-z-index-dialog: 800; --sl-z-index-dropdown: 900; --sl-z-index-toast: 950; --sl-z-index-tooltip: 1000; } @supports (scrollbar-gutter: stable) { .sl-scroll-lock { scrollbar-gutter: var(--sl-scroll-lock-gutter) !important; } .sl-scroll-lock body { overflow: hidden !important; } } @supports not (scrollbar-gutter: stable) { .sl-scroll-lock body { padding-right: var(--sl-scroll-lock-size) !important; overflow: hidden !important; } } .sl-toast-stack { position: fixed; top: 0; inset-inline-end: 0; z-index: var(--sl-z-index-toast); width: 28rem; max-width: 100%; max-height: 100%; overflow: auto; } .sl-toast-stack sl-alert { margin: var(--sl-spacing-medium); } .sl-toast-stack sl-alert::part(base) { box-shadow: var(--sl-shadow-large); } :root { --ion-color-primary: #C1A87D; --ion-color-primary-rgb: 193, 168, 125; --ion-color-primary-contrast: #000000; --ion-color-primary-contrast-rgb: 0, 0, 0; --ion-color-primary-shade: #B19A72; --ion-color-primary-tint: #D1BD9C; --ion-color-secondary: #0163aa; --ion-color-secondary-rgb: 1, 99, 170; --ion-color-secondary-contrast: #ffffff; --ion-color-secondary-contrast-rgb: 255, 255, 255; --ion-color-secondary-shade: #015796; --ion-color-secondary-tint: #1a73b3; --ion-color-tertiary: #6030ff; --ion-color-tertiary-rgb: 96, 48, 255; --ion-color-tertiary-contrast: #ffffff; --ion-color-tertiary-contrast-rgb: 255, 255, 255; --ion-color-tertiary-shade: #542ae0; --ion-color-tertiary-tint: #7045ff; --ion-color-success: #2dd55b; --ion-color-success-rgb: 45, 213, 91; --ion-color-success-contrast: #000000; --ion-color-success-contrast-rgb: 0, 0, 0; --ion-color-success-shade: #28bb50; --ion-color-success-tint: #42d96b; --ion-color-warning: #ffc409; --ion-color-warning-rgb: 255, 196, 9; --ion-color-warning-contrast: #000000; --ion-color-warning-contrast-rgb: 0, 0, 0; --ion-color-warning-shade: #e0ac08; --ion-color-warning-tint: #ffca22; --ion-color-danger: #c5000f; --ion-color-danger-rgb: 197, 0, 15; --ion-color-danger-contrast: #ffffff; --ion-color-danger-contrast-rgb: 255, 255, 255; --ion-color-danger-shade: #ad000d; --ion-color-danger-tint: #cb1a27; --ion-color-light: #f6f8fc; --ion-color-light-rgb: 246, 248, 252; --ion-color-light-contrast: #000000; --ion-color-light-contrast-rgb: 0, 0, 0; --ion-color-light-shade: #d8dade; --ion-color-light-tint: #f7f9fc; --ion-color-medium: #5f5f5f; --ion-color-medium-rgb: 95, 95, 95; --ion-color-medium-contrast: #ffffff; --ion-color-medium-contrast-rgb: 255, 255, 255; --ion-color-medium-shade: #545454; --ion-color-medium-tint: #6f6f6f; --ion-color-dark: #2f2f2f; --ion-color-dark-rgb: 47, 47, 47; --ion-color-dark-contrast: #ffffff; --ion-color-dark-contrast-rgb: 255, 255, 255; --ion-color-dark-shade: #292929; --ion-color-dark-tint: #444444; } ion-modal.fullscreen { --width: 100%; --height: 100%; } .sl-theme-dark { --docs-background-color: var(--ion-background-color); --docs-border-color: var(--sl-color-neutral-200); --docs-border-width: 1px; --docs-border-radius: var(--sl-border-radius-medium); --docs-content-max-width: 860px; --docs-sidebar-width: 320px; --docs-sidebar-transition-speed: 250ms; --docs-content-toc-max-width: 260px; --docs-content-padding: 2rem; --docs-content-vertical-spacing: 2rem; --docs-search-overlay-background: rgb(0 0 0 / 0.2); --docs-skip-to-main-width: 200px; --docs-overlay-color: hsl(0 0% 0% / 66%); --docs-shadow-x-small: 0 1px 2px rgb(0 0 0 / 36%); --docs-shadow-small: 0 1px 2px rgb(0 0 0 / 48%); --docs-shadow-medium: 0 2px 4px rgb(0 0 0 / 48%); --docs-shadow-large: 0 2px 8px rgb(0 0 0 / 48%); --docs-shadow-x-large: 0 4px 16px rgb(0 0 0 / 48%); } html { height: 100%; box-sizing: border-box; line-height: var(--sl-line-height-normal); padding: 0; margin: 0; } body { height: 100%; font: 16px var(--sl-font-sans); font-weight: var(--sl-font-weight-normal); background-color: var(--docs-background-color); line-height: var(--sl-line-height-normal); color: var(--sl-color-neutral-900); padding: 0; margin: 0; overflow-x: hidden; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } ion-app { --ion-toolbar-color: var(--sl-color-neutral-900); ion-content.content { --color: var(--sl-color-neutral-900); } } ion-modal ion-content { --color: var(--sl-color-neutral-900); } .page { height: 100%; display: flex; flex-direction: column; } .notice-bar { display: flex; justify-content: space-between; align-items: center; background: #222; color: #eee; font-size: 0.85rem; padding: 6px 12px; border-bottom: 1px solid #333; } .notice-bar .title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin: 0; } .notice-bar button { background: none; border: none; color: #888; font-size: 0.8rem; cursor: pointer; } .notice-bar button:hover { color: #aaa; } .notice-date { font-size: 0.9rem; color: #888; margin: 0.5em 0; } /* ================================ (Optional) Floating "Install" Button ================================ */ #installBtn { position: fixed; right: 16px; bottom: 16px; z-index: 2147483647; display: none; padding: 12px 16px; border-radius: 9999px; background: #111; color: #fff; font-weight: 600; border: none; cursor: pointer; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25); } #installBtn[data-visible="true"] { display: inline-flex; align-items: center; gap: 8px; } /* ================================ Variables & Theme ================================ */ :root { --pwa-z-modal: 2147483646; --pwa-radius: 16px; --pwa-shadow: 0 20px 40px rgba(0, 0, 0, 0.25); --pwa-bg: #fff; --pwa-fg: #111; --pwa-backdrop: rgba(0, 0, 0, 0.45); --pwa-primary: #111; /* primary button bg */ --pwa-on-primary: #fff; --pwa-muted: #eee; --pwa-ios-blue: #007AFF; /* iOS Share tint */ } @media (prefers-color-scheme: dark) { :root { --pwa-bg: #1c1c1e; --pwa-fg: #f2f2f7; --pwa-backdrop: rgba(0, 0, 0, 0.6); --pwa-muted: #2c2c2e; --pwa-primary: #007AFF; /* looks nice in dark */ --pwa-on-primary: #fff; } } /* ================================ Shared Overlay for iOS & Android ================================ */ #iosInstallGuide, #androidInstallGuide { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: var(--pwa-z-modal); background: var(--pwa-backdrop); } #iosInstallGuide[data-open="true"], #androidInstallGuide[data-open="true"] { display: flex; } #iosInstallGuide .sheet, #androidInstallGuide .sheet { width: min(92vw, 440px); background: var(--pwa-bg); color: var(--pwa-fg); border-radius: var(--pwa-radius); padding: 18px; box-shadow: var(--pwa-shadow); line-height: 1.45; transform: translateY(6px) scale(0.98); opacity: 0; } @media (prefers-reduced-motion: no-preference) { #iosInstallGuide[data-open="true"] .sheet, #androidInstallGuide[data-open="true"] .sheet { animation: pwa-sheet-in 160ms ease-out forwards; } } @keyframes pwa-sheet-in { to { transform: translateY(0) scale(1); opacity: 1; } } #iosInstallGuide .sheet h3, #androidInstallGuide .sheet h3 { margin: 0 0 8px; font-size: 18px; } #iosInstallGuide .sheet p, #androidInstallGuide .sheet p { margin: 6px 0 0; } #iosInstallGuide .sheet ol, #androidInstallGuide .sheet ol { margin: 12px 0; padding-left: 20px; } #iosInstallGuide .actions, #androidInstallGuide .actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; } /* Buttons inside sheets */ #iosInstallGuide button, #androidInstallGuide button { padding: 8px 12px; border: 0; border-radius: 10px; cursor: pointer; font-weight: 600; } /* iOS sheet specific */ #iosInstallGuide .ok { background: var(--pwa-primary); color: var(--pwa-on-primary); } /* Android sheet specific */ #androidInstallGuide .ok { background: var(--pwa-primary); color: var(--pwa-on-primary); } /* Icon alignment/tint within instructions */ #iosInstallGuide .sheet ion-icon, #androidInstallGuide .sheet ion-icon { vertical-align: -2px; font-size: 1.05em; } #iosInstallGuide .sheet ion-icon[name="share-outline"] { color: var(--pwa-ios-blue); } /* Optional: widen Android dialog a bit if you like #androidInstallGuide .sheet { width: min(92vw, 480px); } */ .gaia-dashboard { padding: 20px; } .gaia-dashboard .header { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; } .gaia-dashboard .grid { display: grid; grid-template-columns: 1fr; gap: 20px; } @media (min-width: 900px) { .gaia-dashboard .grid { grid-template-columns: 1fr; /* keep 1 column; section cards manage inner grids */ } } .gaia-dashboard sl-card::part(base) { background: var(--sl-color-neutral-0); border: 1px solid var(--sl-color-neutral-200); border-radius: 12px; } .gaia-dashboard .section-title { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--sl-color-neutral-500); margin: 0 0 12px 0; } .gaia-dashboard .body { line-height: 1.6; } .gods-section-header { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; >h3 { font-weight: 600; font-size: 15px; margin: 0; } } .gods-stats-dash sl-card::part(base) { background: var(--sl-color-neutral-0); border: 1px solid var(--sl-color-neutral-200); border-radius: 12px; } .gs-header { margin-bottom: 12px; } .gs-header h3 { margin: 0; font-size: 16px; } .gs-grid { display: grid; grid-template-columns: 1fr; /* 하나의 컬럼 */ gap: 16px; } .gs-left { display: grid; gap: 16px; } .gs-right { display: grid; gap: 16px; } .gs-panel { padding: 12px; border: 1px solid var(--sl-color-neutral-200); border-radius: 12px; background: var(--sl-color-neutral-0); } .gs-section-title { display: flex; align-items: center; gap: 8px; color: var(--sl-color-neutral-500); font-size: 14px; margin: 0 0 10px 0; } .gs-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .gs-stat { display: flex; flex-direction: column; gap: 4px; } .gs-stat .value { font-weight: 700; font-size: 22px; } .gs-stat .label { font-size: 12px; color: var(--sl-color-neutral-500); } .gs-sub { font-size: 12px; color: var(--sl-color-neutral-500); margin-top: 8px; } .gs-chart-wrap { width: 100%; height: 360px; } .gs-about { line-height: 1.6; } .name-search-result-content { /* ----- Theme tokens ----- */ --surface-0: rgba(18, 18, 18, 0.92); /* 패널 배경 */ --surface-1: rgba(34, 34, 34, 0.95); /* 리스트/카드 */ --surface-1-hover: rgba(42, 42, 42, 0.98); --border: color-mix(in oklab, #ffffff, transparent 85%); --text-muted: color-mix(in oklab, #ffffff, transparent 42%); --accent: #f6c546; /* GAIA Gold */ --success: #69f0ae; /* 네온민트(낮은 채도) */ padding: 10px; display: flex; flex-direction: column; gap: 10px; max-height: min(60vh, 560px); overflow-y: auto; background: var(--surface-0); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35); } /* 가는 상단 구분선 */ .result-separator { height: 1px; background: var(--border); margin: 6px 4px 2px; } /* 리스트 */ .result-list { display: flex; flex-direction: column; gap: 8px; } /* 행 버튼 */ .list-row { display: grid; grid-template-columns: 1fr auto; align-items: center; width: 100%; text-align: left; padding: 14px 14px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-1); transition: transform 120ms ease, background 120ms ease, border-color 120ms ease; cursor: pointer; } .list-row:hover { background: var(--surface-1-hover); transform: translateY(-1px); border-color: color-mix(in oklab, #ffffff, transparent 75%); } .list-row:focus-visible { outline: none; box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent), transparent 55%); border-color: color-mix(in oklab, var(--accent), transparent 35%); } /* 타이포 */ .title { font-size: 1rem; font-weight: 800; letter-spacing: 0.1px; margin: 0 0 2px 0; } .meta { margin: 0; font-size: 0.8rem; color: var(--text-muted); } /* 배지는 완전 평면 */ .badge { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.7rem; padding: 4px 8px; border-radius: 999px; border: 1px solid var(--border); background: transparent; color: var(--text-muted); } /* Available 카드: 얇은 dashed + 그린 포커스 */ .available-name { border: 1px dashed color-mix(in oklab, var(--success), transparent 55%); padding: 10px; border-radius: 14px; background: transparent; } .available-name h4 { font-size: 0.9rem; margin: 0 0 8px 2px; color: var(--success); font-weight: 700; letter-spacing: 0.2px; } .available-name .list-row { color: var(--success); border-color: color-mix(in oklab, var(--success), transparent 65%); background: transparent; } .available-name .list-row:hover { background: color-mix(in oklab, var(--success), transparent 93%); border-color: color-mix(in oklab, var(--success), transparent 45%); } /* Shoelace 기본 요소 여백 */ sl-alert { margin-top: 6px; } sl-spinner { display: block; margin: 16px auto; } /* 스크롤바 */ .name-search-result-content::-webkit-scrollbar { width: 12px; height: 12px; } .name-search-result-content::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.16); border: 3px solid transparent; border-radius: 999px; background-clip: content-box; } .name-search-result-content::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.26); border-width: 2px; } /* ===== 공통 변수 ===== */ .nft-attribute-editor { --tile-width: 168px; /* 데스크톱 기본 타일 너비 */ --thumb-size: 128; /* 데스크톱 썸네일 한 변 */ --tile-gap: 12px; } /* 레이아웃: 좌(리스트)/우(프리뷰) */ .nft-attribute-editor .nft-editor-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; padding-bottom: env(safe-area-inset-bottom, 0); /* iOS 하단 홈바 여유 */ } .nft-attribute-editor .nft-selectors { display: flex; flex-direction: column; gap: 12px; } /* ===== 선택 그리드 & 타일 ===== */ .nft-attribute-editor ion-card.attribute-selector ion-card-content { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--tile-width), 1fr)); gap: var(--tile-gap); } /* 타일 자체 */ .nft-attribute-editor ion-chip.attribute-item.tile { width: var(--tile-width); box-sizing: border-box; padding: 12px 10px; border-radius: 14px; display: flex; flex-direction: column; align-items: center; gap: 8px; user-select: none; /* 텍스트 선택 방지 */ -webkit-tap-highlight-color: transparent; } /* 128×128(가변) 썸네일 박스 */ .nft-thumb-128 { width: 128px; height: 128px; position: relative; border-radius: 12px; background: #0c0c0f; overflow: hidden; transform: scale(calc(var(--thumb-size) / 128)); } /* 체크 배지: 우하단 고정 */ .nft-thumb-128 .check-badge { position: absolute; right: 8px; bottom: 8px; width: 24px; height: 24px; border-radius: 999px; display: grid; place-items: center; background: var(--ion-color-primary); color: var(--ion-color-primary-contrast); box-shadow: 0 2px 8px rgba(0, 0, 0, .35); pointer-events: none; font-size: 16px; z-index: 1; } /* 두 줄 라벨 고정 높이 */ .nft-attribute-editor ion-chip.attribute-item.tile ion-label { display: block; text-align: center; line-height: 16px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-break: keep-all; } /* 선택 강조 */ .nft-attribute-editor ion-chip.attribute-item.tile.selected { border: 1px solid var(--ion-color-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ion-color-primary) 20%, transparent); } /* ---- (기존 소형 썸네일 스타일은 더 이상 사용 안 하므로 제거해도 됨) ---- */ .nft-attribute-editor ion-chip.attribute-item>div.nft-thumb { display: none; } /* ===== 반응형 브레이크포인트 ===== */ /* 큰 태블릿(<= 1024px): 우측 프리뷰 높이/썸네일 살짝 축소 */ @media (max-width: 1024px) { .nft-attribute-editor { --tile-width: 156px; --thumb-size: 112; } .nft-attribute-editor .nft-editor-layout { grid-template-columns: minmax(0, 1fr) 360px; } .nft-attribute-editor .nft-preview-mount { height: 360px; } } /* 태블릿/폰 가로(<= 900px): 우측 프리뷰를 아래로, sticky 해제 */ @media (max-width: 900px) { .nft-attribute-editor .nft-editor-layout { grid-template-columns: 1fr; gap: 12px; } .nft-attribute-editor .nft-preview-col { position: static; /* sticky 비활성 (iOS 점프 방지) */ order: 2; /* 목록 다음에 오도록 */ } .nft-attribute-editor .nft-preview-mount { height: 300px; } } /* 폰(<= 600px): 2열 그리드 느낌, 더 작게 */ @media (max-width: 600px) { .nft-attribute-editor { --tile-width: 148px; --thumb-size: 104; --tile-gap: 10px; } .nft-attribute-editor .nft-preview-mount { height: 260px; } } /* 작은 폰(<= 420px): 1~2열, 터치 목표 확대 */ @media (max-width: 420px) { .nft-attribute-editor { --tile-width: 120px; --thumb-size: 96; --tile-gap: 8px; } .nft-attribute-editor ion-chip.attribute-item.tile { padding: 14px 10px; } .nft-attribute-editor .nft-preview-mount { height: 224px; } .nft-attribute-editor ion-card.attribute-selector ion-card-content { padding: 0 10px; padding-bottom: 10px; } } .login-wrapper { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 20px 0; padding-bottom: 50px; box-sizing: border-box; height: 100%; overflow-y: auto; } /* 여분 공간이 있을 때만 수직 가운데 정렬을 만들어주는 스페이서 */ .login-wrapper::before, .login-wrapper::after { content: ""; flex: 1 0 0; } .login-logo { width: 120px; height: 120px; } .login-title { font-size: 24px; margin-bottom: 12px; } .login-description { margin-bottom: 24px; text-align: center; max-width: 300px; } .login-button { width: 220px; /* 원하는 버튼 너비 */ height: 44px; /* 높이 통일 */ font-size: 16px; border-radius: 6px; /* 둥글기 */ text-align: center; } /* Google 버튼 스타일 */ .login-button.google::part(base) { width: 220px; height: 44px; border-radius: 10px; font-weight: 600; background: #fff; border: 1px solid #e4e7ec; box-shadow: 0 1px 1px rgba(16, 24, 40, 0.02), 0 1px 2px rgba(16, 24, 40, 0.04); color: #1f2937; transition: background-color .15s ease, box-shadow .15s ease, transform .02s ease; gap: 10px; padding: 0 14px; } .login-button.google::part(base):hover { background: #fcfdff; box-shadow: 0 2px 4px rgba(16, 24, 40, 0.06), 0 1px 2px rgba(16, 24, 40, 0.04); transform: translateY(-0.5px); } .login-button.google::part(base):active { background: #f7faff; box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08) inset; transform: translateY(0); } /* 키보드 포커스: 순수 CSS 색상만 사용 */ .login-button.google::part(base):focus-visible { outline: none; box-shadow: 0 0 0 4px rgba(66, 133, 244, 0.2), 0 1px 2px rgba(16, 24, 40, 0.04); border-color: #4285f4; } .login-button.google[disabled]::part(base) { background: #f5f7fa; color: #98a2b3; border-color: #eceff3; box-shadow: none; } /* 내부 콘텐츠 정렬 */ .login-google-content { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; } /* 텍스트 */ .login-google-text { line-height: 1; white-space: nowrap; user-select: none; } /* sl-icon 크기/간격 정리 */ .login-google-icon { width: 24px; height: 24px; margin-right: 6px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 0 24 24' width='24'%3E%3Cpath d='M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z' fill='%234285F4'/%3E%3Cpath d='M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z' fill='%2334A853'/%3E%3Cpath d='M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z' fill='%23FBBC05'/%3E%3Cpath d='M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z' fill='%23EA4335'/%3E%3Cpath d='M1 1h22v22H1z' fill='none'/%3E%3C/svg%3E"); } /* 로딩 중 텍스트 미세 처리 */ .login-button.google[loading] .login-google-text { opacity: .85; } .login-or-text { max-width: 300px; display: block; text-align: center; font-size: 14px; color: #9ca3af; line-height: 1.6; margin: 20px 0; word-break: keep-all; } /* Apple 버튼 스타일 - White */ .login-button.apple::part(base) { width: 220px; height: 44px; border-radius: 10px; font-weight: 600; background: #fff; /* 흰색 버튼 */ color: #000; /* 텍스트는 블랙 */ border: 1px solid #d1d5db; /* 미세한 그레이 보더 */ box-shadow: 0 1px 1px rgba(16, 24, 40, 0.02), 0 1px 2px rgba(16, 24, 40, 0.04); transition: background-color .15s ease, box-shadow .15s ease, transform .02s ease; gap: 10px; padding: 0 14px; } .login-button.apple::part(base):hover { background: #f9fafb; box-shadow: 0 2px 4px rgba(16, 24, 40, 0.06), 0 1px 2px rgba(16, 24, 40, 0.04); transform: translateY(-0.5px); } .login-button.apple::part(base):active { background: #f3f4f6; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08) inset; transform: translateY(0); } /* 키보드 포커스 */ .login-button.apple::part(base):focus-visible { outline: none; box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(16, 24, 40, 0.04); border-color: #000; } .login-button.apple[disabled]::part(base) { background: #f5f7fa; color: #98a2b3; border-color: #eceff3; box-shadow: none; } /* 내부 콘텐츠 */ .login-apple-content { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; } /* 아이콘: 검정색 로고 */ .login-button.apple .login-apple-icon { width: 24px; height: 24px; margin-right: 6px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='814' height='1000'%3E%3Cpath fill='%23000' d='M788.1 340.9c-5.8 4.5-108.2 62.2-108.2 190.5 0 148.4 130.3 200.9 134.2 202.2-.6 3.2-20.7 71.9-68.7 141.9-42.8 61.6-87.5 123.1-155.5 123.1s-85.5-39.5-164-39.5c-76.5 0-103.7 40.8-165.9 40.8s-105.6-57-155.5-127C46.7 790.7 0 663 0 541.8c0-194.4 126.4-297.5 250.8-297.5 66.1 0 121.2 43.4 162.7 43.4 39.5 0 101.1-46 176.3-46 28.5 0 130.9 2.6 198.3 99.2zm-234-181.5c31.1-36.9 53.1-88.1 53.1-139.3 0-7.1-.6-14.3-1.9-20.1-50.6 1.9-110.8 33.7-147.1 75.8-28.5 32.4-55.1 83.6-55.1 135.5 0 7.8 1.3 15.6 1.9 18.1 3.2.6 8.4 1.3 13.6 1.3 45.4 0 102.5-30.4 135.5-71.3z'/%3E%3C/svg%3E"); background-size: contain; background-repeat: no-repeat; background-position: center; } /* 다크 모드 전용 텍스트 링크 */ .login-link::part(base) { background: none; border: none; color: #d1d5db; /* 기본: 밝은 회색 */ font-size: 14px; text-decoration: underline; padding: 4px 0; height: auto; box-shadow: none; } .login-link::part(base):hover { color: #ffffff; /* hover 시 흰색 */ text-decoration: underline; } .login-link::part(base):active { color: #9ca3af; /* 클릭 시 조금 어둡게 */ } .login-link::part(base):focus-visible { outline: none; text-decoration: underline; box-shadow: none; } /* 링크 컨테이너 레이아웃 */ .login-bottom-links { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 6px; } /* 모바일에서 좌우 정렬 */ @media (max-width: 480px) { .login-bottom-links { flex-direction: row; justify-content: center; gap: 16px; } }