@font-face { font-family: Poppins; font-style: normal; font-weight: 400; font-display: swap; src: url(../../fonts/034d78ad42e9620c-s.woff2) format("woff2"); unicode-range: U+900-97F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09 } @font-face { font-family: Poppins; font-style: normal; font-weight: 400; font-display: swap; src: url(../../fonts/fe0777f1195381cb-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Poppins; font-style: normal; font-weight: 400; font-display: swap; src: url(../../fonts/eafabf029ad39a43-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Poppins; font-style: normal; font-weight: 500; font-display: swap; src: url(../../fonts/db911767852bc875-s.woff2) format("woff2"); unicode-range: U+900-97F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09 } @font-face { font-family: Poppins; font-style: normal; font-weight: 500; font-display: swap; src: url(../../fonts/f10b8e9d91f3edcb-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Poppins; font-style: normal; font-weight: 500; font-display: swap; src: url(../../fonts/8888a3826f4a3af4-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Poppins; font-style: normal; font-weight: 600; font-display: swap; src: url(../../fonts/29e7bbdce9332268-s.woff2) format("woff2"); unicode-range: U+900-97F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09 } @font-face { font-family: Poppins; font-style: normal; font-weight: 600; font-display: swap; src: url(../../fonts/c3bc380753a8436c-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Poppins; font-style: normal; font-weight: 600; font-display: swap; src: url(../../fonts/0484562807a97172-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Poppins; font-style: normal; font-weight: 700; font-display: swap; src: url(../../fonts/29a4aea02fdee119-s.woff2) format("woff2"); unicode-range: U+900-97F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09 } @font-face { font-family: Poppins; font-style: normal; font-weight: 700; font-display: swap; src: url(../../fonts/a1386beebedccca4-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Poppins; font-style: normal; font-weight: 700; font-display: swap; src: url(../../fonts/b957ea75a84b6ea7-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Poppins; font-style: normal; font-weight: 800; font-display: swap; src: url(../../fonts/28485c0de2075f40-s.woff2) format("woff2"); unicode-range: U+900-97F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09 } @font-face { font-family: Poppins; font-style: normal; font-weight: 800; font-display: swap; src: url(../../fonts/5fb25f343c7550ca-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Poppins; font-style: normal; font-weight: 800; font-display: swap; src: url(../../fonts/7db6c35d839a711c-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Poppins; font-style: normal; font-weight: 900; font-display: swap; src: url(../../fonts/f5b513e981884070-s.woff2) format("woff2"); unicode-range: U+900-97F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09 } @font-face { font-family: Poppins; font-style: normal; font-weight: 900; font-display: swap; src: url(../../fonts/b8442747db2a9bad-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Poppins; font-style: normal; font-weight: 900; font-display: swap; src: url(../../fonts/6245472ced48d3be-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Poppins Fallback; src: local("Arial"); ascent-override: 93.62%; descent-override: 31.21%; line-gap-override: 8.92%; size-adjust: 112.16% } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 400; font-display: swap; src: url(../../fonts/912fd6360a93005b-s.woff2) format("woff2"); unicode-range: U+600-6FF, U+750-77F, U+870-88E, U+890-891, U+897-8E1, U+8E3-8FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1 } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 400; font-display: swap; src: url(../../fonts/17cf9497af825577-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 400; font-display: swap; src: url(../../fonts/8c96cc4bd2a39381-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 500; font-display: swap; src: url(../../fonts/912fd6360a93005b-s.woff2) format("woff2"); unicode-range: U+600-6FF, U+750-77F, U+870-88E, U+890-891, U+897-8E1, U+8E3-8FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1 } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 500; font-display: swap; src: url(../../fonts/17cf9497af825577-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 500; font-display: swap; src: url(../../fonts/8c96cc4bd2a39381-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 600; font-display: swap; src: url(../../fonts/912fd6360a93005b-s.woff2) format("woff2"); unicode-range: U+600-6FF, U+750-77F, U+870-88E, U+890-891, U+897-8E1, U+8E3-8FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1 } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 600; font-display: swap; src: url(../../fonts/17cf9497af825577-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 600; font-display: swap; src: url(../../fonts/8c96cc4bd2a39381-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 700; font-display: swap; src: url(../../fonts/912fd6360a93005b-s.woff2) format("woff2"); unicode-range: U+600-6FF, U+750-77F, U+870-88E, U+890-891, U+897-8E1, U+8E3-8FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1 } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 700; font-display: swap; src: url(../../fonts/17cf9497af825577-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 700; font-display: swap; src: url(../../fonts/8c96cc4bd2a39381-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 800; font-display: swap; src: url(../../fonts/912fd6360a93005b-s.woff2) format("woff2"); unicode-range: U+600-6FF, U+750-77F, U+870-88E, U+890-891, U+897-8E1, U+8E3-8FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1 } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 800; font-display: swap; src: url(../../fonts/17cf9497af825577-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 800; font-display: swap; src: url(../../fonts/8c96cc4bd2a39381-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 900; font-display: swap; src: url(../../fonts/912fd6360a93005b-s.woff2) format("woff2"); unicode-range: U+600-6FF, U+750-77F, U+870-88E, U+890-891, U+897-8E1, U+8E3-8FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1 } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 900; font-display: swap; src: url(../../fonts/17cf9497af825577-s.woff2) format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF } @font-face { font-family: Vazirmatn; font-style: normal; font-weight: 900; font-display: swap; src: url(../../fonts/8c96cc4bd2a39381-s.p.woff2) format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD } @font-face { font-family: Vazirmatn Fallback; src: local("Arial"); ascent-override: 101.87%; descent-override: 53.36%; line-gap-override: 0.00%; size-adjust: 100.66% } @layer theme { :host, :root { --color-red-400: oklch(70.4% .191 22.216); --color-red-500: oklch(63.7% .237 25.331); --color-red-600: oklch(57.7% .245 27.325); --color-red-700: oklch(50.5% .213 27.518); --color-yellow-200: oklch(94.5% .129 101.54); --color-yellow-400: oklch(85.2% .199 91.936); --color-yellow-500: oklch(79.5% .184 86.047); --color-yellow-600: oklch(68.1% .162 75.834); --color-yellow-900: oklch(42.1% .095 57.708); --color-green-200: oklch(92.5% .084 155.995); --color-green-400: oklch(79.2% .209 151.711); --color-green-500: oklch(72.3% .219 149.579); --color-green-600: oklch(62.7% .194 149.214); --color-green-700: oklch(52.7% .154 150.069); --color-green-800: oklch(44.8% .119 151.328); --color-blue-400: oklch(70.7% .165 254.624); --color-blue-500: oklch(62.3% .214 259.815); --color-blue-600: oklch(54.6% .245 262.881); --color-blue-700: oklch(48.8% .243 264.376); --color-purple-500: oklch(97.343% 0.00143 285.217); --color-slate-100: oklch(96.8% .007 247.896); --color-gray-100: oklch(96.7% .003 264.542); --color-gray-200: oklch(92.8% .006 264.531); --color-gray-300: oklch(87.2% .01 258.338); --color-gray-400: oklch(70.7% .022 261.325); --color-gray-700: oklch(37.3% .034 259.733); --color-zinc-600: oklch(44.2% .017 285.786); --color-zinc-800: oklch(27.4% .006 286.033); --color-neutral-100: oklch(97% 0 0); --color-neutral-200: oklch(92.2% 0 0); --color-neutral-300: oklch(87% 0 0); --color-neutral-600: oklch(43.9% 0 0); --color-neutral-800: oklch(26.9% 0 0); --color-neutral-900: oklch(20.5% 0 0); --color-neutral-950: oklch(14.5% 0 0); --color-black: #000; --color-white: #fff; --spacing: .25rem; --container-sm: 24rem; --container-md: 28rem; --container-lg: 32rem; --container-2xl: 42rem; --container-3xl: 48rem; --container-4xl: 56rem; --container-6xl: 72rem; --container-7xl: 80rem; --text-xs: .75rem; --text-xs--line-height: calc(1/.75); --text-sm: .875rem; --text-sm--line-height: calc(1.25/.875); --text-base: 1rem; --text-base--line-height: calc(1.5/1); --text-lg: 1.125rem; --text-lg--line-height: calc(1.75/1.125); --text-xl: 1.25rem; --text-xl--line-height: calc(1.75/1.25); --text-2xl: 1.5rem; --text-2xl--line-height: calc(2/1.5); --text-3xl: 1.875rem; --text-3xl--line-height: calc(2.25/1.875); --text-4xl: 2.25rem; --text-4xl--line-height: calc(2.5/2.25); --text-5xl: 3rem; --text-5xl--line-height: 1; --text-6xl: 3.75rem; --text-6xl--line-height: 1; --text-7xl: 4.5rem; --text-7xl--line-height: 1; --text-8xl: 6rem; --text-8xl--line-height: 1; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --font-weight-black: 900; --tracking-tight: -.025em; --tracking-widest: .1em; --leading-tight: 1.25; --leading-relaxed: 1.625; --radius-xs: .125rem; --radius-2xl: 1rem; --radius-3xl: 1.5rem; --ease-in: cubic-bezier(.4, 0, 1, 1); --ease-out: cubic-bezier(0, 0, .2, 1); --ease-in-out: cubic-bezier(.4, 0, .2, 1); --animate-spin: spin 1s linear infinite; --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1)infinite; --blur-sm: 8px; --blur-lg: 16px; --blur-xl: 24px; --blur-2xl: 40px; --blur-3xl: 64px; --aspect-video: 16/9; --default-transition-duration: .15s; --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1); --default-font-family: var(--font-geist-sans); --default-mono-font-family: var(--font-geist-mono); --color-border: var(--border) } } @layer base { :host, html { -webkit-text-size-adjust: 100%; tab-size: 4; line-height: 1.5; font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent } abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit } a { color: inherit; -webkit-text-decoration: inherit; text-decoration: inherit } audio, canvas, embed, iframe, img, object, svg, video { vertical-align: middle; display: block } img, video { max-width: 100%; height: auto } body { background-color: var(--background); color: var(--foreground); overflow-y: auto !important } body[data-scroll-locked] { margin-right: 0 !important } } @layer utilities { .absolute { position: absolute } .absolute\! { position: absolute !important } .relative { position: relative } .inset-0 { inset: calc(var(--spacing)*0) } .inset-x-0 { inset-inline: calc(var(--spacing)*0) } .bottom-0 { bottom: calc(var(--spacing)*0) } .bottom-4 { bottom: calc(var(--spacing)*4) } .left-4 { left: calc(var(--spacing)*4) } .-z-10 { z-index: calc(10*-1) } .mx-1 { margin-inline: calc(var(--spacing)*1) } .mx-auto { margin-inline: auto } .my-1 { margin-block: calc(var(--spacing)*1) } .my-16 { margin-block: calc(var(--spacing)*16) } .prose :where(a):not(:where([class~=not-prose], [class~=not-prose] *)) { color: var(--tw-prose-links); font-weight: 500; text-decoration: underline } .prose :where(a strong):not(:where([class~=not-prose], [class~=not-prose] *)), .prose :where(blockquote strong):not(:where([class~=not-prose], [class~=not-prose] *)), .prose :where(thead th strong):not(:where([class~=not-prose], [class~=not-prose] *)) { color: inherit } .prose :where(ol[type=a]):not(:where([class~=not-prose], [class~=not-prose] *)) { list-style-type: lower-alpha } .prose :where(ol[type=a s]):not(:where([class~=not-prose], [class~=not-prose] *)) { list-style-type: lower-alpha } .prose :where(h2):not(:where([class~=not-prose], [class~=not-prose] *)) { color: var(--tw-prose-headings); margin-top: 2em; margin-bottom: 1em; font-size: 1.5em; font-weight: 700; line-height: 1.33333 } .prose :where(h2 strong):not(:where([class~=not-prose], [class~=not-prose] *)) { color: inherit; font-weight: 800 } .prose :where(img):not(:where([class~=not-prose], [class~=not-prose] *)) { margin-top: 2em; margin-bottom: 2em } .prose :where(a code):not(:where([class~=not-prose], [class~=not-prose] *)), .prose :where(h1 code):not(:where([class~=not-prose], [class~=not-prose] *)) { color: inherit } .prose :where(h2 code):not(:where([class~=not-prose], [class~=not-prose] *)) { color: inherit; font-size: .875em } .prose :where(picture>img):not(:where([class~=not-prose], [class~=not-prose] *)) { margin-top: 0; margin-bottom: 0 } .prose :where(h2+*):not(:where([class~=not-prose], [class~=not-prose] *)), .prose :where(h3+*):not(:where([class~=not-prose], [class~=not-prose] *)), .prose :where(h4+*):not(:where([class~=not-prose], [class~=not-prose] *)), .prose :where(hr+*):not(:where([class~=not-prose], [class~=not-prose] *)) { margin-top: 0 } .prose-sm :where(h2):not(:where([class~=not-prose], [class~=not-prose] *)) { margin-top: 1.6em; margin-bottom: .8em; font-size: 1.42857em; line-height: 1.4 } .prose-sm :where(img):not(:where([class~=not-prose], [class~=not-prose] *)), .prose-sm :where(picture):not(:where([class~=not-prose], [class~=not-prose] *)) { margin-top: 1.71429em; margin-bottom: 1.71429em } .prose-sm :where(picture>img):not(:where([class~=not-prose], [class~=not-prose] *)) { margin-top: 0; margin-bottom: 0 } .prose-sm :where(h2 code):not(:where([class~=not-prose], [class~=not-prose] *)) { font-size: .9em } .prose-sm :where(h2+*):not(:where([class~=not-prose], [class~=not-prose] *)), .prose-sm :where(h3+*):not(:where([class~=not-prose], [class~=not-prose] *)), .prose-sm :where(h4+*):not(:where([class~=not-prose], [class~=not-prose] *)), .prose-sm :where(hr+*):not(:where([class~=not-prose], [class~=not-prose] *)) { margin-top: 0 } .mt-1 { margin-top: calc(var(--spacing)*1) } .mt-2 { margin-top: calc(var(--spacing)*2) } .mt-12 { margin-top: calc(var(--spacing)*12) } .mt-16 { margin-top: calc(var(--spacing)*16) } .mt-20 { margin-top: calc(var(--spacing)*20) } .mt-\[2px\] { margin-top: 2px } .mb-20 { margin-bottom: calc(var(--spacing)*20) } .mb-\[2px\] { margin-bottom: 2px } .block { display: block } .flex { display: flex } .inline-block { display: inline-block } .size-3 { width: calc(var(--spacing)*3); height: calc(var(--spacing)*3) } .size-3\.5 { width: calc(var(--spacing)*3.5); height: calc(var(--spacing)*3.5) } .h-2 { height: calc(var(--spacing)*2) } .h-2\.5 { height: calc(var(--spacing)*2.5) } .h-3 { height: calc(var(--spacing)*3) } .h-4 { height: calc(var(--spacing)*4) } .h-6 { height: calc(var(--spacing)*6) } .h-10 { height: calc(var(--spacing)*10) } .h-24 { height: calc(var(--spacing)*24) } .h-32 { height: calc(var(--spacing)*32) } .h-40 { height: calc(var(--spacing)*40) } .h-48 { height: calc(var(--spacing)*48) } .h-64 { height: calc(var(--spacing)*64) } .h-96 { height: calc(var(--spacing)*96) } .h-\[6px\] { height: 6px } .h-\[12rem\] { height: 12rem } .h-\[22rem\] { height: 22rem } .h-full { height: 100% } .min-h-\[120vh\] { min-height: 120vh } .w-4 { width: calc(var(--spacing)*4) } .w-6 { width: calc(var(--spacing)*6) } .w-8 { width: calc(var(--spacing)*8) } .w-10 { width: calc(var(--spacing)*10) } .w-20 { width: calc(var(--spacing)*20) } .w-40 { width: calc(var(--spacing)*40) } .w-48 { width: calc(var(--spacing)*48) } .w-\[2\.8rem\] { width: 2.8rem } .w-\[2\.85rem\] { width: 2.85rem } .w-\[3\.65rem\] { width: 3.65rem } .w-\[4\.9rem\] { width: 4.9rem } .w-\[6px\] { width: 6px } .w-\[8\.2rem\] { width: 8.2rem } .w-\[10\%\] { width: 10% } .w-\[32rem\] { width: 32rem } .w-\[40\%\] { width: 40% } .w-\[80\%\] { width: 80% } .w-full { width: 100% } .flex-1 { flex: 1 } .flex-none { flex: none } .flex-shrink-0 { flex-shrink: 0 } .shrink-0 { flex-shrink: 0 } .\[transform\:translateZ\(0\)\] { transform: translateZ(0) } .transform { transform: var(--tw-rotate-x, )var(--tw-rotate-y, )var(--tw-rotate-z, )var(--tw-skew-x, )var(--tw-skew-y, ) } .flex-col { flex-direction: column } .flex-col-reverse { flex-direction: column-reverse } .flex-row { flex-direction: row } .flex-nowrap { flex-wrap: nowrap } .flex-wrap { flex-wrap: wrap } .items-center { align-items: center } .items-end { align-items: flex-end } .items-start { align-items: flex-start } .justify-between { justify-content: space-between } .justify-center { justify-content: center } .justify-end { justify-content: flex-end } .justify-start { justify-content: flex-start } .gap-\[2px\] { gap: 2px } .overflow-hidden { overflow: hidden } .rounded-2xl { border-radius: var(--radius-2xl) } .rounded-\[3\.5px\] { border-radius: 3.5px } .rounded-\[4px\] { border-radius: 4px } .rounded-full { border-radius: 3.40282e+38px } .rounded-full\! { border-radius: 3.40282e+38px !important } .rounded-lg { border-radius: var(--radius) } .rounded-md { border-radius: calc(var(--radius) - 2px) } .rounded-xl { border-radius: calc(var(--radius) + 4px) } .rounded-tl-3xl { border-top-left-radius: var(--radius-3xl) } .rounded-tr-3xl { border-top-right-radius: var(--radius-3xl) } .bg-\[\#0A090D\] { background-color: #0a090d } .bg-\[\#010101\] { background-color: #010101 } .bg-\[\#050505\] { background-color: #050505 } .bg-\[\#272729\] { background-color: #272729 } .bg-black { background-color: var(--color-black) } .bg-black\/3 { background-color: #00000008 } @supports (color:color-mix(in lab, red, red)) { .bg-black\/3 { background-color: color-mix(in oklab, var(--color-black)3%, transparent) } } .bg-black\/4 { background-color: #0000000a } @supports (color:color-mix(in lab, red, red)) { .bg-black\/4 { background-color: color-mix(in oklab, var(--color-black)4%, transparent) } } .bg-black\/5 { background-color: #0000000d } @supports (color:color-mix(in lab, red, red)) { .bg-black\/5 { background-color: color-mix(in oklab, var(--color-black)5%, transparent) } } .bg-black\/20 { background-color: #0003 } @supports (color:color-mix(in lab, red, red)) { .bg-black\/20 { background-color: color-mix(in oklab, var(--color-black)20%, transparent) } } .bg-black\/50 { background-color: #00000080 } @supports (color:color-mix(in lab, red, red)) { .bg-black\/50 { background-color: color-mix(in oklab, var(--color-black)50%, transparent) } } .bg-gray-200 { background-color: var(--color-gray-200) } .bg-white\/\[0\.2\] { background-color: #fff3 } @supports (color:color-mix(in lab, red, red)) { .bg-white\/\[0\.2\] { background-color: color-mix(in oklab, var(--color-white)20%, transparent) } } .bg-gradient-to-b { --tw-gradient-position: to bottom in oklab } .bg-gradient-to-b, .bg-gradient-to-r { background-image: linear-gradient(var(--tw-gradient-stops)) } .bg-gradient-to-t { --tw-gradient-position: to top in oklab; background-image: linear-gradient(var(--tw-gradient-stops)) } .from-\[\#272729\] { --tw-gradient-from: #272729; --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position)) } .from-neutral-900 { --tw-gradient-from: var(--color-neutral-900); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position)) } .from-20\% { --tw-gradient-from-position: 20% } .via-black { --tw-gradient-via: var(--color-black); --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-via)var(--tw-gradient-via-position), var(--tw-gradient-to)var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-via-stops) } .via-50\% { --tw-gradient-via-position: 50% } .to-\[\#050505\] { --tw-gradient-to: #050505; --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position)) } .to-neutral-900 { --tw-gradient-to: var(--color-neutral-900); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position)) } .to-95\% { --tw-gradient-to-position: 95% } .fill-background { fill: var(--background) } .fill-foreground, .fill-foreground\/80 { fill: var(--foreground) } @supports (color:color-mix(in lab, red, red)) { .fill-foreground\/80 { fill: color-mix(in oklab, var(--foreground)80%, transparent) } } .object-cover { object-fit: cover } .object-left-top { object-position: left top } .p-1 { padding: calc(var(--spacing)*1) } .p-2 { padding: calc(var(--spacing)*2) } .p-12 { padding: calc(var(--spacing)*12) } .p-\[0\.5px\] { padding: .5px } .p-px { padding: 1px } .px-\[0\.5px\] { padding-inline: .5px } .py-5 { padding-block: calc(var(--spacing)*5) } .py-\[4px\] { padding-block: 4px } .pr-1 { padding-right: calc(var(--spacing)*1) } .pr-12 { padding-right: calc(var(--spacing)*12) } .pr-\[4px\] { padding-right: 4px } .pb-\[2px\] { padding-bottom: 2px } .pl-1 { padding-left: calc(var(--spacing)*1) } .pl-12 { padding-left: calc(var(--spacing)*12) } .pl-\[4px\] { padding-left: 4px } .text-center { text-align: center } .text-3xl { font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)) } .text-\[5px\] { font-size: 7px } .font-bold { --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold) } .text-neutral-800 { color: var(--color-neutral-800) } .text-white { color: var(--color-white) } .text-white\! { color: var(--color-white) !important } .text-white\/60 { color: #fff9 } @supports (color:color-mix(in lab, red, red)) { .text-white\/60 { color: color-mix(in oklab, var(--color-white)60%, transparent) } } .text-white\/80 { color: #fffc } @supports (color:color-mix(in lab, red, red)) { .text-white\/80 { color: color-mix(in oklab, var(--color-white)80%, transparent) } } .shadow-sm, .shadow-xl { box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) } .shadow-xl { --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a), 0 8px 10px -6px var(--tw-shadow-color, #0000001a) } .shadow-white { --tw-shadow-color: #fff } @supports (color:color-mix(in lab, red, red)) { .shadow-white { --tw-shadow-color: color-mix(in oklab, var(--color-white)var(--tw-shadow-alpha), transparent) } } .\[will-change\:transform\], .will-change-transform { will-change: transform } .\[perspective\:800px\] { perspective: 800px } .selection\:bg-primary ::selection { background-color: var(--primary) } .selection\:bg-primary::selection { background-color: var(--primary) } .selection\:text-primary-foreground ::selection { color: var(--primary-foreground) } .selection\:text-primary-foreground::selection { color: var(--primary-foreground) } .has-\[\>svg\]\:grid-cols-\[calc\(var\(--spacing\)\*4\)_1fr\]:has(>svg) { grid-template-columns: calc(var(--spacing)*4)1fr } .has-\[\>svg\]\:gap-x-3:has(>svg) { column-gap: calc(var(--spacing)*3) } .has-\[\>svg\]\:px-2\.5:has(>svg) { padding-inline: calc(var(--spacing)*2.5) } .has-\[\>svg\]\:px-3:has(>svg) { padding-inline: calc(var(--spacing)*3) } .has-\[\>svg\]\:px-4:has(>svg) { padding-inline: calc(var(--spacing)*4) } @media (min-width:40rem) { .sm\:min-h-\[150vh\] { min-height: 150vh } } @media (min-width:48rem) { .md\:min-h-\[200vh\] { min-height: 200vh } .md\:scale-100 { --tw-scale-x: 100%; --tw-scale-y: 100%; --tw-scale-z: 100%; scale: var(--tw-scale-x)var(--tw-scale-y) } .md\:py-40 { padding-block: calc(var(--spacing)*40) } } .dark\:bg-\[\#272729\]:is(.dark *) { background-color: #272729 } .dark\:fill-foreground:is(.dark *) { fill: var(--foreground) } .dark\:text-white:is(.dark *) { color: var(--color-white) } .\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg { height: calc(var(--spacing)*5) } .\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg { width: calc(var(--spacing)*5) } .\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg { height: calc(var(--spacing)*5) } .\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg { width: calc(var(--spacing)*5) } .\[\&_svg\]\:pointer-events-none svg { pointer-events: none } .\[\&_svg\]\:shrink-0 svg { flex-shrink: 0 } .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]) { width: calc(var(--spacing)*4); height: calc(var(--spacing)*4) } .\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground svg:not([class*=text-]) { color: var(--muted-foreground) } :is(.\*\:\[span\]\:last\:flex>*):is(span):last-child { display: flex } :is(.\*\:\[span\]\:last\:items-center>*):is(span):last-child { align-items: center } :is(.\*\:\[span\]\:last\:gap-2>*):is(span):last-child { gap: calc(var(--spacing)*2) } :is(.data-\[variant\=destructive\]\:\*\:\[svg\]\:\!text-destructive[data-variant=destructive]>*):is(svg) { color: var(--destructive) !important } .\[\&\>span\:last-child\]\:truncate>span:last-child { text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .\[\&\>svg\]\:pointer-events-none>svg { pointer-events: none } .\[\&\>svg\]\:size-3>svg { width: calc(var(--spacing)*3); height: calc(var(--spacing)*3) } .\[\&\>svg\]\:size-3\.5>svg { width: calc(var(--spacing)*3.5); height: calc(var(--spacing)*3.5) } .\[\&\>svg\]\:size-4>svg { width: calc(var(--spacing)*4); height: calc(var(--spacing)*4) } .\[\&\>svg\]\:h-2\.5>svg { height: calc(var(--spacing)*2.5) } .\[\&\>svg\]\:h-3>svg { height: calc(var(--spacing)*3) } .\[\&\>svg\]\:w-2\.5>svg { width: calc(var(--spacing)*2.5) } .\[\&\>svg\]\:w-3>svg { width: calc(var(--spacing)*3) } .\[\&\>svg\]\:shrink-0>svg { flex-shrink: 0 } .\[\&\>svg\]\:translate-y-0\.5>svg { --tw-translate-y: calc(var(--spacing)*.5); translate: var(--tw-translate-x)var(--tw-translate-y) } .\[\&\>svg\]\:text-current>svg { color: currentColor } .\[\&\>svg\]\:text-muted-foreground>svg { color: var(--muted-foreground) } .\[\&\>svg\]\:text-sidebar-accent-foreground>svg { color: var(--sidebar-accent-foreground) } .\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg { rotate: 180deg } @media (hover:hover) { a.\[a\&\]\:hover\:bg-accent:hover { background-color: var(--accent) } a.\[a\&\]\:hover\:bg-destructive\/90:hover { background-color: var(--destructive) } @supports (color:color-mix(in lab, red, red)) { a.\[a\&\]\:hover\:bg-destructive\/90:hover { background-color: color-mix(in oklab, var(--destructive)90%, transparent) } } a.\[a\&\]\:hover\:bg-primary\/90:hover { background-color: var(--primary) } @supports (color:color-mix(in lab, red, red)) { a.\[a\&\]\:hover\:bg-primary\/90:hover { background-color: color-mix(in oklab, var(--primary)90%, transparent) } } a.\[a\&\]\:hover\:bg-secondary\/90:hover { background-color: var(--secondary) } @supports (color:color-mix(in lab, red, red)) { a.\[a\&\]\:hover\:bg-secondary\/90:hover { background-color: color-mix(in oklab, var(--secondary)90%, transparent) } } a.\[a\&\]\:hover\:text-accent-foreground:hover { color: var(--accent-foreground) } } } @property --tw-animation-delay { syntax: "*"; inherits: false; initial-value: 0s } @property --tw-animation-direction { syntax: "*"; inherits: false; initial-value: normal } @property --tw-animation-duration { syntax: "*"; inherits: false } @property --tw-animation-fill-mode { syntax: "*"; inherits: false; initial-value: none } @property --tw-animation-iteration-count { syntax: "*"; inherits: false; initial-value: 1 } @property --tw-enter-opacity { syntax: "*"; inherits: false; initial-value: 1 } @property --tw-enter-rotate { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-enter-scale { syntax: "*"; inherits: false; initial-value: 1 } @property --tw-enter-translate-x { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-enter-translate-y { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-exit-opacity { syntax: "*"; inherits: false; initial-value: 1 } @property --tw-exit-rotate { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-exit-scale { syntax: "*"; inherits: false; initial-value: 1 } @property --tw-exit-translate-x { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-exit-translate-y { syntax: "*"; inherits: false; initial-value: 0 } :root { --radius: .625rem; --background: oklch(100% 0 0); --foreground: oklch(14.5% 0 0); --card: oklch(100% 0 0); --card-foreground: oklch(14.5% 0 0); --popover: oklch(100% 0 0); --popover-foreground: oklch(14.5% 0 0); --primary: oklch(20.5% 0 0); --primary-foreground: oklch(98.5% 0 0); --secondary: oklch(97% 0 0); --secondary-foreground: oklch(20.5% 0 0); --muted: oklch(97% 0 0); --muted-foreground: oklch(55.6% 0 0); --accent: oklch(97% 0 0); --accent-foreground: oklch(20.5% 0 0); --destructive: oklch(57.7% .245 27.325); --border: oklch(92.2% 0 0); --input: oklch(92.2% 0 0); --ring: oklch(70.8% 0 0); --chart-1: oklch(64.6% .222 41.116); --chart-2: oklch(60% .118 184.704); --chart-3: oklch(39.8% .07 227.392); --chart-4: oklch(82.8% .189 84.429); --chart-5: oklch(76.9% .188 70.08); --sidebar: oklch(98.5% 0 0); --sidebar-foreground: oklch(14.5% 0 0); --sidebar-primary: oklch(20.5% 0 0); --sidebar-primary-foreground: oklch(98.5% 0 0); --sidebar-accent: oklch(97% 0 0); --sidebar-accent-foreground: oklch(20.5% 0 0); --sidebar-border: oklch(92.2% 0 0); --sidebar-ring: oklch(70.8% 0 0) } html { scroll-behavior: smooth } @keyframes fade-in { 0% { opacity: 0 } to { opacity: 1 } } @keyframes scale-in { 0% { transform: scale(0) } to { transform: scale(1) } } @keyframes glow { 0%, to { box-shadow: 0 0 20px #ffffff1a } 50% { box-shadow: 0 0 40px #fff3 } } @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-scale-x { syntax: "*"; inherits: false; initial-value: 1 } @property --tw-scale-y { syntax: "*"; inherits: false; initial-value: 1 } @property --tw-scale-z { syntax: "*"; inherits: false; initial-value: 1 } @property --tw-rotate-x { syntax: "*"; inherits: false } @property --tw-rotate-y { syntax: "*"; inherits: false } @property --tw-rotate-z { syntax: "*"; inherits: false } @property --tw-skew-x { syntax: "*"; inherits: false } @property --tw-skew-y { syntax: "*"; inherits: false } @property --tw-pan-x { syntax: "*"; inherits: false } @property --tw-pan-y { syntax: "*"; inherits: false } @property --tw-pinch-zoom { syntax: "*"; inherits: false } @property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-divide-x-reverse { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid } @property --tw-divide-y-reverse { syntax: "*"; inherits: false; initial-value: 0 } @property --tw-gradient-position { syntax: "*"; inherits: false } @property --tw-gradient-from { syntax: ""; inherits: false; initial-value: #0000 } @property --tw-gradient-via { syntax: ""; inherits: false; initial-value: #0000 } @property --tw-gradient-to { syntax: ""; inherits: false; initial-value: #0000 } @property --tw-gradient-stops { syntax: "*"; inherits: false } @property --tw-gradient-via-stops { syntax: "*"; inherits: false } @property --tw-gradient-from-position { syntax: ""; inherits: false; initial-value: 0 } @property --tw-gradient-via-position { syntax: ""; inherits: false; initial-value: 50% } @property --tw-gradient-to-position { syntax: ""; inherits: false; initial-value: 100% } @property --tw-leading { syntax: "*"; inherits: false } @property --tw-font-weight { syntax: "*"; inherits: false } @property --tw-tracking { syntax: "*"; inherits: false } @property --tw-ordinal { syntax: "*"; inherits: false } @property --tw-slashed-zero { syntax: "*"; inherits: false } @property --tw-numeric-figure { syntax: "*"; inherits: false } @property --tw-numeric-spacing { syntax: "*"; inherits: false } @property --tw-numeric-fraction { syntax: "*"; inherits: false } @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000 } @property --tw-shadow-color { syntax: "*"; inherits: false } @property --tw-shadow-alpha { syntax: ""; inherits: false; initial-value: 100% } @property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000 } @property --tw-inset-shadow-color { syntax: "*"; inherits: false } @property --tw-inset-shadow-alpha { syntax: ""; inherits: false; initial-value: 100% } @property --tw-ring-color { syntax: "*"; inherits: false } @property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000 } @property --tw-inset-ring-color { syntax: "*"; inherits: false } @property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000 } @property --tw-ring-inset { syntax: "*"; inherits: false } @property --tw-ring-offset-width { syntax: ""; inherits: false; initial-value: 0 } @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff } @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000 } @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid } @property --tw-blur { syntax: "*"; inherits: false } @property --tw-brightness { syntax: "*"; inherits: false } @property --tw-contrast { syntax: "*"; inherits: false } @property --tw-grayscale { syntax: "*"; inherits: false } @property --tw-hue-rotate { syntax: "*"; inherits: false } @property --tw-invert { syntax: "*"; inherits: false } @property --tw-opacity { syntax: "*"; inherits: false } @property --tw-saturate { syntax: "*"; inherits: false } @property --tw-sepia { syntax: "*"; inherits: false } @property --tw-drop-shadow { syntax: "*"; inherits: false } @property --tw-drop-shadow-color { syntax: "*"; inherits: false } @property --tw-drop-shadow-alpha { syntax: ""; inherits: false; initial-value: 100% } @property --tw-drop-shadow-size { syntax: "*"; inherits: false } @property --tw-backdrop-blur { syntax: "*"; inherits: false } @property --tw-backdrop-brightness { syntax: "*"; inherits: false } @property --tw-backdrop-contrast { syntax: "*"; inherits: false } @property --tw-backdrop-grayscale { syntax: "*"; inherits: false } @property --tw-backdrop-hue-rotate { syntax: "*"; inherits: false } @property --tw-backdrop-invert { syntax: "*"; inherits: false } @property --tw-backdrop-opacity { syntax: "*"; inherits: false } @property --tw-backdrop-saturate { syntax: "*"; inherits: false } @property --tw-backdrop-sepia { syntax: "*"; inherits: false } @property --tw-duration { syntax: "*"; inherits: false } @property --tw-ease { syntax: "*"; inherits: false } @property --tw-content { syntax: "*"; inherits: false; initial-value: "" } @keyframes spin { to { transform: rotate(1turn) } } @keyframes pulse { 50% { opacity: .5 } } @keyframes enter { 0% { opacity: var(--tw-enter-opacity, 1); transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0)scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1))rotate(var(--tw-enter-rotate, 0)) } } @keyframes exit { to { opacity: var(--tw-exit-opacity, 1); transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0)scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1))rotate(var(--tw-exit-rotate, 0)) } } @keyframes accordion-down { 0% { height: 0 } to { height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, auto)))) } } @keyframes accordion-up { 0% { height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, auto)))) } to { height: 0 } } @keyframes caret-blink { 0%, 70%, to { opacity: 1 } 20%, 50% { opacity: 0 } } html, body { margin: 0; min-height: 100%; background: #000; color: #fff } body { font-family: Arial, sans-serif; overflow-x: hidden } .w-full.overflow-hidden { width: 100%; overflow: hidden } .w-full.overflow-hidden>div { visibility: visible !important } .w-full.overflow-hidden img { max-width: none } .w-full.overflow-hidden>div:nth-child(2) { animation: openLaptop 1.1s cubic-bezier(.2, .8, .2, 1) both } @keyframes openLaptop { from { opacity: 0; transform: scaleX(.9) scaleY(.45) rotateX(-38deg) } to { opacity: 1 } } @media(max-width:767px) { .w-full.overflow-hidden>div { transform: scale(.7); transform-origin: top center } .w-full.overflow-hidden>h2 { font-size: 1.5rem; margin-bottom: 3rem } } /* Make every non-keyboard surface of the lower deck deep black. */ .w-full.overflow-hidden>div>div.relative>div:first-child, .w-full.overflow-hidden>div>div.relative>div:first-child>div, .w-full.overflow-hidden>div>div.relative>div:first-child::before, .w-full.overflow-hidden>div>div.relative>div:first-child::after { background-color: #030303 !important; background-image: none !important } .w-full.overflow-hidden>div>div.relative>div:first-child { border-color: #111827 !important; box-shadow: 0 18px 55px rgba(0, 0, 0, .82), inset 0 1px 0 rgba(255, 255, 255, .055) !important } .w-full.overflow-hidden>div>div.relative>div:first-child>div { border-color: #080808 !important; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .07), inset 0 -2px 0 rgba(0, 0, 0, .9) !important } /* Keep the keyboard/image layer untouched. */ .w-full.overflow-hidden>div>div.relative>div:nth-child(2)>img { z-index: 2 !important } /* Full black chassis: preserve only the keyboard artwork/buttons. */ .w-full.overflow-hidden>div>div.relative>div:first-child, .w-full.overflow-hidden>div>div.relative>div:first-child>div, .w-full.overflow-hidden>div>div.relative>div:first-child>div:not(:has(img)) { background: #000 !important; background-image: none !important; color: #fff !important; } .w-full.overflow-hidden>div>div.relative>div:first-child>div:has(img) { background: #000 !important; background-image: none !important; } .w-full.overflow-hidden>div>div.relative>div:first-child, .w-full.overflow-hidden>div>div.relative>div:first-child>div { border-color: #090909 !important; } :root { --laptop-spectrum: #272729; --laptop-spectrum-white: #f2f2f4; } /* The reference ZIP uses near-black hardware, restrained borders and cyan/purple light. */ .w-full.overflow-hidden>div>div.relative>div:first-child { background: #050505 !important; border: 1px solid rgba(43, 134, 212, .48) !important; box-shadow: 0 18px 55px rgba(5, 10, 28, .72), inset 0 1px 0 rgba(255, 255, 255, .08) !important } .w-full.overflow-hidden>div>div.relative>div:first-child>div { background: #0a090d !important; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .12), inset 0 -1px 0 rgba(6, 202, 248, .18) !important } /* The requested gradient is used on the laptop lid, never on the page background. */ .w-full.overflow-hidden>div>div.relative>div:nth-child(2) { background: var(--laptop-spectrum) !important; border: 1px solid rgba(255, 255, 255, .18) !important; box-shadow: 0 0 0 1px rgba(6, 202, 248, .22), 0 25px 75px rgba(7, 12, 35, .82) !important } .w-full.overflow-hidden>div>div.relative>div:nth-child(2)>div:first-child { background: linear-gradient(145deg, rgba(1, 1, 1, .84), rgba(10, 9, 13, .74)) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), inset 0 0 32px rgba(6, 202, 248, .12) !important } .w-full.overflow-hidden>div>div.relative>div:nth-child(2)>img { filter: saturate(.72) contrast(1.08) brightness(.78) !important; mix-blend-mode: screen; opacity: .9 } /* Remove the old center logo without disturbing its reserved geometry. */ .w-full.overflow-hidden>div>div.relative>div:first-child span { visibility: hidden !important } .w-full.overflow-hidden>div>div.relative>div:first-child span svg { display: none !important } /* Make every non-keyboard surface of the lower deck deep black. */ .w-full.overflow-hidden>div>div.relative>div:first-child, .w-full.overflow-hidden>div>div.relative>div:first-child>div, .w-full.overflow-hidden>div>div.relative>div:first-child::before, .w-full.overflow-hidden>div>div.relative>div:first-child::after { background-color: #030303 !important; background-image: none !important } .w-full.overflow-hidden>div>div.relative>div:first-child { border-color: #111827 !important; box-shadow: 0 18px 55px rgba(0, 0, 0, .82), inset 0 1px 0 rgba(255, 255, 255, .055) !important } .w-full.overflow-hidden>div>div.relative>div:first-child>div { border-color: #080808 !important; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .07), inset 0 -2px 0 rgba(0, 0, 0, .9) !important } /* Keep the keyboard/image layer untouched. */ .w-full.overflow-hidden>div>div.relative>div:nth-child(2)>img { z-index: 2 !important } /* Full black chassis: preserve only the keyboard artwork/buttons. */ .w-full.overflow-hidden>div>div.relative>div:first-child, .w-full.overflow-hidden>div>div.relative>div:first-child>div, .w-full.overflow-hidden>div>div.relative>div:first-child>div:not(:has(img)) { background: #000 !important; background-image: none !important; color: #fff !important; } .w-full.overflow-hidden>div>div.relative>div:first-child>div:has(img) { background: #000 !important; background-image: none !important; } .w-full.overflow-hidden>div>div.relative>div:first-child, .w-full.overflow-hidden>div>div.relative>div:first-child>div { border-color: #090909 !important; } /* انتهای style اضافه کن */ .touchpad { position: absolute; z-index: 5; bottom: 1rem; left: 50%; width: 8rem; height: 3rem; transform: translateX(-50%); border: 1px solid rgba(6, 202, 248, .55); border-radius: .65rem; background: linear-gradient(145deg, #101218, #020303) !important; box-shadow: inset 0 1px 8px rgba(255, 255, 255, .08), 0 0 14px rgba(6, 202, 248, .13); } .laptop-hinge { position: absolute; z-index: 6; top: .25rem; left: 50%; width: 21rem; height: .8rem; transform: translateX(-50%); border: 1px solid rgba(6, 202, 248, .45); border-radius: 0 0 .7rem .7rem; background: linear-gradient(180deg, #222936, #050608) !important; box-shadow: 0 2px 8px rgba(0, 0, 0, .8), 0 0 10px rgba(6, 202, 248, .18); } /* رفع فاصله‌ی اضافی دکمه‌های Ctrl, Alt, fn */ .mx-auto.h-full.w-\\[80\\%\\] .flex.flex-col.justify-between.py-\\[4px\\] { justify-content: center !important; padding-top: 0 !important; padding-bottom: 0 !important; padding-left: 25px !important; } .mx-auto.h-full.w-\\[80\\%\\] .flex.flex-col.justify-between.py-\\[4px\\] span { margin-top: 0.25rem !important; /* برابر mt-1 */ } .aura-key { cursor: pointer !important; position: relative; outline: none; -webkit-tap-highlight-color: transparent; transition: transform 110ms cubic-bezier(.2, .8, .2, 1), filter 160ms ease, box-shadow 160ms ease !important; } .aura-key::after { content: ""; position: absolute; inset: 1px; border-radius: inherit; pointer-events: none; opacity: 0; background: radial-gradient(circle at 50% 38%, rgba(94, 245, 255, .42), transparent 65%); transition: opacity 160ms ease; } .aura-key:hover { filter: brightness(1.35) saturate(1.3); box-shadow: 0 0 7px rgba(74, 220, 255, .45), inset 0 1px 1px rgba(255, 255, 255, .2) !important; } .aura-key:hover::after, .aura-key.is-pressed::after { opacity: 1; } .aura-key.is-pressed { transform: translateY(1.5px) scale(.965) !important; filter: brightness(1.65) saturate(1.45); box-shadow: 0 0 13px rgba(99, 234, 255, .9), inset 0 2px 7px rgba(0, 0, 0, .95) !important; } .aura-key:focus-visible { outline: 1px solid #78efff; outline-offset: 2px; } #key-toast { position: fixed; left: 50%; bottom: 26px; z-index: 100; transform: translate(-50%, 18px); opacity: 0; pointer-events: none; padding: 10px 17px; border: 1px solid rgba(113, 236, 255, .55); border-radius: 999px; background: rgba(5, 12, 22, .82); color: #e8fbff; font: 600 13px/1 Poppins, sans-serif; box-shadow: 0 8px 30px rgba(0, 0, 0, .38), 0 0 22px rgba(49, 209, 255, .18); backdrop-filter: blur(12px); transition: opacity .22s ease, transform .22s ease; } #key-toast.show { opacity: 1; transform: translate(-50%, 0); } @media (prefers-reduced-motion: reduce) { .aura-key, #key-toast { transition: none !important; } }