:root {
	/* vsc theme color */
	--anakiwa: #9cdcfe; /* vsc dark let, vsc light selection */
	--asparagus: #6a9955; /* vsc dark comment */
	--astronaut: #264f78; /* vsc dark selection */
	--bouquet: #b67bb1; /* vsc dark keyword, vsc dark bracket 2 */
	--chestnut-rose: #d16969; /* vsc dark regex */
	--cod-gray: #1e1e1e; /* vsc dark background */
	--copper-canyon: #7B3814; /* vsc light bracket 3 */
	--coriander: #b5cea8; /* vsc dark number */
	--dallas: #795e26; /* vsc light function */
	--dotger-blue: #179fff; /* vsc dark bracket 3 */
	--electric-violet: #af00db; /* vsc light keyword */
	--endeavour: #0451a5; /* vsc light css value */
	--forest-green: #319331;/* vsc light bracket 2 */
	--gold: #ffd700; /* vsc dark bracket 1 */
	--havelock-blue: #569cd6; /* vsc dark declare, vsc dark html, vsc dark arrow */
	--japanese-laurel: #008000; /* vsc light comment */
	--jelly-bean: #267f99; /* vsc light component, vsc light type */
	--lochmara: #0070c1; /* vsc light const */
	--malibu: #4fc1ff; /* vsc dark const */
	--maroon: #800000; /* vsc light html, vsc light css selector */
	--navy-blue: #001080; /* vsc light let */
	--puerto-rico: #4ec9b0; /* vsc dark component, vsc dark type */
	--raw-sienna: #ce9178; /* vsc dark string, vsc dark css value */
	--salem: #098658; /* vsc light number */
	--sapling: #dcdcaa; /* vsc dark function */
	--straw: #d7ba7d; /* vsc dark css selector */
	--tamarillo: #a31515; /* vsc light string */

/* theme */
	--gray-0-80: #000000cc;
	--gray-10: #1a1a1a;
	--gray-20: #333333;
	--gray-30: #4d4d4d;
	--gray-40: #666666;
	--gray-50: #808080;
	--gray-60: #999999;
	--gray-70: #b3b3b3;
	--gray-80: #cccccc;
	--gray-90: #e6e6e6;
	--gray-95: #f2f2f2;
	--gray-98: #fafafa;
	--primary-10: #0c121e;
	--primary-20: #18243d;
	--primary-30: #23355b;
	--primary-40: #2f477a;
	--primary-50: #3b5998;
	--primary-50-20: #3b589833;
	--primary-60: #627aad;
	--primary-70: #899bc1;
	--primary-80: #b1bdd6;
	--primary-90: #d8deea;
	--primary-95: #ebeef5;
	--primary-98: #f7f8fb;
	--primary-55: #3b599855;
	--primary-aa: #3b5998aa;
	--primary-light-50: #3178c6;

/* colors */
	--onahau: #cceeff;
	--alto-55: #dddddd55;
	--azure-66: #33669966;
	--catskill-white: #e6eaf2;
	--firefly: #0a1526;
}
@font-face {
	src: url("./fonts/NotoSans-Medium.woff2") format("woff2");
	font-family: "Noto Sans";
	font-display: swap;
}
@font-face {
	src: url("./fonts/NotoSans-Black.woff2") format("woff2");
	font-weight: bold;
	font-family: "Noto Sans";
	font-display: swap;
}
@font-face {
	src: url("./fonts/NotoSans-Medium.subset.woff2") format("woff2");
	font-family: "Noto Sans.ss";
	font-display: swap;
}
@font-face {
	src: url("./fonts/NotoSans-Black.subset.woff2") format("woff2");
	font-weight: bold;
	font-family: "Noto Sans.ss"2;
	font-display: swap;
}
body {
	font-family: "Noto Sans.ss", "Noto Sans", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
@keyframes blink {
	50% { opacity: 0 }
}